From f4c4c48f9462b4aa56c87782d1fb4411c81bb9f1 Mon Sep 17 00:00:00 2001 From: Hugo Bessa Date: Mon, 10 Feb 2014 16:15:35 -0200 Subject: [PATCH 1/6] Scroll sync by scroll-top, not proportional. Fixes #68 --- lib/client/browser-sync-client.js | 26 ++++++++++++++++++++------ lib/client/browser-sync-client.min.js | 2 +- 2 files changed, 21 insertions(+), 7 deletions(-) diff --git a/lib/client/browser-sync-client.js b/lib/client/browser-sync-client.js index c760c59e4..e34ff4156 100644 --- a/lib/client/browser-sync-client.js +++ b/lib/client/browser-sync-client.js @@ -154,12 +154,13 @@ var transformedElem; - if (data.url || !scope.options.injectChanges) { + if (data.url) { actions.reloadBrowser(true); } if (data.assetFileName && data.fileExtension) { + var domData = this.getElems(data.fileExtension); var elems = this.getMatches(domData.elems, data.assetFileName, domData.attr); @@ -550,9 +551,12 @@ listeners: { scroll: function () { - var url; + var pos, url; - var scrollTop = ghost.getScrollTopPercentage(); // Get % of y axis of scroll + var scrollTop = { + raw: ghost.getScrollTop(), // Get px of y axis of scroll + proportional: ghost.getScrollTopPercentage() // Get % of y axis of scroll + }; var newScroll = new Date().getTime(); var scrollThrottle = 0; @@ -571,6 +575,11 @@ if (scope.ghostMode.enabled) { scope.ghostMode.lastScroll = newScroll; + if (scope.options.scrollProportionally) { + pos = scrollTop.proportional; + } else { + pos = scrollTop.raw; + } url = window.location.host + window.location.pathname; ghost.emitEvent("scroll", { @@ -662,7 +671,6 @@ } socket.on("connection", function (options) { - ghost.emitEvent("browser:add", {width: 200, height: 100}); browserSync.processOptions(scope, options, ghost.utils, ghost.listeners); }); @@ -692,9 +700,15 @@ socket.on("scroll:update", function (data) { if (data.url === window.location.host + window.location.pathname) { - var scrollSpace = ghost.getScrollSpace(); scope.ghostMode.enabled = false; - window.scrollTo(0, scrollSpace[1] * data.position); // proportional scroll + console.log([data, scope]); + if (scope.options.scrollProportionally) { + var scrollSpace = ghost.getScrollSpace(); + window.scrollTo(0, scrollSpace[1] * data.position.proportional); // % of y axis of scroll to px + } else { + window.scrollTo(0, data.position.raw); + } + } }); diff --git a/lib/client/browser-sync-client.min.js b/lib/client/browser-sync-client.min.js index cfa971d2b..15fd4ab53 100644 --- a/lib/client/browser-sync-client.min.js +++ b/lib/client/browser-sync-client.min.js @@ -1 +1 @@ -"use strict";!function(a,b){var c,d={ghostMode:{enabled:!0,cache:{}}},e={tagNames:{css:"link",jpg:"img",jpeg:"img",png:"img",svg:"img",gif:"img",js:"script"},attrs:{link:"href",img:"src",script:"src"}},f=["background-color: black","color: white","padding: 10px","display: none","font-family: sans-serif","position: absolute","z-index: 1000","right: 0px"],g={processOptions:function(a,b,d,e){a.options=b,b.ghostMode&&this.initGhostMode(b.ghostMode,d,e),b.notify&&(c=this.createNotifyElem(f||null))},setOptions:function(a){d&&(d.options=a)},createNotifyElem:function(a){var b=document.createElement("DIV");return b.id="notifyElem",a&&(b.style.cssText=a.join(";")),document.getElementsByTagName("body")[0].appendChild(b),b},notify:function(b,c,d){return c.innerHTML=b,c.style.top=i.getScrollTop()+"px",c.style.display="block",a.setTimeout(function(){c.style.display="none"},d||1e3),c},initGhostMode:function(a,b,c){if(a.clicks&&i.initClickEvents(d,b,c.click),a.scroll&&i.initEvents(d,["scroll"],b,c),a.forms)for(var e=i.getInputs(),f=[[e.texts,"keyup","keyup"],[e.radios,"click","forceChange"],[e.radios,"change","radioChange"],[e.checkboxes,"click","forceChange"],[e.checkboxes,"change","checkboxChange"],["textarea","keyup","keyup"],["select","change","selectChange"],["form","submit","formSubmit"],["form","reset","formReset"]],g=0,h=f.length;h>g;g+=1)i.addBrowserEvents(f[g][0],f[g][1],c[f[g][2]],b)},reloadEvent:function(a,b,d){var e;if((b.url||!a.options.injectChanges)&&d.reloadBrowser(!0),b.assetFileName&&b.fileExtension){var f=this.getElems(b.fileExtension),h=this.getMatches(f.elems,b.assetFileName,f.attr);h.length&&g.notify("Injected: "+b.assetFileName,c);for(var i=0,j=h.length;j>i;i+=1)e=d.swapFile(h[i],f.attr,a)}return e},getElems:function(a){var b=this.getTagName(a),c=this.getAttr(b);return{elems:document.getElementsByTagName(b),attr:c}},getTagName:function(a){return e.tagNames[a]},getAttr:function(a){return e.attrs[a]},getMatches:function(a,b,c){for(var d=[],e=0,f=a.length;f>e;e+=1)-1!==a[e][c].indexOf(b)&&d.push(a[e]);return d}},h={reloadBrowser:function(a){a&&location.reload()},swapFile:function(a,b,c){var d=a[b],e=(new Date).getTime(),f="?rel="+e,g=/^[^\?]+(?=\?)/.exec(d);return g&&(d=g[0]),c&&c.options&&c.options.timestamps===!1&&(f=""),a[b]=d+f,{elem:a,timeStamp:e}}},i={getScrollPosition:function(){var b,c,d=document,e=d.documentElement,f=d.body;return void 0!==a.pageYOffset?[a.pageXOffset,a.pageYOffset]:(b=e.scrollLeft||f.scrollLeft||0,c=e.scrollTop||f.scrollTop||0,[b,c])},getScrollPercentage:function(a,b){var c=b[0]/a[0],d=b[1]/a[1];return[c,d]},getScrollSpace:function(){var a,b,c=document,d=c.documentElement,e=c.body;return a=e.scrollHeight-d.clientWidth,b=e.scrollHeight-d.clientHeight,[a,b]},getScrollTop:function(){return this.getScrollPosition()[1]},getScrollTopPercentage:function(){var a=this.getScrollSpace(),b=this.getScrollPosition();return this.getScrollPercentage(a,b)[1]},setScrollTop:function(b,c){b.enabled=!1,a.scrollTo(0,c)},simulateEvent:function(a,b){var c;document.createEvent?(c=document.createEvent("MouseEvents"),c.initEvent(b,!0,!0),a.dispatchEvent(c)):document.createEventObject&&(c=document.createEventObject(),c.cancelBubble=!0,a.fireEvent("on"+b,c))},checkCache:function(a,b){var c;return a[b]?a[b].elem:(a.called=a.called?a.called+=1:1,(c=document.getElementById(b))?(a[b]={},a[b].elem=c,c):!1)},initClickEvents:function(a,b,c){var d=document.getElementsByTagName("body")[0];this.composeElementEvent(d,b,"click",c)},initEvents:function(a,b,c,d){for(var e,f=0,g=b.length;g>f;f+=1)e=b[f],this.composeWindowEvent(c,e,d[e])},composeWindowEvent:function(b,c,d){a[b.eventListener](b.prefix+c,d,!1)},composeElementEvent:function(a,b,c,d){a[b.eventListener](b.prefix+"click",d,!1)},emitEvent:function(a,c){b&&b.emit&&b.emit(a,c)},addBrowserEvents:function(a,b,c,d){"string"==typeof a&&(a=document.getElementsByTagName(a));for(var e=0,f=a.length;f>e;e+=1)a[e][d.eventListener](d.prefix+b,c,!1)},getHref:function(a,b){var c,d=a.tagName;return c=b&&b.href?b.href:"A"===d?a.href:this.getParentHref(a,5)},getParentHref:function(a,b){for(var c,d=function(a){return"A"===a.parentNode.tagName?a.parentNode.href:a.parentNode},e=a,f=0;b>f;f+=1){if(c=d(e),"string"==typeof c)return c;e=c}return!1},getInputs:function(){for(var a=document.getElementsByTagName("input"),b=[],c=[],d=[],e=["text","email","url","tel","password"],f=0,g=a.length;g>f;f+=1){for(var h=a[f].type,i=0,j=e.length;j>i;i+=1)if(h===e[i]){b.push(a[f]);break}"radio"===a[f].type&&c.push(a[f]),"checkbox"===a[f].type&&d.push(a[f])}return{texts:b,radios:c,checkboxes:d}},listeners:{scroll:function(){var b,c=i.getScrollTopPercentage(),e=(new Date).getTime(),f=0;d.options&&d.options.scrollThrottle&&(f=d.options.scrollThrottle),d.ghostMode.lastScroll||(d.ghostMode.scrollTop=c[0],d.ghostMode.lastScroll=(new Date).getTime()),e>d.ghostMode.lastScroll+f&&d.ghostMode.enabled&&(d.ghostMode.lastScroll=e,b=a.location.host+a.location.pathname,i.emitEvent("scroll",{pos:c,url:b})),d.ghostMode.enabled=!0},click:function(a){if(d.ghostMode.enabled){var b=a.target||a.srcElement,c=b.tagName,e=document.getElementsByTagName(c),f=Array.prototype.indexOf.call(e,b),g={tagName:c,index:f};i.emitEvent("click",g)}else d.ghostMode.enabled=!0},keyup:function(a){var b=a.target||a.srcElement;b.id&&i.emitEvent("input:type",{id:b.id,value:b.value})},forceChange:function(){this.blur(),this.focus()},radioChange:function(a){var b=a.target||a.srcElement;i.emitEvent("input:radio",{id:b.id,value:b.value})},checkboxChange:function(a){var b=a.target||a.srcElement;i.emitEvent("input:checkbox",{id:b.id,checked:b.checked})},selectChange:function(a){var b=a.target||a.srcElement;i.emitEvent("input:select",{id:b.id,value:b.value})},formSubmit:function(a){var b=a.target||a.srcElement;i.emitEvent("form:submit",{id:b.id})},formReset:function(a){var b=a.target||a.srcElement;i.emitEvent("form:reset",{id:b.id})}},utils:{eventListener:a.addEventListener?"addEventListener":"attachEvent",removeEventListener:a.removeEventListener?"removeEventListener":"detachEvent",prefix:a.addEventListener?"":"on"}};a.__karma__&&(a.BrowserSync=g,a.browserSyncActions=h,a.ghost=i,a.scope=d,b.on=function(){}),b.on("connection",function(a){g.processOptions(d,a,i.utils,i.listeners)}),b.on("reload",function(a){a&&g.reloadEvent(d,a,h)}),b.on("click",function(a){var b=document.getElementsByTagName(a.tagName),c=b[a.index];d.ghostMode.enabled=!1,c&&i.simulateEvent(c,"click")}),b.on("location:update",function(b){b.url&&(a.location=b.url)}),b.on("scroll:update",function(b){if(b.url===a.location.host+a.location.pathname){var c=i.getScrollSpace();d.ghostMode.enabled=!1,a.scrollTo(0,c[1]*b.position)}}),b.on("input:update",function(a){d.ghostMode.enabled=!1;var b=i.checkCache(d.ghostMode.cache,a.id);b.value=a.value}),b.on("input:update:radio",function(a){d.ghostMode.enabled=!1;var b=i.checkCache(d.ghostMode.cache,a.id);b.checked=!0}),b.on("input:update:checkbox",function(a){d.ghostMode.enabled=!1;var b=i.checkCache(d.ghostMode.cache,a.id);b.checked=a.checked}),b.on("form:submit",function(a){d.ghostMode.enabled=!1,document.forms[a.id].submit()}),b.on("form:reset",function(a){d.ghostMode.enabled=!1,document.forms[a.id].reset()})}(window,"undefined"==typeof ___socket___?{}:___socket___); \ No newline at end of file +"use strict";!function(a,b){var c,d={ghostMode:{enabled:!0,cache:{}}},e={tagNames:{css:"link",jpg:"img",jpeg:"img",png:"img",svg:"img",gif:"img",js:"script"},attrs:{link:"href",img:"src",script:"src"}},f=["background-color: black","color: white","padding: 10px","display: none","font-family: sans-serif","position: absolute","z-index: 1000","right: 0px"],g={processOptions:function(a,b,d,e){a.options=b,b.ghostMode&&this.initGhostMode(b.ghostMode,d,e),b.notify&&(c=this.createNotifyElem(f||null))},setOptions:function(a){d&&(d.options=a)},createNotifyElem:function(a){var b=document.createElement("DIV");return b.id="notifyElem",a&&(b.style.cssText=a.join(";")),document.getElementsByTagName("body")[0].appendChild(b),b},notify:function(b,c,d){return c.innerHTML=b,c.style.top=i.getScrollTop()+"px",c.style.display="block",a.setTimeout(function(){c.style.display="none"},d||1e3),c},initGhostMode:function(a,b,c){if(a.clicks&&i.initClickEvents(d,b,c.click),a.scroll&&i.initEvents(d,["scroll"],b,c),a.forms)for(var e=i.getInputs(),f=[[e.texts,"keyup","keyup"],[e.radios,"click","forceChange"],[e.radios,"change","radioChange"],[e.checkboxes,"click","forceChange"],[e.checkboxes,"change","checkboxChange"],["textarea","keyup","keyup"],["select","change","selectChange"],["form","submit","formSubmit"],["form","reset","formReset"]],g=0,h=f.length;h>g;g+=1)i.addBrowserEvents(f[g][0],f[g][1],c[f[g][2]],b)},reloadEvent:function(a,b,d){var e;if(b.url&&d.reloadBrowser(!0),b.assetFileName&&b.fileExtension){var f=this.getElems(b.fileExtension),h=this.getMatches(f.elems,b.assetFileName,f.attr);h.length&&g.notify("Injected: "+b.assetFileName,c);for(var i=0,j=h.length;j>i;i+=1)e=d.swapFile(h[i],f.attr,a)}return e},getElems:function(a){var b=this.getTagName(a),c=this.getAttr(b);return{elems:document.getElementsByTagName(b),attr:c}},getTagName:function(a){return e.tagNames[a]},getAttr:function(a){return e.attrs[a]},getMatches:function(a,b,c){for(var d=[],e=0,f=a.length;f>e;e+=1)-1!==a[e][c].indexOf(b)&&d.push(a[e]);return d}},h={reloadBrowser:function(a){a&&location.reload()},swapFile:function(a,b,c){var d=a[b],e=(new Date).getTime(),f="?rel="+e,g=/^[^\?]+(?=\?)/.exec(d);return g&&(d=g[0]),c&&c.options&&c.options.timestamps===!1&&(f=""),a[b]=d+f,{elem:a,timeStamp:e}}},i={getScrollPosition:function(){var b,c,d=document,e=d.documentElement,f=d.body;return void 0!==a.pageYOffset?[a.pageXOffset,a.pageYOffset]:(b=e.scrollLeft||f.scrollLeft||0,c=e.scrollTop||f.scrollTop||0,[b,c])},getScrollPercentage:function(a,b){var c=b[0]/a[0],d=b[1]/a[1];return[c,d]},getScrollSpace:function(){var a,b,c=document,d=c.documentElement,e=c.body;return a=e.scrollHeight-d.clientWidth,b=e.scrollHeight-d.clientHeight,[a,b]},getScrollTop:function(){return this.getScrollPosition()[1]},getScrollTopPercentage:function(){var a=this.getScrollSpace(),b=this.getScrollPosition();return this.getScrollPercentage(a,b)[1]},setScrollTop:function(b,c){b.enabled=!1,a.scrollTo(0,c)},simulateEvent:function(a,b){var c;document.createEvent?(c=document.createEvent("MouseEvents"),c.initEvent(b,!0,!0),a.dispatchEvent(c)):document.createEventObject&&(c=document.createEventObject(),c.cancelBubble=!0,a.fireEvent("on"+b,c))},checkCache:function(a,b){var c;return a[b]?a[b].elem:(a.called=a.called?a.called+=1:1,(c=document.getElementById(b))?(a[b]={},a[b].elem=c,c):!1)},initClickEvents:function(a,b,c){var d=document.getElementsByTagName("body")[0];this.composeElementEvent(d,b,"click",c)},initEvents:function(a,b,c,d){for(var e,f=0,g=b.length;g>f;f+=1)e=b[f],this.composeWindowEvent(c,e,d[e])},composeWindowEvent:function(b,c,d){a[b.eventListener](b.prefix+c,d,!1)},composeElementEvent:function(a,b,c,d){a[b.eventListener](b.prefix+"click",d,!1)},emitEvent:function(a,c){b&&b.emit&&b.emit(a,c)},addBrowserEvents:function(a,b,c,d){"string"==typeof a&&(a=document.getElementsByTagName(a));for(var e=0,f=a.length;f>e;e+=1)a[e][d.eventListener](d.prefix+b,c,!1)},getHref:function(a,b){var c,d=a.tagName;return c=b&&b.href?b.href:"A"===d?a.href:this.getParentHref(a,5)},getParentHref:function(a,b){for(var c,d=function(a){return"A"===a.parentNode.tagName?a.parentNode.href:a.parentNode},e=a,f=0;b>f;f+=1){if(c=d(e),"string"==typeof c)return c;e=c}return!1},getInputs:function(){for(var a=document.getElementsByTagName("input"),b=[],c=[],d=[],e=["text","email","url","tel","password"],f=0,g=a.length;g>f;f+=1){for(var h=a[f].type,i=0,j=e.length;j>i;i+=1)if(h===e[i]){b.push(a[f]);break}"radio"===a[f].type&&c.push(a[f]),"checkbox"===a[f].type&&d.push(a[f])}return{texts:b,radios:c,checkboxes:d}},listeners:{scroll:function(){var b,c,e={raw:i.getScrollTop(),proportional:i.getScrollTopPercentage()},f=(new Date).getTime(),g=0;d.options&&d.options.scrollThrottle&&(g=d.options.scrollThrottle),d.ghostMode.lastScroll||(d.ghostMode.scrollTop=e[0],d.ghostMode.lastScroll=(new Date).getTime()),f>d.ghostMode.lastScroll+g&&d.ghostMode.enabled&&(d.ghostMode.lastScroll=f,b=d.options.scrollProportionally?e.proportional:e.raw,c=a.location.host+a.location.pathname,i.emitEvent("scroll",{pos:e,url:c})),d.ghostMode.enabled=!0},click:function(a){if(d.ghostMode.enabled){var b=a.target||a.srcElement,c=b.tagName,e=document.getElementsByTagName(c),f=Array.prototype.indexOf.call(e,b),g={tagName:c,index:f};i.emitEvent("click",g)}else d.ghostMode.enabled=!0},keyup:function(a){var b=a.target||a.srcElement;b.id&&i.emitEvent("input:type",{id:b.id,value:b.value})},forceChange:function(){this.blur(),this.focus()},radioChange:function(a){var b=a.target||a.srcElement;i.emitEvent("input:radio",{id:b.id,value:b.value})},checkboxChange:function(a){var b=a.target||a.srcElement;i.emitEvent("input:checkbox",{id:b.id,checked:b.checked})},selectChange:function(a){var b=a.target||a.srcElement;i.emitEvent("input:select",{id:b.id,value:b.value})},formSubmit:function(a){var b=a.target||a.srcElement;i.emitEvent("form:submit",{id:b.id})},formReset:function(a){var b=a.target||a.srcElement;i.emitEvent("form:reset",{id:b.id})}},utils:{eventListener:a.addEventListener?"addEventListener":"attachEvent",removeEventListener:a.removeEventListener?"removeEventListener":"detachEvent",prefix:a.addEventListener?"":"on"}};a.__karma__&&(a.BrowserSync=g,a.browserSyncActions=h,a.ghost=i,a.scope=d,b.on=function(){}),b.on("connection",function(a){g.processOptions(d,a,i.utils,i.listeners)}),b.on("reload",function(a){a&&g.reloadEvent(d,a,h)}),b.on("click",function(a){var b=document.getElementsByTagName(a.tagName),c=b[a.index];d.ghostMode.enabled=!1,c&&i.simulateEvent(c,"click")}),b.on("location:update",function(b){b.url&&(a.location=b.url)}),b.on("scroll:update",function(b){if(b.url===a.location.host+a.location.pathname)if(d.ghostMode.enabled=!1,console.log([b,d]),d.options.scrollProportionally){var c=i.getScrollSpace();a.scrollTo(0,c[1]*b.position.proportional)}else a.scrollTo(0,b.position.raw)}),b.on("input:update",function(a){d.ghostMode.enabled=!1;var b=i.checkCache(d.ghostMode.cache,a.id);b.value=a.value}),b.on("input:update:radio",function(a){d.ghostMode.enabled=!1;var b=i.checkCache(d.ghostMode.cache,a.id);b.checked=!0}),b.on("input:update:checkbox",function(a){d.ghostMode.enabled=!1;var b=i.checkCache(d.ghostMode.cache,a.id);b.checked=a.checked}),b.on("form:submit",function(a){d.ghostMode.enabled=!1,document.forms[a.id].submit()}),b.on("form:reset",function(a){d.ghostMode.enabled=!1,document.forms[a.id].reset()})}(window,"undefined"==typeof ___socket___?{}:___socket___); \ No newline at end of file From 0238fe3e8019009091174caabb13de71fa4d1c1c Mon Sep 17 00:00:00 2001 From: Hugo Bessa Date: Mon, 10 Feb 2014 16:17:57 -0200 Subject: [PATCH 2/6] Scroll-top sync (not proportional). Fixes #64 --- lib/client/browser-sync-client.js | 1 - 1 file changed, 1 deletion(-) diff --git a/lib/client/browser-sync-client.js b/lib/client/browser-sync-client.js index e34ff4156..af17a67a1 100644 --- a/lib/client/browser-sync-client.js +++ b/lib/client/browser-sync-client.js @@ -708,7 +708,6 @@ } else { window.scrollTo(0, data.position.raw); } - } }); From fbe949b02a1d3373d4ef3e03a838c251e2068315 Mon Sep 17 00:00:00 2001 From: Hugo Bessa Date: Mon, 10 Feb 2014 16:32:04 -0200 Subject: [PATCH 3/6] Console logging for debug removed --- lib/client/browser-sync-client.js | 1 - lib/client/browser-sync-client.min.js | 2 +- 2 files changed, 1 insertion(+), 2 deletions(-) diff --git a/lib/client/browser-sync-client.js b/lib/client/browser-sync-client.js index af17a67a1..b98f4e5a3 100644 --- a/lib/client/browser-sync-client.js +++ b/lib/client/browser-sync-client.js @@ -701,7 +701,6 @@ socket.on("scroll:update", function (data) { if (data.url === window.location.host + window.location.pathname) { scope.ghostMode.enabled = false; - console.log([data, scope]); if (scope.options.scrollProportionally) { var scrollSpace = ghost.getScrollSpace(); window.scrollTo(0, scrollSpace[1] * data.position.proportional); // % of y axis of scroll to px diff --git a/lib/client/browser-sync-client.min.js b/lib/client/browser-sync-client.min.js index 15fd4ab53..2c4d0452a 100644 --- a/lib/client/browser-sync-client.min.js +++ b/lib/client/browser-sync-client.min.js @@ -1 +1 @@ -"use strict";!function(a,b){var c,d={ghostMode:{enabled:!0,cache:{}}},e={tagNames:{css:"link",jpg:"img",jpeg:"img",png:"img",svg:"img",gif:"img",js:"script"},attrs:{link:"href",img:"src",script:"src"}},f=["background-color: black","color: white","padding: 10px","display: none","font-family: sans-serif","position: absolute","z-index: 1000","right: 0px"],g={processOptions:function(a,b,d,e){a.options=b,b.ghostMode&&this.initGhostMode(b.ghostMode,d,e),b.notify&&(c=this.createNotifyElem(f||null))},setOptions:function(a){d&&(d.options=a)},createNotifyElem:function(a){var b=document.createElement("DIV");return b.id="notifyElem",a&&(b.style.cssText=a.join(";")),document.getElementsByTagName("body")[0].appendChild(b),b},notify:function(b,c,d){return c.innerHTML=b,c.style.top=i.getScrollTop()+"px",c.style.display="block",a.setTimeout(function(){c.style.display="none"},d||1e3),c},initGhostMode:function(a,b,c){if(a.clicks&&i.initClickEvents(d,b,c.click),a.scroll&&i.initEvents(d,["scroll"],b,c),a.forms)for(var e=i.getInputs(),f=[[e.texts,"keyup","keyup"],[e.radios,"click","forceChange"],[e.radios,"change","radioChange"],[e.checkboxes,"click","forceChange"],[e.checkboxes,"change","checkboxChange"],["textarea","keyup","keyup"],["select","change","selectChange"],["form","submit","formSubmit"],["form","reset","formReset"]],g=0,h=f.length;h>g;g+=1)i.addBrowserEvents(f[g][0],f[g][1],c[f[g][2]],b)},reloadEvent:function(a,b,d){var e;if(b.url&&d.reloadBrowser(!0),b.assetFileName&&b.fileExtension){var f=this.getElems(b.fileExtension),h=this.getMatches(f.elems,b.assetFileName,f.attr);h.length&&g.notify("Injected: "+b.assetFileName,c);for(var i=0,j=h.length;j>i;i+=1)e=d.swapFile(h[i],f.attr,a)}return e},getElems:function(a){var b=this.getTagName(a),c=this.getAttr(b);return{elems:document.getElementsByTagName(b),attr:c}},getTagName:function(a){return e.tagNames[a]},getAttr:function(a){return e.attrs[a]},getMatches:function(a,b,c){for(var d=[],e=0,f=a.length;f>e;e+=1)-1!==a[e][c].indexOf(b)&&d.push(a[e]);return d}},h={reloadBrowser:function(a){a&&location.reload()},swapFile:function(a,b,c){var d=a[b],e=(new Date).getTime(),f="?rel="+e,g=/^[^\?]+(?=\?)/.exec(d);return g&&(d=g[0]),c&&c.options&&c.options.timestamps===!1&&(f=""),a[b]=d+f,{elem:a,timeStamp:e}}},i={getScrollPosition:function(){var b,c,d=document,e=d.documentElement,f=d.body;return void 0!==a.pageYOffset?[a.pageXOffset,a.pageYOffset]:(b=e.scrollLeft||f.scrollLeft||0,c=e.scrollTop||f.scrollTop||0,[b,c])},getScrollPercentage:function(a,b){var c=b[0]/a[0],d=b[1]/a[1];return[c,d]},getScrollSpace:function(){var a,b,c=document,d=c.documentElement,e=c.body;return a=e.scrollHeight-d.clientWidth,b=e.scrollHeight-d.clientHeight,[a,b]},getScrollTop:function(){return this.getScrollPosition()[1]},getScrollTopPercentage:function(){var a=this.getScrollSpace(),b=this.getScrollPosition();return this.getScrollPercentage(a,b)[1]},setScrollTop:function(b,c){b.enabled=!1,a.scrollTo(0,c)},simulateEvent:function(a,b){var c;document.createEvent?(c=document.createEvent("MouseEvents"),c.initEvent(b,!0,!0),a.dispatchEvent(c)):document.createEventObject&&(c=document.createEventObject(),c.cancelBubble=!0,a.fireEvent("on"+b,c))},checkCache:function(a,b){var c;return a[b]?a[b].elem:(a.called=a.called?a.called+=1:1,(c=document.getElementById(b))?(a[b]={},a[b].elem=c,c):!1)},initClickEvents:function(a,b,c){var d=document.getElementsByTagName("body")[0];this.composeElementEvent(d,b,"click",c)},initEvents:function(a,b,c,d){for(var e,f=0,g=b.length;g>f;f+=1)e=b[f],this.composeWindowEvent(c,e,d[e])},composeWindowEvent:function(b,c,d){a[b.eventListener](b.prefix+c,d,!1)},composeElementEvent:function(a,b,c,d){a[b.eventListener](b.prefix+"click",d,!1)},emitEvent:function(a,c){b&&b.emit&&b.emit(a,c)},addBrowserEvents:function(a,b,c,d){"string"==typeof a&&(a=document.getElementsByTagName(a));for(var e=0,f=a.length;f>e;e+=1)a[e][d.eventListener](d.prefix+b,c,!1)},getHref:function(a,b){var c,d=a.tagName;return c=b&&b.href?b.href:"A"===d?a.href:this.getParentHref(a,5)},getParentHref:function(a,b){for(var c,d=function(a){return"A"===a.parentNode.tagName?a.parentNode.href:a.parentNode},e=a,f=0;b>f;f+=1){if(c=d(e),"string"==typeof c)return c;e=c}return!1},getInputs:function(){for(var a=document.getElementsByTagName("input"),b=[],c=[],d=[],e=["text","email","url","tel","password"],f=0,g=a.length;g>f;f+=1){for(var h=a[f].type,i=0,j=e.length;j>i;i+=1)if(h===e[i]){b.push(a[f]);break}"radio"===a[f].type&&c.push(a[f]),"checkbox"===a[f].type&&d.push(a[f])}return{texts:b,radios:c,checkboxes:d}},listeners:{scroll:function(){var b,c,e={raw:i.getScrollTop(),proportional:i.getScrollTopPercentage()},f=(new Date).getTime(),g=0;d.options&&d.options.scrollThrottle&&(g=d.options.scrollThrottle),d.ghostMode.lastScroll||(d.ghostMode.scrollTop=e[0],d.ghostMode.lastScroll=(new Date).getTime()),f>d.ghostMode.lastScroll+g&&d.ghostMode.enabled&&(d.ghostMode.lastScroll=f,b=d.options.scrollProportionally?e.proportional:e.raw,c=a.location.host+a.location.pathname,i.emitEvent("scroll",{pos:e,url:c})),d.ghostMode.enabled=!0},click:function(a){if(d.ghostMode.enabled){var b=a.target||a.srcElement,c=b.tagName,e=document.getElementsByTagName(c),f=Array.prototype.indexOf.call(e,b),g={tagName:c,index:f};i.emitEvent("click",g)}else d.ghostMode.enabled=!0},keyup:function(a){var b=a.target||a.srcElement;b.id&&i.emitEvent("input:type",{id:b.id,value:b.value})},forceChange:function(){this.blur(),this.focus()},radioChange:function(a){var b=a.target||a.srcElement;i.emitEvent("input:radio",{id:b.id,value:b.value})},checkboxChange:function(a){var b=a.target||a.srcElement;i.emitEvent("input:checkbox",{id:b.id,checked:b.checked})},selectChange:function(a){var b=a.target||a.srcElement;i.emitEvent("input:select",{id:b.id,value:b.value})},formSubmit:function(a){var b=a.target||a.srcElement;i.emitEvent("form:submit",{id:b.id})},formReset:function(a){var b=a.target||a.srcElement;i.emitEvent("form:reset",{id:b.id})}},utils:{eventListener:a.addEventListener?"addEventListener":"attachEvent",removeEventListener:a.removeEventListener?"removeEventListener":"detachEvent",prefix:a.addEventListener?"":"on"}};a.__karma__&&(a.BrowserSync=g,a.browserSyncActions=h,a.ghost=i,a.scope=d,b.on=function(){}),b.on("connection",function(a){g.processOptions(d,a,i.utils,i.listeners)}),b.on("reload",function(a){a&&g.reloadEvent(d,a,h)}),b.on("click",function(a){var b=document.getElementsByTagName(a.tagName),c=b[a.index];d.ghostMode.enabled=!1,c&&i.simulateEvent(c,"click")}),b.on("location:update",function(b){b.url&&(a.location=b.url)}),b.on("scroll:update",function(b){if(b.url===a.location.host+a.location.pathname)if(d.ghostMode.enabled=!1,console.log([b,d]),d.options.scrollProportionally){var c=i.getScrollSpace();a.scrollTo(0,c[1]*b.position.proportional)}else a.scrollTo(0,b.position.raw)}),b.on("input:update",function(a){d.ghostMode.enabled=!1;var b=i.checkCache(d.ghostMode.cache,a.id);b.value=a.value}),b.on("input:update:radio",function(a){d.ghostMode.enabled=!1;var b=i.checkCache(d.ghostMode.cache,a.id);b.checked=!0}),b.on("input:update:checkbox",function(a){d.ghostMode.enabled=!1;var b=i.checkCache(d.ghostMode.cache,a.id);b.checked=a.checked}),b.on("form:submit",function(a){d.ghostMode.enabled=!1,document.forms[a.id].submit()}),b.on("form:reset",function(a){d.ghostMode.enabled=!1,document.forms[a.id].reset()})}(window,"undefined"==typeof ___socket___?{}:___socket___); \ No newline at end of file +"use strict";!function(a,b){var c,d={ghostMode:{enabled:!0,cache:{}}},e={tagNames:{css:"link",jpg:"img",jpeg:"img",png:"img",svg:"img",gif:"img",js:"script"},attrs:{link:"href",img:"src",script:"src"}},f=["background-color: black","color: white","padding: 10px","display: none","font-family: sans-serif","position: absolute","z-index: 1000","right: 0px"],g={processOptions:function(a,b,d,e){a.options=b,b.ghostMode&&this.initGhostMode(b.ghostMode,d,e),b.notify&&(c=this.createNotifyElem(f||null))},setOptions:function(a){d&&(d.options=a)},createNotifyElem:function(a){var b=document.createElement("DIV");return b.id="notifyElem",a&&(b.style.cssText=a.join(";")),document.getElementsByTagName("body")[0].appendChild(b),b},notify:function(b,c,d){return c.innerHTML=b,c.style.top=i.getScrollTop()+"px",c.style.display="block",a.setTimeout(function(){c.style.display="none"},d||1e3),c},initGhostMode:function(a,b,c){if(a.clicks&&i.initClickEvents(d,b,c.click),a.scroll&&i.initEvents(d,["scroll"],b,c),a.forms)for(var e=i.getInputs(),f=[[e.texts,"keyup","keyup"],[e.radios,"click","forceChange"],[e.radios,"change","radioChange"],[e.checkboxes,"click","forceChange"],[e.checkboxes,"change","checkboxChange"],["textarea","keyup","keyup"],["select","change","selectChange"],["form","submit","formSubmit"],["form","reset","formReset"]],g=0,h=f.length;h>g;g+=1)i.addBrowserEvents(f[g][0],f[g][1],c[f[g][2]],b)},reloadEvent:function(a,b,d){var e;if(b.url&&d.reloadBrowser(!0),b.assetFileName&&b.fileExtension){var f=this.getElems(b.fileExtension),h=this.getMatches(f.elems,b.assetFileName,f.attr);h.length&&g.notify("Injected: "+b.assetFileName,c);for(var i=0,j=h.length;j>i;i+=1)e=d.swapFile(h[i],f.attr,a)}return e},getElems:function(a){var b=this.getTagName(a),c=this.getAttr(b);return{elems:document.getElementsByTagName(b),attr:c}},getTagName:function(a){return e.tagNames[a]},getAttr:function(a){return e.attrs[a]},getMatches:function(a,b,c){for(var d=[],e=0,f=a.length;f>e;e+=1)-1!==a[e][c].indexOf(b)&&d.push(a[e]);return d}},h={reloadBrowser:function(a){a&&location.reload()},swapFile:function(a,b,c){var d=a[b],e=(new Date).getTime(),f="?rel="+e,g=/^[^\?]+(?=\?)/.exec(d);return g&&(d=g[0]),c&&c.options&&c.options.timestamps===!1&&(f=""),a[b]=d+f,{elem:a,timeStamp:e}}},i={getScrollPosition:function(){var b,c,d=document,e=d.documentElement,f=d.body;return void 0!==a.pageYOffset?[a.pageXOffset,a.pageYOffset]:(b=e.scrollLeft||f.scrollLeft||0,c=e.scrollTop||f.scrollTop||0,[b,c])},getScrollPercentage:function(a,b){var c=b[0]/a[0],d=b[1]/a[1];return[c,d]},getScrollSpace:function(){var a,b,c=document,d=c.documentElement,e=c.body;return a=e.scrollHeight-d.clientWidth,b=e.scrollHeight-d.clientHeight,[a,b]},getScrollTop:function(){return this.getScrollPosition()[1]},getScrollTopPercentage:function(){var a=this.getScrollSpace(),b=this.getScrollPosition();return this.getScrollPercentage(a,b)[1]},setScrollTop:function(b,c){b.enabled=!1,a.scrollTo(0,c)},simulateEvent:function(a,b){var c;document.createEvent?(c=document.createEvent("MouseEvents"),c.initEvent(b,!0,!0),a.dispatchEvent(c)):document.createEventObject&&(c=document.createEventObject(),c.cancelBubble=!0,a.fireEvent("on"+b,c))},checkCache:function(a,b){var c;return a[b]?a[b].elem:(a.called=a.called?a.called+=1:1,(c=document.getElementById(b))?(a[b]={},a[b].elem=c,c):!1)},initClickEvents:function(a,b,c){var d=document.getElementsByTagName("body")[0];this.composeElementEvent(d,b,"click",c)},initEvents:function(a,b,c,d){for(var e,f=0,g=b.length;g>f;f+=1)e=b[f],this.composeWindowEvent(c,e,d[e])},composeWindowEvent:function(b,c,d){a[b.eventListener](b.prefix+c,d,!1)},composeElementEvent:function(a,b,c,d){a[b.eventListener](b.prefix+"click",d,!1)},emitEvent:function(a,c){b&&b.emit&&b.emit(a,c)},addBrowserEvents:function(a,b,c,d){"string"==typeof a&&(a=document.getElementsByTagName(a));for(var e=0,f=a.length;f>e;e+=1)a[e][d.eventListener](d.prefix+b,c,!1)},getHref:function(a,b){var c,d=a.tagName;return c=b&&b.href?b.href:"A"===d?a.href:this.getParentHref(a,5)},getParentHref:function(a,b){for(var c,d=function(a){return"A"===a.parentNode.tagName?a.parentNode.href:a.parentNode},e=a,f=0;b>f;f+=1){if(c=d(e),"string"==typeof c)return c;e=c}return!1},getInputs:function(){for(var a=document.getElementsByTagName("input"),b=[],c=[],d=[],e=["text","email","url","tel","password"],f=0,g=a.length;g>f;f+=1){for(var h=a[f].type,i=0,j=e.length;j>i;i+=1)if(h===e[i]){b.push(a[f]);break}"radio"===a[f].type&&c.push(a[f]),"checkbox"===a[f].type&&d.push(a[f])}return{texts:b,radios:c,checkboxes:d}},listeners:{scroll:function(){var b,c,e={raw:i.getScrollTop(),proportional:i.getScrollTopPercentage()},f=(new Date).getTime(),g=0;d.options&&d.options.scrollThrottle&&(g=d.options.scrollThrottle),d.ghostMode.lastScroll||(d.ghostMode.scrollTop=e[0],d.ghostMode.lastScroll=(new Date).getTime()),f>d.ghostMode.lastScroll+g&&d.ghostMode.enabled&&(d.ghostMode.lastScroll=f,b=d.options.scrollProportionally?e.proportional:e.raw,c=a.location.host+a.location.pathname,i.emitEvent("scroll",{pos:e,url:c})),d.ghostMode.enabled=!0},click:function(a){if(d.ghostMode.enabled){var b=a.target||a.srcElement,c=b.tagName,e=document.getElementsByTagName(c),f=Array.prototype.indexOf.call(e,b),g={tagName:c,index:f};i.emitEvent("click",g)}else d.ghostMode.enabled=!0},keyup:function(a){var b=a.target||a.srcElement;b.id&&i.emitEvent("input:type",{id:b.id,value:b.value})},forceChange:function(){this.blur(),this.focus()},radioChange:function(a){var b=a.target||a.srcElement;i.emitEvent("input:radio",{id:b.id,value:b.value})},checkboxChange:function(a){var b=a.target||a.srcElement;i.emitEvent("input:checkbox",{id:b.id,checked:b.checked})},selectChange:function(a){var b=a.target||a.srcElement;i.emitEvent("input:select",{id:b.id,value:b.value})},formSubmit:function(a){var b=a.target||a.srcElement;i.emitEvent("form:submit",{id:b.id})},formReset:function(a){var b=a.target||a.srcElement;i.emitEvent("form:reset",{id:b.id})}},utils:{eventListener:a.addEventListener?"addEventListener":"attachEvent",removeEventListener:a.removeEventListener?"removeEventListener":"detachEvent",prefix:a.addEventListener?"":"on"}};a.__karma__&&(a.BrowserSync=g,a.browserSyncActions=h,a.ghost=i,a.scope=d,b.on=function(){}),b.on("connection",function(a){g.processOptions(d,a,i.utils,i.listeners)}),b.on("reload",function(a){a&&g.reloadEvent(d,a,h)}),b.on("click",function(a){var b=document.getElementsByTagName(a.tagName),c=b[a.index];d.ghostMode.enabled=!1,c&&i.simulateEvent(c,"click")}),b.on("location:update",function(b){b.url&&(a.location=b.url)}),b.on("scroll:update",function(b){if(b.url===a.location.host+a.location.pathname)if(d.ghostMode.enabled=!1,d.options.scrollProportionally){var c=i.getScrollSpace();a.scrollTo(0,c[1]*b.position.proportional)}else a.scrollTo(0,b.position.raw)}),b.on("input:update",function(a){d.ghostMode.enabled=!1;var b=i.checkCache(d.ghostMode.cache,a.id);b.value=a.value}),b.on("input:update:radio",function(a){d.ghostMode.enabled=!1;var b=i.checkCache(d.ghostMode.cache,a.id);b.checked=!0}),b.on("input:update:checkbox",function(a){d.ghostMode.enabled=!1;var b=i.checkCache(d.ghostMode.cache,a.id);b.checked=a.checked}),b.on("form:submit",function(a){d.ghostMode.enabled=!1,document.forms[a.id].submit()}),b.on("form:reset",function(a){d.ghostMode.enabled=!1,document.forms[a.id].reset()})}(window,"undefined"==typeof ___socket___?{}:___socket___); \ No newline at end of file From a7fa6a7cf911b15e4b9f440230ee4392d572bf2f Mon Sep 17 00:00:00 2001 From: Hugo Bessa Date: Mon, 10 Feb 2014 16:34:36 -0200 Subject: [PATCH 4/6] Default value to scrollProportionally option --- lib/config.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/lib/config.js b/lib/config.js index 38ce551b3..0ffadef38 100644 --- a/lib/config.js +++ b/lib/config.js @@ -89,6 +89,14 @@ module.exports = { */ injectChanges: true, + /* + |-------------------------------------------------------------------------- + | Scroll Proportionally (true|false) + |-------------------------------------------------------------------------- + | https://github.com/shakyShane/browser-sync/wiki/options#wiki-scrollproportionally + */ + scrollProportionally: true, + /* |-------------------------------------------------------------------------- | Scroll Throttle (milliseconds) From 7e2d674b714a8decb6f7f1046e991a44495f6ee9 Mon Sep 17 00:00:00 2001 From: Hugo Bessa Date: Mon, 10 Feb 2014 16:42:12 -0200 Subject: [PATCH 5/6] Unintended changes checkout --- lib/client/browser-sync-client.js | 3 ++- lib/client/browser-sync-client.min.js | 2 +- 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/lib/client/browser-sync-client.js b/lib/client/browser-sync-client.js index b98f4e5a3..c522b4ab4 100644 --- a/lib/client/browser-sync-client.js +++ b/lib/client/browser-sync-client.js @@ -154,7 +154,7 @@ var transformedElem; - if (data.url) { + if (data.url || !scope.options.injectChanges) { actions.reloadBrowser(true); } @@ -671,6 +671,7 @@ } socket.on("connection", function (options) { + ghost.emitEvent("browser:add", {width: 200, height: 100}); browserSync.processOptions(scope, options, ghost.utils, ghost.listeners); }); diff --git a/lib/client/browser-sync-client.min.js b/lib/client/browser-sync-client.min.js index 2c4d0452a..120864e71 100644 --- a/lib/client/browser-sync-client.min.js +++ b/lib/client/browser-sync-client.min.js @@ -1 +1 @@ -"use strict";!function(a,b){var c,d={ghostMode:{enabled:!0,cache:{}}},e={tagNames:{css:"link",jpg:"img",jpeg:"img",png:"img",svg:"img",gif:"img",js:"script"},attrs:{link:"href",img:"src",script:"src"}},f=["background-color: black","color: white","padding: 10px","display: none","font-family: sans-serif","position: absolute","z-index: 1000","right: 0px"],g={processOptions:function(a,b,d,e){a.options=b,b.ghostMode&&this.initGhostMode(b.ghostMode,d,e),b.notify&&(c=this.createNotifyElem(f||null))},setOptions:function(a){d&&(d.options=a)},createNotifyElem:function(a){var b=document.createElement("DIV");return b.id="notifyElem",a&&(b.style.cssText=a.join(";")),document.getElementsByTagName("body")[0].appendChild(b),b},notify:function(b,c,d){return c.innerHTML=b,c.style.top=i.getScrollTop()+"px",c.style.display="block",a.setTimeout(function(){c.style.display="none"},d||1e3),c},initGhostMode:function(a,b,c){if(a.clicks&&i.initClickEvents(d,b,c.click),a.scroll&&i.initEvents(d,["scroll"],b,c),a.forms)for(var e=i.getInputs(),f=[[e.texts,"keyup","keyup"],[e.radios,"click","forceChange"],[e.radios,"change","radioChange"],[e.checkboxes,"click","forceChange"],[e.checkboxes,"change","checkboxChange"],["textarea","keyup","keyup"],["select","change","selectChange"],["form","submit","formSubmit"],["form","reset","formReset"]],g=0,h=f.length;h>g;g+=1)i.addBrowserEvents(f[g][0],f[g][1],c[f[g][2]],b)},reloadEvent:function(a,b,d){var e;if(b.url&&d.reloadBrowser(!0),b.assetFileName&&b.fileExtension){var f=this.getElems(b.fileExtension),h=this.getMatches(f.elems,b.assetFileName,f.attr);h.length&&g.notify("Injected: "+b.assetFileName,c);for(var i=0,j=h.length;j>i;i+=1)e=d.swapFile(h[i],f.attr,a)}return e},getElems:function(a){var b=this.getTagName(a),c=this.getAttr(b);return{elems:document.getElementsByTagName(b),attr:c}},getTagName:function(a){return e.tagNames[a]},getAttr:function(a){return e.attrs[a]},getMatches:function(a,b,c){for(var d=[],e=0,f=a.length;f>e;e+=1)-1!==a[e][c].indexOf(b)&&d.push(a[e]);return d}},h={reloadBrowser:function(a){a&&location.reload()},swapFile:function(a,b,c){var d=a[b],e=(new Date).getTime(),f="?rel="+e,g=/^[^\?]+(?=\?)/.exec(d);return g&&(d=g[0]),c&&c.options&&c.options.timestamps===!1&&(f=""),a[b]=d+f,{elem:a,timeStamp:e}}},i={getScrollPosition:function(){var b,c,d=document,e=d.documentElement,f=d.body;return void 0!==a.pageYOffset?[a.pageXOffset,a.pageYOffset]:(b=e.scrollLeft||f.scrollLeft||0,c=e.scrollTop||f.scrollTop||0,[b,c])},getScrollPercentage:function(a,b){var c=b[0]/a[0],d=b[1]/a[1];return[c,d]},getScrollSpace:function(){var a,b,c=document,d=c.documentElement,e=c.body;return a=e.scrollHeight-d.clientWidth,b=e.scrollHeight-d.clientHeight,[a,b]},getScrollTop:function(){return this.getScrollPosition()[1]},getScrollTopPercentage:function(){var a=this.getScrollSpace(),b=this.getScrollPosition();return this.getScrollPercentage(a,b)[1]},setScrollTop:function(b,c){b.enabled=!1,a.scrollTo(0,c)},simulateEvent:function(a,b){var c;document.createEvent?(c=document.createEvent("MouseEvents"),c.initEvent(b,!0,!0),a.dispatchEvent(c)):document.createEventObject&&(c=document.createEventObject(),c.cancelBubble=!0,a.fireEvent("on"+b,c))},checkCache:function(a,b){var c;return a[b]?a[b].elem:(a.called=a.called?a.called+=1:1,(c=document.getElementById(b))?(a[b]={},a[b].elem=c,c):!1)},initClickEvents:function(a,b,c){var d=document.getElementsByTagName("body")[0];this.composeElementEvent(d,b,"click",c)},initEvents:function(a,b,c,d){for(var e,f=0,g=b.length;g>f;f+=1)e=b[f],this.composeWindowEvent(c,e,d[e])},composeWindowEvent:function(b,c,d){a[b.eventListener](b.prefix+c,d,!1)},composeElementEvent:function(a,b,c,d){a[b.eventListener](b.prefix+"click",d,!1)},emitEvent:function(a,c){b&&b.emit&&b.emit(a,c)},addBrowserEvents:function(a,b,c,d){"string"==typeof a&&(a=document.getElementsByTagName(a));for(var e=0,f=a.length;f>e;e+=1)a[e][d.eventListener](d.prefix+b,c,!1)},getHref:function(a,b){var c,d=a.tagName;return c=b&&b.href?b.href:"A"===d?a.href:this.getParentHref(a,5)},getParentHref:function(a,b){for(var c,d=function(a){return"A"===a.parentNode.tagName?a.parentNode.href:a.parentNode},e=a,f=0;b>f;f+=1){if(c=d(e),"string"==typeof c)return c;e=c}return!1},getInputs:function(){for(var a=document.getElementsByTagName("input"),b=[],c=[],d=[],e=["text","email","url","tel","password"],f=0,g=a.length;g>f;f+=1){for(var h=a[f].type,i=0,j=e.length;j>i;i+=1)if(h===e[i]){b.push(a[f]);break}"radio"===a[f].type&&c.push(a[f]),"checkbox"===a[f].type&&d.push(a[f])}return{texts:b,radios:c,checkboxes:d}},listeners:{scroll:function(){var b,c,e={raw:i.getScrollTop(),proportional:i.getScrollTopPercentage()},f=(new Date).getTime(),g=0;d.options&&d.options.scrollThrottle&&(g=d.options.scrollThrottle),d.ghostMode.lastScroll||(d.ghostMode.scrollTop=e[0],d.ghostMode.lastScroll=(new Date).getTime()),f>d.ghostMode.lastScroll+g&&d.ghostMode.enabled&&(d.ghostMode.lastScroll=f,b=d.options.scrollProportionally?e.proportional:e.raw,c=a.location.host+a.location.pathname,i.emitEvent("scroll",{pos:e,url:c})),d.ghostMode.enabled=!0},click:function(a){if(d.ghostMode.enabled){var b=a.target||a.srcElement,c=b.tagName,e=document.getElementsByTagName(c),f=Array.prototype.indexOf.call(e,b),g={tagName:c,index:f};i.emitEvent("click",g)}else d.ghostMode.enabled=!0},keyup:function(a){var b=a.target||a.srcElement;b.id&&i.emitEvent("input:type",{id:b.id,value:b.value})},forceChange:function(){this.blur(),this.focus()},radioChange:function(a){var b=a.target||a.srcElement;i.emitEvent("input:radio",{id:b.id,value:b.value})},checkboxChange:function(a){var b=a.target||a.srcElement;i.emitEvent("input:checkbox",{id:b.id,checked:b.checked})},selectChange:function(a){var b=a.target||a.srcElement;i.emitEvent("input:select",{id:b.id,value:b.value})},formSubmit:function(a){var b=a.target||a.srcElement;i.emitEvent("form:submit",{id:b.id})},formReset:function(a){var b=a.target||a.srcElement;i.emitEvent("form:reset",{id:b.id})}},utils:{eventListener:a.addEventListener?"addEventListener":"attachEvent",removeEventListener:a.removeEventListener?"removeEventListener":"detachEvent",prefix:a.addEventListener?"":"on"}};a.__karma__&&(a.BrowserSync=g,a.browserSyncActions=h,a.ghost=i,a.scope=d,b.on=function(){}),b.on("connection",function(a){g.processOptions(d,a,i.utils,i.listeners)}),b.on("reload",function(a){a&&g.reloadEvent(d,a,h)}),b.on("click",function(a){var b=document.getElementsByTagName(a.tagName),c=b[a.index];d.ghostMode.enabled=!1,c&&i.simulateEvent(c,"click")}),b.on("location:update",function(b){b.url&&(a.location=b.url)}),b.on("scroll:update",function(b){if(b.url===a.location.host+a.location.pathname)if(d.ghostMode.enabled=!1,d.options.scrollProportionally){var c=i.getScrollSpace();a.scrollTo(0,c[1]*b.position.proportional)}else a.scrollTo(0,b.position.raw)}),b.on("input:update",function(a){d.ghostMode.enabled=!1;var b=i.checkCache(d.ghostMode.cache,a.id);b.value=a.value}),b.on("input:update:radio",function(a){d.ghostMode.enabled=!1;var b=i.checkCache(d.ghostMode.cache,a.id);b.checked=!0}),b.on("input:update:checkbox",function(a){d.ghostMode.enabled=!1;var b=i.checkCache(d.ghostMode.cache,a.id);b.checked=a.checked}),b.on("form:submit",function(a){d.ghostMode.enabled=!1,document.forms[a.id].submit()}),b.on("form:reset",function(a){d.ghostMode.enabled=!1,document.forms[a.id].reset()})}(window,"undefined"==typeof ___socket___?{}:___socket___); \ No newline at end of file +"use strict";!function(a,b){var c,d={ghostMode:{enabled:!0,cache:{}}},e={tagNames:{css:"link",jpg:"img",jpeg:"img",png:"img",svg:"img",gif:"img",js:"script"},attrs:{link:"href",img:"src",script:"src"}},f=["background-color: black","color: white","padding: 10px","display: none","font-family: sans-serif","position: absolute","z-index: 1000","right: 0px"],g={processOptions:function(a,b,d,e){a.options=b,b.ghostMode&&this.initGhostMode(b.ghostMode,d,e),b.notify&&(c=this.createNotifyElem(f||null))},setOptions:function(a){d&&(d.options=a)},createNotifyElem:function(a){var b=document.createElement("DIV");return b.id="notifyElem",a&&(b.style.cssText=a.join(";")),document.getElementsByTagName("body")[0].appendChild(b),b},notify:function(b,c,d){return c.innerHTML=b,c.style.top=i.getScrollTop()+"px",c.style.display="block",a.setTimeout(function(){c.style.display="none"},d||1e3),c},initGhostMode:function(a,b,c){if(a.clicks&&i.initClickEvents(d,b,c.click),a.scroll&&i.initEvents(d,["scroll"],b,c),a.forms)for(var e=i.getInputs(),f=[[e.texts,"keyup","keyup"],[e.radios,"click","forceChange"],[e.radios,"change","radioChange"],[e.checkboxes,"click","forceChange"],[e.checkboxes,"change","checkboxChange"],["textarea","keyup","keyup"],["select","change","selectChange"],["form","submit","formSubmit"],["form","reset","formReset"]],g=0,h=f.length;h>g;g+=1)i.addBrowserEvents(f[g][0],f[g][1],c[f[g][2]],b)},reloadEvent:function(a,b,d){var e;if((b.url||!a.options.injectChanges)&&d.reloadBrowser(!0),b.assetFileName&&b.fileExtension){var f=this.getElems(b.fileExtension),h=this.getMatches(f.elems,b.assetFileName,f.attr);h.length&&g.notify("Injected: "+b.assetFileName,c);for(var i=0,j=h.length;j>i;i+=1)e=d.swapFile(h[i],f.attr,a)}return e},getElems:function(a){var b=this.getTagName(a),c=this.getAttr(b);return{elems:document.getElementsByTagName(b),attr:c}},getTagName:function(a){return e.tagNames[a]},getAttr:function(a){return e.attrs[a]},getMatches:function(a,b,c){for(var d=[],e=0,f=a.length;f>e;e+=1)-1!==a[e][c].indexOf(b)&&d.push(a[e]);return d}},h={reloadBrowser:function(a){a&&location.reload()},swapFile:function(a,b,c){var d=a[b],e=(new Date).getTime(),f="?rel="+e,g=/^[^\?]+(?=\?)/.exec(d);return g&&(d=g[0]),c&&c.options&&c.options.timestamps===!1&&(f=""),a[b]=d+f,{elem:a,timeStamp:e}}},i={getScrollPosition:function(){var b,c,d=document,e=d.documentElement,f=d.body;return void 0!==a.pageYOffset?[a.pageXOffset,a.pageYOffset]:(b=e.scrollLeft||f.scrollLeft||0,c=e.scrollTop||f.scrollTop||0,[b,c])},getScrollPercentage:function(a,b){var c=b[0]/a[0],d=b[1]/a[1];return[c,d]},getScrollSpace:function(){var a,b,c=document,d=c.documentElement,e=c.body;return a=e.scrollHeight-d.clientWidth,b=e.scrollHeight-d.clientHeight,[a,b]},getScrollTop:function(){return this.getScrollPosition()[1]},getScrollTopPercentage:function(){var a=this.getScrollSpace(),b=this.getScrollPosition();return this.getScrollPercentage(a,b)[1]},setScrollTop:function(b,c){b.enabled=!1,a.scrollTo(0,c)},simulateEvent:function(a,b){var c;document.createEvent?(c=document.createEvent("MouseEvents"),c.initEvent(b,!0,!0),a.dispatchEvent(c)):document.createEventObject&&(c=document.createEventObject(),c.cancelBubble=!0,a.fireEvent("on"+b,c))},checkCache:function(a,b){var c;return a[b]?a[b].elem:(a.called=a.called?a.called+=1:1,(c=document.getElementById(b))?(a[b]={},a[b].elem=c,c):!1)},initClickEvents:function(a,b,c){var d=document.getElementsByTagName("body")[0];this.composeElementEvent(d,b,"click",c)},initEvents:function(a,b,c,d){for(var e,f=0,g=b.length;g>f;f+=1)e=b[f],this.composeWindowEvent(c,e,d[e])},composeWindowEvent:function(b,c,d){a[b.eventListener](b.prefix+c,d,!1)},composeElementEvent:function(a,b,c,d){a[b.eventListener](b.prefix+"click",d,!1)},emitEvent:function(a,c){b&&b.emit&&b.emit(a,c)},addBrowserEvents:function(a,b,c,d){"string"==typeof a&&(a=document.getElementsByTagName(a));for(var e=0,f=a.length;f>e;e+=1)a[e][d.eventListener](d.prefix+b,c,!1)},getHref:function(a,b){var c,d=a.tagName;return c=b&&b.href?b.href:"A"===d?a.href:this.getParentHref(a,5)},getParentHref:function(a,b){for(var c,d=function(a){return"A"===a.parentNode.tagName?a.parentNode.href:a.parentNode},e=a,f=0;b>f;f+=1){if(c=d(e),"string"==typeof c)return c;e=c}return!1},getInputs:function(){for(var a=document.getElementsByTagName("input"),b=[],c=[],d=[],e=["text","email","url","tel","password"],f=0,g=a.length;g>f;f+=1){for(var h=a[f].type,i=0,j=e.length;j>i;i+=1)if(h===e[i]){b.push(a[f]);break}"radio"===a[f].type&&c.push(a[f]),"checkbox"===a[f].type&&d.push(a[f])}return{texts:b,radios:c,checkboxes:d}},listeners:{scroll:function(){var b,c,e={raw:i.getScrollTop(),proportional:i.getScrollTopPercentage()},f=(new Date).getTime(),g=0;d.options&&d.options.scrollThrottle&&(g=d.options.scrollThrottle),d.ghostMode.lastScroll||(d.ghostMode.scrollTop=e[0],d.ghostMode.lastScroll=(new Date).getTime()),f>d.ghostMode.lastScroll+g&&d.ghostMode.enabled&&(d.ghostMode.lastScroll=f,b=d.options.scrollProportionally?e.proportional:e.raw,c=a.location.host+a.location.pathname,i.emitEvent("scroll",{pos:e,url:c})),d.ghostMode.enabled=!0},click:function(a){if(d.ghostMode.enabled){var b=a.target||a.srcElement,c=b.tagName,e=document.getElementsByTagName(c),f=Array.prototype.indexOf.call(e,b),g={tagName:c,index:f};i.emitEvent("click",g)}else d.ghostMode.enabled=!0},keyup:function(a){var b=a.target||a.srcElement;b.id&&i.emitEvent("input:type",{id:b.id,value:b.value})},forceChange:function(){this.blur(),this.focus()},radioChange:function(a){var b=a.target||a.srcElement;i.emitEvent("input:radio",{id:b.id,value:b.value})},checkboxChange:function(a){var b=a.target||a.srcElement;i.emitEvent("input:checkbox",{id:b.id,checked:b.checked})},selectChange:function(a){var b=a.target||a.srcElement;i.emitEvent("input:select",{id:b.id,value:b.value})},formSubmit:function(a){var b=a.target||a.srcElement;i.emitEvent("form:submit",{id:b.id})},formReset:function(a){var b=a.target||a.srcElement;i.emitEvent("form:reset",{id:b.id})}},utils:{eventListener:a.addEventListener?"addEventListener":"attachEvent",removeEventListener:a.removeEventListener?"removeEventListener":"detachEvent",prefix:a.addEventListener?"":"on"}};a.__karma__&&(a.BrowserSync=g,a.browserSyncActions=h,a.ghost=i,a.scope=d,b.on=function(){}),b.on("connection",function(a){i.emitEvent("browser:add",{width:200,height:100}),g.processOptions(d,a,i.utils,i.listeners)}),b.on("reload",function(a){a&&g.reloadEvent(d,a,h)}),b.on("click",function(a){var b=document.getElementsByTagName(a.tagName),c=b[a.index];d.ghostMode.enabled=!1,c&&i.simulateEvent(c,"click")}),b.on("location:update",function(b){b.url&&(a.location=b.url)}),b.on("scroll:update",function(b){if(b.url===a.location.host+a.location.pathname)if(d.ghostMode.enabled=!1,d.options.scrollProportionally){var c=i.getScrollSpace();a.scrollTo(0,c[1]*b.position.proportional)}else a.scrollTo(0,b.position.raw)}),b.on("input:update",function(a){d.ghostMode.enabled=!1;var b=i.checkCache(d.ghostMode.cache,a.id);b.value=a.value}),b.on("input:update:radio",function(a){d.ghostMode.enabled=!1;var b=i.checkCache(d.ghostMode.cache,a.id);b.checked=!0}),b.on("input:update:checkbox",function(a){d.ghostMode.enabled=!1;var b=i.checkCache(d.ghostMode.cache,a.id);b.checked=a.checked}),b.on("form:submit",function(a){d.ghostMode.enabled=!1,document.forms[a.id].submit()}),b.on("form:reset",function(a){d.ghostMode.enabled=!1,document.forms[a.id].reset()})}(window,"undefined"==typeof ___socket___?{}:___socket___); \ No newline at end of file From 9b78253cafa584142b196f5008935449d527df90 Mon Sep 17 00:00:00 2001 From: Hugo Bessa Date: Mon, 10 Feb 2014 16:47:10 -0200 Subject: [PATCH 6/6] scrollProportionally default config --- lib/index.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/lib/index.js b/lib/index.js index 27d4fa2aa..6f049da69 100755 --- a/lib/index.js +++ b/lib/index.js @@ -26,6 +26,7 @@ var defaultConfig = { notify: true, devMode: false, fileTimeout: 1000, + scrollProportionally: true, scrollThrottle: 0, reloadDelay: 0, injectChanges: true, @@ -455,4 +456,4 @@ module.exports.init = function (files, userConfig) { } } return setup.kickoff(files, config); -}; \ No newline at end of file +};