From d6ba4cbce4545c3d8e52ef668cd136c2f584e8f8 Mon Sep 17 00:00:00 2001
From: Nathan Rajlich <nathan@tootallnate.net>
Date: Fri, 31 Aug 2012 17:34:29 -0700
Subject: [PATCH] initial commit

---
 .gitignore        |   2 +
 Makefile          |  11 ++
 Readme.md         |   5 +
 ZeroClipboard.swf | Bin 0 -> 1352 bytes
 component.json    |  11 ++
 index.js          | 377 ++++++++++++++++++++++++++++++++++++++++++++++
 6 files changed, 406 insertions(+)
 create mode 100644 .gitignore
 create mode 100644 Makefile
 create mode 100644 Readme.md
 create mode 100644 ZeroClipboard.swf
 create mode 100644 component.json
 create mode 100644 index.js

diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..48a2e24
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,2 @@
+components
+build
diff --git a/Makefile b/Makefile
new file mode 100644
index 0000000..eae4117
--- /dev/null
+++ b/Makefile
@@ -0,0 +1,11 @@
+
+build: components
+	@component build
+
+components: component.json
+	@component install --dev
+
+clean:
+	rm -fr build components template.js
+
+.PHONY: clean
diff --git a/Readme.md b/Readme.md
new file mode 100644
index 0000000..e15e335
--- /dev/null
+++ b/Readme.md
@@ -0,0 +1,5 @@
+
+# clipboard-dom
+
+  Makes a DOM element (i.e. <button>) write to the system clipboard using ZeroClipboard
+
diff --git a/ZeroClipboard.swf b/ZeroClipboard.swf
new file mode 100644
index 0000000000000000000000000000000000000000..dac31a4bfe9548bf7fe99324231e3ee5437e5cf6
GIT binary patch
literal 1352
zcmV-O1-JS`S5ppt2mk<h+I>~)a??f>-Xlv|Nse=mNzBcVKp@zbVkjkPk|x**ga+Ip
zq;wdVdM&MNfh@VwI!<OfQ(mQi`T~7`K0s$W=0{(kGo9(LK0@hAa+8=c-LZDR^X)lj
z&t)wgA@O&FMt?+T7EpC!4k7gY)GvV0T433$PpdomqqggXt6W-NY%$hZ)%9MlSL)p^
z`9V`(URhbujj~=Y7r90;JoXqlDth7k;zsPCN<%YnI?VCCd?b^G-(~BIivzEgdE&Iw
z4cyqJW$M(WZR)X5UoI_kN0zy2`$3zq4bthjj!7bS`cW}#`R1D*Iiy9~C1Gn#KUIuu
zn8RGUv1R!Un%{BhQT|ST>(oBhPE;ag>om}fGij2@x@7uoy%YFW*W@wT+*NFR)+BP#
z={8&^Y|&t&>%H;(UUI}K8|jz<CCnez_?L_JUE(#nq)9inpTv77avURJJfCheU%pq!
zmyP9e5=O+X=^s>k!0-lcpz8RasWns)-oJnULQC-u%lr}LA6}q%eE02N{tEB-ui6V5
z_!ZabG<*_R=;!HmuE;l#9gsF%M&qc2gtveHBqIS0#v>#i`i?acH=slhqpnHY(IW4&
z!10>+zVEw~c$p#JnMB`m!j4Oh<^4|JFe*5f+~_jqdy2^wpV1?RL&~Bx!`Fwzvnt&n
z^n<}^;c>`lTi%bC5w3CKesmDd5u<@e+==Z0*!B2o6O(3#qKV@m%xo#V(H)mEDw@P~
z)wbUaY3+~(N`ks9p{l%dI7SB@DP+7o!m~YzxK7i<p1;p+sTxM}W8b36J~g{My<=EP
zbEkf<>bHsGX?s4gXt3+qz8LsE)7%qT>yW74Jk(IGHC|JbT^ZcS)7!YUe_Jmb#$CP9
zbzJ6n=_KPWbKG!xsJN?1aTkWkYO*HoD?b0%Ivx!!4=csxA|`VVX`*=kf1F%6dj(eG
zD^MMjl?L!q;;If4UcMAx`#k%k&ry9cyo{%<Rhj|mv>Y>38?@<oJC5sWafP2d7Hg$r
z_>ely7E`Q%^q%sAdEq-Pq7cifv>eyc9!HId&zCBDyOl4-`A#hEIsBsVEVakAgZ=Gq
zYF}+XRR{3k*?_Fpo<C6%c<^O9^2vMFAm$q}>W>=dcu0b9?1Ka|L$#RrPvx>7FZg5@
zvZ<^xizSpD%T7w@94I%kH*+|*l)IHH<chhHFe-tds9IVa$&8MTPu#{JU_rznVURIk
zoKmr*VJVHJ5eyj&qgWotFoE$DhAf8j7%pPCjO9Frt2i}}VFAN64A(I%sv2O;z*-pt
zcY6oJCm8Nx_!PrE3@aE`F?@!FH4N(*HZXjSVH3j^hWi*QSl!0L4o*G5sfReVt3_`E
z0O8{k9|AxslElHA10-1$kt|_^QUFTyQc`260m5lOoB<Ui5s=2M6gAa19z<4xrp?qx
z>S`?m_0hs~9T#S}FedU%A==Cg*mL=WOr0fX2c&qGoEwnRSu!^uWloO#0e$27(r-q8
z7uClL7sv#kFOkXmRN+c(8YsM)>DyWR+|CTxvv23x(5K*noonHK-^K-f=R6dacP;>z
zU&)VT)KdDka-Cd^=SzIHFBhSfhZrrOrTVyig+Eto^CG8oAPcXqaZtM!Y1FUVi<?lp
zAtd<brf`CnHd80~)~0xZ3!4(hJh9Qfovsxll<C`Af~KPot4X#{LNJH0AgCJd8~t}J
zl~+KCM3sxS@{U~Mgvwi~%=Zn7>T^b2H|mB_UpDGxqb~E`*XUwAS`t^CoQggl!=IH+
K&in()O;oobTcV->

literal 0
HcmV?d00001

diff --git a/component.json b/component.json
new file mode 100644
index 0000000..9044c6e
--- /dev/null
+++ b/component.json
@@ -0,0 +1,11 @@
+{
+  "name": "clipboard-dom",
+  "description": "Makes a DOM element (i.e. <button>) write to the system clipboard",
+  "version": "0.0.1",
+  "keywords": ["copy", "clipboard", "dom", "click", "button"],
+  "dependencies": {
+    "component/classes": "*",
+    "component/emitter": "*"
+  },
+  "scripts": ["index.js"]
+}
diff --git a/index.js b/index.js
new file mode 100644
index 0000000..a044d56
--- /dev/null
+++ b/index.js
@@ -0,0 +1,377 @@
+
+/**
+ * Module dependencies.
+ */
+
+var classes = require('classes');
+var Emitter = require('emitter');
+
+/**
+ * URL to the "ZeroClipboard.swf" file.
+ */
+
+var swfPath = 'ZeroClipboard.swf';
+
+/**
+ * Sets "display: none" on the DOM node.
+ *
+ * @api private
+ */
+
+function hide(node){
+  node.style.display = 'none';
+}
+
+/**
+ * Sets "display: " on the DOM node.
+ *
+ * @api private
+ */
+
+function show(node){
+  node.style.display = '';
+}
+
+/**
+ * Adds class name "name" to the DOM node.
+ *
+ * @api private
+ */
+
+function addClass(node, name){
+  classes(node).add(name);
+}
+
+/**
+ * Removes class name "name" from the DOM node.
+ *
+ * @api private
+ */
+
+function removeClass(node, name){
+  classes(node).remove(name);
+}
+
+/**
+ * Returns `true` if the DOM node has class "name", `false` otherwise.
+ *
+ * @api private
+ */
+
+function hasClass(node, name){
+  classes(node).has(name);
+}
+
+/**
+ * Get absolute coordinates for dom element.
+ * XXX: this probably belongs in a more focused component ("position"?)
+ *
+ * @api private
+ */
+
+function getDOMObjectPosition(obj, stopObj){
+  var info = {
+    left: 0,
+    top: 0,
+    width: obj.width ? obj.width : obj.offsetWidth,
+    height: obj.height ? obj.height : obj.offsetHeight
+  };
+
+  while (obj && (obj != stopObj)) {
+    info.left += obj.offsetLeft;
+    info.top += obj.offsetTop;
+    obj = obj.offsetParent;
+  }
+
+  return info;
+}
+
+/**
+ * Dispatches an event from the ZeroClipboard SWF Flash environment.
+ */
+
+function dispatch(id, eventName, args){
+  var client = window.ZeroClipboard.clients[id];
+  if (client) {
+    client.receiveEvent(eventName, args);
+  }
+}
+
+/**
+ * Ensure that the ZeroClipboard-required global variables are set.
+ */
+
+window.ZeroClipboard = { dispatch: dispatch, nextId: 1, clients: {} };
+
+/**
+ * The Client constructor. Turns a DOM node into a "Copy to Clipboard" button.
+ * To simulate ":hover" and ":active" styling on "node", define ".hover" and
+ * ".active" CSS classes.
+ *
+ * @param node The DOM node to turn into a "Copy to Clipboard" button.
+ * @param parent (optional) The parent DOM node of "node" that "has layout".
+ * @api public
+ */
+
+function Client(node, parent){
+  if (!(this instanceof Client)) {
+    return new Client(node, parent);
+  }
+  Emitter.call(this);
+  this.loaded = false;    // "true" when the SWF movie has loaded
+  this._text = '';        // the text to copy to the clipboard. set with "text()".
+  this._cursor = true;    // whether to show the hand cursor on mouse-over
+  this.zIndex = 99;       // default z-index of the movie object
+
+  // unique ID
+  this.id = window.ZeroClipboard.nextId++;
+  this.movieId = 'ZeroClipboardMovie_' + this.id;
+
+  // register client with ZeroClipboard global to receive flash events
+  window.ZeroClipboard.clients[this.id] = this;
+
+  // create movie
+  if (node) this.render(node, parent);
+}
+
+/**
+ * Inherits from `Emitter.prototype`.
+ */
+
+Client.prototype.__proto__ = Emitter.prototype;
+
+
+Client.prototype.glue = function(elem, appendElem, stylesToAdd) {
+  // glue to DOM element
+  // elem can be ID or actual DOM element object
+  this.domElement = elem;
+
+  // float just above object, or default zIndex if dom element isn't set
+  if (this.domElement.style.zIndex) {
+    this.zIndex = parseInt(this.domElement.style.zIndex, 10) + 1;
+  }
+
+  if (typeof(appendElem) == 'string') {
+    appendElem = appendElem;
+  }
+  else if (typeof(appendElem) == 'undefined') {
+    appendElem = document.getElementsByTagName('body')[0];
+  }
+
+  // find X/Y position of domElement
+  var box = getDOMObjectPosition(this.domElement, appendElem);
+
+  // 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 = this.zIndex;
+
+  if (typeof(stylesToAdd) == 'object') {
+    for (var addedStyle in stylesToAdd) {
+      style[addedStyle] = stylesToAdd[addedStyle];
+    }
+  }
+
+  // style.backgroundColor = '#f00'; // debug
+
+  appendElem.appendChild(this.div);
+
+  this.div.innerHTML = this.getHTML( box.width, box.height );
+};
+
+Client.prototype.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 = /^https/i.test(location.href) ? 'https://' : 'http://';
+    html += '<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="'+protocol+'download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" width="'+width+'" height="'+height+'" id="'+this.movieId+'" align="middle"><param name="allowScriptAccess" value="always" /><param name="allowFullScreen" value="false" /><param name="movie" value="'+swfPath+'" /><param name="loop" value="false" /><param name="menu" value="false" /><param name="quality" value="best" /><param name="bgcolor" value="#ffffff" /><param name="flashvars" value="'+flashvars+'"/><param name="wmode" value="transparent"/></object>';
+  }
+  else {
+    // all other browsers get an EMBED tag
+    html += '<embed id="'+this.movieId+'" src="'+swfPath+'" loop="false" menu="false" quality="best" bgcolor="#ffffff" width="'+width+'" height="'+height+'" name="'+this.movieId+'" align="middle" allowScriptAccess="always" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" flashvars="'+flashvars+'" wmode="transparent" />';
+  }
+  return html;
+};
+
+/**
+ * temporarily hide floater offscreen
+ */
+
+Client.prototype.hide = function(){
+  if (this.div) {
+    this.div.style.left = '-2000px';
+  }
+};
+
+/**
+ * show ourselves after a call to hide()
+ */
+
+Client.prototype.show = function(){
+  this.reposition();
+};
+
+/**
+ * destroy control and floater
+ */
+
+Client.prototype.destroy = function(){
+  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 our floating div, optionally to new container.
+ *
+ * @api private
+ */
+
+Client.prototype.reposition = function(elem){
+  // warning: container CANNOT change size, only position
+  if (elem) {
+    this.domElement = elem;
+    if (!this.domElement) this.hide();
+  }
+
+  if (this.domElement && this.div) {
+    var box = getDOMObjectPosition(this.domElement);
+    var style = this.div.style;
+    style.left = '' + box.left + 'px';
+    style.top = '' + box.top + 'px';
+  }
+};
+
+/**
+ * Set the text that will be copied to clipboard upon a user click.
+ *
+ * @param text String the text that will be copied to the clipboard on-click
+ * @api public
+ */
+
+Client.prototype.text =
+Client.prototype.setText = function(text){
+  if (0 === arguments.length) {
+    return this._text;
+  } else {
+    this._text = text;
+    if (this.loaded) this.movie.setText(text);
+  }
+};
+
+/**
+ * Enable hand cursor (true), or default arrow cursor (false).
+ *
+ * @param enabled Boolean true enabled the cursor hand, false enables the arrow
+ * @api public
+ */
+
+Client.prototype.cursor =
+Client.prototype.setHandCursor = function(enabled){
+  if (0 === arguments.length) {
+    return this._cursor;
+  } else {
+    var e = !!enabled;
+    this._cursor = e;
+    if (this.loaded) this.movie.setHandCursor(e);
+  }
+};
+
+/**
+ * Receive event from flash. Process the event and possibly relay the event to
+ * this client instance using "emit()".
+ *
+ * @api private
+ */
+
+Client.prototype.receiveEvent = function(eventName, args){
+  eventName = eventName.toString().toLowerCase().replace(/^on/, '');
+
+  // special behavior for certain events
+  switch (eventName) {
+    case 'load':
+      // movie claims it is loaded, 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 Windows needs a "kick" in order to set these in certain cases
+      if (!this.loaded && navigator.userAgent.match(/Firefox/) && navigator.userAgent.match(/Windows/)) {
+        var self = this;
+        setTimeout(function(){ self.receiveEvent('load', null); }, 100);
+        this.loaded = true;
+        return;
+      }
+
+      this.loaded = true;
+      this.movie.setText(this._text);
+      this.movie.setHandCursor(this._cursor);
+      break;
+
+    case 'mouseover':
+      if (this.domElement) {
+        addClass(this.domElement, 'hover');
+        if (this.recoverActive) {
+          addClass(this.domElement, 'active');
+        }
+      }
+      break;
+
+    case 'mouseout':
+      if (this.domElement) {
+        this.recoverActive = false;
+        if (hasClass(this.domElement, 'active')) {
+          removeClass(this.domElement, 'active');
+          this.recoverActive = true;
+        }
+        removeClass(this.domElement, 'hover');
+      }
+      break;
+
+    case 'mousedown':
+      if (this.domElement) {
+        addClass(this.domElement, 'active');
+      }
+      break;
+
+    case 'mouseup':
+      if (this.domElement) {
+        removeClass(this.domElement, 'active');
+        this.recoverActive = false;
+      }
+      break;
+  }
+
+  // emit the event
+  var a;
+  if ('string' == typeof args) {
+    a = [eventName, args]; // "args" is only a string
+  } else if (args) {
+    a = args.slice(0); // "args" is actually an array
+    a.unshift(eventName);
+  } else {
+    a = [eventName];
+  }
+  this.emit.apply(this, a);
+};