copying stuff

components.copy-to-clipboard.js

import Ember from 'ember';

export default Ember.Component.extend({
  actions: {
    copy() {
      const $wrapper = this.$('[data-value-wrapper]');
      const range = document.createRange();
      
      range.selectNodeContents($wrapper[0]);
      
      const selection = window.getSelection();
      selection.removeAllRanges();
      selection.addRange(range);
      
      console.log(document.execCommand('copy'));
      
      selection.removeAllRanges();
    }
  }
});

controllers.application.js

import Ember from 'ember';

export default Ember.Controller.extend({
  appName: 'Ember Twiddle'
});

templates.application.hbs

{{#copy-to-clipboard value='hello' as |copy|}}
	<button onclick={{copy}}>Copy</button>
{{/copy-to-clipboard}}

templates.components.copy-to-clipboard.hbs

<div data-value-wrapper>{{value}}</div>
{{yield (action 'copy')}}

twiddle.json

{
  "version": "0.11.0",
  "EmberENV": {
    "FEATURES": {}
  },
  "options": {
    "use_pods": false,
    "enable-testing": false
  },
  "dependencies": {
    "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js",
    "ember": "2.10.2",
    "ember-data": "2.11.0",
    "ember-template-compiler": "2.10.2",
    "ember-testing": "2.10.2"
  },
  "addons": {}
}