Created public beta

Aneksium · Mar 3, 2024 · a0df948 · a0df948
1 parent ebb3b3e
commit a0df948
Show file tree

Hide file tree

Showing 22 changed files with 79 additions and 47 deletions.
diff --git a/icon.ico b/icon.ico
diff --git a/notes/NoteSphere/1.ns b/notes/NoteSphere/1.ns
@@ -0,0 +1 @@
+VE9ETw==:|:1:|:LSBidWdmaXghISEhISE=
diff --git a/notes/NoteSphere/2.ns b/notes/NoteSphere/2.ns
@@ -0,0 +1 @@
+UGxhbnM=:|:3:|:LSBzdXBwb3J0IG1hcmtkb3dubm5uISEhISEhCi0gZWFzdGVyIGVnZ3M=
diff --git a/notes/board/1.ns b/notes/board/1.ns
diff --git a/notes/board/2.ns b/notes/board/2.ns
diff --git a/notes/board/3.ns b/notes/board/3.ns
diff --git a/notes/board/4.ns b/notes/board/4.ns
diff --git a/notes/board/5.ns b/notes/board/5.ns
diff --git a/notes/hello aaron/1.ns b/notes/hello aaron/1.ns
diff --git a/notes/hello aaron/2.ns b/notes/hello aaron/2.ns
diff --git a/notes/hello aaron/3.ns b/notes/hello aaron/3.ns
diff --git a/notes/hello aaron/4.ns b/notes/hello aaron/4.ns
diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/public/icon.ico b/public/icon.ico
diff --git a/public/index.html b/public/index.html
@@ -4,7 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
-    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+    <link rel="icon" href="<%= BASE_URL %>icon.ico">
     <title><%= htmlWebpackPlugin.options.title %></title>
   </head>
   <body>

diff --git a/src/background.ts b/src/background.ts
@@ -19,8 +19,9 @@ async function createWindow() {
         width: 800,
         height: 600,
         frame: false,
-        minWidth: 576,
+        minWidth: 832,
         minHeight: 576,
+        icon: 'icon.ico',
         webPreferences: {
             nodeIntegration: (process.env.ELECTRON_NODE_INTEGRATION as unknown) as boolean,
             contextIsolation: !process.env.ELECTRON_NODE_INTEGRATION,

diff --git a/src/components/NotePreview/NotePreview.vue b/src/components/NotePreview/NotePreview.vue
@@ -1,5 +1,5 @@
 <template>
-    <router-link :to="{ name: 'Editor', params: { id: id } }" class="notePrev" :class="{ 
+    <router-link :to="{ name: 'Editor', params: { board: board, id: id } }" class="notePrev" :class="{ 
         yellow: color == 'yellow',
         aqua: color == 'aqua',
         pink: color == 'pink',
@@ -36,6 +36,10 @@ export default defineComponent({
         id: {
             type: String,
             required: true
+        },
+        board: {
+            type: String,
+            required: true
         }
     },
     data() {

diff --git a/src/routes/EditorPage/EditorPage.vue b/src/routes/EditorPage/EditorPage.vue
@@ -22,6 +22,7 @@
 import { defineComponent } from 'vue'
 import MarkovChain from '../../utils/Markov'
 import * as fs from 'fs'
+import boardManager from '@/utils/BoardManager'
 
 export default defineComponent({
     name: 'EditorPage',
@@ -44,8 +45,14 @@ export default defineComponent({
             this.markov.train(this.content)
         },
         saveNote() {
-            try { fs.writeFileSync(`./notes/${this.id}.ns`, `${this.title}\n${this.color}\n${this.content}`, 'utf-8') }
-            catch { console.log('Error occured.') }
+            try {
+                const note = boardManager.boards.get(this.$route.params.board as string)?.notes.get(this.$route.params.id as string)
+                note!.title = this.title
+                note!.content = this.content
+                note!.color = this.color as 'yellow' | 'aqua' | 'pink' | 'green'
+                note!.save()
+            }
+            catch { console.log('TImed out') }
         },
         autoSave() {
             if(this.saveTimeout != null) clearTimeout(this.saveTimeout)
@@ -61,16 +68,11 @@ export default defineComponent({
         color: function() { this.autoSave() }
     },
     mounted() {
-        const data = fs.readFileSync(`./notes/${this.$route.params.id}`, 'utf-8')
-        const formatted = data.split('\n')
-        const title = formatted[0]
-        const color = formatted[1] as 'yellow' | 'aqua' | 'pink' | 'green'
-        const content = formatted.slice(2, formatted.length).join('\n')
-        
-        this.title = title
-        this.color = color
-        this.content = content
-        this.id = this.$route.params.id as string
+        const noteData = boardManager.boards.get(this.$route.params.board as string)?.notes.get(this.$route.params.id as string)
+        this.title = noteData?.title as string
+        this.color = noteData?.color as 'yellow' | 'aqua' | 'pink' | 'green'
+        this.content = noteData?.content as string
+        this.id = noteData?.id as string
     }
 })
 </script>
diff --git a/src/routes/HomePage/HomePage.vue b/src/routes/HomePage/HomePage.vue
@@ -17,25 +17,25 @@
             <span class="genTitle">Board Name:</span>
             <input id="nameInput" type="text" placeholder="New Board" v-model="overlayMenu.boardCreate.name"/>
             <div id="boardCreateMenBtns">
+                <button class="boardCreateMenBtn" @click="cancelBoardCreate()">Cancel</button>
                 <button class="boardCreateMenBtn" datatype="create" @click="createBoard()">Create</button>
-                <button class="boardCreateMenBtn" datatype="cancel">Cancel</button>
             </div>
         </div>
     </div>
     <div id="navSpace"></div>
     <div id="homeCont">
         <div id="boardMenu">
             <div id="boardMenHead">
-                <span class="genTitle">My Boards</span>
-                <button @click="showOverlay('boardCreate', true)">+</button>
+                <span class="genSubTitle">My Boards</span>
+                <button id="newBoardBtn" @click="showOverlay('boardCreate', true)">New</button>
             </div>
             <div id="boardMenBtnCont">
                 <button 
                     class="boardMenBtn"
                     v-for="(board, i) in loadedBoards"
                     :key="i"
                     @click="currentBoard = board[0]"
-                    :style="currentBoard == board[0] ? 'background-color: rgba(255, 255, 255, 0.125);' : ''">
+                    :style="currentBoard == board[0] ? 'background-color: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.15);' : ''">
                     {{ board[0] }}
                 </button>
             </div>
@@ -48,6 +48,7 @@
             :description="note.content"
             :color="note.color"
             :id="note.id"
+            :board="currentBoard || ''"
             @contextmenu="toggleContextOverlay('notePreview', true, $event, note.id)"
         />
         <div id="newCont">
@@ -116,6 +117,10 @@ export default defineComponent({
             this.currentBoard = this.overlayMenu.boardCreate.name
             this.overlayMenu.boardCreate.name = ''
         },
+        cancelBoardCreate() {
+            this.showOverlay('boardCreate', false)
+            this.overlayMenu.boardCreate.name = ''
+        },
         createNote() {
             const board = boardManager.boards.get(this.currentBoard!)
             const notes = board?.createNote()

diff --git a/src/routes/HomePage/style.css b/src/routes/HomePage/style.css
@@ -1,3 +1,7 @@
+:root {
+    --base-purple: rgb(173, 74, 219);
+    --hover-purple: rgb(113, 54, 141);
+}
 #navSpace {
     height: 36px;
     width: 100%;
@@ -19,7 +23,7 @@
     box-sizing: border-box;
     padding-top: 5rem;
     padding-bottom: 5rem;
-    gap: 8rem;
+    gap: 1rem;
 }
 #boardMenHead {
     display: flex;
@@ -29,7 +33,7 @@
     height: fit-content;
     width: 100%;
     box-sizing: border-box;
-    padding-left: 1rem; padding-right: 1rem;
+    padding-left: 2rem; padding-right: 2rem;
 }
 .genTitle {
     font-family: 'Inconsolata', monospace;
@@ -39,6 +43,30 @@
     user-select: none;
     color: rgba(255, 255, 255, 0.75);
 }
+.genSubTitle {
+    font-family: 'Inconsolata', monospace;
+    font-size: 18px;
+    box-sizing: border-box;
+    user-select: none;
+    color: rgba(255, 255, 255, 0.5);
+}
+#newBoardBtn {
+    padding: 0.4rem;
+    padding-left: 0.75rem;
+    padding-right: 0.75rem;
+    background: var(--base-purple);
+    border: none;
+    border-radius: 5px;
+    font-size: 1rem;
+    color: white;
+    font-family: 'Inconsolata', monospace;
+    box-shadow: rgba(0, 0, 0, 0.75) 3px 3px 5px;
+}
+#newBoardBtn:hover {
+    background-color: var(--hover-purple);
+    transition: background 200ms, color 200ms;
+    color: rgba(255, 255, 255, 0.5);
+}
 #boardMenBtnCont {
     height: 100%;
     display: flex;
@@ -154,11 +182,11 @@
 }
 
 #boardCreateMenBtns {
-    height: 44px;
+    height: 38px;
     width: 100%;
     display: flex;
     flex-direction: row;
-    justify-content: space-between;
+    justify-content: flex-end;
     box-sizing: border-box;
     padding-left: 1.5rem;
     padding-right: 1.5rem;
@@ -167,30 +195,29 @@
 .boardCreateMenBtn {
     width: 96px;
     height: 100%;
-    border-radius: 10px;
+    border-radius: 5px;
     border: none;
     font-family: 'Inconsolata', monospace;
     font-size: 16px;
-    font-weight: bold;
-    box-shadow: rgba(0, 0, 0, 0.5) 5px 5px 5px;
+    color: white;
+    background: none;
 }
 
 .boardCreateMenBtn[datatype="create"] {
-    background-color: rgb(70, 255, 70);
-}
-
-.boardCreateMenBtn[datatype="cancel"] {
-    background-color: rgb(255, 70, 70);
+    background-color: var(--base-purple);
+    box-shadow: rgba(0, 0, 0, 0.5) 5px 5px 5px;
 }
 
 .boardCreateMenBtn[datatype="create"]:hover {
-    background-color: rgb(41, 159, 41);
+    background-color: var(--hover-purple);
+    color: rgba(255, 255, 255, 0.5);
+    transition: background 200ms, color 200ms;
+    text-decoration: none;
 }
 
-.boardCreateMenBtn[datatype="cancel"]:hover {
-    background-color: rgb(164, 45, 45);
+.boardCreateMenBtn:hover {
+    text-decoration: underline 1px;
 }
-
 #homeContextOverlay {
     position: fixed;
     width: 100vw;
@@ -238,4 +265,4 @@
 .npmBtn[datatype="delete"]:hover {
     color: white;
     background-color: rgba(255, 54, 54, 0.75);
-}
+}
diff --git a/src/utils/Note.ts b/src/utils/Note.ts
@@ -23,7 +23,7 @@ export default class Note {
         const colorIndex = ['yellow', 'aqua', 'pink', 'green'].indexOf(this.color)
 
         const data = `${title64}:|:${colorIndex}:|:${cont64}`
-        fs.writeFileSync(`${this.parentPath}/${this.id}`, data, 'utf-8')
+        fs.writeFileSync(`${this.parentPath}/${this.id}.ns`, data, 'utf-8')
     }
     constructor(parentPath: string, id: string) {
         this.parentPath = parentPath

diff --git a/src/utils/router.ts b/src/utils/router.ts
@@ -4,7 +4,7 @@ import EditorPage from '@/routes/EditorPage/EditorPage.vue'
 
 const routes: Array<RouteRecordRaw> = [
     { path: '/', name: 'Home', component: HomePage },
-    { path: '/edit/:id', name: 'Editor', component: EditorPage }
+    { path: '/edit/:board/:id', name: 'Editor', component: EditorPage }
 ]
 
 const router = createRouter({
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		UGxhbnM=:\|:3:\|:LSBzdXBwb3J0IG1hcmtkb3dubm5uISEhISEhCi0gZWFzdGVyIGVnZ3M=