var App = Ember.Application.create();
App.ApplicationController = Ember.ObjectController.extend({
message: 'This is the text that should be copied'
});
App.EmClipboardComponent = Ember.Component.extend({
didInsertElement: function () {
var clip = new ZeroClipboard(this.$('button'), {
// This would normally be a relative path
moviePath: "http://coderberry.me/assets/ZeroClipboard/ZeroClipboard.swf",
// Added for demo on JSFiddle. See http://goo.gl/DLl7O
trustedDomains: ["*"],
allowScriptAccess: "always"
});
clip.on('complete', function (client, args) {
alert('Copied "' + args.text + '" to clipboard');
});
}
});
<script type="text/x-handlebars">
<div class="container">
{{em-clipboard text=message label="Copy"}}
</div>
</script>
<script type="text/x-handlebars" id="components/em-clipboard">
<div class="input-append">
<span class="span4 uneditable-input">{{text}}</span>
<button class="btn" {{bindAttr data-clipboard-text=text}}
title="Copy to clipboard">{{label}}</button>
</div>
</script>
External resources loaded into this fiddle: