Working on signup
Nick Sergeant
parent
f4f51dea3b
commit
45576a5e9d
|
|
@ -134,7 +134,12 @@ url=url&&addSlash(url);if(typeof url==='undefined'){url='/api/private/snipt/';th
|
|||
return url||null;};Site.SiteView=Backbone.View.extend({el:'body',initialize:function(opts){this.$body=$(this.el);this.$html=$('html');this.$html_body=this.$body.add(this.$html);this.$aside_nav=$('aside.nav',this.$body);this.$aside_nav_ul=$('ul',this.$aside_nav);this.$search_form=$('form.search',this.$body);this.$search_query=$('input#search-query',this.$body);this.$search_page_query=$('input.search-query',this.$body);this.$search_queries=this.$search_query.add(this.$search_page_query);this.$snipts=$('section#snipts article.snipt',this.$body);this.$modals=$('div.modal',this.$snipts);this.$main_edit=$('section#main-edit');this.$main=$('section#main');this.$keyboard_shortcuts=$('#keyboard-shortcuts',this.$body);this.$amazon_ads=$('section.amazon',this.$main);this.keyboardShortcuts();this.inFieldLabels();if(this.$amazon_ads.length){this.initAmazonAds();}
|
||||
var SniptListView=Snipt.SniptListView;this.snipt_list=new SniptListView({'snipts':this.$snipts});var that=this;this.$body.click(function(){if(!window.ui_halted&&!window.from_modal&&window.$selected){window.$selected.trigger('deselect');}
|
||||
if(window.from_modal){window.from_modal=false;}
|
||||
that.$aside_nav.removeClass('open');});this.$aside_nav_ul.click(function(e){e.stopPropagation();});$search_queries=this.$search_queries;$search_queries.focus(function(){if(window.$selected){$selected.trigger('deselect');}});this.$body.on('click','a.close',function(){$(this).parent().parent().modal('hide');window.ui_halted=false;return false;});this.$keyboard_shortcuts.on('hidden',function(){window.ui_halted=false;});window.ui_halted=false;},events:{'showKeyboardShortcuts':'showKeyboardShortcuts','click a.mini-profile':'toggleMiniProfile'},keyboardShortcuts:function(){var $body=this.$body;var that=this;$search_queries=this.$search_queries;$search_page_query=this.$search_page_query;$search_query=this.$search_query;$document=$(document);$document.bind('keydown','/',function(e){if(!window.ui_halted){e.preventDefault();if($body.hasClass('search')){$search_page_query.focus();}else{$search_query.focus();}}});$document.bind('keydown','h',function(e){if(!window.ui_halted){window.ui_halted=true;$body.trigger('showKeyboardShortcuts');}else{if(that.$keyboard_shortcuts.is(':visible')){that.$keyboard_shortcuts.modal('hide');}}});$document.bind('keydown','t',function(e){if(!window.ui_halted){window.open('','_blank');}});$document.bind('keydown','r',function(e){if(!window.ui_halted){location.reload(true);}});$document.bind('keydown','Ctrl+h',function(e){if(!window.ui_halted){history.go(-1);}});$document.bind('keydown','Ctrl+l',function(e){if(!window.ui_halted){history.go(1);}});this.$search_queries.bind('keydown','esc',function(e){if(!window.ui_halted){e.preventDefault();this.blur();}});},showKeyboardShortcuts:function(){this.$keyboard_shortcuts.modal('toggle');},toggleMiniProfile:function(e){this.$aside_nav.toggleClass('open');return false;},inFieldLabels:function(){$('div.infield label',this.$body).inFieldLabels({fadeDuration:200});},initAmazonAds:function(){var $more=$('div.more',this.$amazon_ads);var that=this;var adTemplate=$('script#amazon-ad').html();$('a',$more).on('click',function(){var $current=$('li:visible',that.$amazon_ads);$('li',that.$amazon_ads).hide();if($(this).hasClass('see-previous')){var $prev=$current.prev();if($prev.length){$prev=$prev;}else{$prev=$('li',that.$amazon_ads).eq(-1);}
|
||||
that.$aside_nav.removeClass('open');});this.$aside_nav_ul.click(function(e){e.stopPropagation();});$search_queries=this.$search_queries;$search_queries.focus(function(){if(window.$selected){$selected.trigger('deselect');}});this.$body.on('click','a.close',function(){$(this).parent().parent().modal('hide');window.ui_halted=false;return false;});this.$keyboard_shortcuts.on('hidden',function(){window.ui_halted=false;});if(this.$body.hasClass('pro-signup')){var $form=$('form#pro-signup');var $submit=$('button[type="submit"]',$form);var $name=$('input#name');var $cardNumber=$('input#number');var $expMonth=$('select[name="exp-month"]');var $expYear=$('select[name="exp-year"]');var $cvc=$('input#cvc');$form.submit(function(){$submit.attr('disabled','disabled');var errors=false;if(!Stripe.validateCardNumber($cardNumber.val())){$cardNumber.parents('div.control-group').addClass('error');errors=true;}else{$cardNumber.parents('div.control-group').removeClass('error');}
|
||||
if(!Stripe.validateExpiry($expMonth.val(),$expYear.val())){$expMonth.parents('div.control-group').addClass('error');errors=true;}else{$expMonth.parents('div.control-group').removeClass('error');}
|
||||
if(!Stripe.validateCVC($cvc.val())){$cvc.parents('div.control-group').addClass('error');errors=true;}else{$cvc.parents('div.control-group').removeClass('error');}
|
||||
if(!errors){Stripe.createToken({name:$name.val(),number:$cardNumber.val(),cvc:$cvc.val(),exp_month:$expMonth.val(),exp_year:$expYear.val()},that.stripeResponseHandler);}else{$submit.removeAttr('disabled');}
|
||||
return false;});}
|
||||
window.ui_halted=false;},events:{'showKeyboardShortcuts':'showKeyboardShortcuts','click a.mini-profile':'toggleMiniProfile'},keyboardShortcuts:function(){var $body=this.$body;var that=this;$search_queries=this.$search_queries;$search_page_query=this.$search_page_query;$search_query=this.$search_query;$document=$(document);$document.bind('keydown','/',function(e){if(!window.ui_halted){e.preventDefault();if($body.hasClass('search')){$search_page_query.focus();}else{$search_query.focus();}}});$document.bind('keydown','h',function(e){if(!window.ui_halted){window.ui_halted=true;$body.trigger('showKeyboardShortcuts');}else{if(that.$keyboard_shortcuts.is(':visible')){that.$keyboard_shortcuts.modal('hide');}}});$document.bind('keydown','t',function(e){if(!window.ui_halted){window.open('','_blank');}});$document.bind('keydown','r',function(e){if(!window.ui_halted){location.reload(true);}});$document.bind('keydown','Ctrl+h',function(e){if(!window.ui_halted){history.go(-1);}});$document.bind('keydown','Ctrl+l',function(e){if(!window.ui_halted){history.go(1);}});this.$search_queries.bind('keydown','esc',function(e){if(!window.ui_halted){e.preventDefault();this.blur();}});},showKeyboardShortcuts:function(){this.$keyboard_shortcuts.modal('toggle');},toggleMiniProfile:function(e){this.$aside_nav.toggleClass('open');return false;},inFieldLabels:function(){$('div.infield label',this.$body).inFieldLabels({fadeDuration:200});},stripeResponseHandler:function(status,response){console.log(status);console.log(response);if(response.error){}else{}},initAmazonAds:function(){var $more=$('div.more',this.$amazon_ads);var that=this;var adTemplate=$('script#amazon-ad').html();$('a',$more).on('click',function(){var $current=$('li:visible',that.$amazon_ads);$('li',that.$amazon_ads).hide();if($(this).hasClass('see-previous')){var $prev=$current.prev();if($prev.length){$prev=$prev;}else{$prev=$('li',that.$amazon_ads).eq(-1);}
|
||||
$prev.fadeIn('fast');}else{var $next=$current.next();if($next.length){$next=$next;}else{$next=$('li',that.$amazon_ads).eq(0);}
|
||||
$next.fadeIn('fast');}
|
||||
return false;});$.getJSON('/api/public/a/',{'q':window.tag},function(resp){if(resp.result.length===0){that.$amazon_ads.slideUp('fast');}else{var html='';for(var i=0;i<resp.result.length;i++){if(resp.result[i].image){html+=_.template(adTemplate,{url:resp.result[i].url,title:resp.result[i].title,review:resp.result[i].review,image:resp.result[i].image});}}
|
||||
|
|
|
|||
|
|
@ -97,6 +97,59 @@
|
|||
window.ui_halted = false;
|
||||
});
|
||||
|
||||
if (this.$body.hasClass('pro-signup')) {
|
||||
var $form = $('form#pro-signup');
|
||||
var $submit = $('button[type="submit"]', $form);
|
||||
|
||||
var $name = $('input#name');
|
||||
var $cardNumber = $('input#number');
|
||||
var $expMonth = $('select[name="exp-month"]');
|
||||
var $expYear = $('select[name="exp-year"]');
|
||||
var $cvc = $('input#cvc');
|
||||
|
||||
$form.submit(function() {
|
||||
|
||||
$submit.attr('disabled', 'disabled');
|
||||
|
||||
var errors = false;
|
||||
|
||||
if (!Stripe.validateCardNumber($cardNumber.val())) {
|
||||
$cardNumber.parents('div.control-group').addClass('error');
|
||||
errors = true;
|
||||
} else {
|
||||
$cardNumber.parents('div.control-group').removeClass('error');
|
||||
}
|
||||
|
||||
if (!Stripe.validateExpiry($expMonth.val(), $expYear.val())) {
|
||||
$expMonth.parents('div.control-group').addClass('error');
|
||||
errors = true;
|
||||
} else {
|
||||
$expMonth.parents('div.control-group').removeClass('error');
|
||||
}
|
||||
|
||||
if (!Stripe.validateCVC($cvc.val())) {
|
||||
$cvc.parents('div.control-group').addClass('error');
|
||||
errors = true;
|
||||
} else {
|
||||
$cvc.parents('div.control-group').removeClass('error');
|
||||
}
|
||||
|
||||
if (!errors) {
|
||||
Stripe.createToken({
|
||||
name: $name.val(),
|
||||
number: $cardNumber.val(),
|
||||
cvc: $cvc.val(),
|
||||
exp_month: $expMonth.val(),
|
||||
exp_year: $expYear.val()
|
||||
}, that.stripeResponseHandler);
|
||||
} else {
|
||||
$submit.removeAttr('disabled');
|
||||
}
|
||||
|
||||
return false;
|
||||
});
|
||||
}
|
||||
|
||||
window.ui_halted = false;
|
||||
},
|
||||
events: {
|
||||
|
|
@ -173,6 +226,22 @@
|
|||
fadeDuration: 200
|
||||
});
|
||||
},
|
||||
stripeResponseHandler: function(status, response) {
|
||||
console.log(status);
|
||||
console.log(response);
|
||||
if (response.error) {
|
||||
// show the errors on the form
|
||||
//$(".payment-errors").text(response.error.message);
|
||||
} else {
|
||||
//var form$ = $("#payment-form");
|
||||
// token contains id, last4, and card type
|
||||
//var token = response['id'];
|
||||
// insert the token into the form so it gets submitted to the server
|
||||
//form$.append("<input type='hidden' name='stripeToken' value='" + token + "'/>");
|
||||
// and submit
|
||||
//form$.get(0).submit();
|
||||
}
|
||||
},
|
||||
initAmazonAds: function() {
|
||||
var $more = $('div.more', this.$amazon_ads);
|
||||
var that = this;
|
||||
|
|
|
|||
|
|
@ -4,7 +4,12 @@ url=url&&addSlash(url);if(typeof url==='undefined'){url='/api/private/snipt/';th
|
|||
return url||null;};Site.SiteView=Backbone.View.extend({el:'body',initialize:function(opts){this.$body=$(this.el);this.$html=$('html');this.$html_body=this.$body.add(this.$html);this.$aside_nav=$('aside.nav',this.$body);this.$aside_nav_ul=$('ul',this.$aside_nav);this.$search_form=$('form.search',this.$body);this.$search_query=$('input#search-query',this.$body);this.$search_page_query=$('input.search-query',this.$body);this.$search_queries=this.$search_query.add(this.$search_page_query);this.$snipts=$('section#snipts article.snipt',this.$body);this.$modals=$('div.modal',this.$snipts);this.$main_edit=$('section#main-edit');this.$main=$('section#main');this.$keyboard_shortcuts=$('#keyboard-shortcuts',this.$body);this.$amazon_ads=$('section.amazon',this.$main);this.keyboardShortcuts();this.inFieldLabels();if(this.$amazon_ads.length){this.initAmazonAds();}
|
||||
var SniptListView=Snipt.SniptListView;this.snipt_list=new SniptListView({'snipts':this.$snipts});var that=this;this.$body.click(function(){if(!window.ui_halted&&!window.from_modal&&window.$selected){window.$selected.trigger('deselect');}
|
||||
if(window.from_modal){window.from_modal=false;}
|
||||
that.$aside_nav.removeClass('open');});this.$aside_nav_ul.click(function(e){e.stopPropagation();});$search_queries=this.$search_queries;$search_queries.focus(function(){if(window.$selected){$selected.trigger('deselect');}});this.$body.on('click','a.close',function(){$(this).parent().parent().modal('hide');window.ui_halted=false;return false;});this.$keyboard_shortcuts.on('hidden',function(){window.ui_halted=false;});window.ui_halted=false;},events:{'showKeyboardShortcuts':'showKeyboardShortcuts','click a.mini-profile':'toggleMiniProfile'},keyboardShortcuts:function(){var $body=this.$body;var that=this;$search_queries=this.$search_queries;$search_page_query=this.$search_page_query;$search_query=this.$search_query;$document=$(document);$document.bind('keydown','/',function(e){if(!window.ui_halted){e.preventDefault();if($body.hasClass('search')){$search_page_query.focus();}else{$search_query.focus();}}});$document.bind('keydown','h',function(e){if(!window.ui_halted){window.ui_halted=true;$body.trigger('showKeyboardShortcuts');}else{if(that.$keyboard_shortcuts.is(':visible')){that.$keyboard_shortcuts.modal('hide');}}});$document.bind('keydown','t',function(e){if(!window.ui_halted){window.open('','_blank');}});$document.bind('keydown','r',function(e){if(!window.ui_halted){location.reload(true);}});$document.bind('keydown','Ctrl+h',function(e){if(!window.ui_halted){history.go(-1);}});$document.bind('keydown','Ctrl+l',function(e){if(!window.ui_halted){history.go(1);}});this.$search_queries.bind('keydown','esc',function(e){if(!window.ui_halted){e.preventDefault();this.blur();}});},showKeyboardShortcuts:function(){this.$keyboard_shortcuts.modal('toggle');},toggleMiniProfile:function(e){this.$aside_nav.toggleClass('open');return false;},inFieldLabels:function(){$('div.infield label',this.$body).inFieldLabels({fadeDuration:200});},initAmazonAds:function(){var $more=$('div.more',this.$amazon_ads);var that=this;var adTemplate=$('script#amazon-ad').html();$('a',$more).on('click',function(){var $current=$('li:visible',that.$amazon_ads);$('li',that.$amazon_ads).hide();if($(this).hasClass('see-previous')){var $prev=$current.prev();if($prev.length){$prev=$prev;}else{$prev=$('li',that.$amazon_ads).eq(-1);}
|
||||
that.$aside_nav.removeClass('open');});this.$aside_nav_ul.click(function(e){e.stopPropagation();});$search_queries=this.$search_queries;$search_queries.focus(function(){if(window.$selected){$selected.trigger('deselect');}});this.$body.on('click','a.close',function(){$(this).parent().parent().modal('hide');window.ui_halted=false;return false;});this.$keyboard_shortcuts.on('hidden',function(){window.ui_halted=false;});if(this.$body.hasClass('pro-signup')){var $form=$('form#pro-signup');var $submit=$('button[type="submit"]',$form);var $name=$('input#name');var $cardNumber=$('input#number');var $expMonth=$('select[name="exp-month"]');var $expYear=$('select[name="exp-year"]');var $cvc=$('input#cvc');$form.submit(function(){$submit.attr('disabled','disabled');var errors=false;if(!Stripe.validateCardNumber($cardNumber.val())){$cardNumber.parents('div.control-group').addClass('error');errors=true;}else{$cardNumber.parents('div.control-group').removeClass('error');}
|
||||
if(!Stripe.validateExpiry($expMonth.val(),$expYear.val())){$expMonth.parents('div.control-group').addClass('error');errors=true;}else{$expMonth.parents('div.control-group').removeClass('error');}
|
||||
if(!Stripe.validateCVC($cvc.val())){$cvc.parents('div.control-group').addClass('error');errors=true;}else{$cvc.parents('div.control-group').removeClass('error');}
|
||||
if(!errors){Stripe.createToken({name:$name.val(),number:$cardNumber.val(),cvc:$cvc.val(),exp_month:$expMonth.val(),exp_year:$expYear.val()},that.stripeResponseHandler);}else{$submit.removeAttr('disabled');}
|
||||
return false;});}
|
||||
window.ui_halted=false;},events:{'showKeyboardShortcuts':'showKeyboardShortcuts','click a.mini-profile':'toggleMiniProfile'},keyboardShortcuts:function(){var $body=this.$body;var that=this;$search_queries=this.$search_queries;$search_page_query=this.$search_page_query;$search_query=this.$search_query;$document=$(document);$document.bind('keydown','/',function(e){if(!window.ui_halted){e.preventDefault();if($body.hasClass('search')){$search_page_query.focus();}else{$search_query.focus();}}});$document.bind('keydown','h',function(e){if(!window.ui_halted){window.ui_halted=true;$body.trigger('showKeyboardShortcuts');}else{if(that.$keyboard_shortcuts.is(':visible')){that.$keyboard_shortcuts.modal('hide');}}});$document.bind('keydown','t',function(e){if(!window.ui_halted){window.open('','_blank');}});$document.bind('keydown','r',function(e){if(!window.ui_halted){location.reload(true);}});$document.bind('keydown','Ctrl+h',function(e){if(!window.ui_halted){history.go(-1);}});$document.bind('keydown','Ctrl+l',function(e){if(!window.ui_halted){history.go(1);}});this.$search_queries.bind('keydown','esc',function(e){if(!window.ui_halted){e.preventDefault();this.blur();}});},showKeyboardShortcuts:function(){this.$keyboard_shortcuts.modal('toggle');},toggleMiniProfile:function(e){this.$aside_nav.toggleClass('open');return false;},inFieldLabels:function(){$('div.infield label',this.$body).inFieldLabels({fadeDuration:200});},stripeResponseHandler:function(status,response){console.log(status);console.log(response);if(response.error){}else{}},initAmazonAds:function(){var $more=$('div.more',this.$amazon_ads);var that=this;var adTemplate=$('script#amazon-ad').html();$('a',$more).on('click',function(){var $current=$('li:visible',that.$amazon_ads);$('li',that.$amazon_ads).hide();if($(this).hasClass('see-previous')){var $prev=$current.prev();if($prev.length){$prev=$prev;}else{$prev=$('li',that.$amazon_ads).eq(-1);}
|
||||
$prev.fadeIn('fast');}else{var $next=$current.next();if($next.length){$next=$next;}else{$next=$('li',that.$amazon_ads).eq(0);}
|
||||
$next.fadeIn('fast');}
|
||||
return false;});$.getJSON('/api/public/a/',{'q':window.tag},function(resp){if(resp.result.length===0){that.$amazon_ads.slideUp('fast');}else{var html='';for(var i=0;i<resp.result.length;i++){if(resp.result[i].image){html+=_.template(adTemplate,{url:resp.result[i].url,title:resp.result[i].title,review:resp.result[i].review,image:resp.result[i].image});}}
|
||||
|
|
|
|||
|
|
@ -338,19 +338,23 @@
|
|||
<script type="text/javascript" src="{{ STATIC_URL }}js/snipt.js?5"></script>
|
||||
<script type="text/javascript" src="{{ STATIC_URL }}js/libs/ace/ace.js"></script>
|
||||
<script type="text/javascript" src="{{ STATIC_URL }}js/libs/ace/theme-tomorrow.js"></script>
|
||||
{% block extra-scripts %}{% endblock %}
|
||||
|
||||
{% block inline-js %}
|
||||
<script type="text/javascript">{% block js %}window.user = '{{ request.user.username }}';
|
||||
{% if public %}
|
||||
window.pub = {{ public|lower }};
|
||||
{% else %}
|
||||
window.pub = null;
|
||||
{% endif %}
|
||||
window.api_key = '{{ request.user.api_key.key }}';{% endblock %}
|
||||
{% if tag %}
|
||||
window.tag = '{{ tag.name }}';
|
||||
{% endif %}
|
||||
</script>
|
||||
<script type="text/javascript">
|
||||
{% block js %}
|
||||
window.user = '{{ request.user.username }}';
|
||||
{% if public %}
|
||||
window.pub = {{ public|lower }};
|
||||
{% else %}
|
||||
window.pub = null;
|
||||
{% endif %}
|
||||
window.api_key = '{{ request.user.api_key.key }}';
|
||||
{% endblock %}
|
||||
{% if tag %}
|
||||
window.tag = '{{ tag.name }}';
|
||||
{% endif %}
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
||||
<div class="hidden" id="templates">
|
||||
|
|
|
|||
|
|
@ -2,7 +2,16 @@
|
|||
|
||||
{% block page-title %}Sign up for Snipt Pro{% endblock %}
|
||||
|
||||
{% block body-class %}{{ block.super }} static pro{% endblock %}
|
||||
{% block body-class %}{{ block.super }} static pro pro-signup{% endblock %}
|
||||
|
||||
{% block extra-scripts %}
|
||||
<script type="text/javascript" src="https://js.stripe.com/v1/"></script>
|
||||
{% endblock %}
|
||||
|
||||
{% block js %}
|
||||
{{ block.super }}
|
||||
Stripe.setPublishableKey('pk_RUeu9JcZVSzIr9qsJAnYrNJntJ8Vd');
|
||||
{% endblock %}
|
||||
|
||||
{% block breadcrumb %}
|
||||
<li><a href="/pro/">Snipt Pro</a></li>
|
||||
|
|
@ -15,7 +24,7 @@
|
|||
<img src="/static/images/stripe.png" alt="" />
|
||||
</a>
|
||||
<h2>Snipt <span class="pro">Pro</span> signup</h2>
|
||||
<form class="form-horizontal" method="post" action="">
|
||||
<form class="form-horizontal" id="pro-signup" method="post" action="">
|
||||
<fieldset>
|
||||
<legend>$19 USD will be charged to your card annually. Also, you rock. Tell yourself that every year, too.</legend>
|
||||
<div class="control-group">
|
||||
|
|
@ -37,21 +46,23 @@
|
|||
<div class="control-group">
|
||||
<label class="control-label" for="exp-month">Expiration date:</label>
|
||||
<div class="controls">
|
||||
<select name="exp-month" class="span1 exp-month">
|
||||
<option value="01">01</option>
|
||||
<option value="02">02</option>
|
||||
<option value="03">03</option>
|
||||
<option value="04">04</option>
|
||||
<option value="05">05</option>
|
||||
<option value="06">06</option>
|
||||
<option value="07">07</option>
|
||||
<option value="08">08</option>
|
||||
<option value="09">09</option>
|
||||
<option value="10">10</option>
|
||||
<option value="11">11</option>
|
||||
<option value="12">12</option>
|
||||
<select name="exp-month" class="span2 exp-month">
|
||||
<option value="">----</option>
|
||||
<option value="01">01 - January</option>
|
||||
<option value="02">02 - February</option>
|
||||
<option value="03">03 - March</option>
|
||||
<option value="04">04 - April</option>
|
||||
<option value="05">05 - May</option>
|
||||
<option value="06">06 - June</option>
|
||||
<option value="07">07 - July</option>
|
||||
<option value="08">08 - August</option>
|
||||
<option value="09">09 - September</option>
|
||||
<option value="10">10 - October</option>
|
||||
<option value="11">11 - November</option>
|
||||
<option value="12">12 - December</option>
|
||||
</select>
|
||||
<select name="exp-year" class="span1">
|
||||
<option value="">----</option>
|
||||
<option value="2012">2012</option>
|
||||
<option value="2013">2013</option>
|
||||
<option value="2014">2014</option>
|
||||
|
|
|
|||
Loading…
Reference in New Issue