diff --git a/bin/Controls/SimpleContact.js b/bin/Controls/SimpleContact.js new file mode 100644 index 0000000000000000000000000000000000000000..a31c04c4e398ff807ac625b749edf5af7077879b --- /dev/null +++ b/bin/Controls/SimpleContact.js @@ -0,0 +1,152 @@ + +/** + * QUIQQER Contact Control + * + * @author www.pcsg.de (Henning Leutz) + * @module Bricks\Controls\SimpleContact + */ + +define('Controls/SimpleContact', [ + + 'qui/QUI', + 'qui/controls/Control', + 'qui/controls/buttons/Button', + 'qui/controls/loader/Loader', + 'Ajax', + 'Locale' + +], function(QUI, QUIControl, QUIButton, QUILoader, Ajax, Locale) +{ + "use strict"; + + return new Class({ + + Extends : QUIControl, + Type : 'Controls/SimpleContact', + + Binds : ['$onImport'], + + initialize : function(options) + { + this.parent( options ); + + this.Loader = new QUILoader(); + + this.$Text = null; + this.$Email = null; + this.$Name = null; + + this.addEvents({ + onImport : this.$onImport + }); + }, + + /** + * event : on import + */ + $onImport : function() + { + var self = this; + + this.Loader.inject( this.$Elm ); + this.Loader.show(); +/* + var Send = new QUIButton({ + text : 'senden', + textimage : 'fa fa-envelope-o icon-envelope-alt', + events : + { + onClick : function() { + self.$Elm.getElement('form').fireEvent('submit'); + } + } + }).inject( this.$Elm ); +*/ + new Element('button', { + html : 'sendenNNnN', + 'class' : 'button qui-button', + events : { + click : function() { + self.$Elm.getElement('form').fireEvent('submit'); + } + } + }).inject(this.$Elm); + + + this.$Elm.getElement('form').addEvent('submit', function(event) + { + var sendViaAjax = self.getElm().get('data-ajax').toInt(); + + if ( sendViaAjax === 0 ) + { + self.getElm().getElement('form').submit(); + return; + } + + if ( typeof event !== 'undefined' ) { + event.stop(); + } + + self.send(); + }); + + this.$Text = this.$Elm.getElement( '[name="message"]' ); + this.$Email = this.$Elm.getElement( '[name="email"]' ); + this.$Name = this.$Elm.getElement( '[name="name"]' ); + + this.Loader.hide(); + }, + + /** + * Send contact message + */ + send : function() + { + if ( this.$Text.value === '' ) + { + this.$Text.focus(); + return; + } + + if ( this.$Email.value === '' ) + { + this.$Email.focus(); + return; + } + + if ( this.$Name.value === '' ) + { + this.$Name.focus(); + return; + } + + var self = this; + + this.Loader.show(); + + + Ajax.post('ajax_contact', function(result) + { + if ( result ) { + self.$Elm.set( 'html', Locale.get( 'quiqqer/system', 'message.contact.successful' ) ); + } + + self.Loader.hide(); + + }, { + message : this.$Text.value, + email : this.$Email.value, + name : this.$Name.value, + showError : false, + onError : function(Exception) + { + self.Loader.hide(); + + QUI.getMessageHandler(function(MH) { + MH.addError( Exception.getMessage(), self.$Elm ); + }); + } + }); + } + }); +}); \ No newline at end of file diff --git a/bricks.xml b/bricks.xml index 5f71cf4056d6ed1b1fea138b3a96823b81c083f7..45e28a0072de9e1f01e3d7c637013b8d8b95e2b1 100644 --- a/bricks.xml +++ b/bricks.xml @@ -20,6 +20,17 @@ </description> </brick> + <!-- simple contact form (new) --> + + <brick control="\QUI\Bricks\Controls\SimpleContact"> + <title> + <locale group="quiqqer/bricks" var="brick.control.simpleContact.title"/> + </title> + <description> + <locale group="quiqqer/bricks" var="brick.control.simpleContact.description"/> + </description> + </brick> + <brick control="\QUI\Controls\LangSwitch"> <title> <locale group="quiqqer/bricks" var="brick.control.langSwitch.title"/> diff --git a/locale.xml b/locale.xml index 990528bf585271407edd428a50324976e3d8da08..a89ada1e6eabe9df8ce8ed33d8d3c4be446b338f 100644 --- a/locale.xml +++ b/locale.xml @@ -45,13 +45,52 @@ <en><![CDATA[]]></en> </locale> <locale name="brick.control.contact.title"> - <de><![CDATA[Baustein: Kontakt]]></de> - <en><![CDATA[Brick:Contact]]></en> + <de><![CDATA[Baustein: Kontaktformular]]></de> + <en><![CDATA[Brick: Contact form]]></en> </locale> <locale name="brick.control.contact.description"> <de><![CDATA[Ein vorgefertigtes Kontaktformular]]></de> <en><![CDATA[]]></en> </locale> + + + <!-- Simple contact form as brick (new) --> + + <locale name="brick.control.simpleContact.title"> + <de><![CDATA[Baustein: Einfacher Kontaktformular]]></de> + <en><![CDATA[Brick: Simple Contact form]]></en> + </locale> + <locale name="brick.control.simpleContact.description"> + <de><![CDATA[Ein vorgefertigtes Kontaktformular]]></de> + <en><![CDATA[]]></en> + </locale> + <locale name="control.simpleContact.name"> + <de><![CDATA[Vor- und Nachname]]></de> + <en><![CDATA[Name]]></en> + </locale> + <locale name="control.simpleContact.name.placeholder"> + <de><![CDATA[Ihr Vor- und Nachname]]></de> + <en><![CDATA[Please enter Your First and Last Name here]]></en> + </locale> + <locale name="control.simpleContact.email"> + <de><![CDATA[E-Mail]]></de> + <en><![CDATA[Email]]></en> + </locale> + <locale name="control.simpleContact.email.placeholder"> + <de><![CDATA[Ihre E-Mail-Adresse]]></de> + <en><![CDATA[Please enter your email address here]]></en> + </locale> + <locale name="control.simpleContact.message"> + <de><![CDATA[Nachricht]]></de> + <en><![CDATA[Message]]></en> + </locale> + <locale name="control.simpleContact.message.placeholder"> + <de><![CDATA[Ihre Nachricht an uns...]]></de> + <en><![CDATA[Your message to us]]></en> + </locale> + + + <locale name="package.title"> <de><![CDATA[Baustein Modul / Bricks]]></de> <en><![CDATA[Bricks Module]]></en> diff --git a/src/QUI/Bricks/Controls/SimpleContact.css b/src/QUI/Bricks/Controls/SimpleContact.css new file mode 100644 index 0000000000000000000000000000000000000000..38c5e3688badd024d28b1d76336c13b449b21d88 --- /dev/null +++ b/src/QUI/Bricks/Controls/SimpleContact.css @@ -0,0 +1,51 @@ +@CHARSET "UTF-8"; + +.quiqqer-simple-contact { + position: relative; +} + +.quiqqer-simple-contact .simple-contact-content { + margin-bottom: 1em; +} + +.quiqqer-simple-contact label, +.quiqqer-simple-contact input, +.quiqqer-simple-contact textarea { + float: left; + clear: both; + width: 100%; +} + +.quiqqer-simple-contact label { + cursor: pointer; +} + +.quiqqer-simple-contact input, +.quiqqer-simple-contact textarea { + margin-bottom: 10px; +} + + +/* Message & Message color + ================================================================= */ + +.quiqqer-simple-contact-message { + border: 1px solid #555; + clear: both; + float: left; + margin: 1em 0; + padding: 0.8em; + position: relative; + text-align: center; + width: 100%; +} + +.quiqqer-simple-contact-message-error { + background: #F2D4CE; + border-color: #AE432E; +} + +.quiqqer-simple-contact-message-success { + background: #D9E6C3; + border-color: #77AB13; +} diff --git a/src/QUI/Bricks/Controls/SimpleContact.html b/src/QUI/Bricks/Controls/SimpleContact.html new file mode 100644 index 0000000000000000000000000000000000000000..bfc669b541b943dd5d81b8ff57fc714d9dfce503 --- /dev/null +++ b/src/QUI/Bricks/Controls/SimpleContact.html @@ -0,0 +1,51 @@ + +<form class="quiqqer-simple-contact" method="POST" action=""> + + {if $this->getAttribute('showBrickTitle')} + <h1 class="simple-contact-title">{$this->getAttribute('showBrickTitle')}</h1> + {/if} + + {if $this->getAttribute('content')} + <div class="simple-contact-content"> + {$this->getAttribute('content')} + </div> + {/if} + + {if $this->getAttribute('labels')} + <label for="qui-contact-name"> + {locale group="quiqqer/bricks" value="control.simpleContact.name"} + </label> + {/if} + <input type="text" + name="name" + id="qui-contact-name" + required="required" + value="{$this->getAttribute('POST_NAME')}" + placeholder="{locale group="quiqqer/bricks" value="control.simpleContact.name.placeholder"}" + /> + + {if $this->getAttribute('labels')} + <label for="qui-contact-email"> + {locale group="quiqqer/bricks" value="control.simpleContact.email"} + </label> + {/if} + <input type="email" + name="email" + id="qui-contact-email" + required="required" + value="{$this->getAttribute('POST_EMAIL')}" + placeholder="{locale group="quiqqer/bricks" value="control.simpleContact.email.placeholder"}" + /> + + {if $this->getAttribute('labels')} + <label for="qui-contact-message"> + {locale group="quiqqer/bricks" value="control.simpleContact.message"} + </label> + {/if} + <textarea name="message" + id="qui-contact-message" + required="required" + placeholder="{locale group="quiqqer/bricks" value="control.simpleContact.message.placeholder"}" + >{$this->getAttribute('POST_MESSAGE')}</textarea> + +</form> \ No newline at end of file diff --git a/src/QUI/Bricks/Controls/SimpleContact.php b/src/QUI/Bricks/Controls/SimpleContact.php new file mode 100644 index 0000000000000000000000000000000000000000..6e02be7518ae1701c2fd9aa60b0f9c2c97db11ec --- /dev/null +++ b/src/QUI/Bricks/Controls/SimpleContact.php @@ -0,0 +1,68 @@ +<?php + +/** + * This file contains \QUI\Bricks\Controls\SimpleContact + */ + +namespace QUI\Bricks\Controls; + +use QUI; +use QUI\Utils\Security\Orthos; + +/** + * Mini contact control + * {control control="\QUI\Bricks\Controls\SimpleContact" labels=false} + * + * @author www.pcsg.de (Henning Leutz) + * @licence For copyright and license information, please view the /README.md + */ +class SimpleContact extends QUI\Control +{ + /** + * constructor + * + * @param array $attributes + */ + public function __construct($attributes = array()) + { + $this->setAttributes(array( + 'data-ajax' => 1, + 'POST_NAME' => '', + 'POST_EMAIL' => '', + 'POST_MESSAGE' => '' + )); + + parent::__construct($attributes); + + $this->addCSSFile( + dirname(__FILE__) . '/SimpleContact.css' + ); + + $this->setAttribute('class', 'quiqqer-simple-contact'); + $this->setAttribute('qui-class', "Bricks/Controls/SimpleContact"); + $this->setAttribute('labels', true); + } + + /** + * (non-PHPdoc) + * + * @see \QUI\Control::create() + */ + public function getBody() + { + $Engine = QUI::getTemplateManager()->getEngine(); + + // filter POST vars if exist + $this->setAttributes(array( + 'POST_NAME' => Orthos::clearFormRequest($this->getAttribute('POST_NAME')), + 'POST_EMAIL' => Orthos::clearFormRequest($this->getAttribute('POST_EMAIL')), + 'POST_MESSAGE' => Orthos::clearFormRequest($this->getAttribute('POST_MESSAGE')), + )); + + $Engine->assign(array( + 'this' => $this + )); + + return $Engine->fetch(dirname(__FILE__) . '/SimpleContact.html'); + } +}