[ADD] save all #14

index.css

@@ -21,6 +21,20 @@ ul {
   list-style: none;
 }
 
+#loading {
+  background: #fff;
+  box-shadow: 2px 2px 10px 2px #369;
+  padding: 1em 1.5em;
+  border: 0;
+  color: #369;
+  font-size: 2em;
+  min-width: 50%;
+  text-align: center;
+}
+#loading span {
+  display: block;
+}
+
 #header > *,
 #footer > *,
 #content,

index.html

@@ -128,6 +128,7 @@ <h2>NPM package</h2>
           <option value="100">PNG 100x100</option>
           <option value="200">PNG 200x200</option>
           <option value="1000">PNG 1000x1000</option>
+          <option value="all">Save all SVG (colored)</option>
         </select>
         <br/>
         <h2>fg-poi</h2>
@@ -150,6 +151,9 @@ <h2>fg-poi</h2>
     </div>
     <div id="content">
     </div>
+    <dialog id="loading">
+      Loading: <span></span>
+    </dialog>
   </div>
   <div data-page="svg">
     <div id="content">

index.js

@@ -114,6 +114,35 @@ function save(opt) {
   $('#icon select').val('none');
   switch (opt) {
     case 'none': break;
+    case 'all': {
+      var tab = Object.keys(glyphs)
+      const dload = document.getElementById('loading')
+      dload.showModal();
+      function saveAll() {
+        var g = tab.pop();
+        if (g) {
+          var glyph = glyphs[g]
+          dload.querySelector('span').innerText = g;
+          $.ajax({
+            url: './svg/' 
+            + glyph.theme
+            + '/u' + glyph.code.toString(16).toUpperCase()
+            + '-' + glyph.name +'.svg',
+            dataType : 'text',
+            success: function(rep) {
+              rep = rep.replace(/fill:#([^;|\"]*)/g, 'fill:' + $('#icon i').css('color'));
+              var blob = new Blob([rep], {type: "text/plain;charset=utf-8"});
+              saveAs(blob, glyph.name + '.svg');
+              saveAll()
+            }
+          })
+        } else {
+          dload.close()
+        }
+      }
+      saveAll();
+      break;
+    }
     case 'svg': {
       console.log('savesvg')
       $.ajax({