Built motion from commit (unavailable).|2.5.31
[motion2.git] / snippet / 3.0.0 / templates / online / index.tpl.html / index.tpl.html
index ba5140f..8e20e74 100644 (file)
@@ -1,23 +1,30 @@
 <!-- CHAT CONTENT -->
 <md-content class="chat-online">
   <form
+    ng-if="vm.fields.length"
     name="vm.userForm"
     layout="column"
     ng-style="{'font-size': '{{settings.fontSize}}px'}"
     novalidate
   >
     <div class="form-input-container">
-      <div ng-repeat="field in ::vm.fields | orderBy:'index'" layout="column">
+      <div
+        ng-repeat="field in vm.fields | orderBy:'index'"
+        layout="column"
+        class="form-field"
+      >
         <span>{{field.props.title + (field.config.required ? '*' : '')}}</span>
 
-        <span style="line-height: 14px; color: grey; padding: 5px 0px 5px 0px">
+        <span
+          ng-class="field.props.error? 'field-description error': 'field-description'"
+        >
           <div
             ng-if="vm.checkHTML[$index]"
             ng-bind-html="field.props.helpText"
           ></div>
           <div
             ng-if="!vm.checkHTML[$index]"
-            ng-bind-html="field.props.helpText | embed:{linkTarget:'_blank'}"
+            ng-bind-html="field.props.error || field.props.helpText | embed:{linkTarget:'_blank'}"
           ></div>
         </span>
 
         </div>
         <!-- CHAT ERROR -->
 
-        <md-input-container
-          md-no-float
-          ng-switch="field.type"
-          style="margin: 0px; padding: 0px 0px 10px 0px"
-        >
+        <md-input-container md-no-float ng-switch="field.type">
           <!-- START label -->
           <div ng-switch-when="label">
             <md-content
@@ -90,7 +93,7 @@
               ng-required="field.config.required"
             >
               <md-option
-                ng-repeat="option in ::field.options"
+                ng-repeat="option in field.options"
                 ng-value="option.value"
                 >{{option.value}}</md-option
               >
           <!-- END select -->
 
           <!-- START radio -->
-          <div ng-switch-when="multipleChoices">
+          <div
+            ng-switch-when="multipleChoices"
+            layout="{{field.config.direction === 'horizontal' ? 'row' : 'column'}}"
+          >
             <md-radio-group
-              md-no-ink
               name="{{field.props.title}}"
               ng-model="vm.form[field.props.title]"
               ng-required="field.config.required"
-              layout="{{field.config.direction === 'vertical' ? 'row' : 'column'}}"
+              layout="{{field.config.direction === 'horizontal' ? 'row' : 'column'}}"
             >
               <md-radio-button
-                ng-repeat="option in ::field.options"
+                ng-repeat="option in field.options"
                 ng-value="option.value"
                 class="md-primary"
                 >{{option.value}}</md-radio-button
           <!-- END radio -->
 
           <!-- START checkbox -->
-          <div
-            ng-switch-when="checkboxes"
-            layout="{{field.config.direction === 'vertical' ? 'row' : 'column'}}"
-          >
-            <md-checkbox
-              md-no-ink
-              aria-label="{{field.props.title}}"
-              ng-repeat="option in ::field.options"
-              ng-checked="vm.exists(field.props.title, option.value)"
-              ng-disabled="!vm.exists(field.props.title, option.value) && field.config.maxSelections === vm.form[field.props.title].length"
-              ng-required="vm.getSelected()"
-              ng-click="vm.toggle(field.props.title, option.value)"
+          <div ng-switch-when="checkboxes">
+            <div
+              layout="{{field.config.direction === 'horizontal' ? 'row' : 'column'}}"
             >
-              {{option.value}}
-            </md-checkbox>
+              <md-checkbox
+                md-no-ink
+                aria-label="{{field.props.title}}"
+                ng-repeat="option in field.options"
+                ng-checked="vm.exists(field.props.title, option.value)"
+                ng-disabled="!vm.exists(field.props.title, option.value) && field.config.maxSelections === vm.form[field.props.title].length"
+                ng-click="vm.toggle(field.props.title, option.value)"
+                flex
+              >
+                {{option.value}}
+              </md-checkbox>
+            </div>
           </div>
           <!-- END checkbox -->
 
           <!-- START agreement -->
           <div
             ng-switch-when="agreement"
-            layout="{{field.config.direction === 'vertical' ? 'row' : 'column'}}"
+            layout="{{field.config.direction === 'horizontal' ? 'row' : 'column'}}"
           >
             <md-checkbox
               md-no-ink
         </md-input-container>
       </div>
     </div>
-    <md-button
-      title="{{settings.start_chat_button}}"
-      class="md-raised"
-      ng-click="vm.submit()"
-      ng-disabled="vm.userForm.$invalid  || vm.disableItem"
-      ng-style="{'background-color': '{{settings.color_button}}', 'color': '{{settings.textColor}}'}"
-    >
-      {{settings.start_chat_button}}
-    </md-button>
+    <div class="online-button-wrapper">
+      <md-button
+        id="onlineButton"
+        title="{{settings.start_chat_button}}"
+        class="md-raised"
+        ng-click="vm.submit()"
+        ng-disabled="vm.userForm.$invalid  || vm.disableItem"
+        ng-style="{'background-color': '{{settings.color_button}}', 'color': '{{settings.textColor}}'}"
+      >
+        {{settings.start_chat_button}}
+      </md-button>
+    </div>
   </form>
 
   <md-content layout="row" layout-align="center end" class="white-label">