Add source controls with copy and download

src/app/app.ts

@@ -23,8 +23,9 @@ const models: {
 
 let model = models["loot-table"]
 
-let treeViewEl = document.getElementById('tree-view')!
-let sourceviewEl = document.getElementById('source-view')!
+const treeViewEl = document.getElementById('tree-view')!
+const sourceviewEl = document.getElementById('source-view')!
+const sourceviewOut = document.getElementById('source-view-output')!
 Split([treeViewEl, sourceviewEl], {
   sizes: [66, 34]
 })
@@ -45,6 +46,42 @@ modelSelector.addEventListener('change', evt => {
   model.invalidate()
 })
 
+const sourceControlsToggle = document.getElementById('source-controls-toggle')!
+const sourceControlsMenu = document.getElementById('source-controls-menu')!
+sourceControlsToggle.addEventListener('click', evt => {
+  sourceControlsMenu.style.visibility = 'visible'
+
+  document.body.addEventListener('click', evt => {
+    sourceControlsMenu.style.visibility = 'hidden'
+  }, { capture: true, once: true })
+})
+
+const sourceControlsCopy = document.getElementById('source-controls-copy')!
+const sourceControlsDownload = document.getElementById('source-controls-download')!
+const sourceControlsShare = document.getElementById('source-controls-share')!
+
+const addChecked = (el: HTMLElement) => {
+  el.classList.add('check')
+  setTimeout(() => {
+    el.classList.remove('check')
+  }, 2000)
+}
+
+sourceControlsCopy.addEventListener('click', evt => {
+  (sourceviewOut as HTMLTextAreaElement).select()
+  document.execCommand('copy');
+  addChecked(sourceControlsCopy)
+})
+
+sourceControlsDownload.addEventListener('click', evt => {
+  const fileContents = encodeURIComponent(JSON.stringify(model.data, null, 2) + "\n")
+  const dataString = "data:text/json;charset=utf-8," + fileContents
+  const downloadAnchor = document.getElementById('source-controls-download-anchor')!
+  downloadAnchor.setAttribute("href", dataString)
+  downloadAnchor.setAttribute("download", "data.json")
+  downloadAnchor.click()
+})
+
 setTimeout(() => {
   window.scroll(0, 0)
 }, 1000)