Team:HSAAHNU Anhui/inject.js

From 2014hs.igem.org

(Difference between revisions)
(do you hate Internet Explorer? let's kill Windows and embrace the beauty of Unix.)
(i have no idea of why this doesn't work in IE)
Line 51: Line 51:
   //boycott Internet Explorer with me, please.
   //boycott Internet Explorer with me, please.
   var main = document.getElementById('main');
   var main = document.getElementById('main');
 +
  console.log(main);
 +
  console.log(main.innerHTML);
   document.body.innerHTML = main.innerHTML;
   document.body.innerHTML = main.innerHTML;
}
}

Revision as of 02:51, 10 June 2014

/*

* Basically this script will do the following thing:
* Remove old styles.
* Remove old script tags.
* Apply common stylesheets. (Bootstrap, NProgress)
* Apply common scripts. (jQuery, Bootstrap, NProgress)
* Update jQuery.
* move inner HTML of main tag to body tag for clarity.
* Clean up script tags in head tag for debugging purpose.
* Set up PJAX for better performance.
* Complete page specific jobs.
*/

var commonStylesheets = [

 'http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css',
 'http://ricostacruz.com/nprogress/nprogress.css',
 '/Team:HSAAHNU_Anhui/normalize.css?action=raw&ctype=text/css'

];

var commonScripts = [

 'http://code.jquery.com/jquery-1.11.1.min.js',
 'http://ricostacruz.com/nprogress/nprogress.js'

];

function cleanup () {

 function removeNodesFromHead (tag, constriant) {
   constriant = constriant ? constriant
                           : function () { return true; };
   var nodes = document.head.getElementsByTagName(tag);
   var failedCounter = 0;
   var iterator = 0;
   while (nodes.length !== failedCounter) {
     var node = nodes[iterator];
     if (constriant(node))
       document.head.removeChild(node);
     else {
       failedCounter ++;
       iterator ++;
     }
   }
 };
 removeNodesFromHead('style');
 removeNodesFromHead('script');
 removeNodesFromHead('link', function (node) {
   var isStylesheet = node.rel === 'stylesheet';
   return isStylesheet;
 });
 //since Internet Explorer doesn't support main tag yet.
 //boycott Internet Explorer with me, please.
 var main = document.getElementById('main');
 console.log(main);
 console.log(main.innerHTML);
 document.body.innerHTML = main.innerHTML;

}

function applyCommonResources () {

 function applyResources (factory, urls) {
   urls.forEach(function (url) {
     var node = factory(url);
     document.head.appendChild(node);
   });
 };
 applyResources(function (url) {
   var node = document.createElement('link');
   node.href = url;
   node.rel = 'stylesheet';
   return node;
 }, commonStylesheets);
 applyResources(function (url) {
   var node = document.createElement('script');
   node.src = url;
   return node;
 }, commonScripts);
 var meta = document.createElement('meta');
 meta.name = 'viewport';
 meta.content = 'width=device-width, initial-scale=1';
 document.head.appendChild(meta);

}

var crucialComponentLoadingTime = 0; function waitForComponents () {

 //16 seconds is long enough.
 var isLoadFailed = crucialComponentLoadingTime >= 32;
 if (isLoadFailed) {
   alert('One component of this page failed to load. Please refresh!');
   return;
 }
 var isJQueryUpdated = window.hasOwnProperty('jQuery') &&
                       $.fn.jquery === '1.11.1';
 var isNProgressLoaded = window.hasOwnProperty('NProgress');
 if (isJQueryUpdated && isNProgressLoaded) {
   alert('done');
   completePageSpecificJobs();
 }
 else {
   crucialComponentLoadingTime ++;
   setTimeout(waitForComponents, 500);
 }

}

document.addEventListener('DOMContentLoaded', function () {

 cleanup();
 applyCommonResources();
 waitForComponents();

});

function fetchData (path, callback) {

 var isPathString = typeof path === 'string';
 if (!isPathString) {
   var team = '/Team:HSAAHNU_Anhui';
   var query = '?action=raw&ctype=text/css';
   path = team + path.href + query;
 }
 $.ajax(path).done(function (data) {
   callback(null, data);
 });

}

function loadNewPage (path) {

 NProgress.start();
 fetchData(path, function (err, data) {
   data = data.split()[1];
   data = data.split()[0];
   document.body.innerHTML = data;
   completePageSpecificJobs();
   NProgress.done();
 });

}

function startsWith (lhs, rhs) {

 return lhs.substr(0, rhs.length) === rhs;

}

function analyzeAnchor (href) {

 var basePath = 'https://2014hs.igem.org/Team:HSAAHNU_Anhui';
 var isOutsideLink = !startsWith(href, basePath);
 if (isOutsideLink)
   return false;
 var current = document.URL.substr(basePath.length).split('#');
 var next = href.substr(basePath.length).split('#');
 var isSamePage = current[0] === next[0];
 if (isSamePage)
   return false;
 return {
   href: next[0],
   anchor: next[1],
 };

}


var PJAXEnabledOnce = false; function setupPJAXListener () {

 if (history === null) {
   alert('sorry but your browser does not support history api.');
   return;
 }
 alert('it works.');
 function anchorClickListener (event) {
   var node = event.target;
   var path = analyzeAnchor(node.href);
   if (path === false)
     return true;
   history.pushState(null, null, node.href);
   loadNewPage(path);
   if (!PJAXEnabledOnce) {
     PJAXEnabledOnce = true;
     window.addEventListener('popstate', goBackListener);
   }
   return false;
 }
 function goBackListener (event) {
   console.log('Go back to last path:', document.URL);
   loadNewPage(document.URL);
 }
 $('a').click(anchorClickListener);

}

function completePageSpecificJobs () {

 setupPJAXListener();
 var metadata = $('#metadata')[0].innerText;
 metadata = JSON.parse(metadata);
 metadata.title ? $('title')[0].innerText = metadata.title : null;

}