Skip to content

Commit df9e610

Browse files
shortsandsshortsands
committed
jquery-pjax is now working, refactoring main.js to call scripts as necessary
1 parent fa91c96 commit df9e610

File tree

4 files changed

+951
-69
lines changed

4 files changed

+951
-69
lines changed

‎war/getting_started.html

Lines changed: 9 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -28,38 +28,23 @@
2828
<link rel="apple-touch-icon-precomposed" href="../assets/ico/apple-touch-icon-57-precomposed.png">
2929

3030
<!-- see: https://github.com/thybag/PJAX-Standalone -->
31-
<script src='js/pjax-standalone.js'></script>
32-
<script type='text/javascript'>
33-
// Debug output for pjax; replace with
34-
// pjax.connect('content') to silence console output
35-
if(typeof console === 'undefined') console = {"log":function(m){}};
36-
37-
// PJAX links!
38-
pjax.connect({
39-
'container': 'pj-content',
40-
'parseJS': true,
41-
'success': function(event){
42-
var url = (typeof event.data !== 'undefined') ? event.data.url : '';
43-
console.log("Successfully pjaxed "+ url);
44-
},
45-
'error': function(event){
46-
var url = (typeof event.data !== 'undefined') ? event.data.url : '';
47-
console.log("Could not load "+ url);
48-
},
49-
'ready': function(){
50-
console.log("PJAX loaded!");
51-
}
52-
});
31+
<script src="js/jquery-1.8.3.min.js"></script>
32+
<script src="js/jquery.pjax.js"></script>
33+
<script>
34+
// set all links inside pj-content to try pjax
35+
$(document).pjax('a', '#pj-content', {fragment: '#pj-content'});
36+
// set explicit links in nav bar to use pjax
37+
$(document).pjax('a[data-pjax]', '#pj-content', {fragment: '#pj-content'});
5338
</script>
5439

55-
5640
<!-- pull in nav header with jquery in footer -->
5741
<div id="head-nav"></div>
58-
42+
5943
</head>
6044

6145
<body>
6246
<div id="pj-content">
47+
6348
<header class="jumbotron subhead" id="overview">
6449
<div class="container">
6550
<!--<div class="openworm_logo_header"></div>-->

‎war/header-content.html

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -11,28 +11,28 @@
1111
<div class="nav-collapse collapse">
1212
<ul class="nav">
1313
<li id="home">
14-
<a href="./index.html">Home</a>
14+
<a href="./index.html" data-pjax>Home</a>
1515
</li>
1616
<li id="started">
17-
<a href="./getting_started.html">Get Started</a>
17+
<a data-pjax href="./getting_started.html">Get Started</a>
1818
</li>
1919
<li id="involved">
20-
<a href="./get_involved.html">Get Involved</a>
20+
<a data-pjax href="./get_involved.html">Get Involved</a>
2121
</li>
2222
<li id="downloads">
23-
<a href="./downloads.html">Downloads</a>
23+
<a data-pjax href="./downloads.html">Downloads</a>
2424
</li>
2525
<li id="supporters">
26-
<a href="./supporters.html">Supporters</a>
26+
<a data-pjax href="./supporters.html">Supporters</a>
2727
</li>
2828
<li id="media">
29-
<a href="./media.html">Media</a>
29+
<a data-pjax href="./media.html">Media</a>
3030
</li>
3131
<li id="science">
32-
<a href="./science.html">Science</a>
32+
<a data-pjax href="./science.html">Science</a>
3333
</li>
3434
<li id="donate">
35-
<a class="donatecolor" href="./donate.html">Donate</a>
35+
<a data-pjax class="donatecolor" href="./donate.html">Donate</a>
3636
</li>
3737
</ul>
3838
<ul class="nav pull-right">

‎war/index.html

Lines changed: 30 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -28,32 +28,16 @@
2828

2929

3030
<!-- see: https://github.com/thybag/PJAX-Standalone -->
31-
<script src='js/pjax-standalone.js'></script>
32-
<script type='text/javascript'>
33-
// Debug output for pjax; replace with
34-
// pjax.connect('content') to silence console output
35-
if(typeof console === 'undefined') console = {"log":function(m){}};
36-
37-
// PJAX links!
38-
pjax.connect({
39-
'container': 'pj-content',
40-
'parseJS': true,
41-
'success': function(event){
42-
var url = (typeof event.data !== 'undefined') ? event.data.url : '';
43-
console.log("Successfully pjaxed "+ url);
44-
},
45-
'error': function(event){
46-
var url = (typeof event.data !== 'undefined') ? event.data.url : '';
47-
console.log("Could not load "+ url);
48-
},
49-
'ready': function(){
50-
console.log("PJAX loaded!");
51-
}
52-
});
31+
<script src="js/jquery-1.8.3.min.js"></script>
32+
<script src="js/jquery.pjax.js"></script>
33+
<script>
34+
// set all links inside pj-content to try pjax
35+
$(document).pjax('a', '#pj-content', {fragment: '#pj-content'});
36+
// set explicit links in nav bar to use pjax
37+
$(document).pjax('a[data-pjax]', '#pj-content', {fragment: '#pj-content'});
5338
</script>
5439

55-
56-
<!-- pull in nav header with jquery in footer -->
40+
<!-- pull in nav header with jquery script in footer -->
5741
<div id="head-nav"></div>
5842

5943
</head>
@@ -367,7 +351,7 @@ <h2>Source code</h2>
367351
<p>
368352
All the code produced as part of the OpenWorm project is on <a
369353
href="http://docs.openworm.org/en/latest/Community/github.html#github"
370-
target="_blank">GitHub</a>
354+
target="_blank">GitHub</a>
371355
under <a href="http://opensource.org/licenses/MIT" target="_blank">MIT</a> licence. Different <a
372356
href="http://docs.openworm.org/en/latest/projects.html" target="_blank">sub-projects</a> are
373357
hosted in different repositories.
@@ -414,14 +398,6 @@ <h1>Meet with us</h1> <br>
414398
</div>
415399
</div>
416400
<script>
417-
(function (d, s, id) {
418-
var js, fjs = d.getElementsByTagName(s)[0];
419-
if (d.getElementById(id)) return;
420-
js = d.createElement(s);
421-
js.id = id;
422-
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
423-
fjs.parentNode.insertBefore(js, fjs);
424-
}(document, 'script', 'facebook-jssdk'));
425401
// set active nav
426402
$('.nav li').removeClass('active');
427403
$('#home').addClass('active');
@@ -438,7 +414,6 @@ <h1>Meet with us</h1> <br>
438414
================================================== -->
439415
<!-- Placed at the end of the document so the pages load faster -->
440416
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
441-
<script src="js/jquery-1.8.3.min.js"></script>
442417
<script src="js/bootstrap.js"></script>
443418
<script type="text/javascript" src="js/jquery.parss.uncompressed.js"></script>
444419

@@ -459,14 +434,32 @@ <h1>Meet with us</h1> <br>
459434
_gaq.push(['_setAccount', 'UA-29668455-1']);
460435
_gaq.push(['_trackPageview']);
461436

462-
(function () {
437+
function loadGoogle() {
463438
var ga = document.createElement('script');
464439
ga.type = 'text/javascript';
465440
ga.async = true;
466-
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
441+
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') +
442+
'.google-analytics.com/ga.js';
467443
var s = document.getElementsByTagName('script')[0];
468444
s.parentNode.insertBefore(ga, s);
469-
})();
445+
}
446+
447+
function loadFacebook() {
448+
var js, fjs = document.getElementsByTagName('script')[0];
449+
if (document.getElementById('facebook-jssdk')) return;
450+
js = document.createElement('script');
451+
js.id = 'facebook-jssdk';
452+
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
453+
fjs.parentNode.insertBefore(js, fjs);
454+
}
455+
456+
$(document).on('pjax:complete', function() {
457+
// do stuff when pjax finished
458+
alert('pjaxed that page!');
459+
loadGoogle();
460+
loadFacebook();
461+
})
462+
470463
</script>
471464
</body>
472465

0 commit comments

Comments
 (0)