Added multi-subject support

Author: AwMan3703

config.json

@@ -9,7 +9,53 @@
 	"ui" : {
 		"displayModes" : []
 	},
+	"subjects" : {
+		"csSUBJECT:none" : {
+			"name" : "nessuna materia",
+			"item_types" : []
+		},
+		"csSUBJECT:art_history" : {
+			"name" : "storia dell'arte",
+			"item_types" : [
+				"csITEMTYPE:commission",
+				"csITEMTYPE:context",
+				"csITEMTYPE:history",
+				"csITEMTYPE:size",
+				"csITEMTYPE:description",
+				"csITEMTYPE:inspiration",
+				"csITEMTYPE:style",
+				"csITEMTYPE:color",
+				"csITEMTYPE:light",
+				"csITEMTYPE:architecture",
+				"csITEMTYPE:material",
+				"csITEMTYPE:interpretation",
+				"csITEMTYPE:hypothesis",
+				"csITEMTYPE:document"
+			]
+		},
+		"csSUBJECT:italian" : {
+			"name" : "italiano",
+			"item_types" : [
+				"csITEMTYPE:context",
+				"csITEMTYPE:history",
+				"csITEMTYPE:description",
+				"csITEMTYPE:document",
+				"csITEMTYPE:text"
+			]
+		},
+		"csSUBJECT:history" : {
+			"name" : "storia",
+			"item_types" : [
+				"csITEMTYPE:context",
+				"csITEMTYPE:history",
+				"csITEMTYPE:description",
+				"csITEMTYPE:document",
+				"csITEMTYPE:event"
+			]
+		}
+	},
 	"sheet" : {
+		"currentSubject" : "csSUBJECT:art_history",
 		"editing" : {
 			"deleteWarningLengthThreshold" : 25,
 			"deleteWarningWhenImagePresent" : true,

js/clientMenu.js

@@ -4,7 +4,7 @@ function updateClientMenuOption(o) {
     let setting = getNestedJSON(CONFIG, o.dataset.setting)
     switch (typeof setting) {
         case "boolean":
-            if (setting || setting==null) o.classList.add('setting-bool-active')
+            if (setting) o.classList.add('setting-bool-active')
             break
         default:
             break
@@ -36,3 +36,12 @@ const toggleDynamicBackgrounds = (e) => {
         document.getElementById('content-body').classList.remove('dynamic-backgrounds-enabled')
     }
 }
+
+const toggleSaveSubject = (e) => {
+    e = document.getElementById(e)
+    CONFIG.sheet.editing.saveCurrentSubject = !CONFIG.sheet.editing.saveCurrentSubject
+
+    // Update the UI
+    if (CONFIG.sheet.editing.saveCurrentSubject) e.classList.add('setting-bool-active')
+    else e.classList.remove('setting-bool-active')
+}

js/controlPanel.js

@@ -6,15 +6,35 @@ function addItem(type) {
     }, null, `${itemType.emoji} Aggiungi ${itemType.names.singular}`, "contenuto:", "Aggiungi")
 }
 
-function addItemGenerationButtons(parent) {
-    const exclude = [""]
-    Object.keys(CONFIG.sheet.items.types).forEach((key) => {
-        if (exclude.includes(key)) { return }
-        const type = CONFIG.sheet.items.types[key]
+function addItemGenerationButtons(types) {
+    const parent = document.getElementById("add-element-panel")
+    parent.querySelectorAll('*').forEach(cn => cn.remove())
+
+    types.forEach(type => {
+        type = CONFIG.sheet.items.types[type]
         const e = document.createElement("button")
-        e.ontouchend = e.onclick = _ => { addItem(key) }
+        e.ontouchend = e.onclick = _ => { addItem(type) }
         e.className = "item-gen-button"
         e.innerText = `${type.emoji} ${capitalize(type.names.singular)}`
         parent.appendChild(e)
     })
 }
+
+function addSubjectSelectionOptions(subjects) {
+    const parent = document.getElementById('csSUBJECT-selector')
+    parent.childNodes.forEach(cn => cn.remove())
+
+    subjects.forEach(subjectName => {
+        const subject = CONFIG.subjects[subjectName]
+        const e = document.createElement('option')
+        e.value = subjectName
+        e.innerText = subject.name
+        parent.appendChild(e)
+    })
+}
+
+
+document.getElementById('csSUBJECT-selector').onchange = ev => {
+    CONFIG.sheet.currentSubject = ev.currentTarget.value
+    addItemGenerationButtons(CONFIG.subjects[CONFIG.sheet.currentSubject].item_types)
+}

js/startup.js

@@ -7,6 +7,7 @@ const immutableConfig = [ // Config paths that should NOT be saved locally
     "sheet.items"
 ]
 
+
 function checkConfig(local) {
     // Warn if the config is empty
     if (Object.keys(local).length===0)
@@ -20,18 +21,23 @@ function checkConfig(local) {
 
     return local
 }
-function startup(configData) {
+
+function loadConfig(configData) {
     console.info("Config data obtained")
+
     console.log("Saving remote config...")
     const remoteConfigData = {...configData}
     console.info("Remote config saved")
+
     const localConfig = JSON.parse(localStorage.getItem(configData.client.localConfigKey))
-    console.log(`Local config data ${localConfig!=null ? 'detected' : 'not found - loading default'}`)
+    console.log(`Local config data ${localConfig!=null ? 'found' : 'not found - loading default'}`)
     if (localConfig!=null && localConfig.client.saveLocalConfig) configData = localConfig
     console.info(`saveLocalConfig is ${configData.client.saveLocalConfig} – ${configData.client.saveLocalConfig ? 'default' : 'if present, local'} config has been discarded`)
+
     console.log("Checking config data...")
     CONFIG = checkConfig(configData)
     console.info("Config data loaded")
+
     console.log("Restoring immutable config data...")
     for (const path of immutableConfig) {
         const immutableValue = getNestedJSON(remoteConfigData, path)
@@ -40,24 +46,34 @@ function startup(configData) {
     }
     console.info("Immutable config data ready")
 
-    if (CONFIG.client.developmentMode) console.info("Development mode is enabled")
+    console.log(configData)
+}
+
+function applyConfig() {
+    if (!CONFIG.client.developmentMode) document.getElementById("client-debug-options")?.remove()
 
-    // Apply config
-    if (!CONFIG.client.developmentMode) document.getElementById("client-debug-options").remove()
     const clientMenuOptions = document.querySelectorAll("#client-menu-dropdown > #client-options > button")
     clientMenuOptions.forEach((o) => { updateClientMenuOption(o) })
-    const itemGenerationPanel = document.getElementById("add-element-panel")
-    addItemGenerationButtons(itemGenerationPanel)
+
+    addSubjectSelectionOptions(Object.keys(CONFIG.subjects).filter(v => v!=='csSUBJECT:none'))
+    const subjectSelector = document.getElementById('csSUBJECT-selector')
+    if (CONFIG.sheet.editing.saveCurrentSubject) subjectSelector.value = CONFIG.sheet.currentSubject
+    subjectSelector.onchange({currentTarget: subjectSelector})
+
     const contentBody = document.getElementById("content-body")
     addItemSections(contentBody)
+
     const imageCarousels = document.getElementsByClassName("imageCarousel-wrapper")
     forAllElements(imageCarousels, addImageCarouselOptions)
+
     const versionLabel = document.querySelector("#clientInfo-wrapper > #version")
     versionLabel.innerText = `v${CONFIG.client.version}${CONFIG.client.developmentMode ? "dev" : ""}`
+
     const displayModes = CONFIG.ui.displayModes
     if (displayModes.length!==0) { for (const dm of displayModes) {
         document.body.classList.add(dm)
     } }
+
     const content_body = document.getElementById('content-body')
     if (CONFIG.sheet.editing.enableDynamicBackgrounds) content_body.classList.add('dynamic-backgrounds-enabled')
 
@@ -73,6 +89,14 @@ function startup(configData) {
     }
 }
 
+function startup(configData) {
+    loadConfig(configData)
+
+    if (CONFIG.client.developmentMode) console.info("Development mode is enabled")
+
+    applyConfig()
+}
+
 console.log("Fetching config data...")
 const configPath = "" // Path to config from index.html's path
 // Get the current path, cut out the file name and replace it with config.json

style/clientMenu.css

@@ -28,7 +28,7 @@ body {
 	background-color: var(--color-background-main);
 }
 
-button {
+button, select {
 	&:extend(.material);
 	display: flex;
 	align-items: center;