fix: Show the symbol variant name in the symbol picker tooltip (#122)

This change updates the manifest format to add variant details and adds some documentation about generating symbol sets. It also includes some preparatory work for symbols that represent composed variants.
inseven · Jan 19, 2023 · 58ca774 · 58ca774
1 parent 4612933
commit 58ca774
Show file tree

Hide file tree

Showing 8 changed files with 118 additions and 19 deletions.
diff --git a/README.md b/README.md
@@ -10,6 +10,20 @@ Icon designer
 
 Symbolic follows the version numbering, build and signing conventions for InSeven Limited apps. Further details can be found [here](https://github.com/inseven/build-documentation).
 
+## Symbols
+
+### Material Icons
+
+Symbolic includes [Google Material Icons](https://fonts.google.com/icons) which are licensed under the [Apache License](https://www.apache.org/licenses/LICENSE-2.0.html).
+
+Instead of using a submodule, they have been imported into the project using `scripts/import-material-design-icons.py` as the Material Icons repository is about 16GB and including this would significantly impact checkout and build times.
+
+Update the icons as follows:
+
+```bash
+scripts/import-material-design-icons.py ~/Projects/material-design-icons	
+```
+
 ## Licensing
 
 Symbolic is licensed under the MIT License (see [LICENSE](LICENSE)).
diff --git a/Symbolic/Models/Manifest.swift b/Symbolic/Models/Manifest.swift
@@ -22,6 +22,10 @@ import Foundation
 
 struct Manifest: Codable {
 
+    struct VariantDefinition: Codable {
+        let name: String
+    }
+
     struct Variant: Codable {
         let path: String
     }
@@ -31,11 +35,12 @@ struct Manifest: Codable {
         let name: String
         let variants: [String: Variant]
     }
-
+    
     let id: String
     let name: String
     let author: String
     let license: String
+    let variants: [String: VariantDefinition]
     let symbols: [Symbol]
 
 }
diff --git a/Symbolic/Models/Symbol.swift b/Symbolic/Models/Symbol.swift
@@ -26,18 +26,30 @@ struct Symbol: Identifiable {
         return reference.id
     }
 
-    var variant: String? {
-        return reference.variant
-    }
-
     enum Format {
         case svg
         case symbol
     }
 
     let reference: SymbolReference
+    let variant: Variant?
     let name: String
     let format: Format
     let url: URL?
 
+    var localizedDescription: String {
+        guard let variant = variant else {
+            return name
+        }
+        return "\(name) (\(variant.name))"
+    }
+
+    init(reference: SymbolReference, variant: Variant? = nil, name: String, format: Format, url: URL? = nil) {
+        self.reference = reference
+        self.variant = variant
+        self.name = name
+        self.format = format
+        self.url = url
+    }
+
 }
diff --git a/Symbolic/Models/SymbolManager.swift b/Symbolic/Models/SymbolManager.swift
@@ -43,7 +43,7 @@ class SymbolManager {
         return self
             .set(for: reference)?
             .symbolsById[reference.name]?
-            .first { $0.variant == reference.variant }
+            .first { $0.variant?.id == reference.variant }
     }
 
 }
diff --git a/Symbolic/Models/SymbolSet.swift b/Symbolic/Models/SymbolSet.swift
@@ -33,6 +33,13 @@ extension Array where Element == Symbol {
 
 }
 
+struct Variant {
+
+    let id: String
+    let name: String
+
+}
+
 struct SymbolSet {
 
     let id: String
@@ -41,18 +48,26 @@ struct SymbolSet {
     let symbolsById: [String:[Symbol]]
     let author: String
     let licenseUrl: URL?
+    let variants: [String: Variant]
 
     static var sfSymbols: SymbolSet = {
-        return SymbolSet(id: "sf-symbols", name: "SF Symbols", author: "Apple Inc", symbols: SFSymbols.allSymbols)
+        return SymbolSet(id: "sf-symbols",
+                         name: "SF Symbols",
+                         author: "Apple Inc",
+                         symbols: SFSymbols.allSymbols,
+                         variants: [])
     }()
 
-    init(id: String, name: String, author: String, symbols: [Symbol]) {
+    init(id: String, name: String, author: String, symbols: [Symbol], variants: [Variant]) {
         self.id = id
         self.name = name
         self.author = author
         self.symbols = symbols
         self.symbolsById = symbols.lookup()
         self.licenseUrl = nil
+        self.variants = variants.reduce(into: [String: Variant]()) { partialResult, variant in
+            partialResult[variant.id] = variant
+        }
     }
 
     init(directory: String) throws {
@@ -64,19 +79,34 @@ struct SymbolSet {
 
         // TODO: Exist cleanly if unable to load license
 
-        self.id = manifest.id
-        self.name = manifest.name
-        self.symbols = manifest.symbols.map { symbol in
+        let variants = manifest.variants.map { (id, variant) in
+            return Variant(id: id, name: variant.name)
+        }.reduce(into: [String: Variant]()) { partialResult, variant in
+            partialResult[variant.id] = variant
+        }
+
+        let symbols: [Symbol] = manifest.symbols.map { symbol in
             let variants = symbol.variants.map { (identifier, variant) in
                 let url = Bundle.main.url(forResource: variant.path, withExtension: nil, subdirectory: directory)
                 let reference = SymbolReference(family: manifest.id, name: symbol.id, variant: identifier)
-                return Symbol(reference: reference, name: symbol.name, format: .svg, url: url)
+                let variant: Variant?
+                if let variantId = reference.variant {
+                    variant = variants[variantId]
+                } else {
+                    variant = nil
+                }
+                return Symbol(reference: reference, variant: variant, name: symbol.name, format: .svg, url: url)
             }
             return variants
         }.reduce([], +)
+
+        self.id = manifest.id
+        self.name = manifest.name
+        self.symbols = symbols
         self.symbolsById = symbols.lookup()
         self.author = manifest.author
         self.licenseUrl = Bundle.main.url(forResource: manifest.license, withExtension: nil, subdirectory: directory)!
+        self.variants = variants
     }
 
 }

diff --git a/Symbolic/Resources/material-icons/manifest.json b/Symbolic/Resources/material-icons/manifest.json
@@ -3,6 +3,23 @@
     "name": "Material Icons",
     "author": "Google",
     "license": "LICENSE",
+    "variants": {
+        "default": {
+            "name": "Default"
+        },
+        "outlined": {
+            "name": "Outlined"
+        },
+        "twotone": {
+            "name": "Two Tone"
+        },
+        "round": {
+            "name": "Round"
+        },
+        "sharp": {
+            "name": "Sharp"
+        }
+    },
     "symbols": [
         {
             "id": "agriculture",

diff --git a/Symbolic/Views/SymbolPicker.swift b/Symbolic/Views/SymbolPicker.swift
@@ -79,7 +79,7 @@ struct SymbolPicker: View {
                                                 isPresented = false
                                                 selection.wrappedValue = symbol.reference
                                             }
-                                            .help(symbol.name)
+                                            .help(symbol.localizedDescription)
                                     }
                                 } header: {
                                     Text(section.name)

diff --git a/scripts/import-material-design-icons.py b/scripts/import-material-design-icons.py
@@ -17,12 +17,30 @@ def main():
     parser.add_argument("repository")
     options = parser.parse_args()
 
-    manifest = {}
-    manifest["id"] = "material-icons"
-    manifest["name"] = "Material Icons"
-    manifest["author"] = "Google"
-    manifest["license"] = "LICENSE"
-    manifest["symbols"] = []
+    manifest = {
+        "id": "material-icons",
+        "name": "Material Icons",
+        "author": "Google",
+        "license": "LICENSE",
+        "variants": {
+            "default": {
+                "name": "Default",
+            },
+            "outlined": {
+                "name": "Outlined"
+            },
+            "twotone": {
+                "name": "Two Tone",
+            },
+            "round": {
+                "name": "Round",
+            },
+            "sharp": {
+                "name": "Sharp",
+            },
+        },
+        "symbols": [],
+    }
 
     repository_directory = os.path.abspath(options.repository)
     license_path = os.path.join(repository_directory, "LICENSE")
@@ -34,6 +52,7 @@ def main():
         category_path = os.path.join(src_directory, category)
         icons = os.listdir(category_path)
         for icon in icons:
+            print("Importing '%s'..." % icon)
             symbol = {
                 "id": icon,
                 "name": icon.replace("_", " ").title(),
@@ -47,6 +66,8 @@ def main():
                 assert variant.startswith("materialicons")
                 variant_name = variant[len("materialicons"):]
                 variant_key = variant_name if variant_name else "default"
+                if variant_key not in manifest["variants"]:
+                    exit("Variant '%s' not defined in manfiest." % variant_key)
                 icon_path = os.path.join(category_path, icon, variant, "24px.svg")
                 basename = "%s.%s.svg" % (icon, variant_key)
                 shutil.copyfile(icon_path, os.path.join(MATERIAL_ICONS_DIRECTORY, basename))