Team:HSAAHNU Anhui/inject.js

From 2014hs.igem.org

(Difference between revisions)
(remove listener for out-this-site anchor)
(using foundation 5)
 
(42 intermediate revisions not shown)
Line 1: Line 1:
/*
/*
-
  * Basically this script will do the following thing:
+
  * By Minsheng Liu from HSAAHNU_Anhui.
-
* Remove old styles.
+
  * Released under MIT License.
-
  * Apply common stylesheets.
+
-
* 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.
+
-
* Use PJAX.complete to set up page specific things.
+
  */
  */
-
function removeOldStyles () {
+
function cleanup () {
-
   function removeStyleNodes () {
+
   removeNodesFromHead('style');
-
    var styleNodes = document.head.getElementsByTagName('style');
+
  removeNodesFromHead('script');
-
    while (styleNodes.length !== 0) {
+
  removeNodesFromHead('link', function (node) {
-
      document.head.removeChild(styleNodes[0]);
+
    var isStylesheet = node.rel === 'stylesheet';
-
     }
+
     return isStylesheet;
-
   }
+
   });
-
   function removelinkStylesheetNodes () {
+
   document.body.innerHTML = '<h1>Loading...</h1>';
-
    var linkNodes = document.head.getElementsByTagName('link');
+
}
-
     var nonStylesheetLinksCounter = 0;
+
 
-
     var iter = 0;
+
function loadResources () {
-
    while (linkNodes.length !== nonStylesheetLinksCounter) {
+
  generateResourceNodes(basicStyles, 'link', function (node, url) {
-
      var node = linkNodes[iter];
+
     node.href = url;
-
      if (node['rel'] === 'stylesheet')
+
     node.rel = 'stylesheet';
-
        document.head.removeChild(node);
+
  });
-
      else {
+
  generateResourceNodes(basicScripts, 'script', function (node, url) {
-
        nonStylesheetLinksCounter ++;
+
    node.src = url;
-
        iter ++;
+
  });
-
      }
+
 
-
     }
+
  enableMobileDeviceSupport();
 +
  callHTML5Shiv();
 +
}
 +
 
 +
var scriptsLoadingTime = 0;
 +
function waitForScripts () {
 +
  var isTimeout = scriptsLoadingTime > 160;
 +
  if (isTimeout) {
 +
     alert('Loading script timeout. Refresh or check your Internet connection.');
 +
    return;
   }
   }
-
   removeStyleNodes();
+
   var isJQueryUpdated = window.hasOwnProperty('jQuery') &&
-
   removelinkStylesheetNodes();
+
                        $.fn.jquery === '1.11.1';
 +
   var isNProgressLoaded = window.hasOwnProperty('NProgress');
 +
 
 +
  if (isJQueryUpdated && isNProgressLoaded)
 +
    loadPage(parseURL(document.URL));
 +
  else {
 +
    scriptsLoadingTime ++;
 +
    setTimeout(waitForScripts, 100);
 +
  }
}
}
-
function applyCommonStyles () {
+
function loadPage (path) {
-
   var stylesheetURLs = [
+
   NProgress.start();
-
    'http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css',
+
  path.fetch(function (err, data) {
-
    'http://ricostacruz.com/nprogress/nprogress.css',
+
     if (err) {
-
     '/Team:HSAAHNU_Anhui/normalize.css?action=raw&ctype=text/css'
+
      alert('Error happens when loading page!');
-
  ];
+
      return;
 +
    }
-
  stylesheetURLs.forEach(function (url) {
+
     data = selectCore(PJAXSplitter.start, PJAXSplitter.end, data);
-
     var tag = document.createElement('link');
+
     document.body.innerHTML = data;
-
     tag.href = url;
+
     doPageSpecificJobs();
-
     tag.rel = 'stylesheet';
+
 
-
     document.head.appendChild(tag);
+
     NProgress.done();
   });
   });
}
}
-
function updateJQuery () {
+
function setupPJAXListener () {
-
   var tag = document.createElement('script');
+
   if (history === null) {
-
  tag.src = 'http://code.jquery.com/jquery-1.11.1.min.js';
+
    alert('sorry but your browser does not support history api.');
-
   document.head.appendChild(tag);
+
    return;
 +
   }
 +
 
 +
  $('a').click(goForwardListener);
}
}
-
function relocateMainDocument () {
+
function applyMetadata (metadata) {
-
   var main = document.body.getElementsByTagName('main')[0];
+
   metadata = JSON.parse(metadata);
-
   document.body.innerHTML = main.innerHTML;
+
 
 +
   metadata.title ? document.title = metadata.title : null;
}
}
-
var JQueryLoadingTime = 0;
+
function doPageSpecificJobs () {
-
function waitForJQueryToBeUpdated () {
+
   setupPJAXListener();
-
   //16 seconds is long enough.
+
   applyMetadata(document.getElementById('metadata').innerText);
-
  var isLoadFailed = JQueryLoadingTime >= 32;
+
}
-
   if (isLoadFailed)
+
-
    alert('One component of this page failed to load. Please refresh!');
+
-
   var isJQueryUpdated = $.fn.jquery === '1.11.1';
+
//helper functions
-
   if (isJQueryUpdated)
+
function removeNodesFromHead (tag, constriant) {
-
     resumeInitAfterJQueryUpdated();
+
  constriant = constriant ? constriant
-
  else {
+
                          : function () { return true; };
-
    JQueryLoadingTime ++;
+
   var nodes = document.head.getElementsByTagName(tag);
-
    setTimeout(waitForJQueryToBeUpdated, 500);
+
  var failedCounter = 0;
 +
  var iterator = 0;
 +
   while (nodes.length !== failedCounter) {
 +
     var node = nodes[iterator];
 +
    if (constriant(node))
 +
      document.head.removeChild(node);
 +
    else {
 +
      failedCounter ++;
 +
      iterator ++;
 +
    }
   }
   }
}
}
-
$(document).ready(function () {
+
function generateResourceNodes (urls, tagname, process) {
-
  removeOldStyles();
+
  urls.forEach(function (url) {
-
  applyCommonStyles();
+
    var node = document.createElement(tagname);
-
  updateJQuery();
+
    process(node, url);
-
   relocateMainDocument();
+
    document.head.appendChild(node);
-
  waitForJQueryToBeUpdated();
+
   });
-
});
+
};
-
function cleanUpScriptTags () {
+
function enableMobileDeviceSupport () {
-
   var scriptNodes = document.head.getElementsByTagName('script');
+
   var meta = document.createElement('meta');
-
   while (scriptNodes.length !== 0) {
+
   meta.name = 'viewport';
-
    document.head.removeChild(scriptNodes[0]);
+
  meta.content = 'width=device-width, initial-scale=1';
 +
  document.head.appendChild(meta);
 +
}
 +
 
 +
var html5shiv = '/*@preserve HTML5 Shiv 3.7.2 | @afarkas @jdalton @jon_neal @rem | MIT/GPL2 Licensed*/\n!function(a,b){function c(a,b){var c=a.createElement("p"),d=a.getElementsByTagName("head")[0]||a.documentElement;return c.innerHTML="x<style>"+b+"</style>",d.insertBefore(c.lastChild,d.firstChild)}function d(){var a=t.elements;return"string"==typeof a?a.split(" "):a}function e(a,b){var c=t.elements;"string"!=typeof c&&(c=c.join(" ")),"string"!=typeof a&&(a=a.join(" ")),t.elements=c+" "+a,j(b)}function f(a){var b=s[a[q]];return b||(b={},r++,a[q]=r,s[r]=b),b}function g(a,c,d){if(c||(c=b),l)return c.createElement(a);d||(d=f(c));var e;return e=d.cache[a]?d.cache[a].cloneNode():p.test(a)?(d.cache[a]=d.createElem(a)).cloneNode():d.createElem(a),!e.canHaveChildren||o.test(a)||e.tagUrn?e:d.frag.appendChild(e)}function h(a,c){if(a||(a=b),l)return a.createDocumentFragment();c=c||f(a);for(var e=c.frag.cloneNode(),g=0,h=d(),i=h.length;i>g;g++)e.createElement(h[g]);return e}function i(a,b){b.cache||(b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag()),a.createElement=function(c){return t.shivMethods?g(c,a,b):b.createElem(c)},a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+d().join().replace(/[\\w\\-:]+/g,function(a){return b.createElem(a),b.frag.createElement(a),\'c("\'+a+\'")\'})+");return n}")(t,b.frag)}function j(a){a||(a=b);var d=f(a);return!t.shivCSS||k||d.hasCSS||(d.hasCSS=!!c(a,"article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}mark{background:#FF0;color:#000}template{display:none}")),l||i(a,d),a}var k,l,m="3.7.2",n=a.html5||{},o=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,p=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,q="_html5shiv",r=0,s={};!function(){try{var a=b.createElement("a");a.innerHTML="<xyz></xyz>",k="hidden"in a,l=1==a.childNodes.length||function(){b.createElement("a");var a=b.createDocumentFragment();return"undefined"==typeof a.cloneNode||"undefined"==typeof a.createDocumentFragment||"undefined"==typeof a.createElement}()}catch(c){k=!0,l=!0}}();var t={elements:n.elements||"abbr article aside audio bdi canvas data datalist details dialog figcaption figure footer header hgroup main mark meter nav output picture progress section summary template time video",version:m,shivCSS:n.shivCSS!==!1,supportsUnknownElements:l,shivMethods:n.shivMethods!==!1,type:"default",shivDocument:j,createElement:g,createDocumentFragment:h,addElements:e};a.html5=t,j(b)}(this,document);\n';
 +
function callHTML5Shiv () {
 +
  eval(html5shiv);
 +
}
 +
 
 +
var pjaxCalledOnce = false;
 +
function goForwardListener (event) {
 +
  var node = event.target;
 +
  var url = parseURL(node.href);
 +
  if (url === null)
 +
    return true;
 +
 
 +
  history.pushState(null, null, node.href);
 +
  loadPage(url);
 +
 
 +
  if (!pjaxCalledOnce) {
 +
    pjaxCalledOnce = true;
 +
    window.addEventListener('popstate', goBackListener);
   }
   }
 +
  return false;
}
}
-
function loadNewPage (href) {
+
function goBackListener (event) {
-
   alert(href);
+
   var url = parseURL(document.URL);
 +
  if (url === null)
 +
    return;
 +
  loadPage(parseURL(document.URL));
}
}
-
function setupPJAXListener () {
+
function checkURLForPJAX (url) {
-
   $("a").click(function (event) {
+
   var isOutsideLink = !startsWith(href, basePath);
-
    var node = event.target;
+
  if (isOutsideLink)
-
    if (node.href === null)
+
    return;
-
      return true;
+
-
    var isInlineAnchor = node.href[0] === '#';
+
  var current = parseURL(document.URL);
-
    var isOutsiteAnchor = node.href[0] !== '/';
+
  var next = parseURL(url);
-
    if (isInlineAnchor || isOutsiteAnchor)
+
-
      return true;
+
-
    loadNewPage(node.href);
+
  var isSamePage = current.path === next.path;
-
     return false;
+
  if (isSamePage)
-
   });
+
     return;
 +
   else
 +
    return next;
}
}
-
function resumeInitAfterJQueryUpdated () {
+
function parseURL (url) {
-
   cleanUpScriptTags();
+
   var info = url.substr(basePath.length).split('#');
-
   setupPJAXListener();
+
   return {
 +
    path: info[0],
 +
    anchor: info[1],
 +
    fetch: function (callback) {
 +
      var url = basePath + this.path + mediaWikiRawQuery;
 +
      $.ajax(url).done(function (data) { callback(null, data); });
 +
    }
 +
  };
}
}
 +
 +
//utility functions
 +
function startsWith (lhs, rhs) {
 +
  var isStartWith = lhs.substr(0, rhs.length) === rhs;
 +
  return isStartWith;
 +
}
 +
 +
function selectCore (from, to, str) {
 +
  return str.split(from)[1].split(to)[0];
 +
}
 +
 +
//magic "numbers"
 +
var basicStyles = [
 +
  'http://cdnjs.cloudflare.com/ajax/libs/foundation/5.2.3/css/foundation.min.css',
 +
  'http://ricostacruz.com/nprogress/nprogress.css',
 +
  '/Team:HSAAHNU_Anhui/normalize.css?action=raw&ctype=text/css'
 +
];
 +
 +
var basicScripts = [
 +
  'http://code.jquery.com/jquery-1.11.1.min.js',
 +
  'http://ricostacruz.com/nprogress/nprogress.js'
 +
];
 +
 +
var PJAXSplitter = {
 +
  start: '<!-- PJAX Content Start -->',
 +
  end: '<!-- PJAX Content Start -->'
 +
};
 +
 +
var basePath = 'https://2014hs.igem.org/Team:HSAAHNU_Anhui';
 +
var mediaWikiRawQuery = '?action=raw';
 +
 +
document.addEventListener('DOMContentLoaded', function () {
 +
  cleanup();
 +
  loadResources();
 +
  waitForScripts();
 +
});

Latest revision as of 08:25, 15 June 2014

/*

* By Minsheng Liu from HSAAHNU_Anhui.
* Released under MIT License.
*/

function cleanup () {

 removeNodesFromHead('style');
 removeNodesFromHead('script');
 removeNodesFromHead('link', function (node) {
   var isStylesheet = node.rel === 'stylesheet';
   return isStylesheet;
 });
document.body.innerHTML = '

Loading...

';

}

function loadResources () {

 generateResourceNodes(basicStyles, 'link', function (node, url) {
   node.href = url;
   node.rel = 'stylesheet';
 });
 generateResourceNodes(basicScripts, 'script', function (node, url) {
   node.src = url;
 });
 enableMobileDeviceSupport();
 callHTML5Shiv();

}

var scriptsLoadingTime = 0; function waitForScripts () {

 var isTimeout = scriptsLoadingTime > 160;
 if (isTimeout) {
   alert('Loading script timeout. Refresh or check your Internet connection.');
   return;
 }
 var isJQueryUpdated = window.hasOwnProperty('jQuery') &&
                       $.fn.jquery === '1.11.1';
 var isNProgressLoaded = window.hasOwnProperty('NProgress');
 if (isJQueryUpdated && isNProgressLoaded)
   loadPage(parseURL(document.URL));
 else {
   scriptsLoadingTime ++;
   setTimeout(waitForScripts, 100);
 }

}

function loadPage (path) {

 NProgress.start();
 path.fetch(function (err, data) {
   if (err) {
     alert('Error happens when loading page!');
     return;
   }
   data = selectCore(PJAXSplitter.start, PJAXSplitter.end, data);
   document.body.innerHTML = data;
   doPageSpecificJobs();
   NProgress.done();
 });

}

function setupPJAXListener () {

 if (history === null) {
   alert('sorry but your browser does not support history api.');
   return;
 }
 $('a').click(goForwardListener);

}

function applyMetadata (metadata) {

 metadata = JSON.parse(metadata);
 metadata.title ? document.title = metadata.title : null;

}

function doPageSpecificJobs () {

 setupPJAXListener();
 applyMetadata(document.getElementById('metadata').innerText);

}

//helper functions 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 ++;
   }
 }

}

function generateResourceNodes (urls, tagname, process) {

 urls.forEach(function (url) {
   var node = document.createElement(tagname);
   process(node, url);
   document.head.appendChild(node);
 });

};

function enableMobileDeviceSupport () {

 var meta = document.createElement('meta');
 meta.name = 'viewport';
 meta.content = 'width=device-width, initial-scale=1';
 document.head.appendChild(meta);

}

var html5shiv = '/*@preserve HTML5 Shiv 3.7.2 | @afarkas @jdalton @jon_neal @rem | MIT/GPL2 Licensed*/\n!function(a,b){function c(a,b){var c=a.createElement("p"),d=a.getElementsByTagName("head")[0]||a.documentElement;return c.innerHTML="x<style>"+b+"</style>",d.insertBefore(c.lastChild,d.firstChild)}function d(){var a=t.elements;return"string"==typeof a?a.split(" "):a}function e(a,b){var c=t.elements;"string"!=typeof c&&(c=c.join(" ")),"string"!=typeof a&&(a=a.join(" ")),t.elements=c+" "+a,j(b)}function f(a){var b=s[a[q]];return b||(b={},r++,a[q]=r,s[r]=b),b}function g(a,c,d){if(c||(c=b),l)return c.createElement(a);d||(d=f(c));var e;return e=d.cache[a]?d.cache[a].cloneNode():p.test(a)?(d.cache[a]=d.createElem(a)).cloneNode():d.createElem(a),!e.canHaveChildren||o.test(a)||e.tagUrn?e:d.frag.appendChild(e)}function h(a,c){if(a||(a=b),l)return a.createDocumentFragment();c=c||f(a);for(var e=c.frag.cloneNode(),g=0,h=d(),i=h.length;i>g;g++)e.createElement(h[g]);return e}function i(a,b){b.cache||(b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag()),a.createElement=function(c){return t.shivMethods?g(c,a,b):b.createElem(c)},a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+d().join().replace(/[\\w\\-:]+/g,function(a){return b.createElem(a),b.frag.createElement(a),\'c("\'+a+\'")\'})+");return n}")(t,b.frag)}function j(a){a||(a=b);var d=f(a);return!t.shivCSS||k||d.hasCSS||(d.hasCSS=!!c(a,"article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}mark{background:#FF0;color:#000}template{display:none}")),l||i(a,d),a}var k,l,m="3.7.2",n=a.html5||{},o=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,p=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,q="_html5shiv",r=0,s={};!function(){try{var a=b.createElement("a");a.innerHTML="<xyz></xyz>",k="hidden"in a,l=1==a.childNodes.length||function(){b.createElement("a");var a=b.createDocumentFragment();return"undefined"==typeof a.cloneNode||"undefined"==typeof a.createDocumentFragment||"undefined"==typeof a.createElement}()}catch(c){k=!0,l=!0}}();var t={elements:n.elements||"abbr article aside audio bdi canvas data datalist details dialog figcaption figure footer header hgroup main mark meter nav output picture progress section summary template time video",version:m,shivCSS:n.shivCSS!==!1,supportsUnknownElements:l,shivMethods:n.shivMethods!==!1,type:"default",shivDocument:j,createElement:g,createDocumentFragment:h,addElements:e};a.html5=t,j(b)}(this,document);\n'; function callHTML5Shiv () {

 eval(html5shiv);

}

var pjaxCalledOnce = false; function goForwardListener (event) {

 var node = event.target;
 var url = parseURL(node.href);
 if (url === null)
   return true;
 history.pushState(null, null, node.href);
 loadPage(url);
 if (!pjaxCalledOnce) {
   pjaxCalledOnce = true;
   window.addEventListener('popstate', goBackListener);
 }
 return false;

}

function goBackListener (event) {

 var url = parseURL(document.URL);
 if (url === null)
   return;
 loadPage(parseURL(document.URL));

}

function checkURLForPJAX (url) {

 var isOutsideLink = !startsWith(href, basePath);
 if (isOutsideLink)
   return;
 var current = parseURL(document.URL);
 var next = parseURL(url);
 var isSamePage = current.path === next.path;
 if (isSamePage)
   return;
 else
   return next;

}

function parseURL (url) {

 var info = url.substr(basePath.length).split('#');
 return {
   path: info[0],
   anchor: info[1],
   fetch: function (callback) {
     var url = basePath + this.path + mediaWikiRawQuery;
     $.ajax(url).done(function (data) { callback(null, data); });
   }
 };

}

//utility functions function startsWith (lhs, rhs) {

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

}

function selectCore (from, to, str) {

 return str.split(from)[1].split(to)[0];

}

//magic "numbers" var basicStyles = [

 'http://cdnjs.cloudflare.com/ajax/libs/foundation/5.2.3/css/foundation.min.css',
 'http://ricostacruz.com/nprogress/nprogress.css',
 '/Team:HSAAHNU_Anhui/normalize.css?action=raw&ctype=text/css'

];

var basicScripts = [

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

];

var PJAXSplitter = {

 start: ,
 end: 

};

var basePath = 'https://2014hs.igem.org/Team:HSAAHNU_Anhui'; var mediaWikiRawQuery = '?action=raw';

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

 cleanup();
 loadResources();
 waitForScripts();

});