From 62bbb82db1ceee96ac5e1f3cf6efae6b327efebe Mon Sep 17 00:00:00 2001 From: ozhozh Date: Sun, 12 Jun 2011 18:22:40 +0000 Subject: [PATCH] Implementation of the zclip jQuery plugin (a nice ZeroClipboard wrapper) git-svn-id: http://yourls.googlecode.com/svn/trunk@636 12232710-3e20-11de-b438-597f59cd7555 --- admin/index.php | 5 +- css/share.css | 4 + includes/functions-html.php | 6 +- js/ZeroClipboard.js | 290 ------------------------------------ js/infos.js | 3 +- js/insert.js | 3 +- js/jquery.zclip.min.js | 12 ++ js/share.js | 44 ++---- 8 files changed, 34 insertions(+), 333 deletions(-) delete mode 100644 js/ZeroClipboard.js create mode 100644 js/jquery.zclip.min.js diff --git a/admin/index.php b/admin/index.php index 064304c..6ff8a12 100644 --- a/admin/index.php +++ b/admin/index.php @@ -219,7 +219,10 @@ if ( !$is_bookmark ) { yourls_share_box( '', '', '', '', '

Your short link

', '

Quick Share

', true ); } else { - echo ''; + echo ''; } yourls_table_head(); diff --git a/css/share.css b/css/share.css index 73bf6b4..45d96eb 100644 --- a/css/share.css +++ b/css/share.css @@ -59,3 +59,7 @@ div.share { background:transparent url(../images/copy.png) 130% center no-repeat; } +#copylink:hover, #copylink.hover { + background-position:100% 50%; +} + diff --git a/includes/functions-html.php b/includes/functions-html.php index 2a9a2ce..5c6d3b1 100644 --- a/includes/functions-html.php +++ b/includes/functions-html.php @@ -97,8 +97,7 @@ function yourls_html_head( $context = 'index', $title = '' ) { - - + @@ -106,7 +105,8 @@ function yourls_html_head( $context = 'index', $title = '' ) { diff --git a/js/ZeroClipboard.js b/js/ZeroClipboard.js deleted file mode 100644 index 9d1688e..0000000 --- a/js/ZeroClipboard.js +++ /dev/null @@ -1,290 +0,0 @@ -// Simple Set Clipboard System -// Author: Joseph Huckaby - -var ZeroClipboard = { - - version: "1.0.4", - clients: {}, // registered upload clients on page, indexed by id - moviePath: 'ZeroClipboard.swf', // URL to movie - nextId: 1, // ID of next movie - - $: function(thingy) { - // simple DOM lookup utility function - if (typeof(thingy) == 'string') thingy = document.getElementById(thingy); - if (!thingy.addClass) { - // extend element with a few useful methods - thingy.hide = function() { this.style.display = 'none'; }; - thingy.show = function() { this.style.display = ''; }; - thingy.addClass = function(name) { this.removeClass(name); this.className += ' ' + name; }; - thingy.removeClass = function(name) { - this.className = this.className.replace( new RegExp("\\s*" + name + "\\s*"), " ").replace(/^\s+/, '').replace(/\s+$/, ''); - }; - thingy.hasClass = function(name) { - return !!this.className.match( new RegExp("\\s*" + name + "\\s*") ); - } - } - return thingy; - }, - - setMoviePath: function(path) { - // set path to ZeroClipboard.swf - this.moviePath = path; - }, - - dispatch: function(id, eventName, args) { - // receive event from flash movie, send to client - var client = this.clients[id]; - if (client) { - client.receiveEvent(eventName, args); - } - }, - - register: function(id, client) { - // register new client to receive events - this.clients[id] = client; - }, - - getDOMObjectPosition: function(obj) { - // get absolute coordinates for dom element - var info = { - left: 0, - top: 0, - width: obj.width ? obj.width : obj.offsetWidth, - height: obj.height ? obj.height : obj.offsetHeight - }; - - while (obj) { - info.left += obj.offsetLeft; - info.top += obj.offsetTop; - obj = obj.offsetParent; - } - - return info; - }, - - Client: function(elem) { - // constructor for new simple upload client - this.handlers = {}; - - // unique ID - this.id = ZeroClipboard.nextId++; - this.movieId = 'ZeroClipboardMovie_' + this.id; - - // register client with singleton to receive flash events - ZeroClipboard.register(this.id, this); - - // create movie - if (elem) this.glue(elem); - } -}; - -ZeroClipboard.Client.prototype = { - - id: 0, // unique ID for us - ready: false, // whether movie is ready to receive events or not - movie: null, // reference to movie object - clipText: '', // text to copy to clipboard - handCursorEnabled: true, // whether to show hand cursor, or default pointer cursor - cssEffects: true, // enable CSS mouse effects on dom container - handlers: null, // user event handlers - - glue: function(elem) { - // glue to DOM element - // elem can be ID or actual DOM element object - this.domElement = ZeroClipboard.$(elem); - - // float just above object, or zIndex 99 if dom element isn't set - var zIndex = 99; - if (this.domElement.style.zIndex) { - zIndex = parseInt(this.domElement.style.zIndex) + 1; - } - - // find X/Y position of domElement - var box = ZeroClipboard.getDOMObjectPosition(this.domElement); - - // create floating DIV above element - this.div = document.createElement('div'); - var style = this.div.style; - style.position = 'absolute'; - style.left = '' + box.left + 'px'; - style.top = '' + box.top + 'px'; - style.width = '' + box.width + 'px'; - style.height = '' + box.height + 'px'; - style.zIndex = zIndex; - - // style.backgroundColor = '#f00'; // debug - - var body = document.getElementsByTagName('body')[0]; - body.appendChild(this.div); - - this.div.innerHTML = this.getHTML( box.width, box.height ); - }, - - getHTML: function(width, height) { - // return HTML for movie - var html = ''; - var flashvars = 'id=' + this.id + - '&width=' + width + - '&height=' + height; - - if (navigator.userAgent.match(/MSIE/)) { - // IE gets an OBJECT tag - var protocol = location.href.match(/^https/i) ? 'https://' : 'http://'; - html += ''; - } - else { - // all other browsers get an EMBED tag - html += ''; - } - return html; - }, - - hide: function() { - // temporarily hide floater offscreen - if (this.div) { - this.div.style.left = '-2000px'; - } - }, - - show: function() { - // show ourselves after a call to hide() - this.reposition(); - }, - - destroy: function() { - // destroy control and floater - if (this.domElement && this.div) { - this.hide(); - this.div.innerHTML = ''; - - var body = document.getElementsByTagName('body')[0]; - try { body.removeChild( this.div ); } catch(e) {;} - - this.domElement = null; - this.div = null; - } - }, - - reposition: function(elem) { - // reposition our floating div, optionally to new container - // warning: container CANNOT change size, only position - if (elem) { - this.domElement = ZeroClipboard.$(elem); - if (!this.domElement) this.hide(); - } - - if (this.domElement && this.div) { - var box = ZeroClipboard.getDOMObjectPosition(this.domElement); - var style = this.div.style; - style.left = '' + box.left + 'px'; - style.top = '' + box.top + 'px'; - } - }, - - setText: function(newText) { - // set text to be copied to clipboard - this.clipText = newText; - if (this.ready) this.movie.setText(newText); - }, - - addEventListener: function(eventName, func) { - // add user event listener for event - // event types: load, queueStart, fileStart, fileComplete, queueComplete, progress, error, cancel - eventName = eventName.toString().toLowerCase().replace(/^on/, ''); - if (!this.handlers[eventName]) this.handlers[eventName] = []; - this.handlers[eventName].push(func); - }, - - setHandCursor: function(enabled) { - // enable hand cursor (true), or default arrow cursor (false) - this.handCursorEnabled = enabled; - if (this.ready) this.movie.setHandCursor(enabled); - }, - - setCSSEffects: function(enabled) { - // enable or disable CSS effects on DOM container - this.cssEffects = !!enabled; - }, - - receiveEvent: function(eventName, args) { - // receive event from flash - eventName = eventName.toString().toLowerCase().replace(/^on/, ''); - - // special behavior for certain events - switch (eventName) { - case 'load': - // movie claims it is ready, but in IE this isn't always the case... - // bug fix: Cannot extend EMBED DOM elements in Firefox, must use traditional function - this.movie = document.getElementById(this.movieId); - if (!this.movie) { - var self = this; - setTimeout( function() { self.receiveEvent('load', null); }, 1 ); - return; - } - - // firefox on pc needs a "kick" in order to set these in certain cases - if (!this.ready && navigator.userAgent.match(/Firefox/) && navigator.userAgent.match(/Windows/)) { - var self = this; - setTimeout( function() { self.receiveEvent('load', null); }, 100 ); - this.ready = true; - return; - } - - this.ready = true; - this.movie.setText( this.clipText ); - this.movie.setHandCursor( this.handCursorEnabled ); - break; - - case 'mouseover': - if (this.domElement && this.cssEffects) { - this.domElement.addClass('hover'); - if (this.recoverActive) this.domElement.addClass('active'); - } - break; - - case 'mouseout': - if (this.domElement && this.cssEffects) { - this.recoverActive = false; - if (this.domElement.hasClass('active')) { - this.domElement.removeClass('active'); - this.recoverActive = true; - } - this.domElement.removeClass('hover'); - } - break; - - case 'mousedown': - if (this.domElement && this.cssEffects) { - this.domElement.addClass('active'); - } - break; - - case 'mouseup': - if (this.domElement && this.cssEffects) { - this.domElement.removeClass('active'); - this.recoverActive = false; - } - break; - } // switch eventName - - if (this.handlers[eventName]) { - for (var idx = 0, len = this.handlers[eventName].length; idx < len; idx++) { - var func = this.handlers[eventName][idx]; - - if (typeof(func) == 'function') { - // actual function reference - func(this, args); - } - else if ((typeof(func) == 'object') && (func.length == 2)) { - // PHP style object + method, i.e. [myObject, 'myMethod'] - func[0][ func[1] ](this, args); - } - else if (typeof(func) == 'string') { - // name of function - window[func](this, args); - } - } // foreach event handler defined - } // user defined handler for event - } - -}; diff --git a/js/infos.js b/js/infos.js index 4bf3ded..28e2d27 100644 --- a/js/infos.js +++ b/js/infos.js @@ -46,5 +46,4 @@ $(document).ready(function(){ $('#tabs ul#headers li a[href="#stat_tab_share"]').click(function(){ init_clipboard(); }); - -}); +}); \ No newline at end of file diff --git a/js/insert.js b/js/insert.js index eb8346b..1076949 100644 --- a/js/insert.js +++ b/js/insert.js @@ -59,8 +59,7 @@ function toggle_share_fill_boxes( url, shorturl, title ) { $('#statlink').attr( 'href', shorturl+'+' ).html( shorturl+'+' ); var tweet = ( title ? title + ' ' + shorturl : shorturl ); $('#tweet_body').val( tweet ).keypress(); - $('#shareboxes').slideDown(); - init_clipboard(); + $('#shareboxes').slideDown( '300', function(){ init_clipboard(); } ); // clipboard re-initialized after slidedown to make sure the invisible Flash element is correctly positionned $('#tweet_body').keypress(); } diff --git a/js/jquery.zclip.min.js b/js/jquery.zclip.min.js new file mode 100644 index 0000000..3548cc2 --- /dev/null +++ b/js/jquery.zclip.min.js @@ -0,0 +1,12 @@ +/* + * zClip :: jQuery ZeroClipboard v1.1.1 + * http://steamdev.com/zclip + * + * Copyright 2011, SteamDev + * Released under the MIT license. + * http://www.opensource.org/licenses/mit-license.php + * + * Date: Wed Jun 01, 2011 + */ + +(function(a){a.fn.zclip=function(c){if(typeof c=="object"&&!c.length){var b=a.extend({path:"ZeroClipboard.swf",copy:null,beforeCopy:null,afterCopy:null,clickAfter:true,setHandCursor:true,setCSSEffects:true},c);return this.each(function(){var e=a(this);if(e.is(":visible")&&(typeof b.copy=="string"||a.isFunction(b.copy))){ZeroClipboard.setMoviePath(b.path);var d=new ZeroClipboard.Client();if(a.isFunction(b.copy)){e.bind("zClip_copy",b.copy)}if(a.isFunction(b.beforeCopy)){e.bind("zClip_beforeCopy",b.beforeCopy)}if(a.isFunction(b.afterCopy)){e.bind("zClip_afterCopy",b.afterCopy)}d.setHandCursor(b.setHandCursor);d.setCSSEffects(b.setCSSEffects);d.addEventListener("mouseOver",function(f){e.trigger("mouseenter")});d.addEventListener("mouseOut",function(f){e.trigger("mouseleave")});d.addEventListener("mouseDown",function(f){e.trigger("mousedown");if(!a.isFunction(b.copy)){d.setText(b.copy)}else{d.setText(e.triggerHandler("zClip_copy"))}if(a.isFunction(b.beforeCopy)){e.trigger("zClip_beforeCopy")}});d.addEventListener("complete",function(f,g){if(a.isFunction(b.afterCopy)){e.trigger("zClip_afterCopy")}else{if(g.length>500){g=g.substr(0,500)+"...\n\n("+(g.length-500)+" characters not shown)"}e.removeClass("hover");alert("Copied text to clipboard:\n\n "+g)}if(b.clickAfter){e.trigger("click")}});d.glue(e[0],e.parent()[0]);a(window).bind("load resize",function(){d.reposition()})}})}else{if(typeof c=="string"){return this.each(function(){var f=a(this);c=c.toLowerCase();var e=f.data("zclipId");var d=a("#"+e+".zclip");if(c=="remove"){d.remove();f.removeClass("active hover")}else{if(c=="hide"){d.hide();f.removeClass("active hover")}else{if(c=="show"){d.show()}}}})}}}})(jQuery);var ZeroClipboard={version:"1.0.7",clients:{},moviePath:"ZeroClipboard.swf",nextId:1,$:function(a){if(typeof(a)=="string"){a=document.getElementById(a)}if(!a.addClass){a.hide=function(){this.style.display="none"};a.show=function(){this.style.display=""};a.addClass=function(b){this.removeClass(b);this.className+=" "+b};a.removeClass=function(d){var e=this.className.split(/\s+/);var b=-1;for(var c=0;c-1){e.splice(b,1);this.className=e.join(" ")}return this};a.hasClass=function(b){return !!this.className.match(new RegExp("\\s*"+b+"\\s*"))}}return a},setMoviePath:function(a){this.moviePath=a},dispatch:function(d,b,c){var a=this.clients[d];if(a){a.receiveEvent(b,c)}},register:function(b,a){this.clients[b]=a},getDOMObjectPosition:function(c,a){var b={left:0,top:0,width:c.width?c.width:c.offsetWidth,height:c.height?c.height:c.offsetHeight};if(c&&(c!=a)){b.left+=c.offsetLeft;b.top+=c.offsetTop}return b},Client:function(a){this.handlers={};this.id=ZeroClipboard.nextId++;this.movieId="ZeroClipboardMovie_"+this.id;ZeroClipboard.register(this.id,this);if(a){this.glue(a)}}};ZeroClipboard.Client.prototype={id:0,ready:false,movie:null,clipText:"",handCursorEnabled:true,cssEffects:true,handlers:null,glue:function(d,b,e){this.domElement=ZeroClipboard.$(d);var f=99;if(this.domElement.style.zIndex){f=parseInt(this.domElement.style.zIndex,10)+1}if(typeof(b)=="string"){b=ZeroClipboard.$(b)}else{if(typeof(b)=="undefined"){b=document.getElementsByTagName("body")[0]}}var c=ZeroClipboard.getDOMObjectPosition(this.domElement,b);this.div=document.createElement("div");this.div.className="zclip";this.div.id="zclip-"+this.movieId;$(this.domElement).data("zclipId","zclip-"+this.movieId);var a=this.div.style;a.position="absolute";a.left=""+c.left+"px";a.top=""+c.top+"px";a.width=""+c.width+"px";a.height=""+c.height+"px";a.zIndex=f;if(typeof(e)=="object"){for(addedStyle in e){a[addedStyle]=e[addedStyle]}}b.appendChild(this.div);this.div.innerHTML=this.getHTML(c.width,c.height)},getHTML:function(d,a){var c="";var b="id="+this.id+"&width="+d+"&height="+a;if(navigator.userAgent.match(/MSIE/)){var e=location.href.match(/^https/i)?"https://":"http://";c+=''}else{c+=''}return c},hide:function(){if(this.div){this.div.style.left="-2000px"}},show:function(){this.reposition()},destroy:function(){if(this.domElement&&this.div){this.hide();this.div.innerHTML="";var a=document.getElementsByTagName("body")[0];try{a.removeChild(this.div)}catch(b){}this.domElement=null;this.div=null}},reposition:function(c){if(c){this.domElement=ZeroClipboard.$(c);if(!this.domElement){this.hide()}}if(this.domElement&&this.div){var b=ZeroClipboard.getDOMObjectPosition(this.domElement);var a=this.div.style;a.left=""+b.left+"px";a.top=""+b.top+"px"}},setText:function(a){this.clipText=a;if(this.ready){this.movie.setText(a)}},addEventListener:function(a,b){a=a.toString().toLowerCase().replace(/^on/,"");if(!this.handlers[a]){this.handlers[a]=[]}this.handlers[a].push(b)},setHandCursor:function(a){this.handCursorEnabled=a;if(this.ready){this.movie.setHandCursor(a)}},setCSSEffects:function(a){this.cssEffects=!!a},receiveEvent:function(d,f){d=d.toString().toLowerCase().replace(/^on/,"");switch(d){case"load":this.movie=document.getElementById(this.movieId);if(!this.movie){var c=this;setTimeout(function(){c.receiveEvent("load",null)},1);return}if(!this.ready&&navigator.userAgent.match(/Firefox/)&&navigator.userAgent.match(/Windows/)){var c=this;setTimeout(function(){c.receiveEvent("load",null)},100);this.ready=true;return}this.ready=true;try{this.movie.setText(this.clipText)}catch(h){}try{this.movie.setHandCursor(this.handCursorEnabled)}catch(h){}break;case"mouseover":if(this.domElement&&this.cssEffects){this.domElement.addClass("hover");if(this.recoverActive){this.domElement.addClass("active")}}break;case"mouseout":if(this.domElement&&this.cssEffects){this.recoverActive=false;if(this.domElement.hasClass("active")){this.domElement.removeClass("active");this.recoverActive=true}this.domElement.removeClass("hover")}break;case"mousedown":if(this.domElement&&this.cssEffects){this.domElement.addClass("active")}break;case"mouseup":if(this.domElement&&this.cssEffects){this.domElement.removeClass("active");this.recoverActive=false}break}if(this.handlers[d]){for(var b=0,a=this.handlers[d].length;b