use a URL hash to setup and refresh CSS, for use when live reload will not do and just need the css to get updated.
#CSS Refresher
##How to
Save as bookmarklet
javascript:(function(){var a=document.createElement("script");a.setAttribute("src","https://rawgit.com/drifterz28/0d459bb1286df63130f1/raw/f9c20f507bf17aaa456060a77ae51770ee54dcf2/css-refresher.js");document.body.appendChild(a);}());
when on a site that you need to refresh the page click on bookmark, do start|10|styles.css will update styles.css every 10 seconds. stop will stop the refreshing and refresh will do a single refresh.
(function(){
var CSSrefresher, hash, interval;
var styles = document.querySelectorAll('link[rel="stylesheet"]');
var ev = {
start: function () {
console.log('start refreshing every ' + interval/1000 + ' seconds');
clearInterval(CSSrefresher);
CSSrefresher = setInterval(ev.refresh, interval);
},
refresh: function () {
console.log('refreshing');
for (var i = 0; i < styles.length; i++) {
var style = styles[i].href.split('?')[0];
if (!hash[2] || styles[i].href.search(hash[2]) !== -1) {
styles[i].href= style + '?' + new Date().getTime();
}
}
},
stop: function () {
console.log('stoped');
clearInterval(CSSrefresher);
},
help: function () {
console.log('Format: #action|time|css_script');
console.log('Actions: Start, stop, refresh');
console.log('Time: based in seconds');
console.log('CSS script: the name of the style sheet baase off of js .search()');
}
};
console.log('started');
window.addEventListener("hashchange", function (){
console.log('started');
hash = location.hash.slice(1).split('|');
interval = (hash && hash[1])? parseFloat(hash[1]) * 1000 : 100000;
if(ev[hash[0]]){
console.log(hash[0]);
ev[hash[0]]();
}else{
ev.help();
}
},false);
})();