Max/SolidScribe
Max/SolidScribe
1
0
Fork 0
Code Issues 24 Pull Requests Releases Wiki Activity

Compare commits

base: Max:984ac6ccff6eeb36fd4dc79e7df3c288843d6e78
Branches Tags
Max:dev
..
compare: Max:99b69c234f53d676f220c0ac4cbfa25e882d9a19
Branches Tags
Max:dev

No commits in common. "984ac6ccff6eeb36fd4dc79e7df3c288843d6e78" and "99b69c234f53d676f220c0ac4cbfa25e882d9a19" have entirely different histories.
984ac6ccff ... 99b69c234f

7 changed files with 96 additions and 215 deletions
Show Stats Expand all files Collapse all files

16
client/src/assets/semantic-helper.css
View File

@ -199,16 +199,12 @@ a:hover {
/* squire text styles */ /* squire text styles */
.squire-box { .squire-box {
border: none; border: none;
/*height: calc(100% - 69px);*/ height: calc(100% - 69px);
min-height: calc(100% - 0px);
background-color: rgba(255,200,0,0.0);
/*margin-bottom: 15px;*/
box-sizing: border-box; box-sizing: border-box;
padding: 10px 15px 10px; padding: 10px 15px 10px;
/*background: transparent;*/ background: transparent;
overflow-x: scroll; overflow-x: scroll;
/*color: var(--text_color);*/
font-size: 1.2em; font-size: 1.2em;
line-height: 1.5em; line-height: 1.5em;
word-wrap: break-word; word-wrap: break-word;
@ -229,18 +225,17 @@ a:hover {
.squire-box a { .squire-box a {
cursor: pointer; cursor: pointer;
} }
/* .note-card-text i, .note-card-text i,
.squire-box i { .squire-box i {
padding: 0.5em 0.99em; padding: 0.5em 0.99em;
border: 1px solid #CCC; border: 1px solid #CCC;
margin: 1px; margin: 1px;
border-radius: 9px; border-radius: 9px;
display: inline-block; display: inline-block;
}*/ }
.squire-box p { .squire-box p {
margin-bottom: 0; margin-bottom: 0;
} }
.note-card-text blockquote,
.squire-box blockquote { .squire-box blockquote {
margin: 0; margin: 0;
padding: 0.8em; padding: 0.8em;
@ -250,7 +245,6 @@ a:hover {
max-width:100%; max-width:100%;
height: auto; height: auto;
max-height: 200px; max-height: 200px;
margin: 10px 0 0;
} }
.squire-box img { .squire-box img {
max-width:100%; max-width:100%;

92
client/src/components/NoteInputPanel.vue
View File

@ -4,12 +4,10 @@
id="InputNotes" id="InputNotes"
class="master-note-edit" class="master-note-edit"
@keyup.esc="close" @keyup.esc="close"
:class="[{ 'size-down':(sizeDown == true) }, 'position-'+position ]" :class="[{'size-down':(sizeDown == true), 'padded-bottom':extraToolbarsVisible }, 'position-'+position ]"
:style="{ 'background-color':styleObject['noteBackground'], 'color':styleObject['noteText']}" :style="{ 'background-color':styleObject['noteBackground'], 'color':styleObject['noteText']}"
> >
<div class="input-container-wrapper">
<!-- Loading indicator --> <!-- Loading indicator -->
<div v-if="loading" class="loading-note"> <div v-if="loading" class="loading-note">
<div class="ui active dimmer"> <div class="ui active dimmer">
@ -36,28 +34,11 @@
<nm-button v-if="usersOnNote > 1" icon="green user circle" /> <nm-button v-if="usersOnNote > 1" icon="green user circle" />
<nm-button icon="ellipsis horizontal" v-on:click.native="showNoteOptions = !showNoteOptions" /> <nm-button icon="ellipsis horizontal" v-on:click.native="showNoteOptions = !showNoteOptions" />
</div>
<!-- Squire box grows --> </div>
<div class="note-wrapper">
<div id="squire-id" class="squire-box" ref="squirebox"></div> <div id="squire-id" class="squire-box" ref="squirebox"></div>
<!-- bottom stats -->
<div class="ui basic segment">
<div class="ui grid">
<div class="sixteen wide column">
<div class="ui basic compact button">
Status: {{ statusText }}
</div>
<div class="ui basic compact button" :data-tooltip="`Created: ${$helpers.timeAgo(created)}`">
Last Change: {{ $helpers.timeAgo(updated) }}
</div>
</div>
</div>
</div>
</div>
<!-- && this.$store.getters.getIsUserOnMobile --> <!-- && this.$store.getters.getIsUserOnMobile -->
<span class="note-status-indicator" v-on:click="save()" v-if="statusText != 'Saved' && $store.getters.getIsUserOnMobile"> <span class="note-status-indicator" v-on:click="save()" v-if="statusText != 'Saved' && $store.getters.getIsUserOnMobile">
<div class="ui green button">{{statusText}}</div> <div class="ui green button">{{statusText}}</div>
@ -127,9 +108,7 @@
</div> </div>
</div> </div>
</div> <!-- Side slide menus for colors, tags and images -->
<!-- Side slide menus for colors, tags, images and other options -->
<side-slide-menu v-if="colorPickerVisible" v-on:close="colorPickerVisible = false" name="colors"> <side-slide-menu v-if="colorPickerVisible" v-on:close="colorPickerVisible = false" name="colors">
<color-picker <color-picker
@ -232,8 +211,6 @@
modified: false, modified: false,
noteText: '', noteText: '',
rawTextId: 0, rawTextId: 0,
created: '',
updated: '',
shareUsername: null, shareUsername: null,
diffNoteText: '', diffNoteText: '',
statusText: 'Saved', statusText: 'Saved',
@ -322,11 +299,6 @@
this.editor = new Squire( this.$refs.squirebox, {blockTag: 'p' }) this.editor = new Squire( this.$refs.squirebox, {blockTag: 'p' })
this.setText(this.noteText) this.setText(this.noteText)
//focus on open, not on mobile, thats annoying
if(!this.$store.getters.getIsUserOnMobile){
this.editor.focus()
}
//Click Event - Open links when clicked in editor or toggle checks //Click Event - Open links when clicked in editor or toggle checks
this.editor.addEventListener('click', e => { this.editor.addEventListener('click', e => {
@ -721,12 +693,10 @@
this.rawTextId = response.data.rawTextId this.rawTextId = response.data.rawTextId
this.shareUsername = response.data.shareUsername this.shareUsername = response.data.shareUsername
this.created = response.data.created
this.updated = response.data.updated
vm.noteText = response.data.text vm.noteText = response.data.text
vm.diffNoteText = response.data.text vm.diffNoteText = response.data.text
vm.updated = response.data.updated
vm.lastNoteHash = vm.hashString(response.data.text) vm.lastNoteHash = vm.hashString(response.data.text)
//Set up note colors //Set up note colors
if(response.data.color){ if(response.data.color){
@ -1061,52 +1031,23 @@
<style type="text/css" scoped> <style type="text/css" scoped>
/* squire styles */ /* squire styles */
.input-container-wrapper {
display: block;
height: 100%;
width: 100%;
margin: 0;
padding: 0;
overflow: hidden;
display: flex;
flex-direction: column;
}
/*Three main elements nested in panel */
.note-menu {
/*position: absolute;*/
top: 0;/*
left: 0;
right: 0;*/
flex-grow: 0;
}
.note-wrapper {
flex-grow: 1;
overflow: scroll;
}
/*Settings manager styles */ /*Settings manager styles */
.all-settings { .all-settings {
/*border-top: 1px solid #534c68;*/ /*border-top: 1px solid #534c68;*/
background: #221f2b; background: #221f2b;
/*position: absolute;*/ position: absolute;
/*bottom: 40px;*/ bottom: 0;
/*right: 0;*/ right: 0;
/*left: 0;*/ left: 0;
z-index: 99; z-index: 99;
/*border: 1px solid;*/ /*border: 1px solid;*/
/*background-color: var(--background_color);*/ /*background-color: var(--background_color);*/
/*border-color: var(--border_color);*/ /*border-color: var(--border_color);*/
/*box-sizing: border-box;*/ box-sizing: border-box;
/*border-radius: 7px;*/ /*border-radius: 7px;*/
/*box-shadow: 0px 3px 7px 0px rgba(140,140,140,1);*/ /*box-shadow: 0px 3px 7px 0px rgba(140,140,140,1);*/
/*padding: 1.2em 0 0;*/ /*padding: 1.2em 0 0;*/
flex-grow: 0;
} }
.low-settings { .low-settings {
bottom: 0px; bottom: 0px;
@ -1119,7 +1060,6 @@
/*End Settings manager styles */ /*End Settings manager styles */
/* container styles change based on mobile and number of open screens */ /* container styles change based on mobile and number of open screens */
.master-note-edit { .master-note-edit {
position: fixed; position: fixed;
@ -1130,9 +1070,9 @@
box-shadow: 0px 0px 5px 2px rgba(140,140,140,1); box-shadow: 0px 0px 5px 2px rgba(140,140,140,1);
z-index: 1001; z-index: 1001;
/*overflow-x: scroll;*/ /*overflow-x: scroll;*/
}
overflow-y: scroll; .padded-bottom {
overflow-x: hidden; padding-bottom: 20px;
} }
.loading-note { .loading-note {
position: absolute; position: absolute;
@ -1164,14 +1104,6 @@
left: 0%; left: 0%;
right: 50%; right: 50%;
} }
.master-note-edit.position-3 {
display: inline-block;
position: inherit;
width: 100%;
min-height: 200px;
height: auto;
box-shadow: none;
}
.size-down { .size-down {
animation: size-down 0.5s ease; animation: size-down 0.5s ease;

86
client/src/components/NoteTitleDisplayCard.vue
View File

@ -3,10 +3,17 @@
:style="{'background-color':color, 'color':fontColor, 'border-color':color }" :style="{'background-color':color, 'color':fontColor, 'border-color':color }"
:class="{'currently-open':currentlyOpen}" :class="{'currently-open':currentlyOpen}"
> >
<!-- fade-in-fwd -->
<div v-if="noteIcon" class="badge">
<i :class="`large ${noteIcon} icon`" :style="{ 'color':iconColor }"></i>
</div>
<div class="ui grid max-height">
<!-- Show title and snippet below it --> <!-- Show title and snippet below it -->
<div class="overflow-hidden note-card-text" @click="cardClicked"> <div class="top aligned row" @click.self="cardClicked">
<div class="sixteen wide column overflow-hidden note-card-text" @click="cardClicked">
<span class="subtext" v-if="note.shareUsername"> <span class="subtext" v-if="note.shareUsername">
Shared by {{ note.shareUsername }} Shared by {{ note.shareUsername }}
@ -26,43 +33,39 @@
</span> </span>
</span> </span>
<span v-if="note.title == '' && note.subtext == ''">
Empty Note
</span>
<span v-if="noteIcon" class="badge">
<i :class="`large ${noteIcon} icon`" :style="{ 'color':iconColor }"></i>
</span>
<!-- Title display --> <!-- Title display -->
<span v-if="note.title.length > 0" <div v-if="note.title.length > 0"
data-test-id="title" data-test-id="title"
class="big-text" :class="{ 'big-text':(note.titleLength <= 100), 'small-text-title':(note.titleLength >= 100) }"
v-html="note.title"></span> v-html="note.title"></div>
<!-- Sub text display --> <!-- Sub text display -->
<span v-if="note.subtext.length > 0 && !isShowingSearchResults()" <div v-if="note.subtext.length > 0 && !isShowingSearchResults()"
data-test-id="subtext" data-test-id="subtext"
class="small-text" :class="{ 'big-text':(note.subtextLength <= 100 && note.titleLength <= 100), 'small-text':(note.subtextLength >= 100) }"
v-html="note.subtext"></span> v-html="note.subtext"></div>
<!-- Display highlights from solr results --> <!-- Display highlights from solr results -->
<span v-if="note.note_highlights.length > 0" class="term-usage"> <div v-if="note.note_highlights.length > 0" class="term-usage">
<span <div
class="usage-row" class="usage-row"
v-for="highlight in note.note_highlights" v-for="highlight in note.note_highlights"
:class="{ 'big-text':(highlight <= 100), 'small-text-title':(highlight >= 100) }" :class="{ 'big-text':(highlight <= 100), 'small-text-title':(highlight >= 100) }"
v-html="cleanHighlight(highlight)"></span> v-html="cleanHighlight(highlight)"></div>
</span> </div>
</div>
</div> </div>
<!-- Toolbar on the bottom --> <!-- Toolbar on the bottom -->
<div class="tool-bar" @click.self="cardClicked"> <div class="bottom aligned row" @click.self="cardClicked">
<div class="sixteen wide column">
<div class="ui grid reduced-padding">
<div class="icon-bar" @click="cardClicked"> <div class="thirteen wide column clickable icon-bar" @click="cardClicked">
<!-- {{$helpers.timeAgo(note.updated)}} --> <!-- {{$helpers.timeAgo(note.updated)}} -->
<span v-if="note.tags"> <span v-if="note.tags">
<span v-for="tag in (note.tags.split(','))" class="little-tag">{{ tag }}</span> <span v-for="tag in (note.tags.split(','))" class="little-tag">{{ tag }}</span>
@ -73,17 +76,19 @@
<span v-if="note.archived == 1" data-position="top right" data-tooltip="Archived" data-inverted=""> <span v-if="note.archived == 1" data-position="top right" data-tooltip="Archived" data-inverted="">
<i class="green archive icon"></i> <i class="green archive icon"></i>
</span> </span>
</div>
<delete-button class="float-right" :class="{ 'hover-hide':(!$store.getters.getIsUserOnMobile) }" :note-id="note.id" /> <div class="three wide right aligned column">
<delete-button :class="{ 'hover-hide':(!$store.getters.getIsUserOnMobile) }" :note-id="note.id" />
</div> </div>
<div v-if="getThumbs.length > 0"> <div class="row" v-if="getThumbs.length > 0">
<div class="tiny-thumb-box" v-on:click="openEditAttachment"> <div class="tiny-thumb-box" v-on:click="openEditAttachment">
<img v-for="thumb in getThumbs" class="tiny-thumb" :src="`/api/static/thumb_${thumb}`"> <img v-for="thumb in getThumbs" class="tiny-thumb" :src="`/api/static/thumb_${thumb}`">
</div> </div>
</div> </div>
</div>
</div>
</div> </div>
</div> </div>
@ -100,7 +105,6 @@
}, },
methods:{ methods:{
cardClicked(){ cardClicked(){
// console.log(this.note)
this.beenClicked = true this.beenClicked = true
this.onClick(this.note.id) this.onClick(this.note.id)
}, },
@ -200,7 +204,7 @@
} }
.big-text, .big-text > p, .big-text > h1, .big-text > h2 { .big-text, .big-text > p, .big-text > h1, .big-text > h2 {
/*font-size: 1.3em !important;*/ /*font-size: 1.3em !important;*/
font-size: 17px !important; font-size: 16px !important;
font-weight: bold; font-weight: bold;
} }
.big-text > p, .big-text > h1, .big-text > h2 { .big-text > p, .big-text > h1, .big-text > h2 {
@ -236,7 +240,7 @@
/*box-shadow: 0 1px 2px 0 rgba(34,36,38,.15);*/ /*box-shadow: 0 1px 2px 0 rgba(34,36,38,.15);*/
box-shadow: 0 0px 5px 1px rgba(34,36,38,0); box-shadow: 0 0px 5px 1px rgba(34,36,38,0);
margin: 5px; margin: 5px;
/*padding: 0.7em 1em;*/ padding: 0.7em 1em;
border-radius: .28571429rem; border-radius: .28571429rem;
border: 1px solid; border: 1px solid;
border-color: var(--border_color); border-color: var(--border_color);
@ -248,18 +252,13 @@
line-height: 1.8rem; line-height: 1.8rem;
letter-spacing: 0.02rem; letter-spacing: 0.02rem;
display: flex;
flex-direction: column;
} }
.note-title-display-card:hover { .note-title-display-card:hover {
/*box-shadow: 0 3px 6px -0 rgba(34,36,38,.50);*/ /*box-shadow: 0 3px 6px -0 rgba(34,36,38,.50);*/
box-shadow: 0 0px 5px 1px rgba(34,36,38,0.3); box-shadow: 0 0px 5px 1px rgba(34,36,38,0.3);
} }
.icon-bar { .icon-bar {
display: inline-block; opacity: 0.8;
padding: 0 10px 0;
opacity: 1;
width: 100%;
/*margin-top: -2.2rem;*/ /*margin-top: -2.2rem;*/
} }
.hover-hide { .hover-hide {
@ -304,20 +303,6 @@
opacity: 1; opacity: 1;
} }
.note-card-text {
width: 100%;
display: inline-block;
align-self: flex-start;
flex-grow: 1;
padding: 10px 10px 0;
}
.tool-bar {
width: 100%;
display: inline-block;
align-self: flex-end;
flex-grow: 0;
}
.one-column .note-title-display-card { .one-column .note-title-display-card {
/*margin-right: 65%;*/ /*margin-right: 65%;*/
@ -352,8 +337,9 @@
} }
.badge { .badge {
display: inline-block; position: absolute;
float: right; top: 7px;
right: 6px;
} }
/* Tweak mobile display to show only one column */ /* Tweak mobile display to show only one column */

6
client/src/pages/NotesPage.vue
View File

@ -44,12 +44,6 @@
</div> </div>
<!-- <div class="one wide column"></div>
<div class="fourteen wide column">
<input-notes :noteid="3153" :position="3" ref="note3" />
</div>
<div class="one wide column"></div> -->
<h2 v-if="fastFilters['withLinks'] == 1">Notes with Links</h2> <h2 v-if="fastFilters['withLinks'] == 1">Notes with Links</h2>
<h2 v-if="fastFilters['withTags'] == 1">Notes with Tags</h2> <h2 v-if="fastFilters['withTags'] == 1">Notes with Tags</h2>
<h2 v-if="fastFilters['onlyArchived'] == 1">Archived Notes</h2> <h2 v-if="fastFilters['onlyArchived'] == 1">Archived Notes</h2>

6
client/src/stores/mainStore.js
View File

@ -51,8 +51,8 @@ export default new Vuex.Store({
let themeColors = { let themeColors = {
'background_color': '#fff', 'background_color': '#fff',
'text_color': '#3d3d3d', 'text_color': '#3d3d3d',
'outline_color': 'rgba(34,36,38,0.15)', 'outline_color': 'rgba(34,36,38,.15)',
'border_color': 'rgba(34,36,38,0.20)', 'border_color': 'rgba(34,36,38,.20)',
} }
//Night mode colors //Night mode colors
if(state.nightMode){ if(state.nightMode){
@ -60,7 +60,7 @@ export default new Vuex.Store({
'background_color': '#000', 'background_color': '#000',
'text_color': '#a98457', 'text_color': '#a98457',
'outline_color': '#a98457', 'outline_color': '#a98457',
'border_color': 'rgba(255, 255, 255, 0.31)', 'border_color': '#a98457',
} }
} }

30
server/helpers/ProcessText.js
View File

@ -14,18 +14,6 @@ ProcessText.removeHtml = (string) => {
.trim() .trim()
} }
//Remove Empty HTML lines from a string
ProcessText.stripBlankHtmlLines = (string) => {
if(string == undefined || string == null || string.length == 0){
return ''
}
//Blank lines look like this -> <p><br></p>
return string.replace(/\<p\>\<br\>\<\/p\>/g,'')
}
ProcessText.getUrlsFromString = (string) => { ProcessText.getUrlsFromString = (string) => {
const urlPattern = /(?:(?:https?|ftp|file):\/\/|www\.|ftp\.)(?:\([-A-Z0-9+&@#/%=~_|$?!:,.]*\)|[-A-Z0-9+&@#/%=~_|$?!:,.])*(?:\([-A-Z0-9+&@#/%=~_|$?!:,.]*\)|[A-Z0-9+&@#/%=~_|$])/igm const urlPattern = /(?:(?:https?|ftp|file):\/\/|www\.|ftp\.)(?:\([-A-Z0-9+&@#/%=~_|$?!:,.]*\)|[-A-Z0-9+&@#/%=~_|$?!:,.])*(?:\([-A-Z0-9+&@#/%=~_|$?!:,.]*\)|[A-Z0-9+&@#/%=~_|$])/igm
return string.match(urlPattern) return string.match(urlPattern)
@ -52,19 +40,7 @@ ProcessText.deduceNoteTitle = (inString) => {
//Remove inline styles that may be added by editor //Remove inline styles that may be added by editor
inString = inString.replace(/style=".*?"/g,'') inString = inString.replace(/style=".*?"/g,'')
// inString = inString.replace('</a>','')
const tagFreeLength = ProcessText.removeHtml(inString).length
if(tagFreeLength < 100){
title = ProcessText.stripBlankHtmlLines(inString)
return {title, sub}
}
//Primare Case - Short notes
if(tagFreeLength < 300){
sub = ProcessText.stripBlankHtmlLines(inString)
return {title, sub}
}
//Emergency ending tag if truncated. This will help regex find all the lines //Emergency ending tag if truncated. This will help regex find all the lines
inString += '</end>' inString += '</end>'
@ -84,7 +60,7 @@ ProcessText.deduceNoteTitle = (inString) => {
const endTags = ['</o','</l','</u'] const endTags = ['</o','</l','</u']
let totalLines = Math.min(lines.length, 6) let totalLines = Math.min(lines.length, 6)
let charLimit = 400 let charLimit = 250
let listStart = false let listStart = false
let noTitleJustList = false let noTitleJustList = false
@ -168,7 +144,7 @@ ProcessText.deduceNoteTitle = (inString) => {
cleanCutString = cutString cleanCutString = cutString
} }
finalLines.push(cleanCutString + '... <i class="green caret down icon"></i>') finalLines.push(cleanCutString + '...')
break; break;
} }

1
server/models/Note.js
View File

@ -331,7 +331,6 @@ Note.get = (userId, noteId) => {
SELECT SELECT
note_raw_text.text, note_raw_text.text,
note_raw_text.updated as updated, note_raw_text.updated as updated,
note.created,
note.pinned, note.pinned,
note.archived, note.archived,
note.color, note.color,