Skip to content

Commit 183c164

Browse files
shortsandsshortsands
committed
Fixed donate.html to use pjax by loading donate controls separately dependent on URL. I believe this works completely now, only possible issue is that Facebook like button is sometimes very slow to load (~5 seconds) in Firefox.
1 parent 01afa60 commit 183c164

File tree

2 files changed

+126
-124
lines changed

2 files changed

+126
-124
lines changed

‎war/donate.html

Lines changed: 12 additions & 95 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@
2626
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="../assets/ico/apple-touch-icon-114-precomposed.png">
2727
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="../assets/ico/apple-touch-icon-72-precomposed.png">
2828
<link rel="apple-touch-icon-precomposed" href="../assets/ico/apple-touch-icon-57-precomposed.png">
29-
29+
3030
<div class="navbar navbar-inverse navbar-fixed-top">
3131
<div class="navbar-inner" id="head-nav">
3232
</div>
@@ -41,14 +41,12 @@
4141
$('#foot-nav').html(data);
4242
})
4343
</script>
44-
45-
<!-- END -->
46-
4744
</head>
48-
45+
4946
<body>
50-
<!-- disable pjax in DONATE page to fix buttons -->
51-
<div id="NOT-pjax-content">
47+
<div id="pjax-content">
48+
<!-- END REPEAT-->
49+
5250
<header class="jumbotron subhead" id="overview">
5351
<div class="container">
5452
<!--<div class="openworm_logo_header"></div>-->
@@ -163,106 +161,25 @@ <h2>$100,000</h2>
163161
</div>
164162
<!-- end pjax-content -->
165163

166-
167-
<!-- FOOT: CUSTOM FOR DONATE PAGE
164+
<!-- FOOT: DUPLICATE THE FOLLOWING IN ALL PAGES
168165
169166
footer
170167
================================================== -->
171168
<div id="foot-nav"></div>
172-
<!-- foot-nav is filled with script in header -->
169+
<!-- foot-nav is filled with script in head -->
173170

174171
<!-- Le javascript
175172
================================================== -->
176173
<!-- at end of the document so the pages load faster -->
177174

178175
<!-- load other resources asynchronously: -->
179176
<script src="js/bootstrap.js" async></script>
177+
<script src="js/jquery.parss.uncompressed.js" async></script>
178+
<script src="http://platform.twitter.com/widgets.js" async></script>
180179

181-
<!-- execute carousel/donate controls -->
182-
<script>
183-
$(function() {
184-
$('.minilogo').tooltip();
185-
186-
$(".donation").click(function(){
187-
$(".donation").removeClass("active");
188-
$("#otherAmount").removeClass("active");
189-
$("#amountSent").attr("value",$(this).html().replace("$",""));
190-
$(this).addClass("active");
191-
})
192-
193-
$(".other").click(function(){
194-
$("#otherAmount").addClass("active");
195-
$("#amountSent").attr("value",$(this).val());
196-
$("#otherAmount").focus();
197-
})
198-
199-
$("#otherAmount").click(function(){
200-
$("#otherAmount").addClass("active");
201-
$(".donation").removeClass("active");
202-
$("#amountSent").attr("value",$(this).val());
203-
$(".other").addClass("active");
204-
})
205-
206-
$("#otherAmount").on("input",function(){
207-
$("#amountSent").attr("value",$(this).val());
208-
})
209-
210-
var amount = getUrlParameter('amount');
211-
if(amount=="" || amount==undefined){
212-
$("#d50").click();
213-
}
214-
else if(amount=="5"){
215-
$("#d5").click();
216-
}
217-
else if(amount=="25"){
218-
$("#d25").click();
219-
}
220-
else if(amount=="50"){
221-
$("#d50").click();
222-
}
223-
else if(amount=="100"){
224-
$("#d100").click();
225-
}
226-
else{
227-
$(".other").click();
228-
$("#otherAmount").val(amount);
229-
$("#amountSent").attr("value",amount);
230-
}
231-
})
232-
233-
234-
function getUrlParameter(sParam) {
235-
var sPageURL = decodeURIComponent(window.location.search.substring(1)),
236-
sURLVariables = sPageURL.split('&'),
237-
sParameterName,
238-
i;
239-
240-
for (i = 0; i < sURLVariables.length; i++) {
241-
sParameterName = sURLVariables[i].split('=');
242-
243-
if (sParameterName[0] === sParam) {
244-
return sParameterName[1] === undefined ? true : sParameterName[1];
245-
}
246-
}
247-
}
248-
249-
function donate(){
250-
var amount = $(".donation.active");
251-
if(amount.hasClass("other")){
252-
amount=$("#otherAmount").val();
253-
}
254-
else{
255-
amount=amount.html().replace("$","");
256-
}
257-
window.location="\donate.html?amount="+amount;
258-
}
259-
260-
261-
window.___gcfg = {
262-
lang: 'en-GB'
263-
};
264-
265-
</script>
180+
<!-- execute main (initialize resources above + carousel/donate controls -->
181+
<script src="js/jquery.pjax.js"></script>
182+
<script src="js/main.js" defer></script>
266183

267184
</body>
268185

‎war/js/main.js

Lines changed: 114 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,56 +1,73 @@
1-
// set all links inside pjax-content to try pjax:
1+
// set ALL links inside pjax-content to try pjax
2+
// this may slow down outside links with pjax request?
23
$(document).pjax('a', '#pjax-content', {fragment: '#pjax-content'});
3-
44
// set explicit links in nav bars to use pjax
55
$(document).pjax('a[data-pjax]', '#pjax-content', {fragment: '#pjax-content'});
66

77
$(document).on('pjax:complete', function() {
8-
// things to do on page change back to index.html
9-
if (window.location.pathname === '/index.html') {
8+
console.log('pjax:complete');
9+
// things to do on pjax link to specific page
10+
var loc = window.location.pathname;
11+
if (loc === '/index.html' || loc === '/' || loc === '') {
1012
reloadSocial();
13+
} else if (loc === '/donate.html') {
14+
loadDonationControls();
1115
}
1216
setNavigation();
1317
})
1418

19+
$(document).on('pjax:popstate', function() {
20+
console.log('pjax:popstate');
21+
// things to do on pjax BACK/FORWARD to specific page
22+
var loc = window.location.pathname;
23+
if (loc === '/donate.html') {
24+
// hack to make donate controls reload _after_ page load on back
25+
$(document).on('pjax:end', function () {
26+
console.log('loadDonationControls');
27+
loadDonationControls();
28+
})
29+
}
30+
setNavigation();
31+
})
32+
33+
1534
$(window).on('load', function() {
35+
console.log('window initial load');
1636
// things to do on initial page load (defined in main.js)
37+
// for all pages:
1738
loadGoogleAnalytics();
1839
setNavigation();
40+
41+
$(".carousel-control").click(function(e) {
42+
$("#tip").hide();
43+
})
44+
45+
$('.carousel').carousel({
46+
interval: 13000
47+
})
48+
49+
$('.minilogo').tooltip();
50+
51+
window.___gcfg = {
52+
lang: 'en-GB'
53+
}
54+
55+
// for specific pages:
1956
var loc = window.location.pathname;
2057
if (loc === '/index.html' || loc === '/' || loc === '') {
58+
console.log('loc = index');
2159
loadGooglePlus();
2260
loadFacebook();
2361
loadTwitterWidget();
2462
refreshNews();
2563
$('.nav li').removeClass('active');
2664
$('#home').addClass('active');
27-
}
28-
})
29-
30-
$(function() {
31-
// unclear what this does?
32-
// side bar
33-
$('.bs-docs-sidenav').affix({
34-
offset: {
35-
top: function() {
36-
return $(window).width() <= 980 ? 290 : 210
37-
},
38-
bottom: 270
39-
}
40-
})
41-
42-
$(".carousel-control").click(function(e) {
43-
$("#tip").hide();
44-
});
45-
46-
$('.carousel').carousel({
47-
interval: 13000
48-
});
49-
50-
$('.minilogo').tooltip();
65+
} else if (loc === '/donate.html') {
66+
console.log('loc = donate');
67+
loadDonationControls();
68+
}
5169
})
5270

53-
5471
window.___gcfg = {
5572
lang: 'en-GB'
5673
};
@@ -164,6 +181,7 @@ function reloadSocial() {
164181
refreshNews();
165182

166183
// Facebook
184+
console.log(typeof (FB));
167185
if (typeof (FB) != 'undefined') {
168186
delete FB;
169187
$('#facebook-jssdk').remove();
@@ -182,3 +200,70 @@ function reloadSocial() {
182200
loadGooglePlus();
183201
}
184202
}
203+
204+
205+
// donation
206+
207+
function loadDonationControls() {
208+
$(".donation").on('click', function() {
209+
$(".donation").removeClass("active");
210+
$("#otherAmount").removeClass("active");
211+
$("#amountSent").attr("value",$(this).html().replace("$",""));
212+
$(this).addClass("active");
213+
})
214+
215+
$(".other").click(function(){
216+
$("#otherAmount").addClass("active");
217+
$("#amountSent").attr("value",$(this).val());
218+
$("#otherAmount").focus();
219+
})
220+
221+
$("#otherAmount").click(function(){
222+
$("#otherAmount").addClass("active");
223+
$(".donation").removeClass("active");
224+
$("#amountSent").attr("value",$(this).val());
225+
$(".other").addClass("active");
226+
})
227+
228+
$("#otherAmount").on("input",function(){
229+
$("#amountSent").attr("value",$(this).val());
230+
})
231+
232+
var amount = getUrlParameter('amount');
233+
if (amount=="" || amount==undefined) {
234+
$("#d50").click();
235+
}
236+
else if (amount=="5") {
237+
$("#d5").click();
238+
}
239+
else if (amount=="25") {
240+
$("#d25").click();
241+
}
242+
else if (amount=="50") {
243+
$("#d50").click();
244+
}
245+
else if (amount=="100") {
246+
$("#d100").click();
247+
}
248+
else {
249+
$(".other").click();
250+
$("#otherAmount").val(amount);
251+
$("#amountSent").attr("value",amount);
252+
}
253+
}
254+
255+
256+
function getUrlParameter(sParam) {
257+
var sPageURL = decodeURIComponent(window.location.search.substring(1)),
258+
sURLVariables = sPageURL.split('&'),
259+
sParameterName,
260+
i;
261+
262+
for (i = 0; i < sURLVariables.length; i++) {
263+
sParameterName = sURLVariables[i].split('=');
264+
265+
if (sParameterName[0] === sParam) {
266+
return sParameterName[1] === undefined ? true : sParameterName[1];
267+
}
268+
}
269+
}

0 commit comments

Comments
 (0)