Copy ontology with separate button to clipboard

Author: linkvt

src/main/web/app/Ui.js

@@ -27,7 +27,7 @@ export default class Ui {
             on: "click",
             target: Ui.urlType
         });
-        Ui.ontologyText.click(() => Ui.ontologyText.select());
+        new Clipboard("#copy-ontology-to-clipboard-button");
     }
 
     static displayFormats(formats) {

src/main/web/app/assets/index.html

@@ -90,12 +90,18 @@ <h1 class="ui header page">
         <div class="ui divider"></div>
 
         <div class="ui doubling stackable grid">
-            <div class=" sixteen wide column">
+            <div class="twelve wide column">
                 <a id="webvowl-button" class="ui tiny fluid teal labeled icon button">
                     <i class="external icon"></i>
                     Visualize with WebVOWL
                 </a>
             </div>
+            <div class="four wide column">
+                <button id="copy-ontology-to-clipboard-button" class="ui tiny fluid button" data-clipboard-action="copy" data-clipboard-target="#ontology-text">
+                    <i class="copy icon"></i>
+                    Copy ontology
+                </button>
+            </div>
         </div>
 
         <div id="initial-ontology-info" class="ui icon message">

src/main/web/bower.json

@@ -7,6 +7,7 @@
     "babel-polyfill": "https://bitbucket.org/linkvt/babel-polyfill.git#master",
     "jquery": "~2.2.3",
     "semantic-ui": "git://github.com/linkvt/Semantic-UI.git#master",
-    "js-cookie": "~2.1.1"
+    "js-cookie": "~2.1.1",
+    "clipboard": "^1.5.12"
   }
 }