From 9efe21476f69567010f0d63fd7a20748514ef44b Mon Sep 17 00:00:00 2001 From: Max G Date: Wed, 15 Apr 2020 06:28:58 +0000 Subject: [PATCH] * Made dispay of last edit smaller on note title display card * Made note menu buttons look better on mobile * Moved around some note menu buttons * Added a color picker with a rip off of google colors * Added a remove formatting button * Hide pin and archive icons, they appear green on hover, in the buttons * Further simplified display card logic, now it just adds an end tag and returns the data * Changed highlight text color to show colors (works on chrome...) --- client/src/Helpers.js | 2 +- client/src/assets/semantic-helper.css | 14 ++- client/src/components/GlobalSiteMenu.vue | 2 +- client/src/components/NoteInputPanel.vue | 49 +++++++--- .../src/components/NoteTitleDisplayCard.vue | 39 +++++--- .../components/TextColorTooltipComponent.vue | 94 +++++++++++++++++++ server/helpers/ProcessText.js | 11 ++- server/models/Note.js | 2 +- 8 files changed, 176 insertions(+), 37 deletions(-) create mode 100644 client/src/components/TextColorTooltipComponent.vue diff --git a/client/src/Helpers.js b/client/src/Helpers.js index 4e768c5..26e2703 100644 --- a/client/src/Helpers.js +++ b/client/src/Helpers.js @@ -44,7 +44,7 @@ helpers.timeAgo = (time) => { if (typeof format[2] == 'string') { return format[list_choice] } else { - return Math.floor(seconds / format[2]) + ' ' + format[1] + ' ' + token + return Math.floor(seconds / format[2]) + ' ' + format[1]// + ' ' + token } } } diff --git a/client/src/assets/semantic-helper.css b/client/src/assets/semantic-helper.css index c33c7b8..0417b2d 100644 --- a/client/src/assets/semantic-helper.css +++ b/client/src/assets/semantic-helper.css @@ -32,8 +32,8 @@ html { } div.ui.basic.segment.no-fluf-segment { - margin-top: 0px; - } + margin-top: 0px; +} /* Night mode modifiers */ @@ -182,6 +182,11 @@ a:hover { /* Shrink button text for mobile */ @media only screen and (max-width: 740px) { + .note-menu > .nm-button { + font-size: 1.4em; + padding: 10px 1px; + min-width: 40px; + } .note-menu .nm-button span { font-size: 0.7em; line-height: 0.4em; @@ -238,6 +243,11 @@ a:hover { /*border-bottom: 1px solid #ccc;*/ scrollbar-width: none; } + .squire-box::selection, + .squire-box::-moz-selection { + background: #cce2ffa6; + color: inherit; + } /*Makes the first line real big */ .squire-box:focus { outline: none; diff --git a/client/src/components/GlobalSiteMenu.vue b/client/src/components/GlobalSiteMenu.vue index 2162217..9677ab0 100644 --- a/client/src/components/GlobalSiteMenu.vue +++ b/client/src/components/GlobalSiteMenu.vue @@ -257,7 +257,7 @@ }, data: function(){ return { - version: '1.0.3', + version: '1.0.4', username: '', collapsed: false, mobile: false, diff --git a/client/src/components/NoteInputPanel.vue b/client/src/components/NoteInputPanel.vue index d9a88d6..7edb270 100644 --- a/client/src/components/NoteInputPanel.vue +++ b/client/src/components/NoteInputPanel.vue @@ -21,20 +21,22 @@ - - - + - + + + + + @@ -149,13 +151,9 @@
- - + + + + + + - - + + + @@ -331,6 +342,7 @@ 'simple-attachment-note': () => import('@/components/SimpleAttachmentNoteComponent.vue'), 'share-note-component': () => import('@/components/ShareNoteComponent.vue'), + 'color-tooltip':require('@/components/TextColorTooltipComponent.vue').default, 'nm-button':require('@/components/NoteMenuButtonComponent.vue').default }, data(){ @@ -377,6 +389,7 @@ colors: false, images: false, options: false, + colorpicker: false, //Encryption options passwordHint: '', @@ -565,6 +578,10 @@ this.editor.setSelection(squireRange) } }, + removeFormatting(){ + this.selectLineIfNoSelect() + this.editor.removeAllFormatting() + }, modifyFont(inSize){ this.selectLineIfNoSelect() @@ -577,6 +594,12 @@ this.editor.setFontSize(inSize) } }, + modifyColor(color){ + + this.selectLineIfNoSelect() + //Set color of font + this.editor.setTextColour(color) + }, toggleList(type){ //Undo list if its already a lits diff --git a/client/src/components/NoteTitleDisplayCard.vue b/client/src/components/NoteTitleDisplayCard.vue index e730cf3..87e4ece 100644 --- a/client/src/components/NoteTitleDisplayCard.vue +++ b/client/src/components/NoteTitleDisplayCard.vue @@ -68,22 +68,23 @@
- + - + {{ tag }} +
- - Last Edit {{$helpers.timeAgo(note.updated)}} + + {{$helpers.timeAgo(note.updated)}} - + @@ -93,13 +94,13 @@ data-tooltip="Archive" :data-tooltip="note.archived ? 'Un-Archive':'Archive' " data-inverted v-on:click="archiveNote"> - + - + @@ -289,6 +290,21 @@ + + + + \ No newline at end of file diff --git a/server/helpers/ProcessText.js b/server/helpers/ProcessText.js index b2dfcb3..9f63b80 100644 --- a/server/helpers/ProcessText.js +++ b/server/helpers/ProcessText.js @@ -67,7 +67,7 @@ ProcessText.deduceNoteTitle = (inTitle, inString) => { } //Remove inline styles that may be added by editor - inString = inString.replace(/style=".*?"/g,'') + // inString = inString.replace(/style=".*?"/g,'') const tagFreeLength = ProcessText.removeHtml(inString).length @@ -77,14 +77,15 @@ ProcessText.deduceNoteTitle = (inTitle, inString) => { // Still needs, links to open in a new window. sub = ProcessText.stripDoubleBlankLines(inString) - if(tagFreeLength > 200){ - sub += '... ' - } + // if(tagFreeLength > 200){ + // sub += '... ' + // } + inString += '' return {title, sub} //Emergency ending tag if truncated. This will help regex find all the lines - inString += '' + //Match full line and closing tag or just closing tag let lines = inString.match(/[<[a-zA-Z0-9]+>(.*?)<\/[a-zA-Z0-9]+>|<\/[a-zA-Z0-9>]+?>/gms) diff --git a/server/models/Note.js b/server/models/Note.js index 309ad4d..0aa452f 100644 --- a/server/models/Note.js +++ b/server/models/Note.js @@ -591,7 +591,7 @@ Note.search = (userId, searchQuery, searchTags, fastFilters) => { let searchParams = [userId] let noteSearchQuery = ` SELECT note.id, - SUBSTRING(note_raw_text.text, 1, 300) as text, + SUBSTRING(note_raw_text.text, 1, 500) as text, note_raw_text.title as title, note_raw_text.updated as updated, opened,