Thanh công cụ lưu trữ nội dung ghi chú lâu dài theo URL

Code được lấy từ Panel Code1k.com dạng Tool Bar ẩn hiện bên phải trình duyệt.

Giúp người truy cập có thể ghi nhớ văn bản vào trang web mình truy cập. Dữ liệu được nhập vào độc lập từng trang & lưu trữ lâu dài bằng cache của trình duyệt.


Thanh công cụ lưu trữ nội dung ghi chú lâu dài theo URL

<style type='text/css'>#noty-box,#noty-box h2,#noty-box p,#noty-box div,#noty-box ul,#noty-box li,#noty-box strong,#noty-box em,#noty-box small,#noty-box textarea,#noty-box a,#noty-box article,#noty-box footer,#noty-box header{background-attachment:scroll;background-color:transparent;background-image:none;background-position:0 0;background-repeat:repeat;border-style:none;border-width:medium;bottom:auto;clear:none;color:inherit;content:normal;counter-increment:none;counter-reset:none;cursor:auto;direction:inherit;display:inline;float:none;font-family:inherit;font-size:inherit;font-style:inherit;font-variant:normal;font-weight:inherit;height:auto;left:auto;letter-spacing:normal;line-height:inherit;margin:0;max-height:none;max-width:none;min-height:0;min-width:0;outline:invert none medium;overflow:visible;padding:0;position:static;right:auto;table-layout:auto;text-align:inherit;text-decoration:inherit;text-indent:0;text-transform:none;top:auto;unicode-bidi:normal;vertical-align:baseline;visibility:visible;white-space:normal;width:auto;word-spacing:normal;z-index:auto;border-radius:0;-moz-border-radius:0;-webkit-border-radius:0;box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none;}#noty-box,#noty-box p,#noty-box div,#noty-box h2,#noty-box ul,#noty-box li,#noty-box textarea,#noty-box article,#noty-box footer,#noty-box header{display:block;}#noty-box strong{font-weight:bold;}#noty-box em{font-style:italic;}#noty-box a,#noty-box a *{cursor:pointer;}#noty-box a:hover{text-decoration:underline;}#noty-box li:before,#noty-box li:after{content:"";content:none;}#noty-box{background:#ccc;background:-moz-linear-gradient(left center,#bbb,#ccc);background:-webkit-gradient(linear,left top,right top,from(#bbb),to(#ccc));color:#000;direction:ltr;font-family:"Times New Roman",serif;font-size:12px;font-style:normal;font-weight:normal;line-height:1.2;opacity:.75;overflow:auto;padding:10px 10px 30px;position:fixed;right:0;text-align:left;text-decoration:none;top:25px;width:200px;border-radius:10px 0 0 10px;-moz-border-radius:10px 0 0 10px;-webkit-border-radius:10px 0 0 10px;box-shadow:-2px 1px 5px #333;-moz-box-shadow:-2px 1px 5px #333;-webkit-box-shadow:-2px 1px 5px #333;-webkit-transition:right .5s ease-in-out,opacity .5s ease;-moz-transition:right .5s ease-in-out,opacity .5s ease;}#noty-box:hover,#noty-box.editmode{opacity:.98;}#noty-box.closed{opacity:.50;right:-195px;}#noty-box p{margin:6px;}#noty-box a{color:#666;}#noty-box h2{color:#333;font-size:14px;font-weight:bold;margin:0 0 6px;text-align:center;}#noty-box small{display:block;padding:20px 4px;text-align:center;}#noty-box article{background:#eee;border:1px solid #aaa;font-size:12px;margin:4px 0;padding:0;position:relative;}#noty-box article.editmode{background:#fff;border:1px solid #333;}#noty-box article footer{display:none;margin:0 2px 0 4px;position:absolute;right:4px;top:-8px;}#noty-box article footer a,#noty-box article footer a:hover{background:#669;color:#eee;margin:2px;opacity:.95;padding:1px 4px;text-decoration:none;border-radius:6px;-moz-border-radius:6px;-webkit-border-radius:6px;}#noty-box article:hover footer{display:block;}#noty-box.editmode article footer{display:none;}#noty-box footer{display:block;font-size:12px;text-align:right;}#noty-box textarea{background:#fff;border:none;}#noty-box .toggle,#noty-box .toggle:active,#noty-box .toggle:hover{font-size:24px;left:8px;outline:none;position:absolute;text-decoration:none;top:0;}#noty-box .sharemenu{display:none;list-style:none;position:absolute;right:48px;text-align:center;top:16px;z-index:200;}#noty-box .sharemenu a{background:#669;color:#eee;display:block;}</style>

<script type='text/javascript'>(function(d,w){if(w.opera){return}var options={enableNoty:true,pageIdentifier:d.title,defaultClosed:true,enableSharing:true,enableShortLinks:false,proxyScript:"/notyproxy.php",enableTwitter:false,enableGoto:true},lang={mainHeader:"<h2><img src=\"http://1.bp.blogspot.com/_BmIFAHM3wdk/TQRXC-qUbTI/AAAAAAAAAuA/MnlCDXB-Usg/s1600/woodenbox.png\" alt=\"\" /> Box ghi chú của bạn</h2>",helpText:"Box ghi chú của riêng bạn<br>Lưu trữ ghi chú lâu dài cho trang này.",toggleText:"",notePlaceholder:"Ghi chú: ",addLink:"<img src=\"http://lh5.ggpht.com/_BmIFAHM3wdk/TP3wRghltjI/AAAAAAAAAVg/K3MlSgKOc7I/plus-small.png\" alt=\"\" /> Thêm ghi chú",addText:"",editLink:"sửa",editText:"",deleteLink:"x",deleteText:"",jumpLink:"goto",jumpText:"Scroll to Source",shareLink:"Gửi",shareText:"",emailLink:"Email",emailText:"",emailSubject:"Code saved From Code1k.com",tweetLink:"",tweetText:""},notybox,notyfooter,notytoggle,notyhelp,notyshare,notypage,notydata=[],init=function(){var closed,header,opt;if("object"===typeof notyOptions){for(opt in notyOptions){if(notyOptions.hasOwnProperty(opt)){options[opt]=notyOptions[opt]}}}if(!options.enableNoty){return}if("object"===typeof notyLang){for(opt in notyLang){if(notyLang.hasOwnProperty(opt)){lang[opt]=notyLang[opt]}}}options.proxyScript+=(options.proxyScript.indexOf("?")!==-1)?"&":"?";notypage=options.pageIdentifier;closed=noteStorage.get("isclosed");d.createElement("article");d.createElement("section");d.createElement("header");d.createElement("footer");d.createElement("mark");notybox=d.createElement("section");notybox.setAttribute("id","noty-box");header=d.createElement("header");header.innerHTML=lang.mainHeader;notybox.appendChild(header);notyhelp=d.createElement("small");notyhelp.innerHTML=lang.helpText;header.appendChild(notyhelp);notyfooter=d.createElement("footer");notybox.appendChild(notyfooter);notytoggle=d.createElement("a");notytoggle.setAttribute("href","#");notytoggle.setAttribute("title",lang.toggleText);notytoggle.className="toggle";notybox.appendChild(notytoggle);if(closed==="true"||("string"!==typeof closed&&options.defaultClosed)){notytoggle.innerHTML="&laquo;";notybox.className="closed"}else{notytoggle.innerHTML="&raquo;"}d.body.appendChild(notybox);setBoxHeight();initEvents();if(options.enableSharing){initSharing()}loadNotes()},initEvents=function(){var newnote=initNewLink();addEvent(newnote,"click",function(e){var target=addNewNote(lang.notePlaceholder),id=notydata.length-1;target=target.getElementsByTagName("div")[0];editNote(target,id);return cancel(e)});addEvent(notytoggle,"click",toggleClose);addEvent(notybox,"dragover",setCopyMode);addEvent(notybox,"dragenter",setCopyMode);addEvent(d,"dragstart",setDragData);addEvent(notybox,"drop",dropData);addEvent(w,"resize",setBoxHeight);addEvent(w,"unload",saveNotes)},initNewLink=function(){var newnote=d.createElement("a");newnote.setAttribute("href","#");newnote.setAttribute("title",lang.addText);newnote.innerHTML=lang.addLink;notyfooter.appendChild(newnote);return newnote},initSharing=function(){var email,twitter,li=d.createElement("li");notyshare=d.createElement("ul");notyshare.className="sharemenu";email=d.createElement("a");email.setAttribute("href","#");email.setAttribute("title",lang.emailText);email.innerHTML=lang.emailLink;addEvent(email,"click",emailNote);li.appendChild(email);notyshare.appendChild(li);if(options.enableTwitter){li=li.cloneNode(false);twitter=d.createElement("a");twitter.setAttribute("href","#");twitter.setAttribute("title",lang.tweetText);twitter.innerHTML=lang.tweetLink;addEvent(twitter,"click",tweetNote);li.appendChild(twitter);notyshare.appendChild(li)}addEvent(d,"mouseup",function(){notyshare.style.display="none"});notybox.appendChild(notyshare)},setBoxHeight=function(){var padding=(notybox.offsetTop*2)+20,height=w.innerHeight-padding;height=(height>=200)?height:200;notybox.style.height=height+"px"},setCopyMode=function(e){e.dataTransfer.dropEffect="copy";return cancel(e)},setDragData=function(e){var sel,data={};sel=getSelectionData();if(sel){data.text=sel.text;data.el=sel.el;data=JSON.stringify(data);e.dataTransfer.setData("Text",data)}},dropData=function(e){var data=e.dataTransfer.getData("Text");try{data=JSON.parse(data)}catch(error){data={text:data}}if(data.text!==""){if(data.el){addNewNote(data.text,data.el)}else{addNewNote(data.text)}}return cancel(e)},toggleClose=function(e){if(notybox.className==="closed"){notybox.className="";notytoggle.innerHTML="&raquo;";noteStorage.set("isclosed",false)}else{notybox.className="closed";notytoggle.innerHTML="&laquo;";noteStorage.set("isclosed",true)}return cancel(e)},deleteNote=function(e){var note=this.parentNode.parentNode,id;if(note){id=getId(note);note.parentNode.removeChild(note);notydata[id]=null;if(!notybox.getElementsByTagName("article").length){notyhelp.style.display="block"}}return cancel(e)},startEditNote=function(e){var note=this.parentNode.nextSibling;if(note){editNote(note)}return cancel(e)},editNote=(function(){if("contentEditable" in d.createElement("span")){return function(target){target.contentEditable=true;target.parentNode.className="editmode";notybox.className="editmode";addEvent(target,"blur",function(e){var id=getId(this.parentNode),el=d.createElement("div");notydata[id].text=this.innerHTML;el.innerHTML=this.innerHTML;this.parentNode.className="";notybox.className="";this.parentNode.replaceChild(el,this);return cancel(e)})}}else{return function(target){var field=d.createElement("textarea");field.value=stripTags(target.innerHTML);field.style.width=target.offsetWidth+"px";field.style.height=target.offsetHeight+"px";target.parentNode.replaceChild(field,target);notybox.className="editmode";field.focus();addEvent(field,"blur",function(e){var id=getId(this.parentNode),newtext=formatStr(this.value);notydata[id].text=newtext;target.innerHTML=newtext;this.parentNode.replaceChild(target,this);notybox.className="";return cancel(e)})}}}()),addNewNote=function(s,origin){var id,data={};s=formatStr(s);data.text=s;if(origin){data.origin=origin}notydata.push(data);id=notydata.length-1;return addNote(s,id,origin)},addNote=function(s,id,origin){if("string"!==typeof s||"number"!==typeof id){return null}var el=d.createElement("article"),content=d.createElement("div"),foot=d.createElement("footer"),share,edit,del,jump,node;if(origin&&d.evaluate&&options.enableGoto){node=d.evaluate(origin,d,null,XPathResult.FIRST_ORDERED_NODE_TYPE,null).singleNodeValue;if(node){jump=d.createElement("a");jump.innerHTML=lang.jumpLink;jump.setAttribute("href","#");jump.setAttribute("title",lang.jumpText);addEvent(jump,"click",function(e){node.scrollIntoView();return cancel(e)});foot.appendChild(jump)}}if(options.enableSharing){share=d.createElement("a");share.innerHTML=lang.shareLink;share.setAttribute("href","#");share.setAttribute("title",lang.shareText);addEvent(share,"click",shareNote);foot.appendChild(share)}edit=d.createElement("a");edit.innerHTML=lang.editLink;edit.setAttribute("href","#");edit.setAttribute("title",lang.editText);addEvent(edit,"click",startEditNote);foot.appendChild(edit);del=d.createElement("a");del.innerHTML=lang.deleteLink;del.setAttribute("href","#");del.setAttribute("title",lang.deleteText);addEvent(del,"click",deleteNote);foot.appendChild(del);content.innerHTML=s;el.appendChild(foot);el.appendChild(content);el.setAttribute("id","noty-"+id);notybox.insertBefore(el,notyfooter);notyhelp.style.display="none";return el},shareNote=function(e){this.parentNode.appendChild(notyshare);notyshare.style.display="block";return cancel(e)},emailNote=function(e){var id=getId(this.parentNode.parentNode.parentNode.parentNode);if(id!==null){if(options.enableShortLinks){getShortLink(function(url){sendEmail(id,url)})}else{sendEmail(id,w.location.href)}}return cancel(e)},sendEmail=function(id,url){var msg='"'+stripTags(notydata[id].text)+'"',req="mailto:?subject="+lang.emailSubject+d.title+"&body="+encodeURIComponent(msg+" "+url);w.location=req},tweetNote=function(e){var id=getId(this.parentNode.parentNode.parentNode.parentNode);if(id!==null){if(options.enableShortLinks){getShortLink(function(url){sendTweet(id,url)})}else{sendTweet(id,w.location.href)}}return cancel(e)},sendTweet=function(id,url){var msg='"'+truncate(notydata[id].text,137-url.length)+'"',req="http://twitter.com/home?status="+encodeURIComponent(msg+" "+url);w.open(req)},getShortLink=function(cb){if("function"!==typeof cb){return}var cached,key,req,obj;key="short."+notypage;cached=noteStorage.get(key);if(typeof cached!=="string"){obj=getXMLHttpRequest();if(obj!==null){req=options.proxyScript+"url="+encodeURIComponent(w.location.href);obj.open("GET",req,true);obj.onreadystatechange=function(){if(obj.readyState===4&&obj.status===200){var resp=obj.responseText;if(resp!==""){resp=JSON.parse(resp);if(resp.status_txt==="OK"){noteStorage.set(key,resp.data.url);cb(resp.data.url);return}}cb(w.location.href)}};obj.send(null);return}}cb(cached)},saveNotes=function(){var filtered=[],i,l;for(i=0,l=notydata.length;i<l;i++){if(notydata[i]!==null&&notydata[i].text!==""){filtered.push(notydata[i])}}noteStorage.set("page."+notypage,JSON.stringify(filtered))},loadNotes=function(){var data,i,l;data=noteStorage.get("page."+notypage);if(typeof data==="string"){data=JSON.parse(data);notydata=data||[];if(notydata.length){notyhelp.style.display="none"}for(i=0,l=notydata.length;i<l;i++){addNote(notydata[i].text,i,notydata[i].origin)}}},noteStorage=(function(){if("localStorage" in w&&w.localStorage!==null){return{set:function(key,val){w.localStorage["noty."+key]=val},get:function(key){return w.localStorage["noty."+key]}}}else{return{set:function(key,val){},get:function(key){}}}}()),getSelectionData=function(){var data={},sel,an,fn;if(w.getSelection){sel=w.getSelection();an=sel.anchorNode;if(!an){return null}fn=sel.focusNode;an=(an.nodeType===3)?an.parentNode:an;fn=(fn.nodeType===3)?fn.parentNode:fn;if((an.compareDocumentPosition(fn)&2)===2){an=fn}data.el="/"+getXPath(an).join("/");data.text=sel.toString()}else{if(d.selection){data.el=null;data.text=d.selection.createRange().text}}return data},getXPath=function(node,path){var count,sibling;path=path||[];if(node.parentNode){path=getXPath(node.parentNode,path)}if(node.previousSibling){count=1;sibling=node.previousSibling;do{if(sibling.nodeType===1&&sibling.nodeName===node.nodeName){count++}sibling=sibling.previousSibling}while(sibling);if(count===1){count=null}}else{if(node.nextSibling){sibling=node.nextSibling;do{if(sibling.nodeType===1&&sibling.nodeName===node.nodeName){count=1;sibling=null}else{count=null;sibling=sibling.previousSibling}}while(sibling)}}if(node.nodeType===1){path.push(node.nodeName.toLowerCase()+(node.id?"[@id='"+node.id+"']":count>0?"["+count+"]":""))}return path},getId=function(el){if(!el){return null}return parseInt(el.id.substr(el.id.indexOf("-")+1),10)},cancel=function(e){if(e.preventDefault){e.preventDefault()}return false},truncate=function(str,limit){if("string"!==typeof str){return""}var bits,i;limit=limit-3;str=str.replace(/(<([^>]+)>)/g,"");bits=str.split("");if(bits.length>limit){for(i=bits.length-1;i>-1;--i){if(i>limit){bits.length=i}else{if(" "===bits[i]){bits.length=i;break}}}bits.push("...")}return bits.join("")},formatStr=function(s){if("string"!==typeof s){return"<p></p>"}var e={'"':"&quot;","&":"&amp;","<":"&lt;",">":"&gt;"};s=s.replace(/["&<>]/g,function(m){return e[m]});s=s.replace(/\n\n|\r\n\r\n/g,"</p><p>");return"<p>"+s+"</p>"},sanitizeStr=function(s){if("string"!==typeof s){return""}return s.replace(/[\\"']/g,"\\amp;").replace(/\u0000/g,"\\0").replace(/[\r\n]/g,"")},stripTags=function(s){if("string"!==typeof s){return""}s=s.replace(/<\/p><p>/g,"\r\n\r\n");return s.replace(/(<([^>]+)>)/g,"")},getXMLHttpRequest=function(){if(w.XMLHttpRequest){return new XMLHttpRequest()}else{if(w.ActiveXObject){try{return new ActiveXObject("Msxml2.XMLHTTP")}catch(e){try{return new ActiveXObject("Microsoft.XMLHTTP")}catch(e2){return null}}}}return null},addEvent=(function(){if(d.addEventListener){return function(el,type,fn){if(el&&el.nodeName||el===w){el.addEventListener(type,fn,false)}else{if(el&&el.length){var i,l;for(i=0,l=el.length;i<l;i++){addEvent(el[i],type,fn)}}}}}else{return function(el,type,fn){if(el&&el.nodeName||el===w){el.attachEvent("on"+type,function(){return fn.call(el,w.event)})}else{if(el&&el.length){var i,l;for(i=0,l=el.length;i<l;i++){addEvent(el[i],type,fn)}}}}}}()),JSON=w.JSON||{};JSON.stringify=JSON.stringify||function(obj){var t=typeof(obj),v,i,json,arr;if(t!=="object"||obj===null){if(t==="string"){obj='"'+sanitizeStr(obj)+'"'}return String(obj)}else{json=[];arr=(obj&&obj.constructor===Array);for(i in obj){if(obj.hasOwnProperty(i)){v=obj[i];t=typeof(v);if(t==="string"){v='"'+sanitizeStr(v)+'"'}else{if(t==="object"&&v!==null){v=JSON.stringify(v)}}json.push((arr?"":'"'+i+'":')+String(v))}}return(arr?"[":"{")+String(json)+(arr?"]":"}")}};JSON.parse=JSON.parse||function(str){if(str===""){str='""'}eval("var p="+str+";");return p};addEvent(w,"load",init)}(document,window));</script>


Theo : code1k.com
SHARE

Thiết kế web chuyên nghiệp giá rẻ

Chúng tôi tuyên thiết kế web chuyên nghiệp đẳng cấp giá rẻ với 5 năm kinh nghiệm trong lĩnh vực thiết kế website nếu các bạn có nhu cầu có thể liên hệ Hotline: 0962 66 57 57 || Email: cmay.tt@gmail.com || website: cmay.vn

  • Image
  • Image
  • Image
  • Image
  • Image
    Blogger Comment
    Facebook Comment

0 nhận xét:

Đăng nhận xét