diff --git a/.eslintrc.json b/.eslintrc.json new file mode 100644 index 0000000..ca7b9a0 --- /dev/null +++ b/.eslintrc.json @@ -0,0 +1,120 @@ +{ + "env": { + "commonjs": true, + "es2021": true, + "node": true + }, + "extends": "eslint:recommended", + "parserOptions": { + "ecmaVersion": 12, + "sourceType": "module" + }, + "ignorePatterns": [ + "node_modules", + "lib/*", + "tests/*" + ], + "rules": { + "array-bracket-spacing": [ + "error", + "never" + ], + "arrow-spacing": [ + "error", + { + "after": true, + "before": true + } + ], + "brace-style": [ + "error", + "1tbs", + { + "allowSingleLine": true + } + ], + "comma-dangle": [ + "error", + "never" + ], + "computed-property-spacing": [ + "error", + "always" + ], + "default-case": "error", + "default-case-last": "error", + "eqeqeq": "warn", + "indent": [ + "error", + 2 + ], + "key-spacing": "error", + "max-len": [ + "error", + { + "code": 80, + "tabWidth": 2, + "ignoreTrailingComments": true, + "ignoreComments": false, + "ignoreStrings": true, + "ignoreUrls": true + } + ], + "no-array-constructor": "error", + "no-duplicate-imports": "error", + "no-extra-semi": "error", + "no-irregular-whitespace": "warn", + "no-loop-func": "error", + "no-mixed-spaces-and-tabs": "error", + "no-multi-spaces": "error", + "no-nested-ternary": "error", + "no-new-object": "error", + "no-trailing-spaces": "error", + "no-unneeded-ternary": "error", + "no-unused-vars": "error", + "no-use-before-define": "warn", + "no-var": "error", + "no-whitespace-before-property": "error", + "object-curly-spacing": [ + "error", + "always" + ], + "object-shorthand": "error", + "one-var": [ + "error", + { + "initialized": "never" + } + ], + "prefer-destructuring": [ + "error", + { + "array": true, + "object": true + } + ], + "prefer-object-spread": "error", + "prefer-rest-params": "error", + "quote-props": [ + "error", + "as-needed" + ], + "quotes": [ + "warn", + "single" + ], + "require-await": "error", + "semi": [ + "error", + "always" + ], + "space-before-function-paren": [ + "error", + { + "anonymous": "always", + "named": "never", + "asyncArrow": "always" + } + ] + } +} diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..11de5aa --- /dev/null +++ b/.prettierrc @@ -0,0 +1,8 @@ +{ + "trailingComma": "none", + "tabWidth": 2, + "semi": true, + "singleQuote": true, + "useTabs": false, + "bracketSpacing": true +} diff --git a/index.html b/index.html index a8f654c..64c9ec5 100644 --- a/index.html +++ b/index.html @@ -1,33 +1,52 @@ - - - Take Notes - - - -
- -
-
- -
- -
-
-
- - -
-
-
- - - - - - - + + + Take Notes + + + + +
+ +
+
+ +
+ +
+
+
+ + +
+
+
+ + + + + + + diff --git a/main.js b/main.js index d874b6b..5b842e3 100644 --- a/main.js +++ b/main.js @@ -1,103 +1,105 @@ -const electron = require('electron'), - app = electron.app, - BrowserWindow = electron.BrowserWindow, - Menu = electron.Menu, - child = require('child_process'); +const electron = require('electron'); +const { app, BrowserWindow, Menu } = electron; +// const child = require('child_process'); -var mainWindow; +let mainWindow; function createWindow() { - mainWindow = new BrowserWindow({ - width: 1920, - height: 1080, - resizable: false, - webPreferences: { - nodeIntegration: true - } - }); - mainWindow.loadFile('index.html'); - mainWindow.on('closed', () => { - mainWindow = null; - }); + mainWindow = new BrowserWindow({ + width: 1920, + height: 1080, + resizable: true, + webPreferences: { + nodeIntegration: true + } + }); + mainWindow.loadFile('index.html'); + mainWindow.on('closed', () => { + mainWindow = null; + }); } app.on('ready', () => { - let template = [ - { - label: "Menu", - submenu: [ - { - label: "Refresh", - role: "reload", - accelerator: "F5" - }, - { type: "separator" }, - { - label: "Inspect", - click: () => { - mainWindow.webContents.openDevTools() - }, - accelerator: "F12" - } - ] - }, - { - label: "Export" - }, - // { - // label: "Backup", - // submenu: [ - // { - // label: "Export Now", - // click: () => { - // child.exec("node src/createBackup.js", (err, stdout)=>{ - // if(err){throw err;} - // }); - // } - // }, - // { - // type: "separator" - // }, - // { - // label: "View Backup files", - // click: () => { - // electron.shell.showItemInFolder("./backup/ "); - // } - // } - // ] - // }, - { - label: "About", - submenu: [ - { - label: "datmemerboi", - click: () => { - electron.shell.openExternal("https://datmemerboi.github.io/") - } - }, - { type: "separator" }, - { - label: "Github Repo", - click: () => { - electron.shell.openExternal("https://www.github.com/datmemerboi/Quick-Notes/"); - } - } - ] - }, - { - label: "Quit", - role: "quit" - } - ]; + let template = [ + { + label: 'Menu', + submenu: [ + { + label: 'Refresh', + role: 'reload', + accelerator: 'F5' + }, + { type: 'separator' }, + { + label: 'Inspect', + click: () => { + mainWindow.webContents.openDevTools(); + }, + accelerator: 'F12' + } + ] + }, + { + label: 'Export' + }, + /* + { + label: "Backup", + submenu: [ + { + label: "Export Now", + click: () => { + child.exec("node src/createBackup.js", (err, stdout)=>{ + if(err){throw err;} + }); + } + }, + { + type: "separator" + }, + { + label: "View Backup files", + click: () => { + electron.shell.showItemInFolder("./backup/ "); + } + } + ] + }, + */ + { + label: 'About', + submenu: [ + { + label: 'datmemerboi', + click: () => { + electron.shell.openExternal('https://datmemerboi.github.io/'); + } + }, + { type: 'separator' }, + { + label: 'Github Repo', + click: () => { + electron.shell.openExternal( + 'https://www.github.com/datmemerboi/Quick-Notes/' + ); + } + } + ] + }, + { + label: 'Quit', + role: 'quit' + } + ]; - menuBar = Menu.buildFromTemplate(template); - Menu.setApplicationMenu(menuBar) + let menuBar = Menu.buildFromTemplate(template); + Menu.setApplicationMenu(menuBar); - createWindow(); + createWindow(); }); app.on('activate', () => { - if(mainWindow === null) { createWindow(); } + if (mainWindow === null) createWindow(); }); -process.env['ELECTRON_DISABLE_SECURITY_WARNINGS'] = 'true'; +process.env.ELECTRON_DISABLE_SECURITY_WARNINGS = true; diff --git a/package.json b/package.json index dfbdc67..f86dc37 100644 --- a/package.json +++ b/package.json @@ -1,21 +1,20 @@ { "name": "quick-notes", - "version": "2.0.3", + "version": "3.0.1", "description": "Note Taker App", "main": "main.js", "scripts": { - "build-sass": "node-sass --include-path scss --output-style expanded static/master.scss static/master.css", - "watch-sass": "node-sass --watch static/master.scss static/master.css --output-style expanded", + "build-sass": "sass static/master.scss static/master.css", "open-electron": "electron .", "start": "npm run build-sass && npm run open-electron" }, - "author": "DMB", "license": "ISC", "dependencies": { - "electron": "^10.1.3", - "jquery": "^3.5.1" + "electron": "^15.3.0", + "jquery": "^3.6.0" }, "devDependencies": { - "node-sass": "^4.14.1" + "eslint": "^8.1.0", + "sass": "^1.43.3" } } diff --git a/static/master.scss b/static/master.scss index 7ef7d00..4b4bc82 100644 --- a/static/master.scss +++ b/static/master.scss @@ -1,42 +1,50 @@ @font-face { font-family: 'Proxima Nova'; - src: url("./ProximaNova/ProximaNovaA-Bold.woff") format("woff"); + src: url('./ProximaNova/ProximaNovaA-Bold.woff') format('woff'); font-weight: 800; } @font-face { font-family: 'Proxima Nova'; - src: url("./ProximaNova/ProximaNovaA-Semibold.woff") format("woff"); + src: url('./ProximaNova/ProximaNovaA-Semibold.woff') format('woff'); font-weight: 600; } @font-face { font-family: 'Proxima Nova'; - src: url("./ProximaNova/ProximaNovaA-Regular.woff") format("woff"); + src: url('./ProximaNova/ProximaNovaA-Regular.woff') format('woff'); } // COLOR CONSTANTS -$dullWhiteBG: #F0F0F0; -$noteWhiteBG: #F3F3F3; -$noteBorderBG: #DDD; -$doneTaskBG: #DBDADA; +$dullWhiteBG: #f0f0f0; +$noteWhiteBG: #f3f3f3; +$noteBorderBG: #ddd; +$doneTaskBG: #dbdada; // $doneTaskBG: #E5E7E9; $scrollThumbBG: #666; -$scrollTrackBG: #D5D8DC; +$scrollTrackBG: #d5d8dc; // $scrollTrackBG: #EAECEE; $fadedGreyText: #666; -$blueGreyText: #5D6D7E; -$tomatoRedBG: #FF6347; -$bloodRedBG: #C70039; -$jeanBlueBG: #2A6696; -$acceptenceGreenBG: #58D68D; +$blueGreyText: #5d6d7e; +$tomatoRedBG: #ff6347; +$bloodRedBG: #c70039; +$jeanBlueBG: #2a6696; +$acceptenceGreenBG: #58d68d; $colorsArray: $blueGreyText, $tomatoRedBG, $jeanBlueBG; * { - font-family: "Proxima Nova", sans-serif; - h1 { font-size: 1.8em; } - h2 { font-size: 1.6em; } - h3 { font-size: 1.4em; } - h4 { font-size: 1.2em; } + font-family: 'Proxima Nova', sans-serif; + h1 { + font-size: 1.8em; + } + h2 { + font-size: 1.6em; + } + h3 { + font-size: 1.4em; + } + h4 { + font-size: 1.2em; + } h5 { font-size: 1.2em; color: $fadedGreyText; @@ -46,7 +54,9 @@ body { background-color: $dullWhiteBG; font-size: 1em; - &::-webkit-scrollbar { width: 1.35vmin; } + &::-webkit-scrollbar { + width: 1.35vmin; + } &::-webkit-scrollbar-track { background-color: $scrollTrackBG; border-radius: 3px; @@ -58,30 +68,42 @@ body { } .container { - width: 88vw; max-width: 88vw; min-height: 96vh; - position: absolute; left: 5vw; top: 0; + width: 88vw; + max-width: 88vw; + min-height: 96vh; + position: absolute; + left: 5vw; + top: 0; padding: 1vmin 1vmin 3vmin 1vmin; } div.notes { - min-width: 7vw; max-width: 28vw; - min-height: 5vh; max-height: 40vh; + min-width: 7vw; + max-width: 28vw; + min-height: 5vh; + max-height: 40vh; background-color: $noteWhiteBG; - border: solid 1px $noteBorderBG; border-radius: 8px; + border: solid 1px $noteBorderBG; + border-radius: 8px; padding: 2vmin 3vmin 2vmin 3vmin; margin: 1vmin; display: inline-flex; flex-direction: column; - h5, p { + h5, + p { display: block; margin: 0 1vmin 0 1vmin; } div.scrollable { - height: inherit; max-height: 30vh; width: inherit; + height: inherit; + max-height: 30vh; + width: inherit; overflow-y: auto; display: block; - &::-webkit-scrollbar { width: 1vmin; } + &::-webkit-scrollbar { + width: 1vmin; + } &::-webkit-scrollbar-track { border-radius: 8px; background-color: $scrollTrackBG !important; @@ -92,9 +114,11 @@ div.notes { } } div.meta-notes { - width: inherit; height: 2vh; + width: inherit; + height: 2vh; padding: 3vmin 0 0 0; - position: relative; bottom: 0; + position: relative; + bottom: 0; align-items: center; flex-direction: row; display: inline-flex; @@ -103,12 +127,14 @@ div.notes { font-size: 0.9em; } button.delete-btn { - margin: 0; padding: 0; + margin: 0; + padding: 0; border: none; display: inline-flex; img.delete-icon { display: inline-flex; - width: 25px; height: 23px; + width: 25px; + height: 23px; user-select: none; } } @@ -128,10 +154,13 @@ div.notes { */ // TASKS div.tasks { - min-width: 7vw; max-width: 28vw; - min-height: 5vh; max-height: 40vh; + min-width: 7vw; + max-width: 28vw; + min-height: 5vh; + max-height: 40vh; background-color: $noteWhiteBG; - border: solid 1px $noteBorderBG; border-radius: 8px; + border: solid 1px $noteBorderBG; + border-radius: 8px; padding: 2vmin 3vmin 2vmin 3vmin; margin: 1vmin; display: inline-flex; @@ -140,16 +169,21 @@ div.tasks { &.mark-done { background-color: $doneTaskBG !important; } - h5, p { + h5, + p { margin: 0; padding: 0; } div.scrollable { - height: inherit; max-height: 30vh; width: inherit; + height: inherit; + max-height: 30vh; + width: inherit; overflow-y: auto; display: block; - &::-webkit-scrollbar { width: 1vmin; } + &::-webkit-scrollbar { + width: 1vmin; + } &::-webkit-scrollbar-track { border-radius: 8px; background-color: $scrollTrackBG !important; @@ -162,19 +196,22 @@ div.tasks { } div.task-bar { - width: 20vw; height: 2vh; + width: 20vw; + height: 2vh; background-color: grey; display: flex; flex-direction: row; .task-progress { - width: 1%; height: 100%; + width: 1%; + height: 100%; background-color: orange !important; } } // LISTS -ul, ol { +ul, +ol { margin: 0; list-style: none; padding: 0; @@ -185,7 +222,8 @@ ul, ol { } li.list-item { background-color: $jeanBlueBG; - border: none; border-radius: 3px; + border: none; + border-radius: 3px; color: white; margin: 1vmin 0 1vmin 0; padding: 0 0.5vmin 0 0.5vmin; @@ -198,43 +236,61 @@ ul, ol { } } -@-webkit-keyframes moveUp { - from { top: 0vh }; - to { top: 11vh } +@keyframes moveUp { + from { + top: 0vh; + } + to { + top: 11vh; + } } button.add-btn { - width: 3vw; height: 5vh; - border: none; border-radius: 3vmin; + width: 3vw; + height: 5vh; + border: none; + border-radius: 3vmin; &:hover { background-color: $scrollTrackBG; } img.add-icon { - width: 30px; height: 30px; + width: 30px; + height: 30px; user-select: none; } } div.new-note-modal { display: none; - width: 100vw; height: 100vh; - position: absolute; top: 0; left: 0; + width: 100vw; + height: 100vh; + position: absolute; + top: 0; + left: 0; background-color: rgba(0, 0, 0, 0.5); #new-note { animation-name: moveUp; animation-duration: 0.5s; - width: 30vw; height: 70vh; + width: 30vw; + height: 70vh; background-color: $noteWhiteBG !important; - border: solid 1px $noteBorderBG; border-radius: 8px; + border: solid 1px $noteBorderBG; + border-radius: 8px; display: block; - position: relative; top: 11vh; left: 34vw; + position: relative; + top: 11vh; + left: 34vw; padding: 1vmin; .input-bar { - &.title-bar { font-size: 1.2em; } - &.content-box { height: 40vh; } + &.title-bar { + font-size: 1.2em; + } + &.content-box { + height: 40vh; + } } label { @@ -249,7 +305,8 @@ div.new-note-modal { div { padding: 1vmin 0 1vmin 0; #switch { - width: 10vw; height: 3vh; + width: 10vw; + height: 3vh; background-color: $scrollThumbBG !important; color: white; border: none; @@ -265,8 +322,10 @@ div.new-note-modal { padding: 1vmin 0 1vmin 0; button.note-confirm-btn { - width: 8.4vw; height: 4.2vh; - border: 0; border-radius: 5px; + width: 8.4vw; + height: 4.2vh; + border: 0; + border-radius: 5px; margin: 0 0.5vmin 0 0.5vmin; &.cancel { @@ -293,12 +352,12 @@ div.new-note-modal { // INPUT .input-bar { - padding: 1vmin !important; - width: 96.2%; - height: 8vh; - overflow-y: auto; - background-color: $dullWhiteBG; - color: black; - border: solid 1px $noteBorderBG; - border-radius: 3px; + padding: 1vmin !important; + width: 96.2%; + height: 8vh; + overflow-y: auto; + background-color: $dullWhiteBG; + color: black; + border: solid 1px $noteBorderBG; + border-radius: 3px; } diff --git a/static/plus.svg b/static/plus.svg index 5d3ff87..3b2358a 100644 --- a/static/plus.svg +++ b/static/plus.svg @@ -1,3 +1 @@ - - - + \ No newline at end of file diff --git a/static/trash.svg b/static/trash.svg index 05c3171..a74169a 100644 --- a/static/trash.svg +++ b/static/trash.svg @@ -1,5 +1 @@ - - - - - + \ No newline at end of file