Continue work...

assets/core.js

@@ -11,6 +11,11 @@ document.addEventListener("DOMContentLoaded", () => {
     top_bar.height = new auto();
     top_bar.position = new place_top();
 
-    container.appendChild(top_bar.element);
+    const top_bar_element = top_bar.element;
+
+    const search_bar = new search();
+    top_bar_element.appendChild(search_bar.ui);
+
+    container.appendChild(top_bar_element);
 });
 

assets/element.js

@@ -0,0 +1,88 @@
+import { lang } from "./lang.js";
+
+class element {
+    #id;
+    #pictures;
+    #mesh;
+    #name;
+    #description;
+    #params;
+    #links;
+
+    constructor(id) {
+        if (typeof(id) !== "number") {
+            throw "ID must be number.";
+        }
+
+        this.#id = id;
+        this.#pictures = {};
+        this.#params = {};
+        this.#links = {};
+        this.#name = undefined;
+        this.#mesh = undefined;
+    }
+
+    get id() {
+        return this.#id;
+    }
+
+    set name(content) {
+        if (typeof(content) !== "string") {
+            throw "Name must be string.";
+        }
+
+        this.#name = content;
+    }
+
+    get name() {
+        return this.#name;
+    }
+
+    get mesh() {
+        return this.#mesh;
+    }
+
+    set mesh(content) {
+        if (typeof(content) !== "string") {
+            throw "Mesh URL must be string.";
+        }
+
+        this.#mesh = content;
+    }
+
+    get links() {
+        const mesh = {};
+        mesh[lang.element.mesh.link] = this.mesh;
+
+        return Object.assign(this.#links, mesh);
+    }
+
+    set links(content) {
+        if (typeof(content) !== "object") {
+            throw "Links must be an object.";
+        }
+
+        this.#links = Object.assign({}, content);
+    }
+
+    addLink(name, url) {
+        if (typeof(name) !== "string") {
+            throw "Name must be string.";
+        }
+
+        if (typeof(url) !== "string") {
+            throw "Url must be string.";
+        }
+
+        const new_link = {};
+        new_link[name] = url;
+
+        this.#links = Object.assign(new_link, this.#links);
+    }
+
+    get title() {
+        
+    }
+}
+
+export { element };

assets/lang.js

@@ -0,0 +1,14 @@
+const lang = {
+    search : {
+        type : "Wyszukaj element...",
+        find : "Szukaj!",
+    },
+
+    element : {
+        mesh : {
+            link : "Objekt 3D"
+        }
+    }
+};
+
+export { lang };

assets/search.js

@@ -1,13 +1,85 @@
+import { lang } from "./lang.js";
+
 class search {
+    #container;
+    #hint;
+    #input;
+    #last_content;
+    
     constructor() {
+        this.#last_content = "";
+
+        this.#container = document.createElement("div");
+        this.#container.className = "search";
+
+        this.#hint = document.createElement("div");
+        this.#hint.className = "hint";
+
+        this.#input = document.createElement("input");
+        this.#input.type = "text";
+        this.#input.placeholder = lang.search.type;
+
+        const submit = document.createElement("input");
+        submit.type = "submit";
+        submit.value = lang.search.find;
+
+        const form = document.createElement("form");
+        
+        form.addEventListener("submit", (action) => {
+            action.preventDefault();
+            this.find();
+        });
+
+        this.#input.addEventListener("keypress", () => {
+            this.refresh();
+        });
+
+        this.#input.addEventListener("keyup", () => {
+            this.refresh();
+        });
+
+        this.#input.addEventListener("change", () => {
+            this.refresh();
+        });
+
+        form.appendChild(this.#input);
+        form.appendChild(submit);
+        this.#container.appendChild(form);
+        this.#container.appendChild(this.#hint);
     }
 
-    get ui() {
-        const container = document.createElement("div");
+    get content() {
+        return this.#input.value.trim();
+    }
+
+    get changed() {
+        if (this.content === this.#last_content) {
+            return false;
+        }
+
+        this.#last_content = this.content;
+        
+        return true;
+    }
+
+    find() {
+        if (!this.changed) {
+            return;
+        }
 
-        const input = document.createElement("input");
-        input.type = "text";
-        input.className = "search";
+        console.log("UwU");
+    }
+
+    refresh() {
+        if (!this.changed) {
+            return;
+        }
+
+        console.log("OwO");
+    }
+
+    get ui() {
+        return this.#container;
     }
 }