Packages

phoenix_live_reload

1.1.2
1.6.2 1.6.1 1.6.0 1.5.3 1.5.2 1.5.1 1.5.0 1.4.1 1.4.0 1.3.3 1.3.2 1.3.1 1.3.0 1.2.4 1.2.3 retired 1.2.2 1.2.1 1.2.0 1.2.0-rc.0 1.1.7 1.1.6 1.1.5 1.1.4 1.1.3 1.1.2 1.1.1 1.1.0 1.0.8 1.0.7 1.0.6 1.0.5 1.0.4 1.0.3 1.0.2 1.0.1 1.0.0 0.6.0 0.5.2 0.5.1 0.5.0 0.4.3 0.4.2 0.4.1 0.4.0 0.3.3 0.3.2 0.3.1 0.3.0 0.2.0 0.1.0

Provides live-reload functionality for Phoenix

HexDocs

Current section

Files

Jump to
Readme
50 Versions
2 Dependencies
Dependants
Files
Activity
phoenix_live_reload priv static phoenix_live_reload.js
Raw

priv/static/phoenix_live_reload.js 

var buildFreshUrl = function(link){

  var date    = Math.round(Date.now() / 1000).toString();

  var url     = link.href.replace(/(\&|\\?)vsn=\d*/, '');

  var newLink = document.createElement('link');

  var onComplete = function() { link.remove() }



  newLink.onerror = onComplete

  newLink.onload  = onComplete

  link.setAttribute('data-pending-removal', '');

  newLink.setAttribute('rel', 'stylesheet');

  newLink.setAttribute('type', 'text/css');

  newLink.setAttribute('href', url + (url.indexOf('?') >= 0 ? '&' : '?') +'vsn=' + date);

  link.parentNode.insertBefore(newLink, link.nextSibling);



  return newLink;

};



var repaint = function(){

  var browser = navigator.userAgent.toLowerCase();

  if(browser.indexOf('chrome') > -1){

    setTimeout(function(){ document.body.offsetHeight; }, 25);

  }

};



var cssStrategy = function(){

  var reloadableLinkElements = window.top.document.querySelectorAll(

    'link[rel=stylesheet]:not([data-no-reload]):not([data-pending-removal])'

  );



  [].slice

    .call(reloadableLinkElements)

    .filter(function(link) { return link.href })

    .forEach(function(link) { buildFreshUrl(link) });



  repaint();

};



var pageStrategy = function(chan){

  chan.off('assets_change');

  window.top.location.reload();

};



var reloadStrategies = {

  css: cssStrategy,

  page: pageStrategy

};



socket.connect();

var chan = socket.channel('phoenix:live_reload', {})

chan.on('assets_change', function(msg) {

  var reloadStrategy = reloadStrategies[msg.asset_type] || reloadStrategies.page;

  reloadStrategy(chan);

});

chan.join();