feat: configurable material

src/lib/Ggraphic/Info.svelte

@@ -38,7 +38,6 @@
                   `options.config.fixType.${rightSideFixation?.label}`
                 )}
               </div>
-            </div>
           </div></subsection
         >
       </details>

src/lib/Options/MainMenu.svelte

@@ -7,21 +7,22 @@
   import Toggler from "./Toggler.svelte";
   import { Icon } from "@smui/icon-button";
   import { _ } from "svelte-i18n";
-  import { length, profileInfo, material, loads } from "../store";
+  import { length, lengthUnit, LengthUnit, profileInfo, material, loads } from "../store";
   import { menuRoute } from "./menuRouter"
   import BeamConfig from "./BeamConfig.svelte";
 
   let panel1Open = true;
   let panel2Open = false;
   let panel3Open = false;
+  $: lengthUnitName = $_("units." + LengthUnit[$lengthUnit])
 </script>
 
 <Accordion>
   <Panel bind:open={panel1Open}>
     <Header>
       <OptionTitle title={$_("options.config.title")}>
         <span slot="info"
-          >{!Number.isNaN($length.valueOf()) && `l=${$length}`}</span
+          >{!Number.isNaN($length.valueOf()) && `l=${$length.toLocaleString()}${lengthUnitName}`}</span
         >
       </OptionTitle>
       <Toggler isOpen={panel1Open} slot="icon" />

src/lib/Options/Material.svelte

@@ -2,6 +2,7 @@
   import { material } from "../store";
   import TextField from "@smui/textfield";
   import { TreeView } from "carbon-components-svelte";
+  import { _ } from "svelte-i18n";
   import materials from "../materials";
 
   type TreeNodeId = string | number;
@@ -37,17 +38,49 @@
     }));
   }
 
-  let materialId: number = 0;
+  let materialId: number | undefined = 0;
   let filtered: TreeNode[] = [];
-  $: $material = materials[materialId];
+
+  let isDirty = false;
+
+  $: {
+    // Set material to other
+    if (isDirty) {
+      // Deselect
+      materialId = undefined;
+      $material.name = $_("options.material.other");
+    } else if (materialId !== undefined) {
+      // Copying
+      $material = Object.assign({}, materials[materialId]);
+    }
+  }
+
   $: filtered = mfilter(materials, query);
 </script>
 
+<TextField
+  type="number"
+  label={`${$_("results.density")}`}
+  on:input={() => (isDirty = true)}
+  bind:value={$material.density}
+/>
+<TextField
+  type="number"
+  label={`${$_("results.eModulus")} (E, ${$_("units.mpa")})`}
+  on:input={() => (isDirty = true)}
+  bind:value={$material.E}
+/>
+<TextField
+  type="number"
+  label={`${$_("results.gModulus")} (G, ${$_("units.mpa")})`}
+  on:input={() => (isDirty = true)}
+  bind:value={$material.G}
+/>
 <TextField label="Filter" bind:value={query} />
-<br>
 <TreeView
   style="padding-left: 0"
   labelText="List of materials:"
   children={filtered}
+  on:select={() => (isDirty = false)}
   bind:activeId={materialId}
 />

src/lib/locales/en.json

@@ -40,6 +40,7 @@
       }
     },
     "material": {
+      "other": "Other",
       "title": "Material",
       "filter": "Filter",
       "desc": "List of materials"
@@ -122,6 +123,7 @@
     "in": "in",
     "H": "H",
     "kg": "kg",
-    "lbf": "lb-force"
+    "lbf": "lb-force",
+    "mpa": "MPa"
   }
 }

src/lib/locales/ru.json

@@ -40,6 +40,7 @@
       }
     },
     "material": {
+      "other": "Другой",
       "title": "Материал",
       "filter": "Фильтровать",
       "desc": "Список материалов"
@@ -122,6 +123,7 @@
     "in": "дюйм",
     "H": "Н",
     "kg": "кг",
-    "lbf": "фунт-силы"
+    "lbf": "фунт-силы",
+    "mpa": "МПа"
   }
 }

src/lib/store.ts

@@ -124,7 +124,7 @@ export const LengthUnit = {
   IN: "in",
 } as const;
 
-export const lengthUnit = writable<keyof typeof LengthUnit>("M");
+export const lengthUnit = writable<keyof typeof LengthUnit>("MM");
 
 export const ForceUnit = {
   H: "H",