YomoSK · YomoSK · Oct 30, 2024 · Nov 1, 2024 · Nov 2, 2024 · Nov 2, 2024
diff --git a/.gitignore b/.gitignore
@@ -1,3 +1,11 @@
 node_modules
 out
-history.json
+history.json
+
+rust-src/target
+rust-src/Cargo.lock
+rust-src/gen
+
+# Added by cargo
+
+/target
diff --git a/README.md b/README.md
@@ -1,4 +1,25 @@
 # Yomea Project
-Yomea is currently in development state, at this point only Windows builds are shipped. Of course, you can ship your own builds by cloning this repository on your own machine but i do not guarantee compatibility. Your PRs to this project are welcomed.
+Yomea is currently in development state, at this point no builds are shipped by developer.<br>
+
+> [!NOTE]
+> But heads up, you can build your own local builds by cloning this repository.<br>
+
+**Also your PRs to this project are welcomed.**
+
+## Steps to build this repository
+
+> [!IMPORTANT]
+> Make sure you have installed `git` and `curl`.
+
+**1.** Firstly clone Yomea repository onto your machine.
+```bash
+git clone https://github.com/YomoSK/yomea
+```
+
+**2.** Then use cargo to run the project.
+```bash
+cd rust-src
+cargo run
+```
 
 [Website](https://yomea.dev)
diff --git a/rust-src/Cargo.toml b/rust-src/Cargo.toml
@@ -0,0 +1,24 @@
+[package]
+name = "Yomea"
+version = "0.1.0"
+description = "Web browser"
+authors = ["Yomo"]
+license = ""
+repository = "https://github.com/YomoSK/yomea"
+edition = "2021"
+
+# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
+
+[lib]
+name = "app_lib"
+crate-type = ["staticlib", "cdylib", "rlib"]
+
+[build-dependencies]
+tauri-build = { version = "2.0.1", features = [] }
+
+[dependencies]
+serde_json = "1.0"
+serde = { version = "1.0", features = ["derive"] }
+tauri = { version = "2.0.6", features = ["unstable"] }
+isahc = "1.7.2"
+scraper = "0.21.0"
diff --git a/rust-src/build.rs b/rust-src/build.rs
@@ -0,0 +1,3 @@
+fn main() {
+   tauri_build::build();
+}
diff --git a/rust-src/capabilities/default.json b/rust-src/capabilities/default.json
@@ -0,0 +1,11 @@
+{
+  "$schema": "../gen/schemas/desktop-schema.json",
+  "identifier": "default",
+  "description": "enables the default permissions",
+  "windows": [
+    "main"
+  ],
+  "permissions": [
+    "core:default"
+  ]
+}
diff --git a/rust-src/components/home/index.html b/rust-src/components/home/index.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<html lang="en">
+   <head>
+      <meta charset="UTF-8">
+      <meta name="viewport" content="width=device-width, initial-scale=1.0">
+   </head>
+   <body>
+
+   </body>
+</html>
diff --git a/rust-src/components/topbar/index.html b/rust-src/components/topbar/index.html
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html lang="en">
+   <head>
+      <meta charset="UTF-8">
+      <!-- <meta name="viewport" content="width=device-width, initial-scale=1.0"> -->
+      <meta name="viewport" content="height=60, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"></meta>
+      <link rel="stylesheet" href="./styles.css">
+   </head>
+   <body>
+      <nav>
+         <div id="tabs">
+            <!-- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
+               <path d="M10.75 4.75a.75.75 0 0 0-1.5 0v4.5h-4.5a.75.75 0 0 0 0 1.5h4.5v4.5a.75.75 0 0 0 1.5 0v-4.5h4.5a.75.75 0 0 0 0-1.5h-4.5v-4.5Z" />
+            </svg> -->
+            <div id="tab-title" style="display: none;"></div>
+         </div>
+
+         <div id="searchbar">
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
+               <path fill-rule="evenodd" d="M12 1.5a5.25 5.25 0 0 0-5.25 5.25v3a3 3 0 0 0-3 3v6.75a3 3 0 0 0 3 3h10.5a3 3 0 0 0 3-3v-6.75a3 3 0 0 0-3-3v-3c0-2.9-2.35-5.25-5.25-5.25Zm3.75 8.25v-3a3.75 3.75 0 1 0-7.5 0v3h7.5Z" clip-rule="evenodd" />
+            </svg>             
+            <input
+               type="url"
+               placeholder="Search in the universe..."
+               autocomplete="off"
+               autofocus
+            />
+         </div>
+
+         <div id="controls">
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
+               <path d="M6.28 5.22a.75.75 0 0 0-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 1 0 1.06 1.06L10 11.06l3.72 3.72a.75.75 0 1 0 1.06-1.06L11.06 10l3.72-3.72a.75.75 0 0 0-1.06-1.06L10 8.94 6.28 5.22Z" />
+            </svg>             
+         </div>
+      </nav>
+
+      <script src="./script.js" type="module"></script>
+   </body>
+</html>
diff --git a/rust-src/components/topbar/script.js b/rust-src/components/topbar/script.js
@@ -0,0 +1,64 @@
+const { invoke } = window.__TAURI__.core;
+const { listen } = window.__TAURI__.event;
+
+const title = document.getElementById('tab-title');
+const searchbar = document.querySelector('#searchbar>input');
+
+function subpayload(payload, length = 20) {
+   if(payload.length > length) payload = payload.substring(0, length) + '...';
+   return payload;
+}
+
+document.addEventListener('DOMContentLoaded', () => {
+   // invoke('get_title').then(t => {
+   //    title.innerText = t;
+   //    if(t) title.style.display = null;
+   // });
+   localStorage.clear();
+
+   searchbar.addEventListener('keydown', ({ target, key }) => {
+      const url = target.value.trim();
+      if(key.toUpperCase() == 'ENTER' && url != 'about:blank') {
+         target.blur();
+         invoke('load_url', {
+            url: url.includes(' ') ? 'https://google.com/search?q=' + url.split(' ').join('+') : url.includes('://') ? url : 'https://' + url
+         });
+      }
+   });
+
+   searchbar.addEventListener('focus', ({ target }) => {
+      if(target.value) target.value = localStorage.getItem('origin_url') || target.value;
+   });
+
+   searchbar.addEventListener('blur', ({ target }) => {
+      target.value = localStorage.getItem('pretty_url') || target.value;
+   });
+
+   document.querySelector('#controls>svg').addEventListener('click', () => {
+      invoke('close');
+   });
+
+   window.addEventListener('contextmenu', event => event.preventDefault());
+});
+
+listen('title_change', ({ payload }) => {
+   if(payload) {
+      title.innerText = subpayload(payload);
+      title.style.display = null;
+   }
+   else title.style.display = 'none';
+});
+
+listen('url_change', ({ payload }) => {
+   const url = payload.endsWith('/') ? payload.substring(0, payload.length - 1) : payload;
+   if(payload && url != 'about:blank') {
+      const isHTTPS = url.startsWith('https://');
+
+      document.querySelector('#searchbar>svg').style.display = isHTTPS ? 'block' : null;
+      searchbar.style.paddingLeft = isHTTPS ? 'calc(2*.4rem + 20px)' : null;
+
+      localStorage.setItem('origin_url', url);
+      searchbar.value = (isHTTPS ? url.split('://')[1] : url).replace('www.', '');
+      localStorage.setItem('pretty_url', searchbar.value);
+   }
+});
diff --git a/rust-src/components/topbar/styles.css b/rust-src/components/topbar/styles.css
@@ -0,0 +1,92 @@
+@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
+
+body {
+   margin: 0;
+   padding: 0;
+   height: 60px;
+   background: transparent;
+   font-family: 'Roboto', sans-serif;
+}
+
+body::before {
+   content: '';
+   position: absolute;
+   top: 0;
+   left: 0;
+   width: 100%;
+   height: 60px;
+   background: #E3F4FE;
+   opacity: .75;
+   z-index: -1;
+}
+
+nav {
+   /* padding: .75rem 1.25rem; */
+   padding: .75rem 1.25rem .75rem .75rem;
+   display: grid;
+   grid-template-columns: repeat(3, 1fr);
+   align-items: center;
+   height: -webkit-fill-available;
+   -webkit-app-region: drag;
+}
+
+nav svg, nav > #searchbar, nav > * > div {
+   -webkit-app-region: no-drag;
+}
+
+nav > #tabs, nav > #controls {
+   height: -webkit-fill-available;
+   display: flex;
+   gap: .5rem;
+}
+
+nav > #tabs > svg, nav > #controls > svg {
+   width: 22px;
+   cursor: pointer;
+}
+
+nav > #tabs > #tab-title {
+   padding: 0 .5rem;
+   background: #E2E5E8;
+   border-radius: 8px;
+   font-size: 15px;
+   font-weight: 600;
+   display: flex;
+   justify-content: center;
+   align-items: center;
+   text-wrap: nowrap;
+}
+
+nav > #searchbar {
+   position: relative;
+   height: -webkit-fill-available;
+}
+
+nav > #searchbar > svg {
+   position: absolute;
+   top: 50%;
+   left: .4rem;
+   transform: translateY(-50%);
+   width: 20px;
+   display: none;
+}
+
+nav > #searchbar > input {
+   padding: .4rem 1rem;
+   width: 100%;
+   height: -webkit-fill-available;
+   background: #E2E5E8;
+   border: none;
+   border-radius: 8px;
+   font-size: 14px;
+   font-weight: 600;
+   outline: none;
+}
+
+nav > #controls {
+   justify-self: self-end;
+}
+
+nav > #controls > svg:last-child {
+   fill: #FF1E00;
+}
diff --git a/rust-src/icons/icon.ico b/rust-src/icons/icon.ico
diff --git a/rust-src/icons/icon.png b/rust-src/icons/icon.png