Lot's of redoing the forms and using the glm grlid more.
// echo '<pre>$eventData: ' . print_r( $eventData, true ) . '</pre>';
// Add to the registration event arraytrue
- $result_data['intro'] = $eventData['intro'];
- $result_data['descr'] = $eventData['descr'];
- $result_data['image'] = $eventData['image'];
- $result_data['contact_name'] = $eventData['contact_name'];
- $result_data['contact_email'] = $eventData['contact_email'];
- $result_data['contact_phone'] = $eventData['contact_phone'];
- $result_data['url'] = $eventData['url'];
+ $result_data['intro'] = $eventData['intro'];
+ $result_data['descr'] = $eventData['descr'];
+ $result_data['image'] = $eventData['image'];
+ $result_data['contact_name'] = $eventData['contact_name'];
+ $result_data['contact_email'] = $eventData['contact_email'];
+ $result_data['contact_phone'] = $eventData['contact_phone'];
+ $result_data['url'] = $eventData['url'];
+ $result_data['hide_address'] = $eventData['hide_address'];
+ $result_data['use_member_location'] = $eventData['use_member_location'];
+
+ // Check for times data and use that.
if ( isset( $eventData['times'] ) && $eventData['times'] ) {
- $result_data['times'] = $eventData['times'];
+ $result_data['times'] = $eventData['times'];
}
if ( isset( $eventData['starting_date'] ) && $eventData['starting_date'] ) {
$result_data['starting_date'] = $eventData['starting_date'];
}
if ( isset( $eventData['ending_date'] ) && $eventData['ending_date'] ) {
- $result_data['ending_date'] = $eventData['ending_date'];
+ $result_data['ending_date'] = $eventData['ending_date'];
+ }
+ if ( isset( $eventData['locations'] ) && $eventData['locations'] ) {
+ $result_data['locations'] = $eventData['locations'];
}
}
/*}}} end of tampering */
/*{{{ Event Registration List */
+#glm-reg-list h3 a {
+ text-transform: uppercase;
+}
.glm-reg-event-list {
width: 100%;
padding: 0;
border: 1px solid black;
padding: 10px;
margin: 1.2rem 1rem;
- position: relative;
+ /* position: relative; */
}
.glm-reg-event-item h2 {
font-size: 1.5rem;
.glm-reg-entryforms {
width: 100%;
clear: both;
- position: relative;
+ /* position: relative; */
}
.glm-reg-level-add-registrant {
float: right;
}
.glm-reg-compcode-entry {
width: 11rem;
- position: absolute;
+ /* position: absolute; */
top: .8rem;
right: .5rem;
}
.glm-reg-submit {
padding: 1rem;
- position: absolute;
+ /* position: absolute; */
bottom: .3rem;
right: .5rem;
}
reg_rate_per_reg: '',
reg_count: 0,
loggedIn: false,
+ selectedTime: 0,
},
initialize: function(){
'click .glm-add-new-account': 'addNewAccount',
'click .add-new-registrant': 'addNew',
'click .add-new-registrant-cancel': 'cancelAddNew',
+ 'click .timeSelection': 'updateTimeSelection',
+ },
+
+ updateTimeSelection: function(){
+ this.model.set({ selectedTime: this.$('.timeSelection:checked').val() });
},
render: function(){
});
var accountContainer = this.$('.reg-class-accounts');
accountContainer.append(view);
+ if ( app.timeSpecific ) {
+ // this.setCalendar();
+ }
if ( loginAccount === '' ) {
this.$('.glm-add-account').hide();
}
return this;
},
+ getTimeArray: function(){
+ var times = this.model.get( 'times' );
+ var timeParts = [];
+ _.each( times, function(time){
+ var testDate = new Date( time.start_datetime.datetime );
+ timeParts.push( {id: time.id,date: testDate} );
+ });
+ console.log( timeParts );
+ return timeParts;
+ },
+
setCalendar: function(){
+ console.log( 'setting calendar' );
var times = this.model.get( 'times' );
+ console.log(times);
$('#eventCalendar').fullCalendar({
events: function(start, end, timezone, callback) {
var events = [];
this.newRegAccountView = new app.Views.Front.RegistrantForm({model: registrant});
this.$el.append( this.newRegAccountView.render().el );
if ( app.timeSpecific ) {
- this.setCalendar();
+ // this.setCalendar();
}
}
}
this.newRegAccountView = new app.Views.Front.RegistrantForm({model: this.newRegAccount});
this.$el.append( this.newRegAccountView.render().el );
if ( app.timeSpecific ) {
- this.setCalendar();
+ // this.setCalendar();
}
},
tagName: 'div',
- className: 'glm-reg-event-item clearfix',
+ className: 'glm-reg-event-item',
template: _.template( jQuery('#regEvent-template').html() ),
var view = regEvent.classes.map(function(item){
return (new app.Views.Front.RegClass({ model: item })).render().el;
});
- this.$el.append(view);
+ var classContainer = this.$('.glm-reg-classes');
+ classContainer.append(view);
return this;
},
reg_rate_per_reg: '',
reg_count: 0,
loggedIn: false,
+ selectedTime: 0,
},
initialize: function(){
'click .glm-add-new-account': 'addNewAccount',
'click .add-new-registrant': 'addNew',
'click .add-new-registrant-cancel': 'cancelAddNew',
+ 'click .timeSelection': 'updateTimeSelection',
+ },
+
+ updateTimeSelection: function(){
+ this.model.set({ selectedTime: this.$('.timeSelection:checked').val() });
},
render: function(){
});
var accountContainer = this.$('.reg-class-accounts');
accountContainer.append(view);
+ if ( app.timeSpecific ) {
+ // this.setCalendar();
+ }
if ( loginAccount === '' ) {
this.$('.glm-add-account').hide();
}
return this;
},
+ getTimeArray: function(){
+ var times = this.model.get( 'times' );
+ var timeParts = [];
+ _.each( times, function(time){
+ var testDate = new Date( time.start_datetime.datetime );
+ timeParts.push( {id: time.id,date: testDate} );
+ });
+ console.log( timeParts );
+ return timeParts;
+ },
+
setCalendar: function(){
+ console.log( 'setting calendar' );
var times = this.model.get( 'times' );
+ console.log(times);
$('#eventCalendar').fullCalendar({
events: function(start, end, timezone, callback) {
var events = [];
this.newRegAccountView = new app.Views.Front.RegistrantForm({model: registrant});
this.$el.append( this.newRegAccountView.render().el );
if ( app.timeSpecific ) {
- this.setCalendar();
+ // this.setCalendar();
}
}
}
this.newRegAccountView = new app.Views.Front.RegistrantForm({model: this.newRegAccount});
this.$el.append( this.newRegAccountView.render().el );
if ( app.timeSpecific ) {
- this.setCalendar();
+ // this.setCalendar();
}
},
tagName: 'div',
- className: 'glm-reg-event-item clearfix',
+ className: 'glm-reg-event-item',
template: _.template( jQuery('#regEvent-template').html() ),
var view = regEvent.classes.map(function(item){
return (new app.Views.Front.RegClass({ model: item })).render().el;
});
- this.$el.append(view);
+ var classContainer = this.$('.glm-reg-classes');
+ classContainer.append(view);
return this;
},
// Compile template data
$templateData = array(
'page' => 'register',
- //'events' => $eventData,
'regEventsCount' => $regEventsCount,
'haveRegEvents' => $haveRegEvents,
'regEvents' => $list,
{include file='front/registrations/header.html'}
-<div class="glm-reg-event-list">
+<divi id="glm-reg-list" class="glm-reg-row">
{if $haveRegEvents}
{foreach $regEvents as $event}
- <div class="glm-reg-event-item clearfix">
- <h2><a href="{$thisUrl}?page=registration&eventRegId={$event.id}">{$event.event_name}</a></h2>
- {if $event.image}
- <img style="float:right;" src="{$glmPluginMediaUrl}/images/thumb/{$event.image}">
- {/if}
+ <div class="glm-columns glm-large-12 glm-reg-event-item">
+ <h3><a href="{$thisUrl}?page=registration&eventRegId={$event.id}">{$event.event_name}</a></h3>
+ {if $event.image} <img style="float:right;" src="{$glmPluginMediaUrl}/images/thumb/{$event.image}"> {/if}
<p>{$event.intro}</p>
- <table>
- <tr>
- <th> Days/Times </th>
- </tr>
- {foreach $event.times as $time}
- <tr>
- <td>
- {if $time.recur_name != 'Imported Event Schedule'}
- <i>{$time.recur_name}</i>
- {/if}
- {$time.start_time.timestamp|date_format:"%A, %B %e, %Y"}
- {$time.start_time.timestamp|date_format:"%l:%M %P"}
- -
- {$time.end_time.timestamp|date_format:"%l:%M %P"}
- </td>
- </tr>
- {/foreach}
- </table>
+ <div class="glm-reg-row">
+ <div class="glm-columns glm-large-2 glm-small-12">
+ <strong> Dates/Times: </strong>
+ </div>
+ <div class="glm-columns glm-large-10">
+ {foreach $event.times as $time}
+ {if $time.recur_name && $time.recur_name != 'Imported Event Schedule'}
+ <strong>{$time.recur_name}</strong><br />
+ {/if}
+ {$time.start_time.timestamp|date_format:"%A, %B %e, %Y"}
+ {$time.start_time.timestamp|date_format:"%l:%M %P"}
+ -
+ {$time.end_time.timestamp|date_format:"%l:%M %P"}<br />
+ {/foreach}
+ </div>
+ </div>
+ {if $event.hide_address.name == 'No'}
+ <div class="glm-reg-row">
+ <div class="glm-columns glm-large-2 glm-small-12">
+ <strong> Location: </strong>
+ </div>
+ <div class="glm-columns glm-large-10 glm-small-12">
+ {if !$event.use_member_location.value && ($event.locations.name || $event.locations.address)}
+ {if $event.locations.name}{$event.locations.name}<br>{/if}
+ {if $event.locations.address} {$event.locations.address}<br> {/if}
+ {if $event.locations.city.name}{$event.locations.city.name}{/if}{if $event.locations.state.value}, {$event.locations.state.value} {/if}
+ {if $event.locations.zip} {$event.locations.zip} {/if}
+ {if $event.locations.phone} {apply_filters('glm_associate_phone_filter', $event.locations.phone)} {/if}
+ {elseif $event.use_member_location.value || $event.other_ref_dest}
+ {if $event.member.member} {$event.member.member}<br> {/if}
+ {if $event.member.addr1} {$event.member.addr1}<br> {/if}
+ {if $event.member.city}{$event.member.city}{/if}{if $event.member.state.value}, {$event.member.state.value}{/if}
+ {if $event.member.zip} {$event.member.zip} {/if}
+ {if $event.member.phone} {apply_filters('glm_associate_phone_filter', $event.member.phone)} {/if}
+ {/if}
+ </div>
+ </div>
+ {/if}
</div>
{/foreach}
{else}
{/if}
</div>
-{debug}
{/literal}
{* Template for the regEvent *}{literal}
<script type="text/template" id="regEvent-template">
- <h2><%= event_name %></h2>
- <div class="glm-reg-compcode-entry glm-hidden">
- <input type="text" placeholder="Enter Comp Code Here" />
- </div>
- <div>
- <p><%= descr %></p>
- <% if ( this.getClassCount() == 0 ) { %>
- <p> Registrations for this event not currently available at this time. </p>
- <% } else { %>
- <% if ( !time_specific ) { %>
- <p>Attend any time during event</p>
- <% _.each(reg_time, function(rTime){ %>
- <% if ( rTime.attendee_max > 0 ) { %>
- <p> Maximum Registrants: <%= rTime.attendee_max %><br>
- Currently Available: <%= rTime.attendees_available %> </p>
+ <div class="glm-row">
+ <div class="glm-columns glm-small-12">
+ <h2><%= event_name %></h2>
+ <div>
+ <% if ( this.getClassCount() == 0 ) { %>
+ <p> Registrations for this event not currently available at this time. </p>
+ <% } else { %>
+ <% if ( !time_specific ) { %>
+ <p>Attend any time during event</p>
+ <% _.each(reg_time, function(rTime){ %>
+ <% if ( rTime.attendee_max > 0 ) { %>
+ <p> Maximum Registrants: <%= rTime.attendee_max %><br>
+ Currently Available: <%= rTime.attendees_available %> </p>
+ <% } %>
+ <% }); %>
+ <% } else { %>
<% } %>
- <% }); %>
- <% } else { %>
- <% } %>
- <% } %>
+ <% } %>
- <p><%= terms %></p>
- </div>
-
- <div class="glm-reg-entryforms clearfix glm-hidden">
- <div class="glm-reg-dates">
- <h4>Pick your registration dates</h4>
- <input type="date" placeholder="Enter Date" />
- <input type="text" placeholder="Enter Time" />
+ <% if ( terms ) { %><p><%= terms %></p><% } %>
+ </div>
</div>
- </div>
- <div class="glm-reg-submit">
- <div class="glm-reg-warning">You have not yet submitted your registration! <img src="{/literal}{$assetUrl}{literal}/fingerRightRed.svg" style="height: 2em;">
- <input id="glm-reg-cart-continue" type="submit" value="Continue" />
+ <div class="glm-columns glm-small-12 glm-reg-classes"></div>
+ <div class="glm-columns glm-small-12">
+ <div class="glm-reg-submit">
+ <div class="glm-reg-warning">You have not yet submitted your registration! <img src="{/literal}{$assetUrl}{literal}/fingerRightRed.svg" style="height: 2em;">
+ <input id="glm-reg-cart-continue" type="submit" value="Continue" />
+ </div>
+ </div>
</div>
</div>
</script>
{/literal}
{* Template for regClass *}{literal}
<script type="text/template" id="regClass-template">
- <div class="glm-class-row-header">
- <span class="glm-reg-level-title"><%= name %></span>
- <span class="reg-class-count"><%= reg_count %> {/literal}{$terms.reg_term_attendee_plur_cap}{literal}</span>
- </div>
- <div class="reg-class-detail">
- <div><%- descr %></div>
- <% if ( loggedIn ) { %>
- <button class="glm-add-account tiny">Add Me</button>
- <% } %>
- <button class="glm-add-new-account tiny">Add {/literal}{$terms.reg_term_attendee_cap}{literal}</button>
- <div class="reg-class-accounts">
- {/literal}{$terms.reg_term_attendee_plur_cap}{literal}
+ <div class="glm-row">
+ <div class="glm-columns glm-small-12 glm-large-12">
+ <div class="glm-row">
+ <span class="glm-reg-level-title"><%= name %></span>
+ <span class="reg-class-count"><%= reg_count %> {/literal}{$terms.reg_term_attendee_plur_cap}{literal}</span>
+ <div class="glm-columns glm-small-12">
+ <%- descr %>
+ </div>
+ <div class="glm-columns glm-small-12 glm-large-12"> <%= reg_rate_name %> </div>
+ <div class="glm-columns glm-small-12 glm-large-12"> Base Rate: $<%= reg_rate_base_price %> </div>
+ <div class="glm-columns glm-small-12 glm-large-12"> Per Registrant: $<%= reg_rate_per_reg %> </div>
+ <div class="glm-columns glm-small-12 glm-large-12">
+ <% _.each( this.getTimeArray(), function(time){ %>
+ <label>
+ <input class="timeSelection" type="radio" name="timeOption" value="<%= time.id %>" /> <%= time.date.toLocaleTimeString('en-US', {hour: '2-digit', minute: '2-digit'}) %>
+ </label>
+ <% }); %>
+ </div>
+ </div>
+ </div>
+ <div class="glm-columns glm-small-12 glm-large-12">
+ <div class="reg-class-detail">
+ <% if ( loggedIn ) { %>
+ <button class="glm-add-account tiny">Add Me</button>
+ <% } %>
+ <button class="glm-add-new-account tiny">Add {/literal}{$terms.reg_term_attendee_cap}{literal}</button>
+ <div class="reg-class-accounts">
+ {/literal}{$terms.reg_term_attendee_plur_cap}{literal}
+ </div>
+ </div>
</div>
</div>
</script>
{* Template for registrant add form *}{literal}
<script type="text/template" id="eventReg-registrant-add">
{/literal}{if $regEvent.time_specific.value}
- <div id="eventCalendar" style="width: 90%;"></div>
{/if}{literal}
- <div class="glm-reg-row">
+ <div class="glm-row">
<div class="glm-columns glm-large-6">
<h4>{/literal}{$terms.reg_term_contact_information}{literal}</h4>
- <div class="glm-reg-row">
+ <div class="glm-row">
<div class="glm-columns glm-large-4 glm-small-12">First Name</div>
<div class="glm-columns glm-large-8 glm-small-12"><input class="add_reg_fname" value="<%- fname %>"></div>
</div>
- <div class="glm-reg-row">
+ <div class="glm-row">
<div class="glm-columns glm-large-4 glm-small-12">Last Name</div>
<div class="glm-columns glm-large-8 glm-small-12"><input class="add_reg_lname" value="<%- lname %>"></div>
</div>
- <div class="glm-reg-row">
+ <div class="glm-row">
<div class="glm-columns glm-large-4 glm-small-12">Email Address</div>
<div class="glm-columns glm-large-8 glm-small-12"><input class="add_reg_email" value="<%- email %>"></div>
</div>
- <div class="glm-reg-row">
+ <div class="glm-row">
<div class="glm-columns glm-large-4 glm-small-12">Address 1</div>
<div class="glm-columns glm-large-8 glm-small-12"><input class="add_reg_addr1" value="<%- addr1 %>"></div>
</div>
- <div class="glm-reg-row">
+ <div class="glm-row">
<div class="glm-columns glm-large-4 glm-small-12">Address 2</div>
<div class="glm-columns glm-large-8 glm-small-12"><input class="add_reg_addr2" value="<%- addr2 %>"></div>
</div>
- <div class="glm-reg-row">
+ <div class="glm-row">
<div class="glm-columns glm-large-4 glm-small-12">City</div>
<div class="glm-columns glm-large-8 glm-small-12"><input class="add_reg_city" value="<%- city %>"></div>
</div>
- <div class="glm-reg-row">
+ <div class="glm-row">
<div class="glm-columns glm-large-4 glm-small-12">State</div>
<div class="glm-columns glm-large-8 glm-small-12"><input class="add_reg_state" value="<%- state %>"></div>
</div>
- <div class="glm-reg-row">
+ <div class="glm-row">
<div class="glm-columns glm-large-4 glm-small-12">Zip/Postal Code</div>
<div class="glm-columns glm-large-8 glm-small-12"><input class="add_reg_zip" value="<%- zip %>"></div>
</div>
- <div class="glm-reg-row">
+ <div class="glm-row">
<div class="glm-columns glm-large-4 glm-small-12">Country</div>
<div class="glm-columns glm-large-8 glm-small-12"><input class="add_reg_country" value="<%- country %>"></div>
</div>
{/if}{literal}
</div>
</div>
- <div class="glm-reg-row">
+ <div class="glm-row">
<input class="add-new-registrant button tiny" value="Add {/literal}{$terms.reg_term_attendee_cap}{literal}" type="submit">
<a class="add-new-registrant-cancel">Cancel</a>
</div>
<div class="glm-registrant-edit" title="Edit"><%= fname %> <%= lname %> <%= email %><span class="dashicons dashicons-edit"></span></div>
<div class="reg-edit-form">
{/literal}{if $regEvent.time_specific.value}
- <div style="float: right; width: 48%;">
- <div id="eventCalendar-{literal}<%- id %>{/literal}" style="width: 90%;"></div>
- </div>
{/if}{literal}
{/literal}{if $regEvent.time_specific.value}
<div style="width: 48%;">
<% } %>
</script>
{/literal}
-<div class="glm-reg-event-list" id="regApp">
+<div class="glm-reg-event-list">
<h1>{$terms.reg_term_registrations_name}</h1>
{include file='front/registrations/header.html'}
+ <div class="glm-row">
+ <div id="regApp" class="glm-columns glm-small-12">
+ </div>
+ </div>
</div>
{* Bootstrap the models needed on page load *}
{* Need to have RegEvent model created *}