mirror of
https://github.com/lukevella/rallly.git
synced 2025-06-15 17:11:49 +02:00
Merge branch 'feature/date-picker' into develop
This commit is contained in:
Luke Vella
commit
ff9cfa44bc
48 changed files with 993 additions and 411 deletions
|
|
@ -43,7 +43,7 @@ var EventSchema = new Schema({
|
|||
participants : [{
|
||||
id : Schema.Types.ObjectId,
|
||||
name : String,
|
||||
dates : [Boolean]
|
||||
votes : [Boolean]
|
||||
}],
|
||||
isClosed : {
|
||||
type : Boolean,
|
||||
|
|
|
|||
|
|
@ -24,6 +24,7 @@
|
|||
"jquery": "~2.1.3",
|
||||
"angular-hotkeys": "~0.2.2",
|
||||
"ng-tags-input": "2.1.1",
|
||||
"angular-animate": "~1.3.10"
|
||||
"angular-animate": "~1.3.10",
|
||||
"datejs": "~1.0.0-rc3"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,196 +1,196 @@
|
|||
/*
|
||||
Email Notifications Helper Class
|
||||
*/
|
||||
|
||||
var app = require('../app');
|
||||
var communicator = require('../communicator');
|
||||
var debug = require('debug')('rallly');
|
||||
var mandrill = require('mandrill-api');
|
||||
var mandrill_client = new mandrill.Mandrill(app.get('mandrillAPIKey'));
|
||||
|
||||
communicator.on('event:create', function(event){
|
||||
if (!event.creator.allowNotifications && event.isClosed) return;
|
||||
sendEmailConfirmation(event);
|
||||
sendInvites(event);
|
||||
});
|
||||
|
||||
communicator.on('event:update:creator.email', function(event, oldEvent){
|
||||
if (!event.creator.allowNotifications && event.isClosed) return;
|
||||
verifyEmail(event);
|
||||
});
|
||||
|
||||
communicator.on('event:delete', function(event){
|
||||
deleteConfirmation(event);
|
||||
});
|
||||
|
||||
// Send confirmation to the creator of the event with a link to verify the creators email address
|
||||
var sendEmailConfirmation = function(event){
|
||||
var message = {
|
||||
subject : "Rallly: " + event.title + " - Verify Email Address",
|
||||
from_email : 'noreply@rallly.co',
|
||||
from_name : 'Rallly',
|
||||
to: [{
|
||||
'email': event.creator.email
|
||||
}],
|
||||
global_merge_vars : [{
|
||||
'name' : 'TITLE',
|
||||
'content' : 'Your event ' + event.title + ' has been created successfully.'
|
||||
}, {
|
||||
'name' : 'MESSAGE',
|
||||
'content' : 'Hi ' + event.creator.name + ',<br /><br />' +
|
||||
'An email has been sent to each participant with a link to the event.<br /><br />' +
|
||||
'Important: To continue receiving email notifications about this event, please click the button below to verify your email address.'
|
||||
}, {
|
||||
'name' : 'BUTTONTEXT',
|
||||
'content' : 'Verify Email Address'
|
||||
}, {
|
||||
'name' : 'BUTTONLINK',
|
||||
'content' : app.get('absoluteUrl')('verify/'+event._id+'/code/'+event.__private.verificationCode)
|
||||
}]
|
||||
}
|
||||
mandrill_client.messages.sendTemplate({
|
||||
message : message,
|
||||
template_name : 'rallly-standard',
|
||||
async : true,
|
||||
template_content : []
|
||||
}, mandrillSuccessHandler, mandrillErrorHandler);
|
||||
}
|
||||
|
||||
// Send an invite to all participants of the evnet
|
||||
var sendInvites = function(event){
|
||||
event.emails.forEach(function(item){
|
||||
var toEmail = item.email;
|
||||
var message = {
|
||||
subject : "Rallly: " + event.title,
|
||||
from_email : 'noreply@rallly.co',
|
||||
from_name : 'Rallly',
|
||||
to: [{
|
||||
'email': toEmail
|
||||
}],
|
||||
headers : {
|
||||
'Reply-To' : event.creator.email
|
||||
},
|
||||
global_merge_vars : [{
|
||||
'name' : 'TITLE',
|
||||
'content' : event.creator.name + ' has invited you to participate in their event: ' + event.title, }, {
|
||||
'name' : 'MESSAGE',
|
||||
'content' : 'Rallly is a free collaborative scheduling service that lets you and your friends vote on a date to host an event. ' +
|
||||
'Click on the button below to visit the event page and vote on the dates that best suit you. '
|
||||
}, {
|
||||
'name' : 'BUTTONTEXT',
|
||||
'content' : 'View Event'
|
||||
}, {
|
||||
'name' : 'BUTTONLINK',
|
||||
'content' : app.get('absoluteUrl')(event._id)
|
||||
}]
|
||||
}
|
||||
mandrill_client.messages.sendTemplate({
|
||||
message : message,
|
||||
template_name : 'rallly-standard',
|
||||
async : true,
|
||||
template_content : []
|
||||
}, mandrillSuccessHandler, mandrillErrorHandler);
|
||||
})
|
||||
}
|
||||
|
||||
// This message is sent when the user want to verify an email address after the event has been created
|
||||
var verifyEmail = function(event){
|
||||
var message = {
|
||||
subject : "Rallly: " + event.title + " - Verify Email Address",
|
||||
from_email : 'noreply@rallly.co',
|
||||
from_name : 'Rallly',
|
||||
to: [{
|
||||
'email': event.creator.email
|
||||
}],
|
||||
global_merge_vars : [{
|
||||
'name' : 'TITLE',
|
||||
'content' : 'Please verify your email address to receive updates from this event.'
|
||||
}, {
|
||||
'name' : 'MESSAGE',
|
||||
'content' : 'Hi ' + event.creator.name + ',<br /><br />' +
|
||||
'If you would like to receive email updates from this event, please click on the button below to verify your email address.'
|
||||
}, {
|
||||
'name' : 'BUTTONTEXT',
|
||||
'content' : 'Verify Email Address'
|
||||
}, {
|
||||
'name' : 'BUTTONLINK',
|
||||
'content' : app.get('absoluteUrl')('verify/'+event._id+'/code/'+event.__private.verificationCode)
|
||||
}]
|
||||
}
|
||||
mandrill_client.messages.sendTemplate({
|
||||
message : message,
|
||||
template_name : 'rallly-standard',
|
||||
async : true,
|
||||
template_content : []
|
||||
}, mandrillSuccessHandler, mandrillErrorHandler);
|
||||
}
|
||||
|
||||
var sendUpdate = function(event){
|
||||
var message = {
|
||||
subject : "Rallly: " + event.title + " - Verify Email Address",
|
||||
from_email : 'noreply@rallly.co',
|
||||
from_name : 'Rallly',
|
||||
to: [{
|
||||
'email': event.creator.email
|
||||
}],
|
||||
global_merge_vars : [{
|
||||
'name' : 'Name',
|
||||
'content' : event.creator.name
|
||||
}, {
|
||||
'name' : 'Event',
|
||||
'content' : event.title
|
||||
}, {
|
||||
'name' : 'VerifyUrl',
|
||||
'content' : app.get('absoluteUrl')('verify/'+event._id+'/code/'+event.creator.verificationCode)
|
||||
}]
|
||||
}
|
||||
mandrill_client.messages.sendTemplate({
|
||||
message : message,
|
||||
template_name : 'rallly-standard',
|
||||
async : true,
|
||||
template_content : []
|
||||
}, mandrillSuccessHandler, mandrillErrorHandler);
|
||||
}
|
||||
|
||||
var deleteConfirmation = function(event){
|
||||
var message = {
|
||||
subject : "Rallly: " + event.title + " - Delete Request",
|
||||
from_email : 'noreply@rallly.co',
|
||||
from_name : 'Rallly',
|
||||
to: [{
|
||||
'email': event.creator.email
|
||||
}],
|
||||
global_merge_vars : [{
|
||||
'name' : 'TITLE',
|
||||
'content' : 'Are you sure you want to delete ' + event.title + '?'
|
||||
}, {
|
||||
'name' : 'MESSAGE',
|
||||
'content' : 'Hi ' + event.creator.name + ',<br /><br />' +
|
||||
'A request has been made to delete this event. If you would like to delete it click the button below. If you did not make this request, please ignore this email.'
|
||||
}, {
|
||||
'name' : 'BUTTONTEXT',
|
||||
'content' : 'Delete Event'
|
||||
}, {
|
||||
'name' : 'BUTTONLINK',
|
||||
'content' : app.get('absoluteUrl')('delete/'+event._id+'/code/'+event.__private.deleteCode)
|
||||
}]
|
||||
}
|
||||
mandrill_client.messages.sendTemplate({
|
||||
message : message,
|
||||
template_name : 'rallly-standard',
|
||||
async : true,
|
||||
template_content : []
|
||||
}, mandrillSuccessHandler, mandrillErrorHandler);
|
||||
}
|
||||
|
||||
var mandrillSuccessHandler = function(result){
|
||||
if (result.length == 1) {
|
||||
debug('Email sent to ' + result[0].email);
|
||||
} else {
|
||||
debug('Email sent to ' + result.length + ' recipients');
|
||||
}
|
||||
}
|
||||
|
||||
var mandrillErrorHandler = function(e){
|
||||
debug('A mandrill error occurred: ' + e.name + ' - ' + e.message);
|
||||
}
|
||||
// /*
|
||||
// Email Notifications Helper Class
|
||||
// */
|
||||
//
|
||||
// var app = require('../app');
|
||||
// var communicator = require('../communicator');
|
||||
// var debug = require('debug')('rallly');
|
||||
// var mandrill = require('mandrill-api');
|
||||
// var mandrill_client = new mandrill.Mandrill(app.get('mandrillAPIKey'));
|
||||
//
|
||||
// communicator.on('event:create', function(event){
|
||||
// if (!event.creator.allowNotifications && event.isClosed) return;
|
||||
// sendEmailConfirmation(event);
|
||||
// sendInvites(event);
|
||||
// });
|
||||
//
|
||||
// communicator.on('event:update:creator.email', function(event, oldEvent){
|
||||
// if (!event.creator.allowNotifications && event.isClosed) return;
|
||||
// verifyEmail(event);
|
||||
// });
|
||||
//
|
||||
// communicator.on('event:delete', function(event){
|
||||
// deleteConfirmation(event);
|
||||
// });
|
||||
//
|
||||
// // Send confirmation to the creator of the event with a link to verify the creators email address
|
||||
// var sendEmailConfirmation = function(event){
|
||||
// var message = {
|
||||
// subject : "Rallly: " + event.title + " - Verify Email Address",
|
||||
// from_email : 'noreply@rallly.co',
|
||||
// from_name : 'Rallly',
|
||||
// to: [{
|
||||
// 'email': event.creator.email
|
||||
// }],
|
||||
// global_merge_vars : [{
|
||||
// 'name' : 'TITLE',
|
||||
// 'content' : 'Your event ' + event.title + ' has been created successfully.'
|
||||
// }, {
|
||||
// 'name' : 'MESSAGE',
|
||||
// 'content' : 'Hi ' + event.creator.name + ',<br /><br />' +
|
||||
// 'An email has been sent to each participant with a link to the event.<br /><br />' +
|
||||
// 'Important: To continue receiving email notifications about this event, please click the button below to verify your email address.'
|
||||
// }, {
|
||||
// 'name' : 'BUTTONTEXT',
|
||||
// 'content' : 'Verify Email Address'
|
||||
// }, {
|
||||
// 'name' : 'BUTTONLINK',
|
||||
// 'content' : app.get('absoluteUrl')('verify/'+event._id+'/code/'+event.__private.verificationCode)
|
||||
// }]
|
||||
// }
|
||||
// mandrill_client.messages.sendTemplate({
|
||||
// message : message,
|
||||
// template_name : 'rallly-standard',
|
||||
// async : true,
|
||||
// template_content : []
|
||||
// }, mandrillSuccessHandler, mandrillErrorHandler);
|
||||
// }
|
||||
//
|
||||
// // Send an invite to all participants of the evnet
|
||||
// var sendInvites = function(event){
|
||||
// event.emails.forEach(function(item){
|
||||
// var toEmail = item.email;
|
||||
// var message = {
|
||||
// subject : "Rallly: " + event.title,
|
||||
// from_email : 'noreply@rallly.co',
|
||||
// from_name : 'Rallly',
|
||||
// to: [{
|
||||
// 'email': toEmail
|
||||
// }],
|
||||
// headers : {
|
||||
// 'Reply-To' : event.creator.email
|
||||
// },
|
||||
// global_merge_vars : [{
|
||||
// 'name' : 'TITLE',
|
||||
// 'content' : event.creator.name + ' has invited you to participate in their event: ' + event.title, }, {
|
||||
// 'name' : 'MESSAGE',
|
||||
// 'content' : 'Rallly is a free collaborative scheduling service that lets you and your friends vote on a date to host an event. ' +
|
||||
// 'Click on the button below to visit the event page and vote on the dates that best suit you. '
|
||||
// }, {
|
||||
// 'name' : 'BUTTONTEXT',
|
||||
// 'content' : 'View Event'
|
||||
// }, {
|
||||
// 'name' : 'BUTTONLINK',
|
||||
// 'content' : app.get('absoluteUrl')(event._id)
|
||||
// }]
|
||||
// }
|
||||
// mandrill_client.messages.sendTemplate({
|
||||
// message : message,
|
||||
// template_name : 'rallly-standard',
|
||||
// async : true,
|
||||
// template_content : []
|
||||
// }, mandrillSuccessHandler, mandrillErrorHandler);
|
||||
// })
|
||||
// }
|
||||
//
|
||||
// // This message is sent when the user want to verify an email address after the event has been created
|
||||
// var verifyEmail = function(event){
|
||||
// var message = {
|
||||
// subject : "Rallly: " + event.title + " - Verify Email Address",
|
||||
// from_email : 'noreply@rallly.co',
|
||||
// from_name : 'Rallly',
|
||||
// to: [{
|
||||
// 'email': event.creator.email
|
||||
// }],
|
||||
// global_merge_vars : [{
|
||||
// 'name' : 'TITLE',
|
||||
// 'content' : 'Please verify your email address to receive updates from this event.'
|
||||
// }, {
|
||||
// 'name' : 'MESSAGE',
|
||||
// 'content' : 'Hi ' + event.creator.name + ',<br /><br />' +
|
||||
// 'If you would like to receive email updates from this event, please click on the button below to verify your email address.'
|
||||
// }, {
|
||||
// 'name' : 'BUTTONTEXT',
|
||||
// 'content' : 'Verify Email Address'
|
||||
// }, {
|
||||
// 'name' : 'BUTTONLINK',
|
||||
// 'content' : app.get('absoluteUrl')('verify/'+event._id+'/code/'+event.__private.verificationCode)
|
||||
// }]
|
||||
// }
|
||||
// mandrill_client.messages.sendTemplate({
|
||||
// message : message,
|
||||
// template_name : 'rallly-standard',
|
||||
// async : true,
|
||||
// template_content : []
|
||||
// }, mandrillSuccessHandler, mandrillErrorHandler);
|
||||
// }
|
||||
//
|
||||
// var sendUpdate = function(event){
|
||||
// var message = {
|
||||
// subject : "Rallly: " + event.title + " - Verify Email Address",
|
||||
// from_email : 'noreply@rallly.co',
|
||||
// from_name : 'Rallly',
|
||||
// to: [{
|
||||
// 'email': event.creator.email
|
||||
// }],
|
||||
// global_merge_vars : [{
|
||||
// 'name' : 'Name',
|
||||
// 'content' : event.creator.name
|
||||
// }, {
|
||||
// 'name' : 'Event',
|
||||
// 'content' : event.title
|
||||
// }, {
|
||||
// 'name' : 'VerifyUrl',
|
||||
// 'content' : app.get('absoluteUrl')('verify/'+event._id+'/code/'+event.creator.verificationCode)
|
||||
// }]
|
||||
// }
|
||||
// mandrill_client.messages.sendTemplate({
|
||||
// message : message,
|
||||
// template_name : 'rallly-standard',
|
||||
// async : true,
|
||||
// template_content : []
|
||||
// }, mandrillSuccessHandler, mandrillErrorHandler);
|
||||
// }
|
||||
//
|
||||
// var deleteConfirmation = function(event){
|
||||
// var message = {
|
||||
// subject : "Rallly: " + event.title + " - Delete Request",
|
||||
// from_email : 'noreply@rallly.co',
|
||||
// from_name : 'Rallly',
|
||||
// to: [{
|
||||
// 'email': event.creator.email
|
||||
// }],
|
||||
// global_merge_vars : [{
|
||||
// 'name' : 'TITLE',
|
||||
// 'content' : 'Are you sure you want to delete ' + event.title + '?'
|
||||
// }, {
|
||||
// 'name' : 'MESSAGE',
|
||||
// 'content' : 'Hi ' + event.creator.name + ',<br /><br />' +
|
||||
// 'A request has been made to delete this event. If you would like to delete it click the button below. If you did not make this request, please ignore this email.'
|
||||
// }, {
|
||||
// 'name' : 'BUTTONTEXT',
|
||||
// 'content' : 'Delete Event'
|
||||
// }, {
|
||||
// 'name' : 'BUTTONLINK',
|
||||
// 'content' : app.get('absoluteUrl')('delete/'+event._id+'/code/'+event.__private.deleteCode)
|
||||
// }]
|
||||
// }
|
||||
// mandrill_client.messages.sendTemplate({
|
||||
// message : message,
|
||||
// template_name : 'rallly-standard',
|
||||
// async : true,
|
||||
// template_content : []
|
||||
// }, mandrillSuccessHandler, mandrillErrorHandler);
|
||||
// }
|
||||
//
|
||||
// var mandrillSuccessHandler = function(result){
|
||||
// if (result.length == 1) {
|
||||
// debug('Email sent to ' + result[0].email);
|
||||
// } else {
|
||||
// debug('Email sent to ' + result.length + ' recipients');
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// var mandrillErrorHandler = function(e){
|
||||
// debug('A mandrill error occurred: ' + e.name + ' - ' + e.message);
|
||||
// }
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
BIN
public/images/about.png
Normal file
BIN
public/images/about.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.4 KiB |
BIN
public/images/contact.png
Normal file
BIN
public/images/contact.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.9 KiB |
BIN
public/images/home.png
Normal file
BIN
public/images/home.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2 KiB |
|
|
@ -3,7 +3,7 @@ angular.module('rallly')
|
|||
var id = $state.params.id;
|
||||
// Get Event
|
||||
$scope.event = Event.get({id:id}, function(data){
|
||||
// Set the page title to the event title
|
||||
// Set the page title to the event title
|
||||
Title.set($scope.event.title);
|
||||
// Generate event url - i.e. http://rallly.co/jF9F_Fd
|
||||
$scope.eventUrl = $state.href('event', {
|
||||
|
|
|
|||
|
|
@ -3,9 +3,26 @@ angular.module('rallly')
|
|||
|
||||
$scope.title = "Schedule a New Event";
|
||||
$scope.description = "Fill in the form below to create your event and share it with your friends and colleagues.";
|
||||
$scope.event = {};
|
||||
|
||||
var states = [
|
||||
'newevent.general',
|
||||
'newevent.datetime',
|
||||
'newevent.invite'
|
||||
];
|
||||
|
||||
$scope.page = 1;
|
||||
|
||||
var goTo = function(page){
|
||||
$scope.page = page;
|
||||
$state.go(states[page-1]);
|
||||
}
|
||||
|
||||
goTo($scope.page);
|
||||
|
||||
|
||||
$scope.submit = function(){
|
||||
if ($scope.form.$valid){
|
||||
if ($scope.form.$valid && $scope.page == states.length){
|
||||
$http.post('/api/event', $scope.event)
|
||||
.success(function(event, status, headers, config){
|
||||
$scope.event = event;
|
||||
|
|
@ -14,6 +31,8 @@ angular.module('rallly')
|
|||
}, {
|
||||
absolute : true
|
||||
});
|
||||
$scope.page++;
|
||||
$state.go('newevent.success');
|
||||
})
|
||||
.error(function(){
|
||||
var modal = new ConfirmModal({
|
||||
|
|
@ -22,14 +41,18 @@ angular.module('rallly')
|
|||
cancelText : 'OK'
|
||||
});
|
||||
});
|
||||
} else {
|
||||
var notification = new Notification({
|
||||
title : 'Not so fast',
|
||||
message : 'Make sure you fill in all the required fields and try again.',
|
||||
type : 'error'
|
||||
});
|
||||
} else if ($scope.form.$valid) {
|
||||
$scope.form.$setPristine();
|
||||
$scope.nextPage();
|
||||
}
|
||||
}
|
||||
|
||||
$scope.clearDates = null
|
||||
$scope.nextPage = function(){
|
||||
goTo($scope.page+1);
|
||||
}
|
||||
|
||||
$scope.prevPage = function(){
|
||||
goTo($scope.page-1);
|
||||
}
|
||||
|
||||
});
|
||||
|
|
|
|||
|
|
@ -7,36 +7,15 @@ angular.module('rallly')
|
|||
model : '=ngModel',
|
||||
control : '='
|
||||
},
|
||||
templateUrl: 'templates/directives/datePicker.html',
|
||||
link : function(scope, el, attrs, ngModel){
|
||||
scope.model = scope.model || [];
|
||||
angular.element(el).datepicker({
|
||||
multidate : true,
|
||||
todayHighlight: true
|
||||
})
|
||||
.on('changeDate', function(e){
|
||||
var dates = e.dates;
|
||||
dates.sort(function(a, b){
|
||||
if (a.getTime() > b.getTime()) return true;
|
||||
return false;
|
||||
});
|
||||
ngModel.$setViewValue(dates, e);
|
||||
});
|
||||
|
||||
var update = function(modelValue, oldValue){
|
||||
if (!modelValue || !oldValue || (modelValue.length == oldValue.length)) return;
|
||||
var dates = [];
|
||||
for (var i = 0; i < modelValue.length; i++){
|
||||
dates.push(new Date(modelValue[i]));
|
||||
}
|
||||
angular.element(el).datepicker('setDates', dates);
|
||||
}
|
||||
scope.$watchCollection('model', update);
|
||||
|
||||
scope.control = scope.control || {};
|
||||
scope.control.unsetDate = function(date){
|
||||
var index = scope.model.indexOf(date);
|
||||
scope.model.splice(index, 1);
|
||||
}
|
||||
|
||||
scope.$watchCollection('model', function(newValue){
|
||||
ngModel.$setViewValue(newValue);
|
||||
ngModel.$validate();
|
||||
});
|
||||
|
||||
ngModel.$validators.required = function(modelValue, viewValue){
|
||||
if (!modelValue || modelValue.length == 0){
|
||||
|
|
@ -45,6 +24,65 @@ angular.module('rallly')
|
|||
return true;
|
||||
}
|
||||
|
||||
var today = Date.today(), activeDate = today.clone();
|
||||
var setMonth = function(toDate){
|
||||
activeDate = toDate;
|
||||
var startDate = activeDate.clone().moveToFirstDayOfMonth(),
|
||||
startDateDOW = startDate.getDay();
|
||||
startDate.add(startDateDOW - 7).days();
|
||||
scope.title = activeDate.toString('MMMM yyyy');
|
||||
var days = new Array(42);
|
||||
for (var i = 0; i < days.length; i++){
|
||||
var date = startDate.clone().add(i).days()
|
||||
days[i] = {
|
||||
date : date,
|
||||
isOutsideMonth : (date.getMonth() != activeDate.getMonth()) ? true : false,
|
||||
isToday : (Date.equals(date, today))
|
||||
}
|
||||
}
|
||||
scope.days = days;
|
||||
}
|
||||
setMonth(activeDate);
|
||||
scope.selectDay = function(dayObj){
|
||||
if (dayObj.isOutsideMonth) {
|
||||
setMonth(dayObj.date);
|
||||
}
|
||||
if ((index = scope.isActive(dayObj.date, true)) != -1) {
|
||||
// Already selected
|
||||
scope.model.splice(index, 1); // remove
|
||||
} else {
|
||||
// Not selected
|
||||
var index = 0, inserted = false;
|
||||
do {
|
||||
if (scope.model[index] == undefined || Date.compare(Date.parse(scope.model[index]), dayObj.date) > 0){
|
||||
scope.model.splice(index, 0, dayObj.date);
|
||||
inserted = true;
|
||||
}
|
||||
index++;
|
||||
} while (inserted == false);
|
||||
}
|
||||
}
|
||||
scope.isActive = function(date, returnIndex){
|
||||
scope.model = scope.model || [];
|
||||
for (var i = 0; i < scope.model.length; i++){
|
||||
if (Date.equals(Date.parse(scope.model[i]), date)){
|
||||
return (returnIndex) ? i : true;
|
||||
}
|
||||
}
|
||||
return (returnIndex) ? -1 : false;
|
||||
}
|
||||
scope.nextMonth = function(){
|
||||
setMonth(activeDate.add(1).months());
|
||||
}
|
||||
scope.prevMonth = function(){
|
||||
setMonth(activeDate.add(-1).months());
|
||||
}
|
||||
|
||||
scope.control.removeDate = function(date){
|
||||
if ((index = scope.isActive(Date.parse(date), true)) != -1) {
|
||||
scope.model.splice(index, 1)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@ angular.module('rallly')
|
|||
event : '=',
|
||||
form : '='
|
||||
},
|
||||
templateUrl : 'templates/directives/eventForm/userForm.html',
|
||||
templateUrl : 'templates/form/userForm.html',
|
||||
link : function(scope, el, attrs) {
|
||||
scope.errors = {};
|
||||
|
||||
|
|
@ -37,7 +37,7 @@ angular.module('rallly')
|
|||
event : '=',
|
||||
form : '='
|
||||
},
|
||||
templateUrl : 'templates/directives/eventForm/eventForm.html',
|
||||
templateUrl : 'templates/form/eventForm.html',
|
||||
link : function(scope, el, attrs) {
|
||||
scope.errors = {};
|
||||
|
||||
|
|
@ -58,7 +58,7 @@ angular.module('rallly')
|
|||
event : '=',
|
||||
form : '='
|
||||
},
|
||||
templateUrl : 'templates/directives/eventForm/dateForm.html'
|
||||
templateUrl : 'templates/form/dateForm.html'
|
||||
}
|
||||
})
|
||||
.directive('participantsForm', function(FormHelper){
|
||||
|
|
@ -67,7 +67,7 @@ angular.module('rallly')
|
|||
event : '=',
|
||||
form : '='
|
||||
},
|
||||
templateUrl : 'templates/directives/eventForm/participantsForm.html',
|
||||
templateUrl : 'templates/form/participantsForm.html',
|
||||
link : function(scope, el, attrs){
|
||||
scope.emailRegex = FormHelper.emailRegexString;
|
||||
}
|
||||
|
|
@ -79,7 +79,7 @@ angular.module('rallly')
|
|||
event : '=',
|
||||
form : '='
|
||||
},
|
||||
templateUrl : 'templates/directives/eventForm/settingsForm.html',
|
||||
templateUrl : 'templates/form/settingsForm.html',
|
||||
link : function(scope, el, attrs){
|
||||
scope.deleteEvent = function(){
|
||||
if (scope.deleteRequestSent) return;
|
||||
|
|
@ -117,4 +117,56 @@ angular.module('rallly')
|
|||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
.directive('timeForm', function(DatePickerService){
|
||||
return {
|
||||
scope : {
|
||||
event : '=',
|
||||
form : '='
|
||||
},
|
||||
templateUrl : 'templates/form/timeForm.html',
|
||||
link : function(scope, el, attrs){
|
||||
var init = false;
|
||||
var dateService;
|
||||
var deregister = scope.$watch('event.dates', function(value){
|
||||
if (value && !init) {
|
||||
deregister();
|
||||
}
|
||||
init = true;
|
||||
dateService = new DatePickerService(scope.event.dates);
|
||||
scope.unsetDate = function(date){
|
||||
dateService.removeDate(date);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
.directive('timePicker', function($timeout){
|
||||
return {
|
||||
scope : {
|
||||
model : '=ngModel'
|
||||
},
|
||||
require : 'ngModel',
|
||||
link : function(scope, el, attrs, ngModel){
|
||||
ngModel.$viewChangeListeners.push(function(){
|
||||
scope.model = ngModel.$modelValue;
|
||||
});
|
||||
|
||||
ngModel.$parsers.push(function (value) {
|
||||
if (!value) return;
|
||||
return Date.parse(value);
|
||||
});
|
||||
|
||||
ngModel.$validators.time = function(modelValue, viewValue){
|
||||
if (ngModel.$isEmpty(modelValue)) return true;
|
||||
var time = Date.parse(modelValue);
|
||||
if (time) {
|
||||
ngModel.$setViewValue(time.toString("hh:mm tt"));
|
||||
ngModel.$render();
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -49,7 +49,7 @@ angular.module('rallly')
|
|||
scope.selectedDate = function(index){
|
||||
datesCount[index] = 0;
|
||||
for (var i = 0; i < scope.event.participants.length; i++){
|
||||
if (scope.event.participants[i].dates[index]) datesCount[index]++;
|
||||
if (scope.event.participants[i].votes[index]) datesCount[index]++;
|
||||
}
|
||||
return datesCount[index];
|
||||
}
|
||||
|
|
|
|||
|
|
@ -10,8 +10,20 @@ angular.module('rallly', ['ui.router','ngResource','btford.modal','ngTagsInput',
|
|||
})
|
||||
.state('newevent',{
|
||||
url : '/new',
|
||||
templateUrl : 'templates/newevent.html',
|
||||
controller : 'NewEventCtrl'
|
||||
templateUrl : 'templates/newEvent/layout.html',
|
||||
controller : 'NewEventCtrl',
|
||||
})
|
||||
.state('newevent.general', {
|
||||
templateUrl : 'templates/newEvent/general.html'
|
||||
})
|
||||
.state('newevent.datetime', {
|
||||
templateUrl : 'templates/newEvent/datetime.html'
|
||||
})
|
||||
.state('newevent.invite', {
|
||||
templateUrl : 'templates/newEvent/invite.html'
|
||||
})
|
||||
.state('newevent.success', {
|
||||
templateUrl : 'templates/newEvent/success.html'
|
||||
})
|
||||
.state('about', {
|
||||
url : '/about',
|
||||
|
|
|
|||
|
|
@ -1,15 +1,23 @@
|
|||
angular.module("rallly").run(["$templateCache", function($templateCache) {$templateCache.put("templates/about.html","<div style=\"max-width:600px\">\n <h1>What is Rallly?</h1>\n <div class=\"rl-page-desc\">Rallly is a collaborative scheduling service that makes deciding on a date fast and easy.</div>\n <h2>Hi, I\'m Luke!</h2>\n <p>\n I created Rallly as side project to help me learn some new technologies. I decided to publish it because I thought other people might find it useful. Rallly is a completely free service. In fact it is even open source. You can look at the latest source code on Github.\n </p>\n</div>\n");
|
||||
$templateCache.put("templates/confirmmodal.html","<div class=\"rl-modal-overlay\" ng-click=\"modal.cancel()\"></div>\n\n<div class=\"rl-modal\">\n <div class=\"rl-modal-title\">{{modal.title}}</div>\n <div class=\"rl-modal-message\">\n {{modal.message}}\n </div>\n <div class=\"rl-modal-actions\">\n <button type=\"button\" ng-click=\"modal.confirm()\" ng-show=\"modal.confirm\" class=\"btn\" ng-class=\"{danger : modal.isDestructive}\">{{modal.confirmText}}</button>\n <button type=\"button\" ng-click=\"modal.cancel()\" class=\"btn\">{{modal.cancelText}}</button>\n </div>\n</div>\n");
|
||||
$templateCache.put("templates/editevent.html","<div ng-show=\"event._id\">\n <div class=\"box\">\n\n <div class=\"box-title\">Edit Event</div>\n <div class=\"box-description\">\n You can makes changes to your existing event by changing the fields in the form below.\n </div>\n\n <form novalidate name=\"form\" ng-submit=\"submit()\">\n\n <section class=\"box-section\" user-form form=\"form\" event=\"event\">\n\n </section>\n\n <section class=\"box-section\" event-form form=\"form\" event=\"event\">\n\n </section>\n <section class=\"box-section\" date-form form=\"form\" event=\"event\">\n\n </section>\n\n <section class=\"box-section\" settings-form form=\"form\" event=\"event\">\n\n </section>\n\n <div class=\"box-controls box-bottom-sticky\">\n <button type=\"submit\" ng-show=\"didChange()\" class=\"btn btn-primary\" ng-class=\"{disabled : !didChange()}\">\n Save Changes\n </button>\n <button type=\"button\" ng-click=\"undoChanges()\" class=\"btn\" ng-show=\"didChange()\">Undo Changes</button>\n <a href=\"/{{event._id}}\" class=\"btn\" ng-hide=\"didChange()\">Done</a>\n </div>\n\n </form>\n\n </div>\n\n</div>\n");
|
||||
$templateCache.put("templates/event.html","<div ng-show=\"event._id && !event.isDeleted\">\n <div class=\"box \">\n <div class=\"event-header\">\n <div class=\"avatar\">\n <img src=\"/images/eventicon.png\" width=\"32\" />\n </div>\n <div class=\"details\">\n <div class=\"title\">\n {{event.title}}\n <span class=\"title-label danger\" ng-show=\"event.isClosed\">Poll Closed</span>\n <span class=\"title-label success\" ng-hide=\"event.isClosed\">Poll Open</span>\n </div>\n <div class=\"subtitle\">\n Created by <a href=\"mailto:{{event.creator.email}}\">{{event.creator.name}}</a> • {{event.created | elapsed}}\n </div>\n </div>\n <div class=\"actions\">\n <button class=\"btn\" ng-click=\"editEvent()\">Edit Event</button>\n </div>\n </div>\n <div class=\"box-side-sticky event-description\" ng-show=\"event.description\">{{event.description}}</div>\n <div class=\"box-bottom-sticky event-location\" ng-show=\"event.location\">\n <img src=\"/images/location.png\" width=\"18\" /><a href=\"http://google.com/maps?q={{event.location}}\" target=\"_blank\">{{event.location}}</a>\n </div>\n\n </div>\n <div class=\"box box-x-scroll\">\n <div poll event=\"event\" class=\"poll\">\n </div>\n </div>\n\n <div class=\"box\" ng-hide=\"event.comments.length == 0 && event.isClosed\">\n <div class=\"box-title\">\n Discussion\n </div>\n <div class=\"box-description\">\n You can discuss the event with your friends by leaving a comment below.\n </div>\n <div discussion event=\"event\">\n\n </div>\n </div>\n</div>\n");
|
||||
$templateCache.put("templates/event.html","<div ng-show=\"event._id && !event.isDeleted\">\n <div class=\"box \">\n <div class=\"event-header\">\n <div class=\"details\">\n <div class=\"title\">\n {{event.title}}\n <span class=\"title-label danger\" ng-show=\"event.isClosed\">Poll Closed</span>\n <span class=\"title-label success\" ng-hide=\"event.isClosed\">Poll Open</span>\n </div>\n <div class=\"subtitle\">\n Created by <a href=\"mailto:{{event.creator.email}}\">{{event.creator.name}}</a> • {{event.created | elapsed}}\n </div>\n </div>\n <div class=\"actions\">\n <button class=\"btn\" ng-click=\"editEvent()\">Edit Event</button>\n </div>\n </div>\n <div class=\"box-side-sticky event-description\" ng-show=\"event.description\">{{event.description}}</div>\n <div class=\"box-bottom-sticky event-location\" ng-show=\"event.location\">\n <img src=\"/images/location.png\" width=\"18\" /><a href=\"http://google.com/maps?q={{event.location}}\" target=\"_blank\">{{event.location}}</a>\n </div>\n\n </div>\n <div class=\"box box-x-scroll\">\n <div poll event=\"event\" class=\"poll\">\n </div>\n </div>\n\n <div class=\"box\" ng-hide=\"event.comments.length == 0 && event.isClosed\">\n <div class=\"box-title\">\n Discussion\n </div>\n <div class=\"box-description\">\n You can discuss the event with your friends by leaving a comment below.\n </div>\n <div discussion event=\"event\">\n\n </div>\n </div>\n</div>\n");
|
||||
$templateCache.put("templates/home.html","<div class=\"page-placeholder\">\n <div class=\"image\">\n <img src=\"/images/mark_large.png\" width=\"67\" />\n </div>\n <div class=\"title\">\n Schedule an Event\n </div>\n <div class=\"content\">\n Want to host an event but can’t decide on a date? Click on the button below to start!\n </div>\n <button ng-click=\"newEvent()\" class=\"btn\">Schedule New Event</button>\n</div>\n");
|
||||
$templateCache.put("templates/newevent.html","<div ng-hide=\"eventUrl\">\n <div class=\"box\" ng-class=\"{\'animated shake\': form.$submitted && form.$invalid }\">\n\n <div class=\"box-title\">Schedule a New Event</div>\n <div class=\"box-description\">\n Fill in the form below to create your event and share it with your friends and colleagues.\n </div>\n\n <form novalidate autocomplete=\"off\" name=\"form\" ng-submit=\"submit()\">\n <section class=\"box-section\" user-form form=\"form\" event=\"event\">\n\n </section>\n\n <section class=\"box-section\" event-form form=\"form\" event=\"event\">\n\n </section>\n\n <section class=\"box-section\" date-form form=\"form\" event=\"event\">\n\n </section>\n\n <section class=\"box-section\" participants-form form=\"form\" event=\"event\">\n\n </section>\n\n <div class=\"box-controls box-bottom-sticky\">\n <button type=\"submit\" class=\"btn btn-primary\">Create Event</button>\n </div>\n\n </form>\n </div>\n</div>\n<div ng-show=\"eventUrl\" class=\"box\">\n <div class=\"box-message\">\n <div class=\"main-image\">\n <img src=\"/images/success_large.png\" width=\"100\" />\n </div>\n <div class=\"title\">Event Created</div>\n <div class=\"content\">\n Your event has been created successfully! You should receive an email shortly with instructions to verify your email address.\n </div>\n <div class=\"mini-divider\">\n </div>\n <div class=\"form-group\">\n <input type=\"text\" class=\"form-control\" disabled=\"true\" value=\"{{eventUrl}}\" />\n <a href=\"{{eventUrl}}\" class=\"btn form-btn\">GO</a>\n </div>\n </div>\n</div>\n");
|
||||
$templateCache.put("templates/newevent.html","<div ng-if=\"!eventUrl\">\n <div class=\"box\" ng-class=\"{\'animated shake\': form.$submitted && form.$invalid }\">\n\n <div class=\"box-title\">Schedule a New Event</div>\n <div class=\"box-description\">\n Fill in the form below to create your event and share it with your friends and colleagues.\n </div>\n\n <form novalidate autocomplete=\"off\" name=\"form\" ng-submit=\"submit()\">\n <div ng-if=\"page == 1\">\n\n <section class=\"box-section\" user-form form=\"form\" event=\"event\">\n\n </section>\n\n <section class=\"box-section\" event-form form=\"form\" event=\"event\">\n\n </section>\n </div>\n <div ng-if=\"page==2\">\n\n <section class=\"box-section\" date-form form=\"form\" event=\"event\">\n\n </section>\n\n <section class=\"box-section\" ng-show=\"event.dates.length\" time-form form=\"form\" event=\"event\">\n\n </section>\n </div>\n\n <div ng-if=\"page==3\">\n\n <section class=\"box-section\" participants-form form=\"form\" event=\"event\">\n\n </section>\n\n </div>\n\n\n <div class=\"box-controls box-bottom-sticky\">\n <button type=\"button\" ng-if=\"page!=1\" class=\"btn\" ng-click=\"prevPage()\">Back</button>\n <button type=\"button\" ng-if=\"page!=3\" class=\"btn\" ng-click=\"nextPage()\">Next</button>\n <button type=\"submit\" ng-if=\"page==3\" class=\"btn btn-primary\">Create Event</button>\n </div>\n\n </form>\n </div>\n\n</div>\n<div ng-if=\"eventUrl\" class=\"box\">\n <div class=\"box-message\">\n <div class=\"main-image\">\n <img src=\"/images/success_large.png\" width=\"100\" />\n </div>\n <div class=\"title\">Event Created</div>\n <div class=\"content\">\n Your event has been created successfully! You should receive an email shortly with instructions to verify your email address.\n </div>\n <div class=\"mini-divider\">\n </div>\n <div class=\"form-group\">\n <input type=\"text\" class=\"form-control\" disabled=\"true\" value=\"{{eventUrl}}\" />\n <a href=\"{{eventUrl}}\" class=\"btn form-btn\">GO</a>\n </div>\n </div>\n</div>\n");
|
||||
$templateCache.put("templates/notfound.html","<h1>Error 404</h1>\n<h2>Not Found</h2>\n");
|
||||
$templateCache.put("templates/notification.html","<div class=\"notification {{notification.type}}\" ng-click=\"notification.close()\">\n <div class=\"title\">\n {{notification.title}}\n </div>\n <div class=\"message\">\n {{notification.message}}\n </div>\n</div>\n");
|
||||
$templateCache.put("templates/directives/datePicker.html","<div class=\"date-picker\">\n <div class=\"wrapper\">\n <div class=\"date-picker-head\">\n <a href=\"#\" class=\"arrow\" ng-click=\"prevMonth()\">❮</a>\n <span class=\"title\">\n <span class=\"title-text\">{{title}}</span>\n </span>\n <a href=\"#\" class=\"arrow\" ng-click=\"nextMonth()\">❯</a>\n </div>\n <div class=\"dow\">\n <div class=\"day\">\n Sun\n </div>\n <div class=\"day\">\n Mon\n </div>\n <div class=\"day\">\n Tue\n </div>\n <div class=\"day\">\n Wed\n </div>\n <div class=\"day\">\n Thu\n </div>\n <div class=\"day\">\n Fri\n </div>\n <div class=\"day\">\n Sat\n </div>\n </div>\n <div class=\"values\">\n <div ng-repeat=\"day in days\" class=\"value\" ng-class=\"{ outside : day.isOutsideMonth, today : day.isToday, active : isActive(day.date) }\" ng-click=\"selectDay(day)\">\n {{day.date | date : \'d\' }}\n </div>\n </div>\n </div>\n</div>\n");
|
||||
$templateCache.put("templates/directives/discussion.html","<ul class=\"comment-thread\" ng-show=\"event.comments.length\">\n <li ng-repeat=\"comment in event.comments\" class=\"comment\">\n <div class=\"avatar-section\">\n <img src=\"/images/avatar.png\" />\n </div>\n <div class=\"comment-section\">\n <a href=\"#\" class=\"comment-delete\" ng-click=\"deleteComment(comment)\">×</a>\n <div class=\"meta\">\n <span class=\"name\">{{comment.author.name}}</span>\n <span class=\"time\">{{comment.created | elapsed}}</span>\n </div>\n <div class=\"content\">{{comment.content}}</div>\n </div>\n </li>\n</ul>\n<form novalidate ng-submit=\"postComment()\" name=\"commentForm\" class=\"comment-form\">\n <div class=\"avatar-section\">\n <img src=\"/images/avatar.png\" />\n </div>\n <div class=\"input-section form-group\">\n <div class=\"content-section\">\n <textarea class=\"form-control\" required ng-model=\"comment.content\" placeholder=\"Write a comment...\"></textarea>\n </div>\n <div class=\"name-section\">\n <div class=\"name-container\">\n <input type=\"text\" class=\"form-control\" required placeholder=\"Your Name\" ng-model=\"comment.author.name\" />\n <button type=\"submit\" class=\"btn\">Post Comment</button>\n <span class=\"form-error\" ng-show=\"commentForm.$submitted && commentForm.$error\">\n <img src=\"/images/error.png\" width=\"14\" /> Make sure you fill in all the fields.\n </span>\n </div>\n </div>\n </div>\n</form>\n");
|
||||
$templateCache.put("templates/directives/poll.html","<div class=\"poll-header\">\n <div class=\"header participants-header\">\n {{event.participants.length}} participants\n </div>\n <div class=\"header date-header\" ng-repeat=\"date in event.dates\">\n <div class=\"daticon\">\n <div class=\"dow\">\n {{date | date: \'EEE\'}}\n </div>\n <div class=\"day\">\n {{date | date: \'d\'}}\n </div>\n <div class=\"month\">\n {{date | date : \'MMM\'}}\n </div>\n <span class=\"count\" ng-show=\"selectedDate($index)\" ng-class={top:isTopDate($index)}>{{selectedDate($index)}}</span>\n </div>\n </div>\n <div class=\"header actions-header\">\n\n </div>\n</div>\n<div class=\"poll-body\">\n <div class=\"poll-entry\" ng-repeat=\"participant in event.participants\">\n <form novalidate ng-submit=\"update(participant); editMode = false\">\n <div class=\"cell name-cell\">\n <span class=\"avatar style-{{$index + 1}}\">\n <img src=\"/images/user.png\" width=\"11\" />\n </span>\n <input required autocomplete=\"off\" type=\"text\" class=\"form-control\" ng-model=\"participant.name\" ng-show=\"editMode\" value=\"participant.name\"/>\n <span ng-hide=\"editMode\" class=\"name editable\" ng-click=\"editMode = true && !event.isClosed; edit(participant)\">{{participant.name}}</span>\n </div>\n <div class=\"cell vote-cell\" ng-repeat=\"date in event.dates\">\n <img src=\"/images/tick@2x.png\" width=\"16\" ng-hide=\"editMode\" ng-if=\"participant.dates[$index]\" />\n <img src=\"/images/nope@2x.png\" width=\"8\" ng-hide=\"editMode\" ng-if=\"!participant.dates[$index]\" />\n <input ng-model=\"participant.dates[$index]\" ng-show=\"editMode\" ng-false-value=\"false\" type=\"checkbox\" />\n <div class=\"overlay\" ng-show=\"editMode\" ng-click=\"participant.dates[$index] = !participant.dates[$index]\"></div>\n </div>\n <div class=\"cell action-cell\" ng-hide=\"event.isClosed\">\n <button type=\"button\" ng-hide=\"editMode\" ng-click=\"editMode = true; edit(participant)\" class=\"btn hover\">Edit</button>\n <button type=\"button\" ng-hide=\"editMode\" ng-click=\"delete(participant)\" class=\"btn danger hover\">Delete</button>\n <button type=\"submit\" ng-show=\"editMode\" class=\"btn\">Save</button>\n <button type=\"button\" ng-show=\"editMode\" ng-click=\"editMode = false; cancel($index)\" class=\"btn\">Cancel</button>\n </div>\n </form>\n </div>\n <div class=\"poll-example\" ng-class=\"{hidden : event.participants.length > 0}\">\n <div class=\"poll-entry\" ng-repeat=\"example in examples\">\n <div class=\"cell name-cell\">\n <span class=\"avatar style-{{$index + 1}}\">\n <img src=\"/images/user.png\" width=\"11\" />\n </span>\n <span class=\"name\">{{example.name}}</span>\n </div>\n <div class=\"cell vote-cell\" ng-repeat=\"date in event.dates\">\n <img src=\"/images/tick@2x.png\" width=\"16\" ng-if=\"example.dates[$index]\" />\n <img src=\"/images/nope@2x.png\" width=\"8\" ng-if=\"!example.dates[$index]\" />\n </div>\n <div class=\"cell action-cell\">\n\n </div>\n </div>\n <div class=\"overlay\">\n <div class=\"overlay-text\">\n Fill in the form below to get started\n </div>\n </div>\n </div>\n <div ng-hide=\"event.isClosed\" class=\"poll-entry highlight\">\n <form novalidate name=\"formnew\" ng-submit=\"save()\">\n <div class=\"cell name-cell\">\n <span class=\"avatar style-{{participant.style}}\">\n <img src=\"/images/user.png\" width=\"11\" />\n </span>\n <input autocomplete=\"off\" name=\"username\" type=\"text\" class=\"form-control\" placeholder=\"Your name...\" ng-model=\"participant.name\" required value=\"participant.name\"/>\n </div>\n <div class=\"cell vote-cell\" ng-repeat=\"date in event.dates\">\n <input ng-model=\"participant.dates[$index]\" ng-false-value=\"false\" type=\"checkbox\" />\n <div class=\"overlay\" ng-click=\"participant.dates[$index] = !participant.dates[$index]\"></div>\n </div>\n <div class=\"cell action-cell\">\n <button type=\"submit\" ng-class=\"{ \'animated shake\' : formnew.$submitted && formnew.$invalid }\" class=\"btn\">Save</button>\n </div>\n </form>\n </div>\n</div>\n");
|
||||
$templateCache.put("templates/directives/eventForm/dateForm.html","<div class=\"section-details\">\n <div class=\"section-title\">Choose Dates</div>\n <ul class=\"daticon-list\">\n <li ng-repeat=\"date in event.dates\">\n <div class=\"daticon\">\n <div class=\"dow\">\n {{date | date: \'EEE\'}}\n </div>\n <div class=\"day\">\n {{date | date: \'d\'}}\n </div>\n <div class=\"month\">\n {{date | date : \'MMM\'}}\n </div>\n <span class=\"delete\" ng-click=\"datepicker.unsetDate(date)\"></span>\n </div>\n </li>\n </ul>\n</div>\n<div class=\"section-main\">\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label for=\"email\">Calendar</label>\n <span class=\"form-error\" ng-show=\"(form.datepicker.$dirty || form.$submitted) && form.datepicker.$error.required\">\n <img src=\"/images/error.png\" width=\"14\" /> You need to select a few dates\n </span>\n <div datepicker required name=\"datepicker\" control=\"datepicker\" ng-model=\"event.dates\">\n\n </div>\n </div>\n </div>\n</div>\n");
|
||||
$templateCache.put("templates/directives/eventForm/eventForm.html","<div class=\"section-details\">\n <div class=\"section-title\">Event Details</div>\n</div>\n<div class=\"section-main\">\n <div class=\"form-row\">\n <div class=\"form-col\">\n <div class=\"form-group\">\n <label for=\"title\">Title</label>\n <span class=\"form-error\" ng-show=\"(form.title.$touched || form.$submitted) && errors.title\">\n <img src=\"/images/error.png\" width=\"14\" /> {{errors.title}}\n </span>\n <input id=\"title\" name=\"title\" ng-maxlength=\"30\" required ng-model=\"event.title\" type=\"text\" placeholder=\"Monthly Meetup...\" class=\"form-control extend\"/>\n </div>\n </div>\n <div class=\"form-col\">\n <div class=\"form-group optional\">\n <label for=\"location\">Location</label>\n <span class=\"form-error\" ng-show=\"(form.location.$touched || form.$submitted) && errors.location\">\n <img src=\"/images/error.png\" width=\"14\" /> {{errors.location}}\n </span>\n <input id=\"location\" name=\"location\" ng-model=\"event.location\" ng-maxlength=\"50\" type=\"text\" placeholder=\"Rick\'s Cafe...\" class=\"form-control extend\"/>\n </div>\n </div>\n </div>\n <div class=\"form-row\">\n <div class=\"form-group optional\">\n <label for=\"description\" >Description</label>\n <textarea id=\"description\" name=\"description\" ng-model=\"event.description\" placeholder=\"Enter Description...\" class=\"form-control extend\"></textarea>\n </div>\n </div>\n</div>\n");
|
||||
$templateCache.put("templates/directives/eventForm/participantsForm.html","<div class=\"section-details\">\n <div class=\"section-title\">Invite Participants</div>\n</div>\n<div class=\"section-main\">\n <div class=\"form-row\">\n <div class=\"form-group optional\">\n <label>Participant\'s Emails</label>\n <tags-input max-length=\"50\" allowed-tags-pattern=\"{{emailRegex}}\" display-property=\"email\" ng-model=\"event.emails\" placeholder=\"Add an Email\" type=\"email\" autocomplete=\"off\"></tags-input>\n </div>\n </div>\n</div>\n</section>\n");
|
||||
$templateCache.put("templates/directives/eventForm/settingsForm.html","<div class=\"section-details\">\n <div class=\"section-title\">Settings</div>\n</div>\n<div class=\"section-main\">\n <div class=\"switch-row\">\n <div class=\"switch-details\">\n <div class=\"title\">\n Poll Status\n </div>\n <div class=\"description\">\n Let people vote on the poll.\n </div>\n </div>\n <div class=\"switch\">\n <div class=\"switch-value\">\n {{event.isClosed ? \'Closed\' : \'Open\' }}\n </div>\n <div switch-toggle ng-model=\"event.isClosed\" invert>\n </div>\n </div>\n </div>\n <div class=\"switch-row\">\n <div class=\"switch-details\">\n <div class=\"title\">\n Notifications\n </div>\n <div class=\"description\">\n Send email notifications to the creator of this event.\n </div>\n </div>\n <div class=\"switch\">\n <div class=\"switch-value\">\n {{event.creator.allowNotifications ? \'Enabled\' : \'Disabled\' }}\n </div>\n <div switch-toggle ng-model=\"event.creator.allowNotifications\">\n </div>\n </div>\n </div>\n <div class=\"switch-row\">\n <div class=\"switch-details\">\n <div class=\"title\">\n Delete Event\n </div>\n <div class=\"description\">\n Once you delete an event it will no longer be accessible.\n </div>\n </div>\n <div class=\"switch\">\n <button type=\"button\" ng-click=\"deleteEvent()\" class=\"btn\" ng-class=\"{danger : !deleteRequestSent, disabled : deleteRequestSent}\">{{deleteRequestSent ? \'Request Sent\' : \'Delete Event\' }}</button>\n </div>\n </div>\n</div>\n</section>\n");
|
||||
$templateCache.put("templates/directives/eventForm/userForm.html","<div class=\"section-details\">\n <div class=\"section-title\">Your Details</div>\n</div>\n<div class=\"section-main\">\n <div class=\"form-row\">\n <div class=\"form-col\">\n <div class=\"form-group\">\n <label for=\"name\">Name</label>\n <span class=\"form-error\" ng-show=\"(form.name.$touched || form.$submitted) && errors.name\">\n <img src=\"/images/error.png\" width=\"14\" /> {{errors.name}}\n </span>\n <input id=\"name\" name=\"name\" ng-maxlength=\"30\" required ng-model=\"event.creator.name\" type=\"text\" placeholder=\"John Doe...\" class=\"form-control extend\"/>\n </div>\n </div>\n <div class=\"form-col\">\n <div class=\"form-group\">\n <label for=\"email\">Email</label>\n <span class=\"form-error\" ng-show=\"(form.email.$touched || form.$submitted) && errors.email\">\n <img src=\"/images/error.png\" width=\"14\" /> {{errors.email}}\n </span>\n <input type=\"email\" id=\"email\" name=\"email\" ng-pattern=\"emailRegex\" required ng-model=\"event.creator.email\" placeholder=\"john.doe@email.com...\" class=\"form-control extend\"/>\n </div>\n </div>\n </div>\n</div>\n");}]);
|
||||
$templateCache.put("templates/directives/poll.html","<div class=\"poll-header\">\n <div class=\"header participants-header\">\n {{event.participants.length}} participants\n </div>\n <div class=\"header date-header\" ng-repeat=\"d in event.dates\">\n <div class=\"daticon\">\n <div class=\"dow\">\n {{d | date: \'EEE\'}}\n </div>\n <div class=\"day\">\n {{d | date: \'d\'}}\n </div>\n <div class=\"month\">\n {{d | date : \'MMM\'}}\n </div>\n <span class=\"count\" ng-show=\"selectedDate($index)\" ng-class={top:isTopDate($index)}>{{selectedDate($index)}}</span>\n </div>\n </div>\n <div class=\"header actions-header\">\n\n </div>\n</div>\n<div class=\"poll-body\">\n <div class=\"poll-entry\" ng-repeat=\"participant in event.participants\">\n <form novalidate ng-submit=\"update(participant); editMode = false\">\n <div class=\"cell name-cell\">\n <span class=\"avatar style-{{$index + 1}}\">\n <img src=\"/images/user.png\" width=\"11\" />\n </span>\n <input required autocomplete=\"off\" type=\"text\" class=\"form-control\" ng-model=\"participant.name\" ng-show=\"editMode\" value=\"participant.name\"/>\n <span ng-hide=\"editMode\" class=\"name editable\" ng-click=\"editMode = true && !event.isClosed; edit(participant)\">{{participant.name}}</span>\n </div>\n <div class=\"cell vote-cell\" ng-repeat=\"date in event.dates\">\n <img src=\"/images/tick@2x.png\" width=\"16\" ng-hide=\"editMode\" ng-if=\"participant.votes[$index]\" />\n <img src=\"/images/nope@2x.png\" width=\"8\" ng-hide=\"editMode\" ng-if=\"!participant.votes[$index]\" />\n <input ng-model=\"participant.votes[$index]\" ng-show=\"editMode\" ng-false-value=\"false\" type=\"checkbox\" />\n <div class=\"overlay\" ng-show=\"editMode\" ng-click=\"participant.votes[$index] = !participant.votes[$index]\"></div>\n </div>\n <div class=\"cell action-cell\" ng-hide=\"event.isClosed\">\n <button type=\"button\" ng-hide=\"editMode\" ng-click=\"editMode = true; edit(participant)\" class=\"btn hover\">Edit</button>\n <button type=\"button\" ng-hide=\"editMode\" ng-click=\"delete(participant)\" class=\"btn danger hover\">Delete</button>\n <button type=\"submit\" ng-show=\"editMode\" class=\"btn\">Save</button>\n <button type=\"button\" ng-show=\"editMode\" ng-click=\"editMode = false; cancel($index)\" class=\"btn\">Cancel</button>\n </div>\n </form>\n </div>\n <div class=\"poll-example\" ng-class=\"{hidden : event.participants.length > 0}\">\n <div class=\"poll-entry\" ng-repeat=\"example in examples\">\n <div class=\"cell name-cell\">\n <span class=\"avatar style-{{$index + 1}}\">\n <img src=\"/images/user.png\" width=\"11\" />\n </span>\n <span class=\"name\">{{example.name}}</span>\n </div>\n <div class=\"cell vote-cell\" ng-repeat=\"date in event.dates\">\n <img src=\"/images/tick@2x.png\" width=\"16\" ng-if=\"example.votes[$index]\" />\n <img src=\"/images/nope@2x.png\" width=\"8\" ng-if=\"!example.votes[$index]\" />\n </div>\n <div class=\"cell action-cell\">\n\n </div>\n </div>\n <div class=\"overlay\">\n <div class=\"overlay-text\">\n Fill in the form below to get started\n </div>\n </div>\n </div>\n <div ng-hide=\"event.isClosed\" class=\"poll-entry highlight\">\n <form novalidate name=\"formnew\" ng-submit=\"save()\">\n <div class=\"cell name-cell\">\n <span class=\"avatar style-{{participant.style}}\">\n <img src=\"/images/user.png\" width=\"11\" />\n </span>\n <input autocomplete=\"off\" name=\"username\" type=\"text\" class=\"form-control\" placeholder=\"Your name...\" ng-model=\"participant.name\" required value=\"participant.name\"/>\n </div>\n <div class=\"cell vote-cell\" ng-repeat=\"date in event.dates\">\n <input ng-model=\"participant.votes[$index]\" ng-false-value=\"false\" type=\"checkbox\" />\n <div class=\"overlay\" ng-click=\"participant.votes[$index] = !participant.votes[$index]\"></div>\n </div>\n <div class=\"cell action-cell\">\n <button type=\"submit\" ng-class=\"{ \'animated shake\' : formnew.$submitted && formnew.$invalid }\" class=\"btn\">Save</button>\n </div>\n </form>\n </div>\n</div>\n");
|
||||
$templateCache.put("templates/directives/timePicker.html","<div class=\"time-picker\">\n <div class=\"time-picker-col\">\n <div class=\"daticon\">\n <div class=\"dow\">\n {{date | date: \'EEE\'}}\n </div>\n <div class=\"day\">\n {{date | date: \'d\'}}\n </div>\n <div class=\"month\">\n {{date | date : \'MMM\'}}\n </div>\n <!-- <span class=\"delete\" ng-click=\"datepicker.unsetDate(date)\"></span> -->\n </div>\n </div>\n <div class=\"time-picker-col\" ng-repeat=\"time in date.times track by $index\">\n <input type=\"text\" class=\"time-picker-input\" time-picker ng-model=\"time\" ng-model-options=\"{ updateOn: \'blur\' }\" />\n </div>\n</div>\n");
|
||||
$templateCache.put("templates/form/dateForm.html","<div class=\"section-details\">\n <div class=\"section-title\">Choose Dates</div>\n <ul class=\"daticon-list\">\n <li ng-repeat=\"d in event.dates\">\n <div class=\"daticon\">\n <div class=\"dow\">\n {{d | date: \'EEE\'}}\n </div>\n <div class=\"day\">\n {{d | date: \'d\'}}\n </div>\n <div class=\"month\">\n {{d | date : \'MMM\'}}\n </div>\n <span class=\"delete\" ng-click=\"datepicker.removeDate(d)\"></span>\n </div>\n </li>\n </ul>\n</div>\n<div class=\"section-main\">\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label for=\"email\">Calendar</label>\n <span class=\"form-error\" ng-show=\"form.$submitted && form.datepicker.$error.required\">\n <img src=\"/images/error.png\" width=\"14\" /> You need to select a few dates\n </span>\n <div datepicker required name=\"datepicker\" control=\"datepicker\" ng-model=\"event.dates\">\n\n </div>\n </div>\n </div>\n</div>\n");
|
||||
$templateCache.put("templates/form/eventForm.html","<div class=\"section-details\">\n <div class=\"section-title\">Event Details</div>\n</div>\n<div class=\"section-main\">\n <div class=\"form-row\">\n <div class=\"form-col\">\n <div class=\"form-group\">\n <label for=\"title\">Title</label>\n <span class=\"form-error\" ng-show=\"(form.title.$touched || form.$submitted) && errors.title\">\n <img src=\"/images/error.png\" width=\"14\" /> {{errors.title}}\n </span>\n <input id=\"title\" name=\"title\" ng-maxlength=\"30\" required ng-model=\"event.title\" type=\"text\" placeholder=\"Monthly Meetup...\" class=\"form-control extend\"/>\n </div>\n </div>\n <div class=\"form-col\">\n <div class=\"form-group optional\">\n <label for=\"location\">Location</label>\n <span class=\"form-error\" ng-show=\"(form.location.$touched || form.$submitted) && errors.location\">\n <img src=\"/images/error.png\" width=\"14\" /> {{errors.location}}\n </span>\n <input id=\"location\" name=\"location\" ng-model=\"event.location\" ng-maxlength=\"50\" type=\"text\" placeholder=\"Rick\'s Cafe...\" class=\"form-control extend\"/>\n </div>\n </div>\n </div>\n <div class=\"form-row\">\n <div class=\"form-group optional\">\n <label for=\"description\" >Description</label>\n <textarea id=\"description\" name=\"description\" ng-model=\"event.description\" placeholder=\"Enter Description...\" class=\"form-control extend\"></textarea>\n </div>\n </div>\n</div>\n");
|
||||
$templateCache.put("templates/form/participantsForm.html","<div class=\"section-details\">\n <div class=\"section-title\">Invite Participants</div>\n</div>\n<div class=\"section-main\">\n <div class=\"form-row\">\n <div class=\"form-group optional\">\n <label>Participant\'s Emails</label>\n <tags-input max-length=\"50\" allowed-tags-pattern=\"{{emailRegex}}\" display-property=\"email\" ng-model=\"event.emails\" placeholder=\"Add an Email\" type=\"email\" autocomplete=\"off\"></tags-input>\n <input type=\"hidden\" name=\"shouldCreate\" value=\"true\" />\n\n </div>\n </div>\n</div>\n</section>\n");
|
||||
$templateCache.put("templates/form/settingsForm.html","<div class=\"section-details\">\n <div class=\"section-title\">Settings</div>\n</div>\n<div class=\"section-main\">\n <div class=\"switch-row\">\n <div class=\"switch-details\">\n <div class=\"title\">\n Poll Status\n </div>\n <div class=\"description\">\n Let people vote on the poll.\n </div>\n </div>\n <div class=\"switch\">\n <div class=\"switch-value\">\n {{event.isClosed ? \'Closed\' : \'Open\' }}\n </div>\n <div switch-toggle ng-model=\"event.isClosed\" invert>\n </div>\n </div>\n </div>\n <div class=\"switch-row\">\n <div class=\"switch-details\">\n <div class=\"title\">\n Notifications\n </div>\n <div class=\"description\">\n Send email notifications to the creator of this event.\n </div>\n </div>\n <div class=\"switch\">\n <div class=\"switch-value\">\n {{event.creator.allowNotifications ? \'Enabled\' : \'Disabled\' }}\n </div>\n <div switch-toggle ng-model=\"event.creator.allowNotifications\">\n </div>\n </div>\n </div>\n <div class=\"switch-row\">\n <div class=\"switch-details\">\n <div class=\"title\">\n Delete Event\n </div>\n <div class=\"description\">\n Once you delete an event it will no longer be accessible.\n </div>\n </div>\n <div class=\"switch\">\n <button type=\"button\" ng-click=\"deleteEvent()\" class=\"btn\" ng-class=\"{danger : !deleteRequestSent, disabled : deleteRequestSent}\">{{deleteRequestSent ? \'Request Sent\' : \'Delete Event\' }}</button>\n </div>\n </div>\n</div>\n</section>\n");
|
||||
$templateCache.put("templates/form/timeForm.html","<div class=\"section-details\">\n <div class=\"section-title\">Choose Times</div>\n</div>\n<div class=\"section-main\">\n <table class=\"time-form\">\n <thead>\n <tr>\n <th>\n\n </th>\n <th>\n Time 1\n </th>\n <th>\n Time 2\n </th>\n <th>\n Time 3\n </th>\n </tr>\n </thead>\n <tbody>\n <tr ng-repeat=\"d in event.dates\">\n <td>\n <div class=\"daticon\">\n <div class=\"dow\">\n {{d.date | date: \'EEE\'}}\n </div>\n <div class=\"day\">\n {{d.date | date: \'d\'}}\n </div>\n <div class=\"month\">\n {{d.date | date : \'MMM\'}}\n </div>\n <span class=\"delete\" ng-click=\"unsetDate(d.date)\"></span>\n </div>\n </td>\n <td ng-repeat=\"time in [1,2,3] track by $index\">\n <input type=\"text\" time-picker ng-model-options=\"{ updateOn: \'blur\' }\" ng-model=\"d.times[$index]\" class=\"time-picker-input\" />\n </td>\n </tr>\n </tbody>\n </table>\n</div>\n");
|
||||
$templateCache.put("templates/form/userForm.html","<div class=\"section-details\">\n <div class=\"section-title\">Your Details</div>\n</div>\n<div class=\"section-main\">\n <div class=\"form-row\">\n <div class=\"form-col\">\n <div class=\"form-group\">\n <label for=\"name\">Name</label>\n <span class=\"form-error\" ng-show=\"(form.name.$touched || form.$submitted) && errors.name\">\n <img src=\"/images/error.png\" width=\"14\" /> {{errors.name}}\n </span>\n <input id=\"name\" name=\"name\" ng-maxlength=\"30\" required ng-model=\"event.creator.name\" type=\"text\" placeholder=\"John Doe...\" class=\"form-control extend\"/>\n </div>\n </div>\n <div class=\"form-col\">\n <div class=\"form-group\">\n <label for=\"email\">Email</label>\n <span class=\"form-error\" ng-show=\"(form.email.$touched || form.$submitted) && errors.email\">\n <img src=\"/images/error.png\" width=\"14\" /> {{errors.email}}\n </span>\n <input type=\"email\" id=\"email\" name=\"email\" ng-pattern=\"emailRegex\" required ng-model=\"event.creator.email\" placeholder=\"john.doe@email.com...\" class=\"form-control extend\"/>\n </div>\n </div>\n </div>\n</div>\n");
|
||||
$templateCache.put("templates/newEvent/datetime.html","<section class=\"box-section\" date-form form=\"form\" event=\"event\">\n\n</section>\n\n<div class=\"box-controls box-bottom-sticky\">\n <button type=\"button\" class=\"btn\" ng-click=\"prevPage()\">Previous</button>\n <button type=\"submit\" class=\"btn\">Next</button>\n</div>\n");
|
||||
$templateCache.put("templates/newEvent/general.html","<section class=\"box-section\" user-form form=\"form\" event=\"event\">\n\n</section>\n\n<section class=\"box-section\" event-form form=\"form\" event=\"event\">\n\n</section>\n\n<div class=\"box-controls box-bottom-sticky\">\n <button type=\"submit\" class=\"btn\">Next Step</button>\n</div>\n");
|
||||
$templateCache.put("templates/newEvent/invite.html","<section class=\"box-section\" participants-form form=\"form\" event=\"event\">\n\n</section>\n\n<div class=\"box-controls box-bottom-sticky\">\n <button type=\"button\" class=\"btn\" ng-click=\"prevPage()\">Previous</button>\n <button type=\"submit\" class=\"btn\">Create</button>\n</div>\n");
|
||||
$templateCache.put("templates/newEvent/layout.html","<div class=\"box\">\n\n <div class=\"box-title\">Schedule a New Event</div>\n <div class=\"box-description\">\n Fill in the form below to create your event and share it with your friends and colleagues.\n </div>\n <ol class=\"box-steps\">\n <li class=\"step active\">\n General Details\n </li>\n <li class=\"step\" ng-class=\"{ active : page > 1 }\">\n Dates & Times\n </li>\n <li class=\"step\" ng-class=\"{ active : page > 2 }\">\n Invites\n </li>\n <li class=\"step\" ng-class=\"{ active : page > 3 }\">\n Done\n </li>\n </ol>\n <form novalidate autocomplete=\"off\" name=\"form\" ng-submit=\"submit()\">\n <div ui-view>\n\n </div>\n </form>\n</div>\n");
|
||||
$templateCache.put("templates/newEvent/success.html","<div class=\"box-message\">\n <div class=\"main-image\">\n <img src=\"/images/success_large.png\" width=\"100\" />\n </div>\n <div class=\"title\">Event Created</div>\n <div class=\"content\">\n Your event has been created successfully! You should receive an email shortly with instructions to verify your email address.\n </div>\n <div class=\"mini-divider\">\n </div>\n <div class=\"form-group\">\n <input type=\"text\" class=\"form-control\" disabled=\"true\" value=\"{{eventUrl}}\" />\n <a href=\"{{eventUrl}}\" class=\"btn form-btn\">GO</a>\n </div>\n</div>\n");}]);
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
@mixin form-input {
|
||||
border-radius: 2px;
|
||||
border: 1px solid $border-clr;
|
||||
font-size:em(18px);
|
||||
@include transition(border-color 0.1s ease-in-out);
|
||||
&:focus {
|
||||
border-color: $blue-clr;
|
||||
outline:none;
|
||||
background: white;
|
||||
}
|
||||
&.extend {
|
||||
width:100%;
|
||||
}
|
||||
@include placeholder {
|
||||
color: rgba($text-3-clr,0.7);
|
||||
}
|
||||
}
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
$dark-blue-clr: #2E3A54;
|
||||
$green-clr: #6EBC48;
|
||||
$green-clr: #75C062;
|
||||
$pink-clr: #E55A84;
|
||||
$red-clr: #E06488;
|
||||
$blue-clr: #5AC4E5;
|
||||
|
|
@ -11,6 +11,6 @@ $text-2-clr: #828B9A;
|
|||
$text-3-clr: #AEB4BE;
|
||||
$border-clr: #D9DDE3;
|
||||
$navigation-bg-clr: $dark-blue-clr;
|
||||
$background-clr: #F5F5F5;
|
||||
$background-clr: $light-blue-clr;
|
||||
|
||||
$color-collection: (#8A75AE, #80A1DA, #B3DD8B, #7EE4E4, #FCD285, #F7967F, #E8669D, #F7B6E7, #F99D7B, #88D0CB);
|
||||
|
|
|
|||
|
|
@ -1,19 +1,25 @@
|
|||
$navigation-width: 100%;
|
||||
$top-bar-height: 50px;
|
||||
$navigation-width: 200px;
|
||||
$top-bar-height: 60px;
|
||||
$min-width: 820px;
|
||||
|
||||
.outer-container {
|
||||
width:100%;
|
||||
height:100%;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
body {
|
||||
background: $background-clr;
|
||||
color: $text-clr;
|
||||
min-width: $min-width;
|
||||
}
|
||||
|
||||
.main-navigation {
|
||||
position:fixed;
|
||||
z-index: 2000;
|
||||
min-height:100%;
|
||||
width: $navigation-width;
|
||||
min-width:$min-width;
|
||||
background: $navigation-bg-clr;
|
||||
color: white;
|
||||
.wrapper {
|
||||
width: $navigation-width;
|
||||
|
|
@ -23,18 +29,24 @@ body {
|
|||
|
||||
.main-content {
|
||||
background: $background-clr;
|
||||
min-height:100%;
|
||||
margin-left: $navigation-width;
|
||||
height:100%;
|
||||
overflow-y:scroll;
|
||||
.main-view {
|
||||
position:relative;
|
||||
padding: 80px 40px;
|
||||
padding: 100px 40px 20px 40px;
|
||||
width:100%;
|
||||
min-height: 600px;
|
||||
height:100%;
|
||||
}
|
||||
}
|
||||
|
||||
.top-bar {
|
||||
width:100%;
|
||||
box-shadow: 0 1px 2px rgba(black, 0.1);
|
||||
position:fixed;
|
||||
top:0;
|
||||
background: white;
|
||||
height: $top-bar-height;
|
||||
z-index: 1000;
|
||||
line-height: $top-bar-height;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,41 +1,65 @@
|
|||
$top-space: 15px;
|
||||
$nav-pad: 20px;
|
||||
|
||||
@mixin expand {
|
||||
padding-left:$nav-pad;
|
||||
padding-right: $nav-pad;
|
||||
margin-left: $nav-pad * -1;
|
||||
width:100%;
|
||||
@include box-sizing(content-box);
|
||||
}
|
||||
|
||||
.main-navigation {
|
||||
position:fixed;
|
||||
width:100%;
|
||||
z-index: 1000;
|
||||
.wrapper {
|
||||
min-width:600px;
|
||||
background: $navigation-bg-clr;
|
||||
height: em(60px);
|
||||
}
|
||||
padding: 0 $nav-pad;
|
||||
.logo {
|
||||
display:inline-block;
|
||||
vertical-align:middle;
|
||||
margin-top:$top-space;
|
||||
|
||||
display:block;
|
||||
height: 60px;
|
||||
line-height:60px;
|
||||
background: darken($navigation-bg-clr, 3%);
|
||||
position:relative;
|
||||
@include transition(background 0.2s ease-in-out);
|
||||
@include expand;
|
||||
img {
|
||||
position:absolute;
|
||||
top:50%;
|
||||
margin-top:-12px;
|
||||
}
|
||||
}
|
||||
.menu-section {
|
||||
@include expand;
|
||||
font-size:10px;
|
||||
text-transform:uppercase;
|
||||
padding : 10px $nav-pad;
|
||||
border-bottom: 1px solid darken($navigation-bg-clr, 3%);
|
||||
margin-top:20px;
|
||||
margin-bottom:10px;
|
||||
}
|
||||
.create-new {
|
||||
display:block;
|
||||
font-size: em(12px);
|
||||
color: white;
|
||||
background: $green-clr;
|
||||
text-decoration: none;
|
||||
padding: 12px 5px;
|
||||
border-radius: 2px;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
@include box-sizing(content-box);
|
||||
width: 100%;
|
||||
margin-left:-5px;
|
||||
}
|
||||
.navigation {
|
||||
display:inline-block;
|
||||
vertical-align:middle;
|
||||
margin-left: 60px;
|
||||
margin-top:$top-space;
|
||||
.links {
|
||||
padding:0 ;
|
||||
margin:0;
|
||||
list-style: none;
|
||||
display:inline-block;
|
||||
li {
|
||||
display:inline-block;
|
||||
margin-right:em(20px);
|
||||
}
|
||||
a {
|
||||
display:block;
|
||||
text-decoration: none;
|
||||
color: #616F8D;
|
||||
font-weight: bold;
|
||||
line-height: em(24px);
|
||||
font-size: em(15px);
|
||||
opacity: 0.7;
|
||||
line-height: em(40px);
|
||||
font-size: em(12px);
|
||||
font-weight:bold;
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
color:white;
|
||||
|
|
@ -52,50 +76,17 @@ $top-space: 15px;
|
|||
}
|
||||
}
|
||||
.text {
|
||||
vertical-align:middle;
|
||||
}
|
||||
.icon {
|
||||
display:inline-block;
|
||||
vertical-align:middle;
|
||||
margin-right: 5px;
|
||||
width:16px;
|
||||
height:16px;
|
||||
background-size: 16px 32px;
|
||||
margin-right: 10px;
|
||||
width:24px;
|
||||
height:24px;
|
||||
background-size: 24px 48px;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
.create-new {
|
||||
display:inline-block;
|
||||
float:right;
|
||||
padding: 13px;
|
||||
// border-bottom:1px solid lighten($navigation-bg-clr, 5%);
|
||||
a {
|
||||
display:block;
|
||||
@include transition(background-color 0.1s ease-in-out);
|
||||
color:tint($green-clr,90%);
|
||||
text-align:center;
|
||||
border-radius: 2px;
|
||||
@include linear-gradient(lighten($green-clr,8%), lighten($green-clr,2%));
|
||||
text-decoration:none;
|
||||
font-size:12px;
|
||||
font-weight: bold;
|
||||
// text-shadow: 0 1px 1px darken($green-clr, 10%);
|
||||
padding: 8px 15px 10px 12px;
|
||||
&:hover {
|
||||
|
||||
}
|
||||
&:active {
|
||||
box-shadow: inset 0 2px 5px rgba(black,0.1), 0 0 0 1px darken($navigation-bg-clr, 8%);
|
||||
}
|
||||
img {
|
||||
vertical-align:middle;
|
||||
margin-right: 5px;
|
||||
margin-top: -2px;
|
||||
}
|
||||
span {
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
.top-bar {
|
||||
float: left;
|
||||
width: 100%;
|
||||
background:rgba(white,0.9);
|
||||
box-shadow: 0 1px 2px rgba($border-clr, 0.5);
|
||||
.primary {
|
||||
list-style:none;
|
||||
margin:0;
|
||||
padding-left:40px;
|
||||
padding-left:20px;
|
||||
margin-top:-4px;
|
||||
.item {
|
||||
img {
|
||||
|
|
@ -45,7 +45,7 @@
|
|||
border: 1px solid $border-clr;
|
||||
border-radius: 3px;
|
||||
padding: 20px;
|
||||
margin-top:-9px;
|
||||
margin-top:-14px;
|
||||
border-top-left-radius:0;
|
||||
box-shadow: 0 2px 3px $border-clr;
|
||||
.dropdown-title {
|
||||
|
|
|
|||
|
|
@ -64,17 +64,6 @@
|
|||
|
||||
.event-header {
|
||||
width: 100%;
|
||||
margin-top: -30px;
|
||||
.avatar {
|
||||
display:inline-block;
|
||||
margin-right: 20px;
|
||||
text-align: center;
|
||||
border-radius: 1px;
|
||||
box-shadow: 0 0 0 5px white, 0 0 0 6px $border-clr, inset 0 0 0 1px $border-clr;
|
||||
padding: 20px;
|
||||
background:$background-clr;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
.details {
|
||||
display:inline-block;
|
||||
.title {
|
||||
|
|
@ -113,7 +102,6 @@
|
|||
.actions {
|
||||
visibility:hidden;
|
||||
float: right;
|
||||
margin-top: 30px;
|
||||
}
|
||||
&:hover {
|
||||
.actions {
|
||||
|
|
|
|||
|
|
@ -7,8 +7,9 @@ $box-h-pad: 25px;
|
|||
border-radius: 3px;
|
||||
margin: 0 auto 20px auto;
|
||||
max-width: 800px;
|
||||
min-width:700px;
|
||||
overflow:hidden;
|
||||
padding: $box-v-pad $box-h-pad;
|
||||
box-shadow: 0 0 1px $border-clr;
|
||||
&.box-x-scroll {
|
||||
overflow-x: scroll;
|
||||
}
|
||||
|
|
@ -22,9 +23,6 @@ $box-h-pad: 25px;
|
|||
border-color: $blue-clr;
|
||||
box-shadow: 0 0 3px rgba($blue-clr, 0.5);
|
||||
}
|
||||
&:last-child {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.box-title {
|
||||
|
|
@ -51,6 +49,9 @@ $box-h-pad: 25px;
|
|||
}
|
||||
.box-section {
|
||||
padding-top: 20px;
|
||||
&:first-child {
|
||||
border:0;
|
||||
}
|
||||
@include row;
|
||||
.section-details {
|
||||
@include span-columns(3);
|
||||
|
|
@ -62,13 +63,14 @@ $box-h-pad: 25px;
|
|||
}
|
||||
.section-main {
|
||||
@include span-columns(9);
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.box-message {
|
||||
text-align:center;
|
||||
padding:40px;
|
||||
max-width:450px;
|
||||
max-width:500px;
|
||||
margin:0 auto;
|
||||
.main-image {
|
||||
margin-bottom: 20px;
|
||||
|
|
@ -122,3 +124,40 @@ $box-h-pad: 25px;
|
|||
margin-top: $box-v-pad;
|
||||
padding: 15px $box-h-pad;
|
||||
}
|
||||
|
||||
.box-steps {
|
||||
@include display(flex);
|
||||
width:100%;
|
||||
list-style-position:inside;
|
||||
padding:0;
|
||||
margin:40px 0 10px 0;
|
||||
.step {
|
||||
@include flex(1);
|
||||
color: $text-2-clr;
|
||||
font-size: em(14px);
|
||||
margin: 0 0 0 0;
|
||||
padding: 0 0 10px 10px;
|
||||
border-bottom:2px solid $border-clr;
|
||||
position:relative;
|
||||
@include transition(all 0.2s ease-in-out);
|
||||
&:first-child {
|
||||
padding-left : 0;
|
||||
}
|
||||
&:after {
|
||||
content: "";
|
||||
position:absolute;
|
||||
bottom:-2px;
|
||||
left:0;
|
||||
height: 2px;
|
||||
width:0;
|
||||
background: $green-clr;
|
||||
@include transition(all 0.2s ease-in-out);
|
||||
}
|
||||
&.active {
|
||||
color: $text-clr;
|
||||
&:after {
|
||||
width:100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
border:1px solid #E0E3E9;
|
||||
display:inline-block;
|
||||
border-radius: 2px;
|
||||
box-shadow: inset 0 1px 0 white, 0 1px 0 rgba($border-clr,0.5);
|
||||
box-shadow: inset 0 1px 0 white, 0 1px 1px rgba($border-clr,0.5);
|
||||
@include linear-gradient($btn-top-clr, $btn-bottom-clr);
|
||||
font-size: em(12px);
|
||||
font-weight:600;
|
||||
|
|
@ -28,6 +28,6 @@
|
|||
outline:0;
|
||||
}
|
||||
&:active {
|
||||
box-shadow: inset 0 0 2px rgba(black, 0.1);
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -28,7 +28,6 @@
|
|||
}
|
||||
.form-control {
|
||||
font-size: em(14px) !important;
|
||||
border-width: 2px !important;
|
||||
}
|
||||
textarea.form-control {
|
||||
min-height: 0;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,119 @@
|
|||
.ng-submitted .ng-invalid > .date-picker {
|
||||
border-color: $pink-clr;
|
||||
}
|
||||
|
||||
.date-picker {
|
||||
border: 1px solid $border-clr;
|
||||
border-radius: 2px;
|
||||
@include transition(border-color 0.2s ease-in-out);
|
||||
.wrapper {
|
||||
padding:20px;
|
||||
}
|
||||
.date-picker-head {
|
||||
display:table;
|
||||
width:100%;
|
||||
margin-bottom:30px;
|
||||
text-align:center;
|
||||
.title {
|
||||
display:inline-block;
|
||||
width:200px;
|
||||
margin: 0 20px;
|
||||
font-weight:bold;
|
||||
font-size: em(18px);
|
||||
}
|
||||
.arrow {
|
||||
text-decoration:none;
|
||||
color: $text-3-clr;
|
||||
position:relative;
|
||||
border: 1px solid $border-clr;
|
||||
display:inline-block;
|
||||
width: 25px;
|
||||
border-radius: 2px;
|
||||
font-size: 12px;
|
||||
line-height:25px;
|
||||
text-align:center;
|
||||
float:left;
|
||||
box-shadow: 0 1px 1px rgba($border-clr,0.5);
|
||||
margin:0 20px;
|
||||
&:last-child {
|
||||
float:right;
|
||||
}
|
||||
&:hover {
|
||||
color: $text-clr;
|
||||
}
|
||||
&:active {
|
||||
box-shadow:none;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.dow {
|
||||
font-size:0;
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 2px solid $border-clr;
|
||||
margin-bottom: 10px;
|
||||
.day {
|
||||
text-transform:uppercase;
|
||||
font-size: 14px;
|
||||
display:inline-block;
|
||||
width: (100% / 7);
|
||||
text-align:center;
|
||||
color: $pink-clr;
|
||||
}
|
||||
}
|
||||
.values {
|
||||
.value {
|
||||
display:inline-block;
|
||||
width: (100% / 7);
|
||||
text-align:center;
|
||||
font-size: em(14px);
|
||||
line-height:em(55px);
|
||||
position:relative;
|
||||
font-weight: bold;
|
||||
&.today {
|
||||
color:#818176;
|
||||
&:after {
|
||||
opacity:1;
|
||||
background: rgba(yellow, 0.1);
|
||||
}
|
||||
}
|
||||
&.outside {
|
||||
color: $text-3-clr;
|
||||
font-weight:normal;
|
||||
}
|
||||
&:after {
|
||||
content: " ";
|
||||
cursor:pointer;
|
||||
opacity: 0;
|
||||
position:absolute;
|
||||
$size: em(42px);
|
||||
width:$size;
|
||||
height:$size;
|
||||
margin-left:$size * -0.5;
|
||||
margin-top:$size * -0.5;
|
||||
left:50%;
|
||||
top:50%;
|
||||
border-radius: 2px;
|
||||
}
|
||||
&:hover {
|
||||
&:after {
|
||||
opacity:1;
|
||||
background: rgba($border-clr,0.4);
|
||||
}
|
||||
cursor: pointer;
|
||||
}
|
||||
&.active {
|
||||
background:white;
|
||||
color: $green-clr;
|
||||
&:after {
|
||||
opacity:1;
|
||||
background: rgba($green-clr,0.1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ng-submitted .ng-invalid > .datepicker {
|
||||
border-color: $pink-clr;
|
||||
}
|
||||
|
|
@ -147,14 +263,9 @@
|
|||
list-style:none;
|
||||
padding:5px;
|
||||
text-align:left;
|
||||
.placeholder {
|
||||
line-height: em(18px);
|
||||
font-size: em(12px);
|
||||
color: #ccc;
|
||||
}
|
||||
li {
|
||||
margin: 5px;
|
||||
display:inline-block;
|
||||
margin: 10px 10px 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -57,22 +57,7 @@ form {
|
|||
}
|
||||
}
|
||||
input.form-control, textarea.form-control {
|
||||
border-radius: 3px;
|
||||
border: 1px solid $border-clr;
|
||||
font-size:em(18px);
|
||||
@include transition(border-color 0.1s ease-in-out);
|
||||
&:focus {
|
||||
border-color: $blue-clr;
|
||||
box-shadow: 0 0 3px rgba($blue-clr, 0.5);
|
||||
outline:none;
|
||||
background: white;
|
||||
}
|
||||
&.extend {
|
||||
width:100%;
|
||||
}
|
||||
@include placeholder {
|
||||
color: rgba($text-3-clr,0.7);
|
||||
}
|
||||
@include form-input;
|
||||
}
|
||||
.form-btn {
|
||||
padding: em(12px) em(15px);
|
||||
|
|
|
|||
|
|
@ -1,11 +1,14 @@
|
|||
.notification {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
top: 80px;
|
||||
$not-width: 300px;
|
||||
right: 0;
|
||||
width: $not-width;
|
||||
z-index: 3000;
|
||||
padding: 12px 40px;
|
||||
padding: 12px 20px;
|
||||
background: $text-2-clr;
|
||||
border-top-left-radius:2px;
|
||||
border-bottom-left-radius:2px;
|
||||
color: white;
|
||||
@include transition(all 0.3s ease-in-out);
|
||||
&.success {
|
||||
|
|
@ -15,15 +18,15 @@
|
|||
background: $red-clr;
|
||||
}
|
||||
&.ng-enter {
|
||||
top: -100px;
|
||||
right: -$not-width;
|
||||
opacity:0;
|
||||
}
|
||||
&.ng-enter-active {
|
||||
top:0;
|
||||
right:0;
|
||||
opacity:1;
|
||||
}
|
||||
&.ng-leave-active {
|
||||
top:-100px;
|
||||
right:-$not-width;
|
||||
opacity:1;
|
||||
}
|
||||
.title {
|
||||
|
|
|
|||
|
|
@ -47,6 +47,7 @@ $name-col-width: 235px;
|
|||
left:0;
|
||||
width:100%;
|
||||
height: 100%;
|
||||
border-bottom:1px solid $border-clr;
|
||||
background: rgba(white, 0.75);
|
||||
text-align: center;
|
||||
.overlay-text {
|
||||
|
|
|
|||
67
public/scss/partials/ui/_timepicker.scss
Normal file
67
public/scss/partials/ui/_timepicker.scss
Normal file
|
|
@ -0,0 +1,67 @@
|
|||
.time-picker {
|
||||
width:100%;
|
||||
padding: 10px;
|
||||
.time-picker-col {
|
||||
display:table-cell;
|
||||
vertical-align:middle;
|
||||
}
|
||||
.time-picker-input {
|
||||
padding: 5px;
|
||||
border-radius: 3px;
|
||||
border: 1px solid $border-clr;
|
||||
outline:0;
|
||||
font-size: 18px;
|
||||
&:focus {
|
||||
border-color: $blue-clr;
|
||||
box-shadow: 0 0 3px rgba($blue-clr, 0.5);
|
||||
outline:0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.time-picker-input {
|
||||
padding: em(5px) 0;
|
||||
text-align:center;
|
||||
border:0;
|
||||
font-size:em(14px);
|
||||
&.ng-invalid {
|
||||
border-color: $red-clr;
|
||||
&:focus {
|
||||
box-shadow: 0 0 3px rgba($red-clr, 0.5);
|
||||
}
|
||||
}
|
||||
&.ng-valid.ng-dirty {
|
||||
border-color: $green-clr;
|
||||
}
|
||||
&:focus {
|
||||
outline:0;
|
||||
color: $text-clr;
|
||||
}
|
||||
}
|
||||
|
||||
.time-form {
|
||||
width:100%;
|
||||
border:1px solid $border-clr;
|
||||
th {
|
||||
border-bottom:2px solid $border-clr;
|
||||
padding: 10px;
|
||||
font-size: 14px;
|
||||
text-transform:uppercase;
|
||||
}
|
||||
td {
|
||||
border-right: 1px solid $border-clr;
|
||||
padding: 10px 10px;
|
||||
border-bottom:1px solid $border-clr;
|
||||
&:last-child {
|
||||
border-right:0;
|
||||
}
|
||||
input {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
tr:last-child {
|
||||
td {
|
||||
border-bottom:0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -28,6 +28,7 @@ a {
|
|||
@import "partials/ui/comments";
|
||||
@import "partials/ui/switch";
|
||||
@import "partials/ui/notification";
|
||||
@import "partials/ui/timepicker";
|
||||
|
||||
@import "partials/pages/home";
|
||||
@import "partials/pages/event";
|
||||
|
|
|
|||
39
public/templates/directives/datePicker.html
Normal file
39
public/templates/directives/datePicker.html
Normal file
|
|
@ -0,0 +1,39 @@
|
|||
<div class="date-picker">
|
||||
<div class="wrapper">
|
||||
<div class="date-picker-head">
|
||||
<a href="#" class="arrow" ng-click="prevMonth()">❮</a>
|
||||
<span class="title">
|
||||
<span class="title-text">{{title}}</span>
|
||||
</span>
|
||||
<a href="#" class="arrow" ng-click="nextMonth()">❯</a>
|
||||
</div>
|
||||
<div class="dow">
|
||||
<div class="day">
|
||||
Sun
|
||||
</div>
|
||||
<div class="day">
|
||||
Mon
|
||||
</div>
|
||||
<div class="day">
|
||||
Tue
|
||||
</div>
|
||||
<div class="day">
|
||||
Wed
|
||||
</div>
|
||||
<div class="day">
|
||||
Thu
|
||||
</div>
|
||||
<div class="day">
|
||||
Fri
|
||||
</div>
|
||||
<div class="day">
|
||||
Sat
|
||||
</div>
|
||||
</div>
|
||||
<div class="values">
|
||||
<div ng-repeat="day in days" class="value" ng-class="{ outside : day.isOutsideMonth, today : day.isToday, active : isActive(day.date) }" ng-click="selectDay(day)">
|
||||
{{day.date | date : 'd' }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -2,16 +2,16 @@
|
|||
<div class="header participants-header">
|
||||
{{event.participants.length}} participants
|
||||
</div>
|
||||
<div class="header date-header" ng-repeat="date in event.dates">
|
||||
<div class="header date-header" ng-repeat="d in event.dates">
|
||||
<div class="daticon">
|
||||
<div class="dow">
|
||||
{{date | date: 'EEE'}}
|
||||
{{d | date: 'EEE'}}
|
||||
</div>
|
||||
<div class="day">
|
||||
{{date | date: 'd'}}
|
||||
{{d | date: 'd'}}
|
||||
</div>
|
||||
<div class="month">
|
||||
{{date | date : 'MMM'}}
|
||||
{{d | date : 'MMM'}}
|
||||
</div>
|
||||
<span class="count" ng-show="selectedDate($index)" ng-class={top:isTopDate($index)}>{{selectedDate($index)}}</span>
|
||||
</div>
|
||||
|
|
@ -31,10 +31,10 @@
|
|||
<span ng-hide="editMode" class="name editable" ng-click="editMode = true && !event.isClosed; edit(participant)">{{participant.name}}</span>
|
||||
</div>
|
||||
<div class="cell vote-cell" ng-repeat="date in event.dates">
|
||||
<img src="/images/tick@2x.png" width="16" ng-hide="editMode" ng-if="participant.dates[$index]" />
|
||||
<img src="/images/nope@2x.png" width="8" ng-hide="editMode" ng-if="!participant.dates[$index]" />
|
||||
<input ng-model="participant.dates[$index]" ng-show="editMode" ng-false-value="false" type="checkbox" />
|
||||
<div class="overlay" ng-show="editMode" ng-click="participant.dates[$index] = !participant.dates[$index]"></div>
|
||||
<img src="/images/tick@2x.png" width="16" ng-hide="editMode" ng-if="participant.votes[$index]" />
|
||||
<img src="/images/nope@2x.png" width="8" ng-hide="editMode" ng-if="!participant.votes[$index]" />
|
||||
<input ng-model="participant.votes[$index]" ng-show="editMode" ng-false-value="false" type="checkbox" />
|
||||
<div class="overlay" ng-show="editMode" ng-click="participant.votes[$index] = !participant.votes[$index]"></div>
|
||||
</div>
|
||||
<div class="cell action-cell" ng-hide="event.isClosed">
|
||||
<button type="button" ng-hide="editMode" ng-click="editMode = true; edit(participant)" class="btn hover">Edit</button>
|
||||
|
|
@ -53,8 +53,8 @@
|
|||
<span class="name">{{example.name}}</span>
|
||||
</div>
|
||||
<div class="cell vote-cell" ng-repeat="date in event.dates">
|
||||
<img src="/images/tick@2x.png" width="16" ng-if="example.dates[$index]" />
|
||||
<img src="/images/nope@2x.png" width="8" ng-if="!example.dates[$index]" />
|
||||
<img src="/images/tick@2x.png" width="16" ng-if="example.votes[$index]" />
|
||||
<img src="/images/nope@2x.png" width="8" ng-if="!example.votes[$index]" />
|
||||
</div>
|
||||
<div class="cell action-cell">
|
||||
|
||||
|
|
@ -75,8 +75,8 @@
|
|||
<input autocomplete="off" name="username" type="text" class="form-control" placeholder="Your name..." ng-model="participant.name" required value="participant.name"/>
|
||||
</div>
|
||||
<div class="cell vote-cell" ng-repeat="date in event.dates">
|
||||
<input ng-model="participant.dates[$index]" ng-false-value="false" type="checkbox" />
|
||||
<div class="overlay" ng-click="participant.dates[$index] = !participant.dates[$index]"></div>
|
||||
<input ng-model="participant.votes[$index]" ng-false-value="false" type="checkbox" />
|
||||
<div class="overlay" ng-click="participant.votes[$index] = !participant.votes[$index]"></div>
|
||||
</div>
|
||||
<div class="cell action-cell">
|
||||
<button type="submit" ng-class="{ 'animated shake' : formnew.$submitted && formnew.$invalid }" class="btn">Save</button>
|
||||
|
|
|
|||
19
public/templates/directives/timePicker.html
Normal file
19
public/templates/directives/timePicker.html
Normal file
|
|
@ -0,0 +1,19 @@
|
|||
<div class="time-picker">
|
||||
<div class="time-picker-col">
|
||||
<div class="daticon">
|
||||
<div class="dow">
|
||||
{{date | date: 'EEE'}}
|
||||
</div>
|
||||
<div class="day">
|
||||
{{date | date: 'd'}}
|
||||
</div>
|
||||
<div class="month">
|
||||
{{date | date : 'MMM'}}
|
||||
</div>
|
||||
<!-- <span class="delete" ng-click="datepicker.unsetDate(date)"></span> -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="time-picker-col" ng-repeat="time in date.times track by $index">
|
||||
<input type="text" class="time-picker-input" time-picker ng-model="time" ng-model-options="{ updateOn: 'blur' }" />
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,9 +1,6 @@
|
|||
<div ng-show="event._id && !event.isDeleted">
|
||||
<div class="box ">
|
||||
<div class="event-header">
|
||||
<div class="avatar">
|
||||
<img src="/images/eventicon.png" width="32" />
|
||||
</div>
|
||||
<div class="details">
|
||||
<div class="title">
|
||||
{{event.title}}
|
||||
|
|
|
|||
|
|
@ -1,18 +1,18 @@
|
|||
<div class="section-details">
|
||||
<div class="section-title">Choose Dates</div>
|
||||
<ul class="daticon-list">
|
||||
<li ng-repeat="date in event.dates">
|
||||
<li ng-repeat="d in event.dates">
|
||||
<div class="daticon">
|
||||
<div class="dow">
|
||||
{{date | date: 'EEE'}}
|
||||
{{d | date: 'EEE'}}
|
||||
</div>
|
||||
<div class="day">
|
||||
{{date | date: 'd'}}
|
||||
{{d | date: 'd'}}
|
||||
</div>
|
||||
<div class="month">
|
||||
{{date | date : 'MMM'}}
|
||||
{{d | date : 'MMM'}}
|
||||
</div>
|
||||
<span class="delete" ng-click="datepicker.unsetDate(date)"></span>
|
||||
<span class="delete" ng-click="datepicker.removeDate(d)"></span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
|
@ -21,7 +21,7 @@
|
|||
<div class="form-row">
|
||||
<div class="form-group">
|
||||
<label for="email">Calendar</label>
|
||||
<span class="form-error" ng-show="(form.datepicker.$dirty || form.$submitted) && form.datepicker.$error.required">
|
||||
<span class="form-error" ng-show="form.$submitted && form.datepicker.$error.required">
|
||||
<img src="/images/error.png" width="14" /> You need to select a few dates
|
||||
</span>
|
||||
<div datepicker required name="datepicker" control="datepicker" ng-model="event.dates">
|
||||
|
|
@ -5,7 +5,9 @@
|
|||
<div class="form-row">
|
||||
<div class="form-group optional">
|
||||
<label>Participant's Emails</label>
|
||||
<tags-input max-length="50" allowed-tags-pattern="{{emailRegex}}" display-property="email" ng-model="event.emails" placeholder="Add an Email" type="email" autocomplete="off"></tags-input>
|
||||
<tags-input max-length="50" allowed-tags-pattern="{{emailRegex}}" display-property="email" ng-model="event.emails" placeholder="Add an Email" type="email" autocomplete="off"></tags-input>
|
||||
<input type="hidden" name="shouldCreate" value="true" />
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
44
public/templates/form/timeForm.html
Normal file
44
public/templates/form/timeForm.html
Normal file
|
|
@ -0,0 +1,44 @@
|
|||
<div class="section-details">
|
||||
<div class="section-title">Choose Times</div>
|
||||
</div>
|
||||
<div class="section-main">
|
||||
<table class="time-form">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
|
||||
</th>
|
||||
<th>
|
||||
Time 1
|
||||
</th>
|
||||
<th>
|
||||
Time 2
|
||||
</th>
|
||||
<th>
|
||||
Time 3
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr ng-repeat="d in event.dates">
|
||||
<td>
|
||||
<div class="daticon">
|
||||
<div class="dow">
|
||||
{{d.date | date: 'EEE'}}
|
||||
</div>
|
||||
<div class="day">
|
||||
{{d.date | date: 'd'}}
|
||||
</div>
|
||||
<div class="month">
|
||||
{{d.date | date : 'MMM'}}
|
||||
</div>
|
||||
<span class="delete" ng-click="unsetDate(d.date)"></span>
|
||||
</div>
|
||||
</td>
|
||||
<td ng-repeat="time in [1,2,3] track by $index">
|
||||
<input type="text" time-picker ng-model-options="{ updateOn: 'blur' }" ng-model="d.times[$index]" class="time-picker-input" />
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
8
public/templates/newEvent/datetime.html
Normal file
8
public/templates/newEvent/datetime.html
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
<section class="box-section" date-form form="form" event="event">
|
||||
|
||||
</section>
|
||||
|
||||
<div class="box-controls box-bottom-sticky">
|
||||
<button type="button" class="btn" ng-click="prevPage()">Previous</button>
|
||||
<button type="submit" class="btn">Next</button>
|
||||
</div>
|
||||
11
public/templates/newEvent/general.html
Normal file
11
public/templates/newEvent/general.html
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
<section class="box-section" user-form form="form" event="event">
|
||||
|
||||
</section>
|
||||
|
||||
<section class="box-section" event-form form="form" event="event">
|
||||
|
||||
</section>
|
||||
|
||||
<div class="box-controls box-bottom-sticky">
|
||||
<button type="submit" class="btn">Next Step</button>
|
||||
</div>
|
||||
8
public/templates/newEvent/invite.html
Normal file
8
public/templates/newEvent/invite.html
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
<section class="box-section" participants-form form="form" event="event">
|
||||
|
||||
</section>
|
||||
|
||||
<div class="box-controls box-bottom-sticky">
|
||||
<button type="button" class="btn" ng-click="prevPage()">Previous</button>
|
||||
<button type="submit" class="btn">Create</button>
|
||||
</div>
|
||||
26
public/templates/newEvent/layout.html
Normal file
26
public/templates/newEvent/layout.html
Normal file
|
|
@ -0,0 +1,26 @@
|
|||
<div class="box">
|
||||
|
||||
<div class="box-title">Schedule a New Event</div>
|
||||
<div class="box-description">
|
||||
Fill in the form below to create your event and share it with your friends and colleagues.
|
||||
</div>
|
||||
<ol class="box-steps">
|
||||
<li class="step active">
|
||||
General Details
|
||||
</li>
|
||||
<li class="step" ng-class="{ active : page > 1 }">
|
||||
Dates & Times
|
||||
</li>
|
||||
<li class="step" ng-class="{ active : page > 2 }">
|
||||
Invites
|
||||
</li>
|
||||
<li class="step" ng-class="{ active : page > 3 }">
|
||||
Done
|
||||
</li>
|
||||
</ol>
|
||||
<form novalidate autocomplete="off" name="form" ng-submit="submit()">
|
||||
<div ui-view>
|
||||
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
15
public/templates/newEvent/success.html
Normal file
15
public/templates/newEvent/success.html
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
<div class="box-message">
|
||||
<div class="main-image">
|
||||
<img src="/images/success_large.png" width="100" />
|
||||
</div>
|
||||
<div class="title">Event Created</div>
|
||||
<div class="content">
|
||||
Your event has been created successfully! You should receive an email shortly with instructions to verify your email address.
|
||||
</div>
|
||||
<div class="mini-divider">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<input type="text" class="form-control" disabled="true" value="{{eventUrl}}" />
|
||||
<a href="{{eventUrl}}" class="btn form-btn">GO</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
<div ng-hide="eventUrl">
|
||||
<div ng-if="!eventUrl">
|
||||
<div class="box" ng-class="{'animated shake': form.$submitted && form.$invalid }">
|
||||
|
||||
<div class="box-title">Schedule a New Event</div>
|
||||
|
|
@ -7,30 +7,47 @@
|
|||
</div>
|
||||
|
||||
<form novalidate autocomplete="off" name="form" ng-submit="submit()">
|
||||
<section class="box-section" user-form form="form" event="event">
|
||||
<div ng-if="page == 1">
|
||||
|
||||
</section>
|
||||
<section class="box-section" user-form form="form" event="event">
|
||||
|
||||
<section class="box-section" event-form form="form" event="event">
|
||||
</section>
|
||||
|
||||
</section>
|
||||
<section class="box-section" event-form form="form" event="event">
|
||||
|
||||
<section class="box-section" date-form form="form" event="event">
|
||||
</section>
|
||||
</div>
|
||||
<div ng-if="page==2">
|
||||
|
||||
</section>
|
||||
<section class="box-section" date-form form="form" event="event">
|
||||
|
||||
</section>
|
||||
|
||||
<section class="box-section" ng-show="event.dates.length" time-form form="form" event="event">
|
||||
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<div ng-if="page==3">
|
||||
|
||||
<section class="box-section" participants-form form="form" event="event">
|
||||
|
||||
</section>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div class="box-controls box-bottom-sticky">
|
||||
<button type="submit" class="btn btn-primary">Create Event</button>
|
||||
<button type="button" ng-if="page!=1" class="btn" ng-click="prevPage()">Back</button>
|
||||
<button type="button" ng-if="page!=3" class="btn" ng-click="nextPage()">Next</button>
|
||||
<button type="submit" ng-if="page==3" class="btn btn-primary">Create Event</button>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div ng-show="eventUrl" class="box">
|
||||
<div ng-if="eventUrl" class="box">
|
||||
<div class="box-message">
|
||||
<div class="main-image">
|
||||
<img src="/images/success_large.png" width="100" />
|
||||
|
|
|
|||
|
|
@ -22,6 +22,7 @@
|
|||
<meta name="msapplication-config" content="/images/favicon/browserconfig.xml">
|
||||
<link rel="stylesheet" href="/css/style.css" media="screen" charset="utf-8">
|
||||
<script type="text/javascript" src="/vendor/jquery/dist/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="/vendor/datejs/build/production/date.min.js"></script>
|
||||
<script type="text/javascript" src="/vendor/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
|
||||
<script type="text/javascript" src="/vendor/angular/angular.min.js"></script>
|
||||
<script type="text/javascript" src="/vendor/angular-resource/angular-resource.min.js"></script>
|
||||
|
|
@ -33,12 +34,59 @@
|
|||
</head>
|
||||
<body>
|
||||
<div class="outer-container">
|
||||
<div class="main-navigation">
|
||||
<a href="/" class="logo">
|
||||
<img src="/images/logo.png" width="100" />
|
||||
</a>
|
||||
<div class="menu-section">
|
||||
Menu
|
||||
</div>
|
||||
<nav class="navigation">
|
||||
<ul class="links" ng-controller="NavigationCtrl">
|
||||
<li>
|
||||
<a href="/" ng-class="{active : isActive('/')}">
|
||||
<i back-img="home" class="icon"></i>
|
||||
<span class="text">Homepage</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/about" ng-class="{active : isActive('/about')}">
|
||||
<i back-img="about" class="icon"></i>
|
||||
<span class="text">What is Rallly?</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/contact" ng-class="{active : isActive('/contact')}">
|
||||
<i back-img="contact" class="icon"></i>
|
||||
<span class="text">Contact</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="menu-section">
|
||||
|
||||
</div>
|
||||
<a class="create-new" href="/new">Schedule an event</a>
|
||||
</div>
|
||||
<div class="main-content">
|
||||
<div class="top-bar">
|
||||
<ul class="primary ng-scope" ng-controller="AccountCtrl">
|
||||
<li class="item dropdown" dropdown="">
|
||||
<a class="dropdown-toggle hoverable" ng-click="toggle()" href="#">
|
||||
<img src="/images/person.png" height="16">
|
||||
<span>Guest</span>
|
||||
</a>
|
||||
<div class="dropdown-menu">
|
||||
<div class="dropdown-content">
|
||||
User accounts will be added soon.
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div ui-view class="main-view">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue