Registraction edit js fix, styles for update button
authorlaury <laury@gaslightmedia.com>
Tue, 12 Dec 2017 20:11:59 +0000 (15:11 -0500)
committerlaury <laury@gaslightmedia.com>
Tue, 12 Dec 2017 20:11:59 +0000 (15:11 -0500)
css/front.css
js/frontRegApp.js
views/front/registrations/checkout.html
views/front/registrations/registration.html

index 5f67e6b..a617a2c 100644 (file)
 .glm-reg-list-data{
     padding: 0;
 }
-.glm-reg-list-description{
+.glm-reg-list-description {
     padding: 5px 0;
     line-height: 1.2;
+    white-space: normal;
 }
 #glm-reg-list .glm-reg-event-item {
     border: 1px solid black;
@@ -498,6 +499,9 @@ span.glm-error {
 /* Reg detail styles */
 #regApp {
     
+}
+#regApp .reg-edit-form {
+    float: left;
 }
 #regApp .glm-reg-class-container {
     border: 1px solid lightgrey;
@@ -507,8 +511,11 @@ span.glm-error {
 #regApp .glm-reg-class-container.collapsed .reg-class-detail {
 }
 #regApp .glm-reg-class-container .reg-class-detail {
+    background: white;
 }
 #regApp .glm-reg-class-container .glm-reg-event-details {
+    border-top-left-radius: 3px;
+    border-top-right-radius: 3px;
     background-color: #007095;
     color: white;
     cursor: pointer;
@@ -517,7 +524,15 @@ span.glm-error {
 #regApp .glm-reg-class-container .glm-reg-event-details:hover {
     background-color: #008CBA;
 }
-
+#regApp .reg-edit-form .update-registrant-button-container {
+    float: left;
+}
+#regApp .reg-edit-form .update-registrant-button-container .update-registrant {
+    float: left;
+}
+#regApp .reg-edit-form .update-registrant-button-container .update-registrant.cancel {
+    float: right;
+}
 #accountHeader {
     background: -webkit-linear-gradient(top, #f2f2f2 45%, #FFFFFF 100%);
     background: -moz-linear-gradient(center top, #f2f2f2 45%, #FFFFFF 100%);
@@ -551,7 +566,7 @@ span.glm-error {
     border-color: lightgrey;
     border-width: 0 1px;
     border-style: solid;
-    border-radius: 2px;
+    border-radius: 1px;
     background: white;
     min-height: 60px;
     width: 100%;
@@ -572,8 +587,7 @@ span.glm-error {
     #accountHeader #glm-header-reg-widget {
         margin-top: 0;
         min-height: 0;
-        border-top: 1px;
-        border-bottom: 1px;
+        border-width: 1px;
     }
 }
 #accountHeader .button {
@@ -588,11 +602,10 @@ span.glm-error {
     #accountHeader .button {
         margin-bottom: 5px;
     }
-    #glm-header-reg-widget {
+    #accountHeader #glm-header-reg-widget {
         width: 100%;
-        margin-bottom: 5px;
     }
-    #glm-header-reg-widget #registrations-cart-link-widget {
+    #accountHeader #glm-header-reg-widget #registrations-cart-link-widget {
         width: 100% !important;
     }
     #regApp #glm-reg-event-name {
index 55083e0..2e53861 100644 (file)
@@ -851,11 +851,16 @@ app.Views.Front.RegRequestRegistrant = Backbone.View.extend({
 
     // show the edit form
     editRegistrant: function(){
-        if ( app.checkForEditLock() === true ) {
-            return;
+        if ( !this.$('.reg-edit-form').is(":visible") ) {
+            if ( app.checkForEditLock() === true ) {
+                return;
+            }
+            this.$('.reg-edit-form').show();
+            app.regEventLock = true;
+        } else {
+            this.$('.reg-edit-form').hide();
+            app.regEventLock = false;
         }
-        this.$('.reg-edit-form').show();
-        app.regEventLock = true;
     },
 
     // render the view
index 1a0dc13..2a6d087 100644 (file)
             <div class="glm-reg-row">
                 <div class="glm-large-6 glm-small-12 glm-columns">
                     <h4>Payment Information</h4>
-                    
-                    <select>
-                    {foreach $payMethods as $payMethod}
-                        
-                        {$pmname = array_search($payMethod.value, $payMethodsNumb)}
-                        {$pm = $payMethodsNumb.{$pmname}}
-                        {if $payMethods.{$pm}.default} 
-                            <option value="{$pm}">{$payMethods.{$pm}.name}</option>
-                        {/if}
-                    {/foreach}
-                    </select>
-                    Currently the 'select' foreach iterates without also dumping the payment method detail div
-                    Either iterate over it once again (as below) or find some way to spit it out outside of the 'select' element
-                    
                     {foreach $payMethods as $payMethod}
                         
                         {$pmname = array_search($payMethod.value, $payMethodsNumb)}
                             {/if}
                         {/if}
                     {/foreach}
-                    the code below is the same, but doesn't utilize a foreach loop
-                    
                     
-    {$pm = $payMethodsNumb.NoCharge}
-    {if $payMethods.{$pm}.default}
-                    <h5><input id="payMethodButton_{$pm}" type="radio" name="payMethod" value="{$pm}" class="payMethodSelector" required {if $payMethod == {$pm}} checked{/if}><label for="payMethodButton_{$pm}">  {$payMethods.{$pm}.name}</label></h5>
-                    <div id="payMethod_{$pm}" class="payMethodSelection glm-hidden">
-                        <p>*** No Charge ****</p>
-                    </div>
-    {/if}
-    {$pm = $payMethodsNumb.CompCode}
-    {if $payMethods.{$pm}.default}
-                    <h5><input id="payMethodButton_{$pm}" type="radio" name="payMethod" value="{$pm}" class="payMethodSelector" required {if $payMethod == {$pm}} checked{/if}><label for="payMethodButton_{$pm}"> {$payMethods.{$pm}.name}</label></h5>
-                    <div id="payMethod_{$pm}" class="payMethodSelection glm-hidden">
-                        <div class="glm-reg-row">
-                            <div class="glm-small-12 glm-large-3 glm-columns glm-reg-nowrap{if $regAccount.fieldRequired.comp_code} glm-reg-required{/if}">Enter code:</div>
-                            <div class="glm-small-12 glm-large-9 glm-columns{if $regAccount.fieldFail.comp_code} glm-reg-fail{/if}">
-                                <input type="text" name="comp_code" value="{$regAccount.fieldData.comp_code}"{if $regAccount.fieldRequired.comp_code} required{/if} class="payMethodInput payMethodInput_{$pm}">
-                            </div>
-                        </div>
-                    </div>
-    {/if}
-    {$pm = $payMethodsNumb.Cash}
-    {if $payMethods.{$pm}.default}
-                    <h5><input id="payMethodButton_{$pm}" type="radio" name="payMethod" value="{$pm}" class="payMethodSelector" required {if $payMethod == {$pm}} checked{/if}><label for="payMethodButton_{$pm}">  {$payMethods.{$pm}.name}</label></h5>
-                    <div id="payMethod_{$pm}" class="payMethodSelection glm-hidden">
-                        <p>*** Cash ****</p>
-                    </div>
-
-    {/if}
-    {$pm = $payMethodsNumb.Check}
-    {if $payMethods.{$pm}.default}
-                    <h5><input id="payMethodButton_{$pm}" type="radio" name="payMethod" value="{$pm}" class="payMethodSelector" required {if $payMethod == {$pm}} checked{/if}><label for="payMethodButton_{$pm}">  {$payMethods.{$pm}.name}</label></h5>
-                    <div id="payMethod_{$pm}" class="payMethodSelection glm-hidden">
-                        <p>*** No Check ****</p>
-                    </div>
-    {/if}
-    {$pm = $payMethodsNumb.CallFromMerchant}
-    {if $payMethods.{$pm}.default}
-                    <h5><input id="payMethodButton_{$pm}" type="radio" name="payMethod" value="{$pm}" class="payMethodSelector" required {if $payMethod == {$pm}} checked{/if}><label for="payMethodButton_{$pm}">  {$payMethods.{$pm}.name}</label></h5>
-                    <div id="payMethod_{$pm}" class="payMethodSelection glm-hidden">
-                        <p>*** Call From Merchant ****</p>
-                    </div>
-    {/if}
-    {$pm = $payMethodsNumb.CreditCard}
-    {if $payMethods.{$pm}.default}
-                    <h5><input id="payMethodButton_{$pm}" type="radio" name="payMethod" value="{$pm}" class="payMethodSelector" required {if $payMethod == {$pm}} checked{/if}><label for="payMethodButton_{$pm}">  {$payMethods.{$pm}.name}</label></h5>
-                    <div id="payMethod_{$pm}" class="payMethodSelection glm-hidden">
-                        <div class="glm-reg-row">
-                            <div class="glm-small-12 glm-large-3 glm-columns glm-reg-nowrap{if $regAccount.fieldRequired.cc_name} glm-reg-required{/if}">Name on Card:</div>
-                            <div class="glm-small-12 glm-large-9 glm-columns{if $regAccount.fieldFail.cc_name} glm-reg-fail{/if}">
-                                <input type="text" name="cc_name" value="{$regAccount.fieldData.cc_name}"{if $regAccount.fieldRequired.cc_name} required{/if} class="payMethodInput payMethodInput_{$pm}">
-                            </div>
-                        </div>
-                        <div class="glm-reg-row">
-                            <div class="glm-small-12 glm-large-3 glm-columns glm-reg-nowrap{if $regAccount.fieldRequired.cc_type} glm-reg-required{/if}">Card Type:</div>
-                            <div class="glm-small-12 glm-large-9 glm-columns{if $regAccount.fieldFail.cc_type} glm-reg-fail{/if}">
-                                <select name="cc_type" class="payMethodInput payMethodInput_{$pm}">
-                                    <option value=""></option>
-                        {foreach $regAccount.fieldData.cc_type.list as $c}
-                                    <option value="{$c.value}"{if $c.default} selected="selected"{/if}>
-                                        {$c.name}
-                                    </option>
-                        {/foreach}
-                                </select>
-                            </div>
-                        </div>
-                        <div class="glm-reg-row">
-                            <div class="glm-small-12 glm-large-3 glm-columns glm-reg-nowrap{if $regAccount.fieldRequired.cc_numb} glm-reg-required{/if}">Card Number:</div>
-                            <div class="glm-small-12 glm-large-9 glm-columns{if $regAccount.fieldFail.cc_numb} glm-reg-fail{/if}">
-                                <input type="text" placeholder="Numbers Only" name="cc_numb" value="{$regAccount.fieldData.cc_numb}"{if $regAccount.fieldRequired.cc_numb} required{/if} class="payMethodInput payMethodInput_{$pm} cc-input">
-                           </div>
-                        </div>
-                        <div class="glm-reg-row">
-                            <div class="glm-small-12 glm-large-3 glm-columns glm-reg-nowrap{if $regAccount.fieldRequired.cc_exp} glm-reg-required{/if}">Card Expiration:</div>
-                            <div class="glm-small-12 glm-large-9 glm-columns{if $regAccount.fieldFail.cc_exp} glm-reg-fail{/if}">
-                                <input type="text" placeholder="MM/YY" name="cc_exp" value="{$regAccount.fieldData.cc_exp}"{if $regAccount.fieldRequired.cc_exp} required{/if} class="payMethodInput payMethodInput_{$pm} expire-input">
-                            </div>
-                        </div>
-                        <div class="glm-reg-row">
-                            <div class="glm-small-12 glm-large-3 glm-columns glm-reg-nowrap{if $regAccount.fieldRequired.cc_cvv} glm-reg-required{/if}">CVV:</div>
-                            <div class="glm-small-12 glm-large-9 glm-columns{if $regAccount.fieldFail.cc_cvv} glm-reg-fail{/if}">
-                                <input type="text" placeholder="3 or 4 digit security code on back of card" name="cc_cvv" value="{$regAccount.fieldData.cc_cvv}"{if $regAccount.fieldRequired.cc_cvv} required{/if} class="payMethodInput payMethodInput_{$pm} cvv-input">
-                            </div>
-                        </div>
-                    </div>
-    {/if}
-    {$pm = $payMethodsNumb.PayPal}
-    {if $payMethods.{$pm}.default}
-                    <h5><input id="payMethodButton_{$pm}" type="radio" name="payMethod" value="{$pm}" class="payMethodSelector" required {if $payMethod == {$pm}} checked{/if}><label for="payMethodButton_{$pm}">  {$payMethods.{$pm}.name}</label></h5>
-                    <div id="payMethod_{$pm}" class="payMethodSelection glm-hidden">
-                        <p>*** Pay Pal ****</p>
-                    </div>
-    {/if}
                 </div>
   {/if} {* / total charges > 0 *}
             </div>
index b9b17dd..2257967 100644 (file)
                     <input type="hidden" id="reg-time-{literal}<%= id %>{/literal}" value="{literal}<%- reg_time %>{/literal}">
                 </div>
             {/if}{literal}
-            <div>
+            <div class="update-registrant-button-container">
                 <input class="update-registrant button tiny" value="Update {/literal}{$terms.reg_term_attendee_cap}{literal}" type="submit">
                 <a class="update-registrant-cancel">Cancel</a>
             </div>