|
|
|
|
@ -1,9 +1,9 @@
|
|
|
|
|
<template>
|
|
|
|
|
<!-- change class to .master-note-edit to have it popup on the screen -->
|
|
|
|
|
<!-- change class to .master-note-edit to have it popup on the screen.
|
|
|
|
|
@keyup.esc="closeButtonAction()" -->
|
|
|
|
|
<div
|
|
|
|
|
id="InputNotes"
|
|
|
|
|
class="master-note-edit"
|
|
|
|
|
@keyup.esc="closeButtonAction()"
|
|
|
|
|
class="master-note-edit"
|
|
|
|
|
>
|
|
|
|
|
|
|
|
|
|
<!-- Giant Edit Note Menu -->
|
|
|
|
|
@ -89,9 +89,9 @@
|
|
|
|
|
|
|
|
|
|
<div class="edit-divide"></div>
|
|
|
|
|
|
|
|
|
|
<div class="edit-button" v-on:click="$router.push(`/notes/open/${noteid}/menu/colors`)" data-tooltip="Note Color" data-position="bottom center" :style="{ 'background-color':styleObject['noteBackground'], 'color':styleObject['noteText']}">
|
|
|
|
|
<!-- <div class="edit-button" v-on:click="$router.push(`/notes/open/${noteid}/menu/colors`)" data-tooltip="Note Color" data-position="bottom center" :style="{ 'background-color':styleObject['noteBackground'], 'color':styleObject['noteText']}">
|
|
|
|
|
<i class="paint brush icon"></i>
|
|
|
|
|
</div>
|
|
|
|
|
</div> -->
|
|
|
|
|
<!-- <div class="edit-button" v-on:click="$router.push(`/notes/open/${noteid}/menu/tags`)" data-tooltip="Tags" data-position="bottom center">
|
|
|
|
|
<i class="tags icon"></i>
|
|
|
|
|
</div> -->
|
|
|
|
|
@ -107,7 +107,9 @@
|
|
|
|
|
<div class="edit-divide"></div>
|
|
|
|
|
|
|
|
|
|
<div class="edit-button" v-on:click="$router.push(`/notes/open/${noteid}/menu/options`)" data-tooltip="More Options" data-position="bottom center">
|
|
|
|
|
|
|
|
|
|
<i class="ellipsis horizontal icon"></i>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="edit-divide"></div>
|
|
|
|
|
@ -128,6 +130,7 @@
|
|
|
|
|
|
|
|
|
|
<div class="edit-button ui" v-on:click="closeButtonAction()" :data-tooltip="`Close\n(ESC)`" data-position="bottom center">
|
|
|
|
|
<i class="green close icon"></i>
|
|
|
|
|
<span class="ui green text">Done</span>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
@ -139,7 +142,7 @@
|
|
|
|
|
:class="{ 'side-menu-open':sideMenuOpen, 'size-down':(sizeDown == true),}">
|
|
|
|
|
|
|
|
|
|
<!-- Squire box grows -->
|
|
|
|
|
<div id="text-box-container" class="note-wrapper">
|
|
|
|
|
<div id="text-box-container" class="note-wrapper" :style="{ 'background-color':styleObject['noteBackground']}">
|
|
|
|
|
|
|
|
|
|
<!-- Loading indicator -->
|
|
|
|
|
<transition name="fade">
|
|
|
|
|
@ -161,19 +164,22 @@
|
|
|
|
|
v-on:blur="save" type="text" v-model="noteTitle" placeholder="Title" class="stealth-input glint">
|
|
|
|
|
</textarea>
|
|
|
|
|
|
|
|
|
|
<div class="large-close-button glint" v-on:click="closeButtonAction()">
|
|
|
|
|
<!-- close button giant -->
|
|
|
|
|
<div v-if="!$store.getters.getIsUserOnMobile" class="large-close-button" v-on:click="closeButtonAction()">
|
|
|
|
|
<i class="fitted green close icon"></i>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- little tags on the side, only show on desktop -->
|
|
|
|
|
<div class="note-mini-tag-area" :class="{ 'size-down':sizeDown }" v-on:click="$router.push(`/notes/open/${noteid}/menu/tags`)">
|
|
|
|
|
<span class="add-mini-tag" v-if="noteTags.length == 0">
|
|
|
|
|
<!-- tags on the side, only show on desktop -->
|
|
|
|
|
<div class="note-mini-tag-area" :class="{ 'size-down':sizeDown }"
|
|
|
|
|
v-on:click="$router.push(`/notes/open/${noteid}/menu/tags`)"
|
|
|
|
|
:style="{ 'background-color':styleObject['noteBackground'] }">
|
|
|
|
|
<span class="add-mini-tag" v-if="allTags.length == 0">
|
|
|
|
|
<i class="tags icon"></i>Add Tags
|
|
|
|
|
</span>
|
|
|
|
|
<span v-for="tag in allTags" class="active-mini-tag" v-if="isTagOnNote(tag.id)">
|
|
|
|
|
#{{ tag.text }}
|
|
|
|
|
<span v-for="tag in allTags" class="active-mini-tag">
|
|
|
|
|
#{{ tag }}
|
|
|
|
|
</span>
|
|
|
|
|
<span class="active-mini-tag" v-if="noteTags.length > 0">
|
|
|
|
|
<span class="active-mini-tag" v-if="allTags.length > 0">
|
|
|
|
|
+
|
|
|
|
|
</span>
|
|
|
|
|
|
|
|
|
|
@ -201,21 +207,23 @@
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
|
|
<!-- Side slide menus for colors, tags, images and other options -->
|
|
|
|
|
<side-slide-menu v-if="colors" v-on:close="colors = false" name="colors">
|
|
|
|
|
<!-- <side-slide-menu v-if="colors" v-on:close="colors = false" name="colors">
|
|
|
|
|
<color-picker
|
|
|
|
|
@changeColor="onChangeColor"
|
|
|
|
|
@close="colors = false; $router.go(-1)"
|
|
|
|
|
:style-object="styleObject"
|
|
|
|
|
/>
|
|
|
|
|
</side-slide-menu>
|
|
|
|
|
</side-slide-menu> -->
|
|
|
|
|
|
|
|
|
|
<side-slide-menu v-if="tags" v-on:close="tags = false; fetchNoteTags()" name="tags" :style-object="styleObject">
|
|
|
|
|
<!-- tag edit menu -->
|
|
|
|
|
<side-slide-menu v-if="tags" v-on:close="tags = false; fetchNoteTags()" name="tags">
|
|
|
|
|
<div class="ui basic segment">
|
|
|
|
|
<note-tag-edit :noteId="noteid" :key="'tags-for-note-'+noteid"/>
|
|
|
|
|
</div>
|
|
|
|
|
</side-slide-menu>
|
|
|
|
|
|
|
|
|
|
<side-slide-menu v-if="images" v-on:close="images = false" name="images" :style-object="styleObject">
|
|
|
|
|
<!-- images menu -->
|
|
|
|
|
<side-slide-menu v-if="images" v-on:close="images = false" name="images">
|
|
|
|
|
<div class="ui basic segment">
|
|
|
|
|
<simple-attachment-note
|
|
|
|
|
:note-id="noteid"
|
|
|
|
|
@ -224,67 +232,81 @@
|
|
|
|
|
</div>
|
|
|
|
|
</side-slide-menu>
|
|
|
|
|
|
|
|
|
|
<side-slide-menu v-if="options" v-on:close="options = false" name="note-options" :style-object="styleObject">
|
|
|
|
|
<side-slide-menu v-if="options" v-on:close="options = false" name="note-options">
|
|
|
|
|
<div class="ui basic padded segment">
|
|
|
|
|
<div class="ui grid">
|
|
|
|
|
<div class="sixteen wide column">
|
|
|
|
|
<h3>Note Options</h3>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="eight wide column">
|
|
|
|
|
<div class="ui dividing header">
|
|
|
|
|
Note Options
|
|
|
|
|
</div>
|
|
|
|
|
<div class="ui labeled icon fluid basic button" v-on:click="onToggleArchived()">
|
|
|
|
|
<i class="archive icon" :class="{'green':(archived == 1)}"></i>
|
|
|
|
|
<span v-if="archived == 1">Un-Archive Note</span>
|
|
|
|
|
<span v-if="archived != 1">Archive Note</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="eight wide column">
|
|
|
|
|
<div class="ui labeled icon fluid basic button" v-on:click="onTogglePinned">
|
|
|
|
|
<i class="pin icon" :class="{'green':(pinned == 1)}"></i>
|
|
|
|
|
<span v-if="pinned == 1">Un-Pin Note</span>
|
|
|
|
|
<span v-if="pinned != 1">Pin Note</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="sixteen wide column">
|
|
|
|
|
<h3>List Options</h3>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="sixteen wide column">
|
|
|
|
|
|
|
|
|
|
<div class="eight wide column">
|
|
|
|
|
<div class="ui dividing header">
|
|
|
|
|
List Options
|
|
|
|
|
</div>
|
|
|
|
|
<div class="ui labeled icon fluid basic button" v-on:click="sortList">
|
|
|
|
|
<i class="sort amount up icon"></i>
|
|
|
|
|
Sort List
|
|
|
|
|
Sort List (Complete to bottom)
|
|
|
|
|
</div>
|
|
|
|
|
<div class="ui labeled icon fluid basic button" v-on:click="uncheckAllListItems">
|
|
|
|
|
<i class="list ul icon"></i>
|
|
|
|
|
Uncheck All
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="eight wide column">
|
|
|
|
|
<div class="ui labeled icon fluid basic button" v-on:click="deleteCompletedListItems">
|
|
|
|
|
<i class="trash icon"></i>
|
|
|
|
|
Delete Checked
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="eight wide column">
|
|
|
|
|
<div class="ui labeled icon fluid basic button" v-on:click="uncheckAllListItems">
|
|
|
|
|
<i class="list ul icon"></i>
|
|
|
|
|
Uncheck All
|
|
|
|
|
<div class="ui dividing header">
|
|
|
|
|
Calculate Line
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="sixteen wide column">
|
|
|
|
|
<h3>Misc Options</h3>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="eight wide column">
|
|
|
|
|
<div class="ui labeled icon fluid basic button" v-on:click="calculateMath" data-tooltip="Calculates algebra before '='">
|
|
|
|
|
<p>
|
|
|
|
|
Calculates algebra before '='
|
|
|
|
|
</p>
|
|
|
|
|
<div class="ui labeled icon fluid basic button" v-on:click="calculateMath">
|
|
|
|
|
<i class="calculator icon"></i>
|
|
|
|
|
Simple Math
|
|
|
|
|
Calculate Simple Math
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="eight wide column">
|
|
|
|
|
<!-- data-tooltip="Files on note" -->
|
|
|
|
|
<div class="ui dividing header">
|
|
|
|
|
Note Attachments & Links
|
|
|
|
|
</div>
|
|
|
|
|
<p>
|
|
|
|
|
Attachment & Link Count {{ attachmentCount }}
|
|
|
|
|
</p>
|
|
|
|
|
<div v-on:click="openEditAttachment" class="ui labeled icon fluid basic button">
|
|
|
|
|
<i class="folder icon"></i>
|
|
|
|
|
Note Files
|
|
|
|
|
{{ attachmentCount }}
|
|
|
|
|
View all Attachments & Links
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<color-picker
|
|
|
|
|
@changeColor="onChangeColor"
|
|
|
|
|
@close="colors = false; $router.go(-1)"
|
|
|
|
|
:style-object="styleObject"
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
|
|
<div class="sixteen wide column" v-if="rawTextId > 0">
|
|
|
|
|
<h3>Share Note</h3>
|
|
|
|
|
<div class="ui dividing header">
|
|
|
|
|
Share Note
|
|
|
|
|
</div>
|
|
|
|
|
<share-note-component
|
|
|
|
|
:note-id="noteid"
|
|
|
|
|
:raw-text-id="rawTextId"
|
|
|
|
|
@ -296,7 +318,7 @@
|
|
|
|
|
</side-slide-menu>
|
|
|
|
|
|
|
|
|
|
<!-- create table option -->
|
|
|
|
|
<side-slide-menu v-if="table" v-on:close="table = false; fetchNoteTags()" name="table" :style-object="styleObject">
|
|
|
|
|
<side-slide-menu v-if="table" v-on:close="table = false;" name="table" :style-object="styleObject">
|
|
|
|
|
<div class="ui basic segment">
|
|
|
|
|
<h2>Insert Table</h2>
|
|
|
|
|
<div class="table-tic-table">
|
|
|
|
|
@ -521,77 +543,15 @@
|
|
|
|
|
|
|
|
|
|
}, totalTime + 40)
|
|
|
|
|
},
|
|
|
|
|
removeTag(tagId){
|
|
|
|
|
|
|
|
|
|
this.allTags = []
|
|
|
|
|
let entryId = 0
|
|
|
|
|
|
|
|
|
|
//Find fucking note tag for removal
|
|
|
|
|
this.noteTags.forEach(noteTag => {
|
|
|
|
|
if(noteTag['tagId'] == tagId){
|
|
|
|
|
entryId = noteTag['entryId']
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
let postData = {
|
|
|
|
|
'tagId':entryId,
|
|
|
|
|
'noteId':this.noteid
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
axios.post('/api/tag/removefromnote', postData)
|
|
|
|
|
.then(response => {
|
|
|
|
|
this.fetchNoteTags()
|
|
|
|
|
})
|
|
|
|
|
.catch(error => { this.$bus.$emit('notification', 'Failed to Remove Tag') })
|
|
|
|
|
},
|
|
|
|
|
addTag(tagText){
|
|
|
|
|
|
|
|
|
|
this.allTags = []
|
|
|
|
|
|
|
|
|
|
let postData = {
|
|
|
|
|
'tagText':tagText,
|
|
|
|
|
'noteId':this.noteid
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
axios.post('/api/tag/addtonote', postData)
|
|
|
|
|
.then(response => {
|
|
|
|
|
this.fetchNoteTags()
|
|
|
|
|
})
|
|
|
|
|
.catch(error => { this.$bus.$emit('notification', 'Failed to Add Tag') })
|
|
|
|
|
},
|
|
|
|
|
fetchNoteTags(){
|
|
|
|
|
axios.post('/api/tag/get', {'noteId': this.noteid})
|
|
|
|
|
axios.post('/api/tag/fornote', {'noteId': this.noteid})
|
|
|
|
|
.then(({data}) => {
|
|
|
|
|
this.allTags = data.allTags
|
|
|
|
|
this.noteTags = data.noteTagIds
|
|
|
|
|
|
|
|
|
|
//Stick used tags at top.
|
|
|
|
|
if(this.noteTags.length > 0){
|
|
|
|
|
|
|
|
|
|
let frontTags = []
|
|
|
|
|
|
|
|
|
|
for (var i = this.allTags.length - 1; i >= 0; i--) {
|
|
|
|
|
this.noteTags.forEach(noteTag => {
|
|
|
|
|
if(this.allTags[i]['id'] == noteTag['tagId']){
|
|
|
|
|
frontTags.push(this.allTags[i])
|
|
|
|
|
this.allTags.splice(i,1)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
this.allTags.unshift(...frontTags)
|
|
|
|
|
}
|
|
|
|
|
//Setup note tags from string
|
|
|
|
|
this.allTags = data.tags ? data.tags.split(',') : []
|
|
|
|
|
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
isTagOnNote(id){
|
|
|
|
|
for (let i = 0; i < this.noteTags.length; i++) {
|
|
|
|
|
const current = this.noteTags[i]
|
|
|
|
|
if(current && current['tagId'] == id){
|
|
|
|
|
return true
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
return false
|
|
|
|
|
},
|
|
|
|
|
initSquire(){
|
|
|
|
|
|
|
|
|
|
//Set up squire and load note text
|
|
|
|
|
@ -604,10 +564,6 @@
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
//Load tags on mobile
|
|
|
|
|
this.fetchNoteTags()
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//Set up websockets after squire is set up
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.setupWebSockets()
|
|
|
|
|
@ -783,6 +739,9 @@
|
|
|
|
|
this.lastNoteHash = this.hashString( response.data.text )
|
|
|
|
|
// this.diffNoteText = response.data.text
|
|
|
|
|
|
|
|
|
|
//Setup note tags
|
|
|
|
|
this.allTags = response.data.tags ? response.data.tags.split(','):[]
|
|
|
|
|
|
|
|
|
|
//Set up note colors
|
|
|
|
|
if(response.data.color){
|
|
|
|
|
this.styleObject = JSON.parse(response.data.color)
|
|
|
|
|
|
Max G
1 year ago