update doc + minify js + update version to 0.4
This commit is contained in:
parent
ee72140d94
commit
25a7ed9648
10
README.md
10
README.md
|
@ -58,6 +58,16 @@ manage communication between browser tabs
|
|||
$bt.send({ name : $bt.CMD_CUSTOM, customKey : 'customValue' });
|
||||
|
||||
|
||||
### Bonus
|
||||
|
||||
// alias localStorage : clear|rem|get|set
|
||||
$l;
|
||||
// alias json : str|obj
|
||||
$j
|
||||
// minimal vanilla jquery style : ready|on|html|append|attr|val|foreach
|
||||
$v
|
||||
|
||||
|
||||
### Demo
|
||||
|
||||
on chromium/chrome browser make sure to test on a web server (not directly file://)
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<!doctype>
|
||||
<html>
|
||||
<head>
|
||||
<title>pluie.org bt demo</title>
|
||||
<title>pluie.org bt demo - v0.4</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<style>
|
||||
body { background-color:#888; color:white; font-family:arial; font-size:1.3rem; }
|
||||
|
@ -11,13 +11,13 @@
|
|||
button { padding:5px 15px; }
|
||||
h3 { margin:35px 0 10px 0; }
|
||||
h2 { margin:5px 0 0 0; }
|
||||
textarea { padding:8px 5px; border-radius:10px; border-style:solid; width:100%; height:120px; }
|
||||
textarea { padding:8px 5px; border-radius:10px; border-style:solid; width:100%; height:120px; font-size:1.2rem; }
|
||||
#test { margin:20px; background-color:white; padding:20px; border: 1px dashed #aaa; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h2>pluie.org bt demo : </h2>
|
||||
<span>author : a-sansara</span>
|
||||
<span>author : a-sansara - version : 0.4</span>
|
||||
<div>
|
||||
<p>
|
||||
this js lib can perform several actions on browser tabs.
|
||||
|
@ -41,7 +41,7 @@ enter txt or html : <br/>
|
|||
<h3>Target output</h3>
|
||||
<div id="test"></div>
|
||||
</div>
|
||||
<script type="text/javascript" src="src/bt.js"></script>
|
||||
<script type="text/javascript" src="src/bt-min.js"></script>
|
||||
<script type="text/javascript">
|
||||
// define a new custom cmd
|
||||
$bt.CMD_CUSTOM = "customCmd";
|
||||
|
|
6
src/bt-min.js
vendored
Normal file
6
src/bt-min.js
vendored
Normal file
|
@ -0,0 +1,6 @@
|
|||
/* by a-sansara - https://github.com/pluie-org/bt */var $bt={TRACE:true&&typeof console!="undefined",LS_TABS:'bt.tabs',LS_CURTAB:'bt.ctab',LS_CMD:'bt.cmd',CMD_SYNC:'bt.sync',CMD_APPEND:'dom.append',CMD_HTML:'dom.html',CMD_RELOAD:'bt.reload',init:function(fn){this._init(fn);},on:function(cmd){this.log(cmd);},log:function(data){if(this.TRACE)console.log(data);},send:function(cmd){cmd.uid=this.id+Math.random();cmd.from=this.id;if(typeof cmd.to=="undefined")cmd.to="*";$l.set(this.LS_CMD,$j.str(cmd));$l.rem(this.LS_CMD);},append:function(selector,data,btid){this._dom(this.CMD_APPEND,selector,data,btid);},html:function(selector,data,btid){this._dom(this.CMD_HTML,selector,data,btid);},sync:function(selector,btid){this._dom(this.CMD_HTML,selector,$v(selector).html(),btid);},reload:function(url,btid){$bt.send({name:$bt.CMD_RELOAD,url:url,to:!btid?'*':btid});},_refresh:function(){$bt.list=$j.obj($l.get($bt.LS_TABS));},_broadcast:function(){$bt.send({name:$bt.CMD_SYNC});},_remove:function(id){if(!id)id=$bt.id;var i=$bt.list.indexOf(id);if(i>-1)$bt.list.splice(i,1);},_init:function(fn){$v(window).on('beforeunload',$bt._unload);$v(window).on('storage',$bt._cmd);$v(window).on('focus',$bt._focus);$bt.id=(new Date).getTime();var t=$l.get($bt.LS_TABS);$bt.list=t==null?[]:$j.obj(t);$bt.list.push($bt.id);$l.set($bt.LS_TABS,$j.str($bt.list));$bt._broadcast();$bt.log($bt.list);if(typeof fn=="function")fn();},_dom:function(n,s,d,id){$bt.send({name:n,selector:s,data:d,to:!id?'*':id});},_unload:function(e){$bt._refresh();$bt._remove();$l.set($bt.LS_TABS,$j.str($bt.list));$bt._broadcast();return null;},_focus:function(e){$l.set($bt.LS_CURTAB,$bt.id);},_cmd:function(e){if(e.key!=$bt.LS_CMD)return;var cmd=$j.obj(e.newValue);if(!cmd)return;if(cmd.to=="*"||cmd.to==$bt.id){$bt.log("do "+cmd.name);$bt.log(cmd);switch(cmd.name){case $bt.CMD_SYNC:$bt._refresh();$bt.log($bt.list);break;case $bt.CMD_APPEND:$v(cmd.selector).append(cmd.data);break;case $bt.CMD_HTML:$v(cmd.selector).html(cmd.data);break;case $bt.CMD_RELOAD:window.location=typeof cmd.url!="undefined"?cmd.url:window.location;break;default:if(typeof $bt.on=="function")$bt.on(cmd);}}}}
|
||||
var $v=function(p){var s=typeof p=="string";var c=s?document.querySelectorAll(p):null;var a=s?[].slice.call(c):[p];delete(s);if(p==localStorage){return{clear:function(){return p.clear();},get:function(k){return p.getItem(k);},rem:function(k){return p.removeItem(k);},set:function(k,v){return p.setItem(k,v);}};}
|
||||
else if(p==JSON){return{str:function(o){return p.stringify(o);},obj:function(s){return p.parse(s);}};}
|
||||
else{this.foreach=function(f){[].forEach.call(c,f);};this.html=function(d){if(arguments.length==0)return a[0].innerHTML;else a[0].innerHTML=d;};this.append=function(d){this.foreach(function(n){n.innerHTML+=d;});};this.on=function(t,f,u){if(c!=null){this.foreach(function(n){n.addEventListener(t,f,u===true);});}
|
||||
else a[0].addEventListener(t,f,u===true);};this.val=function(d){if(arguments.length==0)return a[0].value;else a[0].value=d;};this.attr=function(k,v){if(arguments.length==1)return a[0].getAttribute(k);else a[0].setAttribute(k,v);};this.ready=function(f){document.addEventListener('DOMContentLoaded',f);};return this;}}
|
||||
var $l=$v(localStorage);var $j=$v(JSON);
|
45
src/bt.js
45
src/bt.js
|
@ -3,26 +3,47 @@
|
|||
* @contributors :
|
||||
* @copyright : pluie.org
|
||||
* @date : 2015-12-10 22:22:34
|
||||
* @version : 0.2
|
||||
* @version : 0.4
|
||||
* @license : MIT
|
||||
* @require : html5 localStorage
|
||||
* @desc :
|
||||
*
|
||||
* BrowserTab USAGE :
|
||||
* USAGE :
|
||||
*
|
||||
*
|
||||
* Initialize
|
||||
*
|
||||
* $(document).ready(function() {
|
||||
* $v(document).ready(function() {
|
||||
* $bt.init();
|
||||
* }
|
||||
*
|
||||
*
|
||||
* Internal Commands
|
||||
*
|
||||
* // append data on node to other browser tabs
|
||||
* $bt.append('#test', '<b>it's cool to append</b>');
|
||||
* $bt.append('#test', "<b>it's cool to append</b>");
|
||||
*
|
||||
* // rewrite content on node to other browser tabs
|
||||
* $bt.html('#test', '<b>it's cool to rewrite</b>');
|
||||
* $bt.html('#test', "<b>it's cool to rewrite</b>");
|
||||
*
|
||||
* // rewrite content to specific browser tabs
|
||||
* $bt.html('#test', "<b>it's cool to rewrite</b>", '1449974562012');
|
||||
*
|
||||
* // perform a node synchro to other browser tabs
|
||||
* $bt.sync('#test');
|
||||
*
|
||||
* // reload other browser tabs
|
||||
* $bt.reload();
|
||||
*
|
||||
* // reload other browser tabs to specific url
|
||||
* $bt.reload(window.location.path+"?reloaded=1");
|
||||
*
|
||||
* // get browser tab list
|
||||
* $bt.list;
|
||||
*
|
||||
* // current browser tab id
|
||||
* $bt.id;
|
||||
*
|
||||
*
|
||||
* Custom Commands
|
||||
*
|
||||
|
@ -41,6 +62,15 @@
|
|||
* // send a custom command to other browser tabs
|
||||
* $bt.send({ name : $bt.CMD_CUSTOM, customKey : 'customValue' });
|
||||
*
|
||||
* Bonus
|
||||
*
|
||||
* // alias localStorage : clear|rem|get|set
|
||||
* $l;
|
||||
* // alias json : str|obj
|
||||
* $j
|
||||
* // minimal vanilla jquery style : ready|on|html|append|attr|val|foreach
|
||||
* $v
|
||||
*
|
||||
* enjoy !
|
||||
*/
|
||||
var $bt = {
|
||||
|
@ -224,7 +254,6 @@ var $bt = {
|
|||
// vanilla minimal jquery style
|
||||
var $v = function(p) {
|
||||
var s = typeof p == "string";
|
||||
var z = "cool";
|
||||
var c = s ? document.querySelectorAll(p) : null;
|
||||
var a = s ? [].slice.call(c) : [p];
|
||||
delete(s);
|
||||
|
@ -284,7 +313,7 @@ var $v = function(p) {
|
|||
return this;
|
||||
}
|
||||
}
|
||||
// alias localStorage
|
||||
// alias localStorage : clear|rem|get|set
|
||||
var $l = $v(localStorage);
|
||||
// alias json
|
||||
// alias json : str|obj
|
||||
var $j = $v(JSON);
|
||||
|
|
Loading…
Reference in New Issue
Block a user