Example tournaments

view-webapp/src/main/webapp/index.html

@@ -7,6 +7,10 @@
     <i class="fa fa-upload"></i>
     Import tournament
   </a>
+  <a id="example-tournament" class="ui green icon floating button">
+    <i class="fa fa-copy"></i>
+    Clone example tournament
+  </a>
 </div>
 <div class="tournaments section">
 #set($files = $api.get('tour'))
@@ -52,6 +56,33 @@
     </form>
   </div>
 </div>
+<div id="clone-popup" class="popup">
+  <div class="popup-body">
+    <form id="clone-form" class="ui form">
+      <div class="popup-content">
+        <div class="field">
+          <label>Example tournament</label>
+          <select id="exampleTournamentName">
+            <option value=""></option>
+#foreach($tour in $utils.exampleTournaments)
+            <option value="$tour">$tour</option>
+#end
+          </select>
+        </div>
+      </div>
+      <div class="popup-footer">
+        <button id="cancel-clone" type="button" class="ui gray right labeled icon floating close button">
+          <i class="times icon"></i>
+          Cancel
+        </button>
+        <button id="clone" type="button" class="ui green right labeled icon floating button">
+          <i class="plus icon"></i>
+          Clone
+        </button>
+      </div>
+    </form>
+  </div>
+</div>
 <script type="text/javascript">
   // #[[
   function doImport() {
@@ -75,6 +106,26 @@
     });
   }
 
+  function doClone(name) {
+    fetch(`/api/import?example=${name}`, {
+      method: 'POST',
+      body: {}
+    }).then(resp => {
+      if (resp.ok)  return resp.json();
+      else throw resp;
+    }).then(json => {
+      if (json.success) {
+        console.log(`/tour?id=${json.id}`)
+        document.location.href = `/tour?id=${json.id}`
+      } else {
+        showError(json.error || 'unknown error')
+      }
+    }).catch(err => {
+      error(err);
+    });
+  }
+
+
   onLoad(()=>{
     $('#import-tournament').on('click', e => {
       modal('import-popup');
@@ -88,6 +139,15 @@
       } else showError('no file choosen');
       close_modal();
     });
+    $('#example-tournament').on('click', e => {
+      modal('clone-popup');
+      e.preventDefault();
+      return false;
+    });
+    $('#clone').on('click', e => {
+      let example = $('#exampleTournamentName')[0].value;
+      doClone(example);
+    });
   });
   // ]]#
 </script>