Adding styles for admin side start for editing classes.
authorSteve Sutton <steve@gaslightmedia.com>
Fri, 8 Sep 2017 20:49:05 +0000 (16:49 -0400)
committerSteve Sutton <steve@gaslightmedia.com>
Fri, 8 Sep 2017 20:49:05 +0000 (16:49 -0400)
Adding buttons for the add level delete level.
Adding buttons for the add and delete reg rates.
Working on the template for the add level.

css/admin.css
js/models/admin/regClass.js
js/readme.txt
js/regApp.js
js/views/admin/regEvent.js
views/admin/registrations/eventEditLevels.html

index 0cb0eab..27a9fda 100644 (file)
@@ -4,3 +4,50 @@
     margin-right: 5px;
     display: inline-block;
 }
+
+.clearfix:after {
+    clear: both;
+    content: ".";
+    display: block;
+    height: 0;
+    line-height: 0;
+    visibility: hidden;
+}
+
+.glm-reg-event-list {
+    width: 100%;
+    padding: 0;
+    clear: both;
+    display: block;
+}
+.glm-reg-event-item {
+    border: 1px solid black;
+    padding: 10px;
+    margin: 1.2rem 1rem;
+    position: relative;
+}
+.glm-reg-event-item h2 {
+    font-size: 1.5rem;
+    font-weight: bold;
+    text-decoration: none;
+    padding: .4rem;
+    width: 80%;
+}
+.glm-reg-level {
+    width: 48%;
+    float: left;
+    clear: left;
+}
+.glm-reg-level h3 {
+    font-size: 1rem;
+    font-weight: bold;
+    color: white;
+    text-decoration: none;
+    padding: .3rem;
+}
+.glm-reg-submit {
+    padding: 1rem;
+    position: absolute;
+    bottom: .3rem;
+    right: .5rem;
+}
index 31ec135..53d2e29 100644 (file)
@@ -5,6 +5,7 @@ app.Models.Admin.RegClass = Backbone.Model.extend({
 
     // Defaults
     defaults: {
+        id: 'new',
         reg_event: 0,
         name: '',
         descr: '',
index f642355..a25d406 100644 (file)
@@ -1 +1,30 @@
-Add admin.js and/or front.js to this directory to have those registered automatically.
\ No newline at end of file
+Add admin.js and/or front.js to this directory to have those registered automatically.
+
+== structure for backbone.js ==
+
+js/
+    models/
+        admin/
+        front/
+    collections/
+        admin/
+        front/
+    views/
+        admin/
+        front/
+
+== run gulp ==
+From the main plugin directory run gulp
+> gulp
+It will watch all javascript files and if they change recreate the main
+regApp.js file.
+
+== Backbone.js ==
+http://backbonejs.org
+
+=== Model ===
+Models are the heart of any JavaScript application, containing the interactive data as well as a large part of the logic surrounding it: conversions, validations, computed properties, and access control. You extend Backbone.Model with your domain-specific methods, and Model provides a basic set of functionality for managing changes.
+=== Collection ===
+Collections are ordered sets of models. You can bind "change" events to be notified when any model in the collection has been modified, listen for "add" and "remove" events, fetch the collection from the server, and use a full suite of Underscore.js methods.
+=== View ===
+Backbone views are almost more convention than they are code — they don't determine anything about your HTML or CSS for you, and can be used with any JavaScript templating library. The general idea is to organize your interface into logical views, backed by models, each of which can be updated independently when the model changes, without having to redraw the page. Instead of digging into a JSON object, looking up an element in the DOM, and updating the HTML by hand, you can bind your view's render function to the model's "change" event — and now everywhere that model data is displayed in the UI, it is always immediately up to date.
index 0884735..af3b0da 100644 (file)
@@ -1 +1 @@
-app.Models.Front.Account=Backbone.Model.extend({defaults:{id:"",email:"",parent:""},initialize:function(){this.on("invalid",function(e,t){console.log(t)})},validate:function(e,t){if(void 0===e.email||""===e.email)return"Need an email address!"}}),app.Models.Front.AccountDetail=app.Models.Front.Account.extend({defaults:{id:"",fname:"",lname:"",org:"",title:"",addr1:"",addr2:"",city:"",state:"",zip:"",country:"",phone:"",fax:"",email_ok:!1,is_member:!1,date_created:"",email:"",parent:""}}),app.Models.Front.Login=Backbone.Model.extend({defaults:{username:"",password:""},urlRoot:appLoginUrl,initialize:function(){this.on("invalid",function(e,t){console.log(t)})},validate:function(e,t){return void 0===e.username||""===e.username?"Username required!":void 0===e.password||""===e.password?"Password required!":void 0}}),app.Models.Front.RegClass=Backbone.Model.extend({defaults:{reg_event:0,name:"",descr:"",reg_rate_name:"",reg_rate_base_price:"",reg_rate_per_reg:"",reg_count:0},initialize:function(){this.accounts=new app.Collections.Front.Accounts}}),app.Models.Front.RegEvent=Backbone.Model.extend({defaults:{name:"regEvent",event_name:"",event_code:"",notify_email:"",attendees_max:0,attendees_max_per_reg:0,reg_hold_minutes:0,cart_hold_days:0,terms:""},initialize:function(){this.classes=new app.Collections.Front.RegClasses},setClasses:function(e){this.classes.reset(e)}}),app.Models.Front.regRate=Backbone.Model.extend({defaults:{reg_event:0,reg_class:"",name:"",start_days:0,end_days:0,base_rate:0,per_registrant:0,registrant_credits:0},initialize:function(){}}),app.Models.Admin.RegClass=Backbone.Model.extend({defaults:{reg_event:0,name:"",descr:""},initialize:function(){this.rates=new app.Collections.Admin.RegRates}}),app.Models.Admin.RegEvent=Backbone.Model.extend({defaults:{name:"regEvent",event_name:"",event_code:"",notify_email:"",attendees_max:0,attendees_max_per_reg:0,reg_hold_minutes:0,cart_hold_days:0,terms:""},initialize:function(){this.classes=new app.Collections.Admin.RegClasses},setClasses:function(e){this.classes.reset(e)}}),app.Models.Admin.RegRate=Backbone.Model.extend({defaults:{reg_event:0,reg_class:"",name:"",start_days:0,end_days:0,base_rate:0,per_registrant:0,registrant_credits:0},initialize:function(){}}),app.Collections.Front.Accounts=Backbone.Collection.extend({model:app.Models.Front.Account,localStorage:new Backbone.LocalStorage("Accounts"),sync:function(e,t,n){console.log("sync called on collection. method: "+e)}}),app.Collections.Front.RegClasses=Backbone.Collection.extend({model:app.Models.Front.RegClass}),app.Collections.Front.RegRates=Backbone.Collection.extend({model:app.Models.Front.RegRate}),app.Collections.Admin.RegClasses=Backbone.Collection.extend({model:app.Models.Admin.RegClass}),app.Collections.Admin.RegRates=Backbone.Collection.extend({model:app.Models.Admin.RegRate}),app.Views.Front.Account=Backbone.View.extend({tagName:"div",className:"glm-reg-level-registrant clearfix",template:_.template(jQuery("#account-template").html()),events:{"click label":"edit","click .glm-reg-level-registrant-delete":"deleteOne","click .saveRegistrant":"close"},initialize:function(){return this.listenTo(this.model,"change",this.render),this.listenTo(this.model,"destroy",this.remove),this},render:function(){return this.$el.html(this.template(this.model.toJSON())),this.$nameInput=this.$(".editName"),this.$emailInput=this.$(".editEmail"),this},deleteOne:function(){this.model.destroy()},edit:function(){this.$el.addClass("editing"),this.$nameInput.focus()},close:function(){var e=this.$nameInput.val().trim(),t=this.$emailInput.val().trim();e&&t?this.model.save({name:e,email:t}):this.clear(),this.$el.removeClass("editing")}}),Backbone.emulateJSON=!0,Backbone.emulateHTTP=!0,app.Views.Front.App=Backbone.View.extend({el:"#regApp",initialize:function(){this.event=new app.Views.Front.RegEvent({model:regEvent}),this.render()},render:function(){return this.$el.append(this.event.render().el),this},events:{"click #appLogin":"login"},login:function(){this.loginView=new app.Views.Front.Login({model:new app.Models.Front.Login}),this.$el.append(this.loginView.render().el),jQuery("#appLogin").hide()}}),app.Views.Front.Login=Backbone.View.extend({tagName:"div",className:"glm-reg-login",template:_.template(jQuery("#eventReg-account-login").html()),events:{"click .accountLogin":"loginToAccount","click #loginCancel":"closeLoginForm"},initialize:function(){return this},closeLoginForm:function(){this.remove(),jQuery("#appLogin").show()},loginToAccount:function(){jQuery.ajax({url:ajaxUrl})},render:function(){return this.$el.html(this.template(this.model.toJSON())),this.$userInput=jQuery(".login"),this.$pwdInput=jQuery(".password"),this}}),app.Views.Front.RegClass=Backbone.View.extend({tagName:"div",className:"glm-reg-level",template:_.template(jQuery("#regClass-template").html()),initialize:function(){return this.listenTo(this.model.accounts,"add",this.addOne),this.listenTo(this.model.accounts,"create",this.addOne),this.listenTo(this.model.accounts,"reset",this.addAll),this.listenTo(this.model,"change",this.updateCount),this},events:{"click .addRegistrant":"newEntry"},newEntry:function(){this.$newEmail=jQuery(".addEmail"),this.$newEmail.val().trim()&&jQuery.ajax({context:this,url:ajaxUrl+"&glm_action=account&option=checkEmail",dataType:"json",data:"email="+this.$newEmail.val().trim()}).done(function(e){!0!==e.validEmail?alert("Must be a valid email address!"):!0!==e.valid?alert("No account matched that email address!"):void 0!==e.id&&void 0!==e.email&&(this.model.accounts.create({id:e.id,email:e.email,parent:this.model.id}),this.model.trigger("change"),this.$newEmail.val(""))}).fail(function(e){console.log("Fail: "+e)})},render:function(){return this.$el.html(this.template(this.model.toJSON())),this},updateCount:function(){return this.model.reg_count=this.model.accounts.length,console.log("Updating Count: "+this.model.reg_count),this.render,this},addOne:function(e){if(e.isValid()){var t=new app.Views.Front.Account({model:e});this.$el.append(t.render().el)}},addAll:function(){jQuery(".glm-reg-level").html("")}}),app.Views.Front.RegEvent=Backbone.View.extend({tagName:"div",className:"glm-reg-event-item clearfix",template:_.template(jQuery("#regEvent-template").html()),initialize:function(){this.listenTo(this.model,"change",this.render)},render:function(){this.$el.html(this.template(this.model.toJSON()));var e=regEvent.classes.map(function(e){return new app.Views.Front.RegClass({model:e}).render().el});return this.$el.append(e),this}}),Backbone.emulateJSON=!0,Backbone.emulateHTTP=!0,app.Views.Admin.EventEditLevels=Backbone.View.extend({el:"#regApp",initialize:function(){this.event=new app.Views.Admin.RegEvent({model:regEvent}),this.render()},render:function(){return this.$el.append(this.event.render().el),this},events:{}}),app.Views.Admin.RegClass=Backbone.View.extend({tagName:"div",className:"glm-reg-level",template:_.template(jQuery("#regClass-template").html()),initialize:function(){return this.listenTo(this.model.accounts,"add",this.addOne),this.listenTo(this.model.accounts,"create",this.addOne),this.listenTo(this.model.accounts,"reset",this.addAll),this.listenTo(this.model,"change",this.updateCount),this},events:{},render:function(){return this.$el.html(this.template(this.model.toJSON())),this},addOne:function(e){if(e.isValid()){var t=new app.Views.Admin.Account({model:e});this.$el.append(t.render().el)}},addAll:function(){jQuery(".glm-reg-level").html("")}}),app.Views.Admin.RegEvent=Backbone.View.extend({tagName:"div",className:"glm-reg-event-item clearfix",template:_.template(jQuery("#regEvent-template").html()),initialize:function(){this.listenTo(this.model,"change",this.render)},render:function(){this.$el.html(this.template(this.model.toJSON()));var e=regEvent.classes.map(function(e){return new app.Views.Admin.RegClass({model:e}).render().el});return this.$el.append(e),this}});
\ No newline at end of file
+app.Models.Front.Account=Backbone.Model.extend({defaults:{id:"",email:"",parent:""},initialize:function(){this.on("invalid",function(e,t){console.log(t)})},validate:function(e,t){if(void 0===e.email||""===e.email)return"Need an email address!"}}),app.Models.Front.AccountDetail=app.Models.Front.Account.extend({defaults:{id:"",fname:"",lname:"",org:"",title:"",addr1:"",addr2:"",city:"",state:"",zip:"",country:"",phone:"",fax:"",email_ok:!1,is_member:!1,date_created:"",email:"",parent:""}}),app.Models.Front.Login=Backbone.Model.extend({defaults:{username:"",password:""},urlRoot:appLoginUrl,initialize:function(){this.on("invalid",function(e,t){console.log(t)})},validate:function(e,t){return void 0===e.username||""===e.username?"Username required!":void 0===e.password||""===e.password?"Password required!":void 0}}),app.Models.Front.RegClass=Backbone.Model.extend({defaults:{reg_event:0,name:"",descr:"",reg_rate_name:"",reg_rate_base_price:"",reg_rate_per_reg:"",reg_count:0},initialize:function(){this.accounts=new app.Collections.Front.Accounts}}),app.Models.Front.RegEvent=Backbone.Model.extend({defaults:{name:"regEvent",event_name:"",event_code:"",notify_email:"",attendees_max:0,attendees_max_per_reg:0,reg_hold_minutes:0,cart_hold_days:0,terms:""},initialize:function(){this.classes=new app.Collections.Front.RegClasses},setClasses:function(e){this.classes.reset(e)}}),app.Models.Front.regRate=Backbone.Model.extend({defaults:{reg_event:0,reg_class:"",name:"",start_days:0,end_days:0,base_rate:0,per_registrant:0,registrant_credits:0},initialize:function(){}}),app.Models.Admin.RegClass=Backbone.Model.extend({defaults:{id:"new",reg_event:0,name:"",descr:""},initialize:function(){this.rates=new app.Collections.Admin.RegRates}}),app.Models.Admin.RegEvent=Backbone.Model.extend({defaults:{name:"regEvent",event_name:"",event_code:"",notify_email:"",attendees_max:0,attendees_max_per_reg:0,reg_hold_minutes:0,cart_hold_days:0,terms:""},initialize:function(){this.classes=new app.Collections.Admin.RegClasses},setClasses:function(e){this.classes.reset(e)}}),app.Models.Admin.RegRate=Backbone.Model.extend({defaults:{reg_event:0,reg_class:"",name:"",start_days:0,end_days:0,base_rate:0,per_registrant:0,registrant_credits:0},initialize:function(){}}),app.Collections.Front.Accounts=Backbone.Collection.extend({model:app.Models.Front.Account,localStorage:new Backbone.LocalStorage("Accounts"),sync:function(e,t,n){console.log("sync called on collection. method: "+e)}}),app.Collections.Front.RegClasses=Backbone.Collection.extend({model:app.Models.Front.RegClass}),app.Collections.Front.RegRates=Backbone.Collection.extend({model:app.Models.Front.RegRate}),app.Collections.Admin.RegClasses=Backbone.Collection.extend({model:app.Models.Admin.RegClass}),app.Collections.Admin.RegRates=Backbone.Collection.extend({model:app.Models.Admin.RegRate}),app.Views.Front.Account=Backbone.View.extend({tagName:"div",className:"glm-reg-level-registrant clearfix",template:_.template(jQuery("#account-template").html()),events:{"click label":"edit","click .glm-reg-level-registrant-delete":"deleteOne","click .saveRegistrant":"close"},initialize:function(){return this.listenTo(this.model,"change",this.render),this.listenTo(this.model,"destroy",this.remove),this},render:function(){return this.$el.html(this.template(this.model.toJSON())),this.$nameInput=this.$(".editName"),this.$emailInput=this.$(".editEmail"),this},deleteOne:function(){this.model.destroy()},edit:function(){this.$el.addClass("editing"),this.$nameInput.focus()},close:function(){var e=this.$nameInput.val().trim(),t=this.$emailInput.val().trim();e&&t?this.model.save({name:e,email:t}):this.clear(),this.$el.removeClass("editing")}}),Backbone.emulateJSON=!0,Backbone.emulateHTTP=!0,app.Views.Front.App=Backbone.View.extend({el:"#regApp",initialize:function(){this.event=new app.Views.Front.RegEvent({model:regEvent}),this.render()},render:function(){return this.$el.append(this.event.render().el),this},events:{"click #appLogin":"login"},login:function(){this.loginView=new app.Views.Front.Login({model:new app.Models.Front.Login}),this.$el.append(this.loginView.render().el),jQuery("#appLogin").hide()}}),app.Views.Front.Login=Backbone.View.extend({tagName:"div",className:"glm-reg-login",template:_.template(jQuery("#eventReg-account-login").html()),events:{"click .accountLogin":"loginToAccount","click #loginCancel":"closeLoginForm"},initialize:function(){return this},closeLoginForm:function(){this.remove(),jQuery("#appLogin").show()},loginToAccount:function(){jQuery.ajax({url:ajaxUrl})},render:function(){return this.$el.html(this.template(this.model.toJSON())),this.$userInput=jQuery(".login"),this.$pwdInput=jQuery(".password"),this}}),app.Views.Front.RegClass=Backbone.View.extend({tagName:"div",className:"glm-reg-level",template:_.template(jQuery("#regClass-template").html()),initialize:function(){return this.listenTo(this.model.accounts,"add",this.addOne),this.listenTo(this.model.accounts,"create",this.addOne),this.listenTo(this.model.accounts,"reset",this.addAll),this.listenTo(this.model,"change",this.updateCount),this},events:{"click .addRegistrant":"newEntry"},newEntry:function(){this.$newEmail=jQuery(".addEmail"),this.$newEmail.val().trim()&&jQuery.ajax({context:this,url:ajaxUrl+"&glm_action=account&option=checkEmail",dataType:"json",data:"email="+this.$newEmail.val().trim()}).done(function(e){!0!==e.validEmail?alert("Must be a valid email address!"):!0!==e.valid?alert("No account matched that email address!"):void 0!==e.id&&void 0!==e.email&&(this.model.accounts.create({id:e.id,email:e.email,parent:this.model.id}),this.model.trigger("change"),this.$newEmail.val(""))}).fail(function(e){console.log("Fail: "+e)})},render:function(){return this.$el.html(this.template(this.model.toJSON())),this},updateCount:function(){return this.model.reg_count=this.model.accounts.length,console.log("Updating Count: "+this.model.reg_count),this.render,this},addOne:function(e){if(e.isValid()){var t=new app.Views.Front.Account({model:e});this.$el.append(t.render().el)}},addAll:function(){jQuery(".glm-reg-level").html("")}}),app.Views.Front.RegEvent=Backbone.View.extend({tagName:"div",className:"glm-reg-event-item clearfix",template:_.template(jQuery("#regEvent-template").html()),initialize:function(){this.listenTo(this.model,"change",this.render)},render:function(){this.$el.html(this.template(this.model.toJSON()));var e=regEvent.classes.map(function(e){return new app.Views.Front.RegClass({model:e}).render().el});return this.$el.append(e),this}}),Backbone.emulateJSON=!0,Backbone.emulateHTTP=!0,app.Views.Admin.EventEditLevels=Backbone.View.extend({el:"#regApp",initialize:function(){this.event=new app.Views.Admin.RegEvent({model:regEvent}),this.render()},render:function(){return this.$el.append(this.event.render().el),this},events:{}}),app.Views.Admin.RegClass=Backbone.View.extend({tagName:"div",className:"glm-reg-level",template:_.template(jQuery("#regClass-template").html()),initialize:function(){return this.listenTo(this.model.accounts,"add",this.addOne),this.listenTo(this.model.accounts,"create",this.addOne),this.listenTo(this.model.accounts,"reset",this.addAll),this.listenTo(this.model,"change",this.updateCount),this},events:{},render:function(){return this.$el.html(this.template(this.model.toJSON())),this},addOne:function(e){if(e.isValid()){var t=new app.Views.Admin.Account({model:e});this.$el.append(t.render().el)}},addAll:function(){jQuery(".glm-reg-level").html("")}}),app.Views.Admin.RegEvent=Backbone.View.extend({tagName:"div",className:"glm-reg-event-item clearfix",template:_.template(jQuery("#regEvent-template").html()),initialize:function(){this.listenTo(this.model,"change",this.render)},events:{"click .add-reg-level":"addLevel"},addLevel:function(){console.log("Add Level Called");var e=new app.Views.Admin.RegClass({model:new app.Models.Admin.RegClass});this.$el.append(e.render().el)},render:function(){this.$el.html(this.template(this.model.toJSON()));var e=regEvent.classes.map(function(e){return new app.Views.Admin.RegClass({model:e}).render().el});return this.$el.append(e),this}});
\ No newline at end of file
index 33c1821..e48fc9c 100644 (file)
@@ -13,6 +13,18 @@ app.Views.Admin.RegEvent = Backbone.View.extend({
     initialize: function(){
         this.listenTo( this.model, 'change', this.render );
     },
+
+    events: {
+        'click .add-reg-level': 'addLevel',
+    },
+
+    addLevel: function(){
+        console.log( 'Add Level Called' );
+        // create a now view and model and add it to classes and call render.
+        var view = new app.Views.Admin.RegClass({ model: new app.Models.Admin.RegClass });
+        this.$el.append(view.render().el);
+    },
+
     render: function(){
         this.$el.html( this.template( this.model.toJSON() ) );
         var view = regEvent.classes.map(function(item){
index 4df6b19..6351cb2 100644 (file)
@@ -23,6 +23,8 @@
     {literal}
     <script type="text/template" id="regEvent-template">
     <h2><%= event_name %></h2>
+    <h3>Registration Levels</h3>
+    <button class="add-reg-level">Add Level</button>
     </script>
     <script type="text/template" id="account-template">
     <a class="glm-reg-level-registrant-delete">Delete</a>
     </div>
     </script>
     <script type="text/template" id="regClass-template">
-    <h3><%= name %></h3>
-    <p><%= descr %></p>
+    <button>Delete Level</button>
+    <h3><input type="text"
+        name="reg_name_<% if (id) { %><%- id %><% } else { %> new <% } %>"
+        value="<% if (name) { %><%- name %><% } %>"></h3>
+    <p><input type="text"
+        name="reg_descr_<% if (id) { %><%- id %><% } else { %> new <% } %>"
+        size="90"
+        value="<% if (descr) { %><%- descr %><% } %>"></p>
+    <button class="add-reg-rate">Add Reg Rate</button>
     </script>
     <script type="text/template" id="eventReg-account-login">
     <h4>Login</h4>