Skip to content
This repository was archived by the owner on Feb 16, 2021. It is now read-only.

Commit f27bfbb

Browse files
JamesMGreeneJamesMGreene
committed
Added a v2.x demo. Reorganized ZC JS/SWF files.
1 parent ce1c6e1 commit f27bfbb

38 files changed

+399
-9
lines changed

‎index-v2.x.html

Lines changed: 94 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,94 @@
1+
<!doctype html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<meta http-equiv="X-UA-Compatible" content="chrome=1">
6+
<title>ZeroClipboard v2.x</title>
7+
<meta name="description" content="Copy to clipboard html browser.">
8+
<link rel="stylesheet" href="stylesheets/styles.css">
9+
<link rel="stylesheet" href="stylesheets/pygment_trac.css">
10+
<script type="text/javascript" src="javascripts/scale.fix.js"></script>
11+
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
12+
<!--[if lt IE 9]>
13+
<script type="text/javascript" src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
14+
<![endif]-->
15+
</head>
16+
<body>
17+
<div class="wrapper">
18+
<header>
19+
<h2 class="header">ZeroClipboard v2.x</h2>
20+
<p class="header">The ZeroClipboard library provides an easy way to copy text to the clipboard using an invisible Adobe Flash movie and a JavaScript interface. The &quot;Zero&quot; signifies that the library is invisible and the user interface is left entirely up to you.</p>
21+
22+
<ul>
23+
<li class="download"><a class="buttons" href="#" disabled="disabled"><em>???</em> ZIP</a></li>
24+
<li><a class="buttons github" href="https://github.com/zeroclipboard/zeroclipboard">View On GitHub</a></li>
25+
</ul>
26+
</header>
27+
<section>
28+
<h1>ZeroClipboard v2.x</h1>
29+
<div>The ZeroClipboard library provides an easy way to copy text to the clipboard using an invisible <a href="http://en.wikipedia.org/wiki/Adobe_Flash">Adobe Flash</a> movie and a <a href="http://en.wikipedia.org/wiki/JavaScript">JavaScript</a> interface. The "Zero" signifies that the library is invisible and the user interface is left entirely up to you.</div>
30+
31+
<h2>WARNING!</h2>
32+
<div>This page is for the <code>v2.x</code> version of ZeroClipboard, which is <strong>currently <em>unstable</em></strong>. For the <strong>stable</strong> <code>v1.x</code>, please see the <a href="index.html"><code>v1.x</code> demo page</a>.</div>
33+
34+
<h3>Testing this page locally</h3>
35+
<div>To test this page locally, checkout the <code>gh-pages</code> branch and run <code>make</code> to open <a href="http://localhost:3000/">localhost:3000</a>, then navigate to <a href="index-v2.x.html">index-v2.x.html</a>.</div>
36+
37+
<h3>Demo</h3>
38+
<div>
39+
<div><strong>Browser:</strong> <script type="text/javascript">document.write(navigator.userAgent);</script></div>
40+
<div><strong>Current config:</strong> <span id="current-demo-config">???</span></div>
41+
<div>
42+
<strong>Choose config:</strong>
43+
<!--
44+
IMPORTANT!!!
45+
The version numbers listed in the following `demo-version` select menu control the actual script and SWF version
46+
targeting (see "boot.js"). This is the only place you need to change the version numbers!
47+
Double-check that the current stable release is marked as the only `option` with the `selected` attribute.
48+
-->
49+
<select id="demo-version">
50+
<!--<option>git:master</option>-->
51+
<option selected="selected">git:master</option>
52+
<!--<option>v2.0.0</option>-->
53+
</select>
54+
<select id="demo-type">
55+
<option value="traditional" selected="selected">Traditional</option>
56+
<option value="amd">AMD</option>
57+
<option value="commonjs" disabled="disabled">CommonJS</option>
58+
</select>
59+
<button id="boot" type="button">Boot!</button>
60+
</div>
61+
<div class="demo-area">
62+
<h4><label for="fe_text">Text to Copy:</label></h4>
63+
<textarea id="fe_text" cols="50" rows="3">Copy me!</textarea>
64+
<p><button id="d_clip_button" class="my_clip_button" title="Click me to copy to clipboard." data-clipboard-target="fe_text" data-clipboard-text="Default clipboard text from attribute"><b>Copy To Clipboard...</b></button></p>
65+
<h4><label for="testarea">Paste Here:</label></h4>
66+
<textarea id="testarea" cols="50" rows="3"></textarea>
67+
<p><button id="clear-test">Clear Test Area</button></p>
68+
</div>
69+
<h4>Debug Console:</h4>
70+
<div id="d_debug"></div>
71+
</div>
72+
</section>
73+
<footer>
74+
<p><small>Hosted on <a href="https://pages.github.com">GitHub Pages</a> using the Dinky theme</small></p>
75+
</footer>
76+
</div>
77+
<!--[if !IE]><script type="text/javascript">fixScale(document);</script><!--<![endif]-->
78+
<script type="text/javascript" src="javascripts/vendor/jquery.min.js"></script>
79+
<script type="text/javascript" src="javascripts/v2.x/boot.js"></script>
80+
<script type="text/javascript">
81+
var _gauges = _gauges || [];
82+
(function() {
83+
var t = document.createElement('script');
84+
t.type = 'text/javascript';
85+
t.async = true;
86+
t.id = 'gauges-tracker';
87+
t.setAttribute('data-site-id', '501d5697f5a1f502f2000057');
88+
t.src = '//secure.gaug.es/track.js';
89+
var s = document.getElementsByTagName('script')[0];
90+
s.parentNode.insertBefore(t, s);
91+
})();
92+
</script>
93+
</body>
94+
</html>

‎index.html

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,9 @@ <h2 class="header">ZeroClipboard</h2>
2929
<h1>ZeroClipboard</h1>
3030
<div>The ZeroClipboard library provides an easy way to copy text to the clipboard using an invisible <a href="http://en.wikipedia.org/wiki/Adobe_Flash">Adobe Flash</a> movie and a <a href="http://en.wikipedia.org/wiki/JavaScript">JavaScript</a> interface. The "Zero" signifies that the library is invisible and the user interface is left entirely up to you.</div>
3131

32+
<h3>Looking for <code>v2.x</code>?</h3>
33+
<div>This page is for the <strong>stable</strong> <code>v1.x</code> version of ZeroClipboard. For the <strong>currently <em>unstable</em></strong> <code>v2.x</code>, please see the <a href="index-v2.x.html"><code>v2.x</code> demo page</a>.</div>
34+
3235
<h3>Testing this page locally</h3>
3336
<div>To test this page locally, checkout the <code>gh-pages</code> branch and run <code>make</code> to open <a href="http://localhost:3000/">localhost:3000</a></div>
3437

@@ -83,7 +86,7 @@ <h4>Debug Console:</h4>
8386
</div>
8487
<!--[if !IE]><script type="text/javascript">fixScale(document);</script><!--<![endif]-->
8588
<script type="text/javascript" src="javascripts/vendor/jquery.min.js"></script>
86-
<script type="text/javascript" src="javascripts/boot.js"></script>
89+
<script type="text/javascript" src="javascripts/v1.x/boot.js"></script>
8790
<script type="text/javascript">
8891
var _gauges = _gauges || [];
8992
(function() {

‎javascripts/boot.js renamed to ‎javascripts/v1.x/boot.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -65,16 +65,16 @@
6565
case "traditional": {
6666
// Create a script block to load the ZeroClipboard library
6767
var zcLibSrcUrl = !loadingEdge ?
68-
"javascripts/zc/ZeroClipboard_" + targetVersion + ".js" :
68+
"javascripts/zc/v" + targetVersion + "/ZeroClipboard.js" :
6969
"//rawgithub.com/zeroclipboard/ZeroClipboard/1.x-master/ZeroClipboard.js";
7070
addScript(zcLibSrcUrl);
7171

7272
// Create a cross-domain configuration script block if loading "edge"
73-
var zcConfigSrcUrl = "javascripts/config-traditional" + (loadingEdge ? "-edge" : "") + ".js";
73+
var zcConfigSrcUrl = "javascripts/v1.x/config-traditional" + (loadingEdge ? "-edge" : "") + ".js";
7474
addScript(zcConfigSrcUrl);
7575

7676
// Create a script block to hook up the demo
77-
addScript("javascripts/demo-traditional.js");
77+
addScript("javascripts/v1.x/demo-traditional.js");
7878

7979
break;
8080
}
@@ -90,11 +90,11 @@
9090
}
9191

9292
// Create a cross-domain configuration script block if loading "edge"
93-
var zcConfigSrcUrl = "javascripts/config-amd" + (loadingEdge ? "-edge" : "") + ".js";
93+
var zcConfigSrcUrl = "javascripts/v1.x/config-amd" + (loadingEdge ? "-edge" : "") + ".js";
9494
addScript(zcConfigSrcUrl);
9595

9696
// Create a script block to hook up the demo
97-
addScript("javascripts/demo-amd.js");
97+
addScript("javascripts/v1.x/demo-amd.js");
9898

9999
break;
100100
}

‎javascripts/config-amd-edge.js renamed to ‎javascripts/v1.x/config-amd-edge.js

File renamed without changes.

‎javascripts/config-amd.js renamed to ‎javascripts/v1.x/config-amd.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313

1414
// paths are relative to the aforementioned `baseUrl`
1515
paths: {
16-
"ZeroClipboard_lib": "zc/ZeroClipboard_" + window._ZC_DEMO_TARGET_VERSION,
16+
"ZeroClipboard_lib": "zc/v" + window._ZC_DEMO_TARGET_VERSION + "/ZeroClipboard",
1717
"jquery": "vendor/jquery.min",
1818
"domReady": "vendor/requirejs-plugins/domReady"
1919
}
@@ -42,7 +42,7 @@
4242
// - "//localhost:3000/javascripts/ZeroClipboard.swf"
4343
// - "//my.awesomecdn.com/javascripts/ZeroClipboard.swf"
4444
// - "http://my.awesomecdn.com/javascripts/ZeroClipboard.swf"
45-
moviePath: "javascripts/zc/ZeroClipboard_" + ZeroClipboard.version + ".swf"
45+
moviePath: "javascripts/zc/v" + ZeroClipboard.version + "/ZeroClipboard.swf"
4646

4747
});
4848

‎javascripts/config-traditional-edge.js renamed to ‎javascripts/v1.x/config-traditional-edge.js

File renamed without changes.

‎javascripts/config-traditional.js renamed to ‎javascripts/v1.x/config-traditional.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,6 @@ ZeroClipboard.setDefaults({
99
// - "//localhost:3000/javascripts/ZeroClipboard.swf"
1010
// - "//my.awesomecdn.com/javascripts/ZeroClipboard.swf"
1111
// - "http://my.awesomecdn.com/javascripts/ZeroClipboard.swf"
12-
moviePath: "javascripts/zc/ZeroClipboard_" + ZeroClipboard.version + ".swf"
12+
moviePath: "javascripts/zc/v" + ZeroClipboard.version + "/ZeroClipboard.swf"
1313

1414
});

‎javascripts/demo-amd.js renamed to ‎javascripts/v1.x/demo-amd.js

File renamed without changes.

‎javascripts/demo-traditional.js renamed to ‎javascripts/v1.x/demo-traditional.js

File renamed without changes.

‎javascripts/v2.x/boot.js

Lines changed: 127 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,127 @@
1+
(function() {
2+
function parseQuery(query) {
3+
var ret = {};
4+
var pairs = query.slice(1).toLowerCase().split("&");
5+
for (var i = 0, len = pairs.length; i < len; i++) {
6+
var kvp = pairs[i].split("=");
7+
if (kvp.length > 1) {
8+
ret[kvp[0]] = kvp.slice(1).join(",");
9+
}
10+
}
11+
return ret;
12+
}
13+
14+
function addScript(srcUrl) {
15+
// Stupid IE: http://www.guypo.com/technical/ies-premature-execution-problem/
16+
document.write('<scr' + 'ipt type="text/javascript" src="' + srcUrl + '"></script>');
17+
}
18+
19+
20+
// Grab the default configuration
21+
var $demoVersionDropdown = $("#demo-version");
22+
var defaultVersion = $demoVersionDropdown.find(":selected").val();
23+
var $demoTypeDropdown = $("#demo-type");
24+
var defaultType = $demoTypeDropdown.find(":selected").val();
25+
26+
// Identify the desired demo based on the current URL's query string
27+
var query = parseQuery(window.location.search);
28+
if (!query.version) {
29+
query.version = defaultVersion;
30+
}
31+
if (!query.type) {
32+
query.type = defaultType;
33+
}
34+
35+
// Select the correct demo type for this page load
36+
$demoVersionDropdown.find("option").filter(function() { return $(this).val() === query.version; }).prop("selected", true);
37+
$demoTypeDropdown.find("option[value='" + query.type + "']").prop("selected", true);
38+
39+
$("#current-demo-config").html("<code>" + query.version + "</code> &mdash; " + $demoTypeDropdown.find(":selected").text());
40+
41+
// Listen for a click and refresh the page
42+
$("#boot").on("click", function(evt) {
43+
var selectedVersion = $demoVersionDropdown.find(":selected").val() || defaultVersion;
44+
var selectedType = $demoTypeDropdown.find(":selected").val() || defaultType;
45+
if ((query.version !== selectedVersion) || (query.type !== selectedType)) {
46+
window.location.href = "?version=" + selectedVersion + "&type=" + selectedType;
47+
}
48+
});
49+
50+
51+
// Adjust the stable version's download link
52+
var stableVersion = defaultVersion; // e.g. "v1.1.7"
53+
var $downloadLink = $(".download > a");
54+
$downloadLink
55+
.on("click", function(event){
56+
if (this.getAttribute("disabled") !== undefined) {
57+
event.preventDefault();
58+
}
59+
});
60+
61+
if (stableVersion !== "git:master") {
62+
$downloadLink
63+
.removeAttr("disabled")
64+
.attr("href", "https://github.com/zeroclipboard/ZeroClipboard/archive/" + stableVersion + ".zip")
65+
.text(stableVersion + " ZIP");
66+
}
67+
68+
69+
// Boot-load the actual demo code
70+
var targetVersion = query.version.replace(/^v/, "");
71+
if (targetVersion) {
72+
var loadingEdge = targetVersion === "git:master";
73+
74+
switch (query.type) {
75+
76+
case "traditional": {
77+
// Create a script block to load the ZeroClipboard library
78+
var zcLibSrcUrl = !loadingEdge ?
79+
"javascripts/zc/v" + targetVersion + "/ZeroClipboard.js" :
80+
"//rawgithub.com/zeroclipboard/ZeroClipboard/master/ZeroClipboard.js";
81+
addScript(zcLibSrcUrl);
82+
83+
// Create a cross-domain configuration script block if loading "edge"
84+
var zcConfigSrcUrl = "javascripts/v2.x/config-traditional" + (loadingEdge ? "-edge" : "") + ".js";
85+
addScript(zcConfigSrcUrl);
86+
87+
// Create a script block to hook up the demo
88+
addScript("javascripts/v2.x/demo-traditional.js");
89+
90+
break;
91+
}
92+
93+
case "amd": {
94+
// Create a script block to load the RequireJS AMD Loader library
95+
var requirejsLibEl = addScript("javascripts/vendor/require.js");
96+
97+
// Shamefully define a global variable to curry the version number along to the AMD config.
98+
// Could've alternatively `define`d a named AMD module but there really wasn't any benefit.
99+
if (!loadingEdge) {
100+
window._ZC_DEMO_TARGET_VERSION = targetVersion;
101+
}
102+
103+
// Create a cross-domain configuration script block if loading "edge"
104+
var zcConfigSrcUrl = "javascripts/v2.x/config-amd" + (loadingEdge ? "-edge" : "") + ".js";
105+
addScript(zcConfigSrcUrl);
106+
107+
// Create a script block to hook up the demo
108+
addScript("javascripts/v2.x/demo-amd.js");
109+
110+
break;
111+
}
112+
113+
case "commonjs": {
114+
alert("There is no CommonJS demo implemented yet.");
115+
break;
116+
}
117+
118+
default: {
119+
alert("You've requested an invalid `type` for the demo: '" + query.type + "'");
120+
break;
121+
}
122+
}
123+
}
124+
else {
125+
alert("You've requested an invalid `version` for the demo: '" + targetVersion + "'");
126+
}
127+
})();

‎javascripts/v2.x/config-amd-edge.js

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
//
2+
// WARNING!
3+
// This is NOT a recommended example of setting up an AMD demo. However, doing it this way
4+
// prevented us from having to create multiple near-duplicate files with different version
5+
// info just to be able to show demos for the various versions of ZeroClipboard.
6+
//
7+
8+
(function() {
9+
10+
requirejs.config({
11+
// Note that the path itself must be relative to the page serving the scripts
12+
baseUrl: "javascripts/",
13+
14+
// paths are relative to the aforementioned `baseUrl`
15+
paths: {
16+
"ZeroClipboard_lib": "//rawgithub.com/zeroclipboard/ZeroClipboard/master/ZeroClipboard",
17+
"jquery": "vendor/jquery.min",
18+
"domReady": "vendor/requirejs-plugins/domReady"
19+
}
20+
});
21+
22+
// If jQuery was already loaded (which it should've been), add a fake AMD wrapper for it
23+
if (window.jQuery) {
24+
define("jquery", function() {
25+
return window.jQuery
26+
});
27+
}
28+
29+
// Messy but strictly for demo purposes: wrap ZeroClipboard with another module
30+
define("ZeroClipboard", ["ZeroClipboard_lib"], function(ZeroClipboard) {
31+
32+
/*
33+
ZeroClipboard.config({
34+
35+
36+
37+
});
38+
*/
39+
40+
return ZeroClipboard;
41+
});
42+
43+
})();

‎javascripts/v2.x/config-amd.js

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
//
2+
// WARNING!
3+
// This is NOT a recommended example of setting up an AMD demo. However, doing it this way
4+
// prevented us from having to create multiple near-duplicate files with different version
5+
// info just to be able to show demos for the various versions of ZeroClipboard.
6+
//
7+
8+
(function() {
9+
10+
requirejs.config({
11+
// Note that the path itself must be relative to the page serving the scripts
12+
baseUrl: "javascripts/",
13+
14+
// paths are relative to the aforementioned `baseUrl`
15+
paths: {
16+
"ZeroClipboard_lib": "zc/v" + window._ZC_DEMO_TARGET_VERSION + "/ZeroClipboard",
17+
"jquery": "vendor/jquery.min",
18+
"domReady": "vendor/requirejs-plugins/domReady"
19+
}
20+
});
21+
22+
// Delete the shameful global variable
23+
delete window._ZC_DEMO_TARGET_VERSION;
24+
25+
// If jQuery was already loaded (which it should've been), add a fake AMD wrapper for it
26+
if (window.jQuery) {
27+
define("jquery", function() {
28+
return window.jQuery
29+
});
30+
}
31+
32+
// Messy but strictly for demo purposes: wrap ZeroClipboard with another module
33+
define("ZeroClipboard", ["ZeroClipboard_lib"], function(ZeroClipboard) {
34+
35+
/*
36+
ZeroClipboard.config({
37+
38+
39+
40+
});
41+
*/
42+
43+
return ZeroClipboard;
44+
});
45+
46+
})();

0 commit comments

Comments
 (0)