UI clear button + fix multiple fonts sharing same codepoint (#11)

* add UI button to clear file input

* don't include duplicate glyphs for same codepoint in one fontstack.

Allow FreeType style_name to be empty.

* rename build.sh to build_wasm.sh

.github/workflows/actions.yml

@@ -35,7 +35,7 @@ jobs:
         with:
           version: ${{env.EM_VERSION}}
           actions-cache-folder: ${{env.EM_CACHE_FOLDER}}
-      - run: ./build.sh boost/boost/include
+      - run: ./build_wasm.sh boost/boost/include
       - run: BOOST_INCLUDEDIR=boost/boost/include cmake . && make
       - run: cd app && npm install && npx tsc && npx vite build --base=/font-maker/
       - name: build_app

CONTRIBUTING.md

@@ -7,7 +7,7 @@ The WASM outputs `sdfglyph.js` and `sdfglyph.wasm` are not committed to git. To
 * [sdfglyph.js](https://maplibre.org/font-maker/sdfglyph.js)
 * [sdfglyph.wasm](https://maplibre.org/font-maker/sdfglyph.wasm)
 
-## Building
+## Building WASM
 
 If you want to compile the WebAssembly components from scratch, you'll need the following:
 
@@ -16,5 +16,11 @@ If you want to compile the WebAssembly components from scratch, you'll need the
 
 Clone this repository and all submodules with `git clone --recursive`
 
-Use `./build.sh PATH_TO_INCLUDE_DIR` to build the WASM output, where `PATH_TO_INCLUDE_DIR` is the directory of your local Boost install.
+Use `./build_wasm.sh PATH_TO_INCLUDE_DIR` to build the WASM output, where `PATH_TO_INCLUDE_DIR` is the directory of your local Boost install. example: `./build_wasm.sh /opt/local/include`
 
+## Building command line
+
+```
+cmake .
+make
+```

app/src/App.tsx

@@ -3,10 +3,7 @@ import "tachyons/css/tachyons.min.css";
 import Pbf from "pbf";
 import JSZip from "jszip";
 import { saveAs } from "file-saver";
-import {
-  Map,
-  NavigationControl
-} from "react-map-gl";
+import { Map, NavigationControl } from "react-map-gl";
 import maplibregl from "maplibre-gl";
 import "maplibre-gl/dist/maplibre-gl.css";
 import { styleFunc } from "./style";
@@ -139,6 +136,10 @@ function App() {
     setFileUploads([...fileUploads, ...event.target.files!]);
   }
 
+  function clearFileInput() {
+    setFileUploads([]);
+  }
+
   async function runFilesConvert() {
     if (fileUploads.length === 0) return;
     let bufs: ArrayBuffer[] = [];
@@ -209,6 +210,12 @@ function App() {
             );
           })}
 
+          {fileUploads.length > 0 ? (
+            <button className="f6 mt2" onClick={clearFileInput}>
+              Clear
+            </button>
+          ) : null}
+
           <div
             className={
               "pa2 mt3 br2 " +

build.sh → build_wasm.sh

@@ -8,7 +8,7 @@ emcc -I vendor/sdf-glyph-foundry/include/ \
 		 -I $1 \
 		 -I vendor/protozero/include \
 		 -s USE_FREETYPE=1 \
-		 -s EXPORTED_RUNTIME_METHODS=[ccall,cwrap] \
+		 -s EXPORTED_RUNTIME_METHODS=[ccall] \
 		 -s EXPORTED_FUNCTIONS=[_generate_glyph_buffer,_free_glyph_buffer,_create_fontstack,_free_fontstack,_fontstack_name,_glyph_buffer_data,_glyph_buffer_size,_fontstack_add_face] \
 		 -o app/public/sdfglyph.js \
 		 -Wno-enum-constexpr-conversion \

main.cpp

@@ -56,6 +56,7 @@ void do_codepoint(protozero::pbf_writer &parent, std::vector<FT_Face> &faces, FT
                 glyph_message.add_bytes(2,glyph.bitmap);
             }
             parent.add_message(3,glyph_data);
+            return;
         }
     }
 }
@@ -125,7 +126,11 @@ extern "C" {
         FT_Set_Char_Size(face, 0, static_cast<FT_F26Dot6>(size * (1 << 6)), 0, 0);
         f->faces->push_back(face);
 
-        std::string combined_name = std::string(face->family_name) + " " + std::string(face->style_name);
+        std::string combined_name = std::string(face->family_name);
+        if (face->style_name != NULL) {
+            combined_name += " " + std::string(face->style_name);
+        }
+
         if (f->seen_face_names->count(combined_name) == 0) {
             if (f->seen_face_names->size() > 0) {
               *f->name += ",";