Replace ZeroClipboard with clipboard.js

For copy/paste support in our code samples, we are using the
ZeroClipboard library which relies heavily on Flash.
Because many browsers/extensions are disabling this plugin nowadays,
this commit replaces ZeroClipboard with a native, lightweight solution
for this feature.
This commit is contained in:
Brian Clozel 2016-04-26 10:17:19 +02:00 committed by Rob Winch
parent eed779c7e9
commit 2620d036ab
6 changed files with 38 additions and 24 deletions

View File

@ -26,7 +26,7 @@
<script type="text/javascript" src="{{site.baseurl}}/js/backbone.js"></script>
<script type="text/javascript" src="{{site.baseurl}}/js/projectDocumentationWidget.js"></script>
<script type="text/javascript" src="{{site.baseurl}}/js/application.js"></script>
<script type="text/javascript" src="{{site.baseurl}}/js/ZeroClipboard.min.js"></script>
<script type="text/javascript" src="{{site.baseurl}}/js/clipboard.min.js"></script>
<script type="text/javascript">
var apiBaseUrl = "{{ site.main_site_url }}";
var projectId = "{{ site.project }}";

File diff suppressed because one or more lines are too long

Binary file not shown.

7
js/clipboard.min.js vendored Normal file

File diff suppressed because one or more lines are too long

View File

@ -1,26 +1,43 @@
window.Spring = window.Spring || {};
ZeroClipboard.setDefaults( { moviePath: siteBaseUrl + '/js/ZeroClipboard.swf' } );
$(document).ready(function() {
Spring.configureCopyButtons();
});
Spring.configureCopyButtons = function() {
if (ZeroClipboard.detectFlashSupport()) {
$("pre.highlight").each(function(index) {
Spring.buildCopyButton($(this), index);
}
);
}
$("pre.highlight").each(function(index) {
Spring.buildCopyButton($(this), index);
}
);
var errorMessage = function() {
if (/Mac/i.test(navigator.userAgent)) {
return 'Press Cmd-C to Copy';
}
else {
return 'Press Ctrl-C to Copy';
}
};
var snippets = new Clipboard('.copy-button');
snippets.on('success', function(e) {
e.clearSelection();
Spring.showTooltip(e.trigger, "Copied!");
});
snippets.on('error', function(e) {
Spring.showTooltip(e.trigger, errorMessage());
});
}
Spring.showTooltip = function(elem, message) {
$(elem).tooltip({placement:'right', title:message});
$(elem).tooltip('show');
setTimeout(function(){$(elem).tooltip('destroy');},1000);
}
Spring.buildCopyButton = function (preEl, id) {
var codeBlockId = "code-block-"+ id;
var codeBlockId = "code-block-"+ id;
var copyButtonId = "copy-button-" + id;
preEl.attr('id', codeBlockId);
var button = $('<button class="copy-button snippet" id="' + copyButtonId + '" data-clipboard-target="' + codeBlockId + '"></button>');
var button = $('<button class="copy-button snippet" id="' + copyButtonId + '" data-clipboard-target="#' + codeBlockId + '"></button>');
preEl.before(button);
var zero = new ZeroClipboard(button);
$(zero.htmlBridge).tooltip({title: "copy to clipboard", placement: 'bottom'});
}

View File

@ -107,9 +107,7 @@ Spring.SnippetView = Backbone.View.extend({
var html = $(this.combinedTemplate(this.model));
this.$el.html(html);
if (ZeroClipboard.detectFlashSupport()) {
Spring.buildCopyButton(html.find(":first"), "snippet");
}
Spring.buildCopyButton(html.find(":first"), "snippet");
return this;
},