add compose box to email

src/public/js/eventlineup.js

@@ -276,9 +276,13 @@ function emailModal(el, url) {
         return Promise.reject(response.text());
       }
     })
-    .then((html) => {
-  email_modal.classList.add("is-open");
-  email_modal.querySelector(".Modal-body").innerHTML = html;
+    .then((lineup_table) => {
+      const email_textarea = document.querySelector('#email-editor')
+      const lineup_table_div = document.querySelector(".FieldGroup .lineup-email")
+      tinymce.activeEditor.setContent("Team,")
+      lineup_table_div.innerHTML = lineup_table
+      email_modal.classList.add("is-open");
+  // email_modal.querySelector(".Modal-body").innerHTML = html;
   });
 }
 
@@ -505,3 +509,57 @@ function toggleChildSlots (element) {
     })
   }
 }
+
+async function submitEmail () {
+  // range=document.createRange();
+  // window.getSelection().removeAllRanges();
+  // // range.selectNode(document.querySelector('.Modal').querySelector('.Modal-body')); 
+  // tinymce.activeEditor.selection.select(tinymce.activeEditor.getBody());
+  // // window.getSelection().addRange(range);
+  // document.execCommand('copy');
+  // window.getSelection().removeAllRanges();
+  const emailStyle = `
+  <style>.lineup-email {
+    font-family: "Helvetica", sans-serif;
+  }
+  .lineup-email .title-cell {
+    font-weight: bold;
+    background-color: #323669;
+    color: #fff;
+    padding: 2px 5px;
+    text-transform: uppercase;
+  }
+  .lineup-email .title-cell.out {
+    background-color: rgb(244, 199, 195);
+    color: black;
+  }
+  .lineup-email .sequence-cell {
+    font-weight: bold;
+    padding: 1px 5px;
+    text-align: left;
+  }
+  .lineup-email .name-cell {
+    width: 200px;
+    text-align: left;
+  }
+  .lineup-email .position-label-cell {
+    font-weight: bold;
+    text-align: right;
+  }
+  
+  .Panel .Panel {
+    border: none;
+    margin: 0;
+  }</style>
+  `
+  html_content = emailStyle+tinymce.activeEditor.getContent()
+  console.log(html_content)
+
+  navigator.clipboard.write(
+    [new ClipboardItem(
+      {
+        'text/plain': new Blob([tinymce.activeEditor.getContent({format: "text"})], {type: 'text/plain'}),
+        'text/html': new Blob([html_content], {type: 'text/html'})
+      })
+    ])
+}