* Added Much better session Management, key updating and deleting
* Force reload of JS if app numbers dont match * Added cool tag display on side of note * Cleaned up a bunch of code and tweaked little things to be better
This commit is contained in:
@@ -248,7 +248,7 @@
|
||||
|
||||
|
||||
|
||||
<div v-on:click="reloadPage" class="version-display">
|
||||
<div v-on:click="reloadPage" class="version-display" v-if="version != 0" >
|
||||
<i :class="`${getVersionIcon()} icon`"></i> {{ version }}
|
||||
</div>
|
||||
|
||||
@@ -267,7 +267,7 @@
|
||||
},
|
||||
data: function(){
|
||||
return {
|
||||
version: '2.3.4',
|
||||
version: '0',
|
||||
username: '',
|
||||
collapsed: false,
|
||||
mobile: false,
|
||||
@@ -277,6 +277,7 @@
|
||||
}
|
||||
},
|
||||
beforeCreate: function(){
|
||||
|
||||
},
|
||||
mounted: function(){
|
||||
this.mobile = this.$store.getters.getIsUserOnMobile
|
||||
@@ -288,6 +289,7 @@
|
||||
|
||||
if(this.loggedIn){
|
||||
this.$store.dispatch('fetchAndUpdateUserTotals')
|
||||
this.version = localStorage.getItem('currentVersion')
|
||||
}
|
||||
|
||||
},
|
||||
@@ -347,11 +349,12 @@
|
||||
.catch(error => { this.$bus.$emit('notification', 'Failed to create note') })
|
||||
},
|
||||
destroyLoginToken() {
|
||||
axios.post('/api/user/logout').then( response => {
|
||||
axios.post('/api/user/logout')
|
||||
setTimeout(() => {
|
||||
this.$bus.$emit('notification', 'Logged Out')
|
||||
this.$store.commit('destroyLoginToken')
|
||||
this.$router.push('/')
|
||||
})
|
||||
}, 200)
|
||||
},
|
||||
toggleNightMode(){
|
||||
this.$store.commit('toggleNightMode')
|
||||
|
@@ -98,13 +98,15 @@
|
||||
//Login user if we have a valid token
|
||||
if(data && data.token && data.token.length > 0){
|
||||
|
||||
const token = data.token
|
||||
const username = this.username
|
||||
//Set username to local session
|
||||
this.$store.commit('setUsername', this.username)
|
||||
|
||||
this.$store.commit('setLoginToken', {token, username})
|
||||
const token = data.token
|
||||
|
||||
//Setup socket io after user logs in
|
||||
axios.defaults.headers.common['authorizationtoken'] = token
|
||||
this.$io.emit('user_connect', token)
|
||||
localStorage.setItem('loginToken', token)
|
||||
|
||||
//Redirect user to notes section after login
|
||||
this.$router.push('/notes')
|
||||
@@ -113,7 +115,7 @@
|
||||
register(){
|
||||
|
||||
if( this.username.length == 0 || this.password.length == 0 ){
|
||||
this.$bus.$emit('notification', 'Username and Password Required')
|
||||
this.$bus.$emit('notification', 'Unable to Sign Up - Username and Password Required')
|
||||
return
|
||||
}
|
||||
|
||||
@@ -121,19 +123,19 @@
|
||||
.then(({data}) => {
|
||||
|
||||
if(data == false){
|
||||
this.$bus.$emit('notification', 'Username already in use')
|
||||
this.$bus.$emit('notification', 'Unable to Sign Up - Username already in use')
|
||||
}
|
||||
|
||||
this.finalizeLogin(data)
|
||||
})
|
||||
.catch(error => {
|
||||
this.$bus.$emit('notification', 'Username already in use')
|
||||
this.$bus.$emit('notification', 'Unable to Sign Up - Username already in use')
|
||||
})
|
||||
},
|
||||
login(){
|
||||
|
||||
if( this.username.length == 0 || this.password.length == 0 ){
|
||||
this.$bus.$emit('notification', 'Username and Password Required')
|
||||
this.$bus.$emit('notification', 'Unable to Login - Username and Password Required')
|
||||
return
|
||||
}
|
||||
|
||||
@@ -141,13 +143,13 @@
|
||||
.then(({data}) => {
|
||||
|
||||
if(data == false){
|
||||
this.$bus.$emit('notification', 'Incorrect Username or Password')
|
||||
this.$bus.$emit('notification', 'Unable to Login - Incorrect Username or Password')
|
||||
}
|
||||
|
||||
this.finalizeLogin(data)
|
||||
})
|
||||
.catch(error => {
|
||||
this.$bus.$emit('notification', 'Incorrect Username or Password')
|
||||
this.$bus.$emit('notification', 'Unable to Login - Incorrect Username or Password')
|
||||
})
|
||||
}
|
||||
}
|
||||
|
@@ -170,13 +170,18 @@
|
||||
</div>
|
||||
|
||||
<!-- little tags on the side -->
|
||||
<div class="note-mini-tag-area" v-if="allTags.length > 0" :class="{ 'slide-out-right':(sizeDown == true) }">
|
||||
<div class="note-mini-tag-area" :class="{ 'size-down':sizeDown }">
|
||||
<span v-for="tag in allTags" class="subtle-tag active-mini-tag" v-if="isTagOnNote(tag.id)" v-on:click="removeTag(tag.id)">
|
||||
<i class="tag icon"></i>
|
||||
{{ tag.text }}
|
||||
</span>
|
||||
<span v-else class="subtle-tag" v-on:click="addTag(tag.text)">
|
||||
<i class="plus icon"></i>
|
||||
{{ tag.text }}
|
||||
</span>
|
||||
<span class="subtle-tag" v-on:click="$router.push(`/notes/open/${noteid}/menu/tags`)">
|
||||
<i class="plus icon"></i><i class="green tags icon"></i>Add Tag
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- color picker -->
|
||||
@@ -195,7 +200,7 @@
|
||||
/>
|
||||
</side-slide-menu>
|
||||
|
||||
<side-slide-menu v-if="tags" v-on:close="tags = false" name="tags" :style-object="styleObject">
|
||||
<side-slide-menu v-if="tags" v-on:close="tags = false; fetchNoteTags()" name="tags" :style-object="styleObject">
|
||||
<div class="ui basic segment">
|
||||
<note-tag-edit :noteId="noteid" :key="'tags-for-note-'+noteid"/>
|
||||
</div>
|
||||
@@ -254,10 +259,10 @@
|
||||
|
||||
<!-- Show side shades if user is on desktop only -->
|
||||
<div class="full-focus-shade shade1"
|
||||
:class="{ 'slide-out-left':(sizeDown == true) }"
|
||||
:class="{ 'slide-out-left':sizeDown }"
|
||||
v-on:click="close()"></div>
|
||||
<div class="full-focus-shade shade2"
|
||||
:class="{ 'slide-out-right':(sizeDown == true) }"
|
||||
:class="{ 'slide-out-right':sizeDown }"
|
||||
v-on:click="close()"></div>
|
||||
|
||||
</div>
|
||||
@@ -335,10 +340,6 @@
|
||||
diffTextTimeout: null,
|
||||
diffsApplied: null,
|
||||
|
||||
//Fake Caret position and visibility
|
||||
caretShow: false,
|
||||
caretLeft: null,
|
||||
caretTop: null,
|
||||
//Used to restore caret position
|
||||
lastRange: null,
|
||||
startOffset: 0,
|
||||
@@ -541,9 +542,6 @@
|
||||
if(!this.$store.getters.getIsUserOnMobile){
|
||||
this.editor.focus()
|
||||
this.editor.moveCursorToEnd()
|
||||
this.caretShow = true
|
||||
this.moveArtificialCaret()
|
||||
|
||||
|
||||
this.fetchNoteTags() //Don't load tags on mobile
|
||||
}
|
||||
@@ -615,14 +613,7 @@
|
||||
})
|
||||
|
||||
this.editor.addEventListener('keydown', event => {
|
||||
setTimeout(() => {
|
||||
if(event.keyCode == 32){
|
||||
this.caretLeft += 3
|
||||
}
|
||||
if(event.keyCode == 8){
|
||||
// this.caretLeft -= 3
|
||||
}
|
||||
}, 10)
|
||||
|
||||
})
|
||||
|
||||
//Bind event handlers
|
||||
@@ -633,29 +624,10 @@
|
||||
|
||||
//Show and hide additional toolbars
|
||||
this.editor.addEventListener('focus', e => {
|
||||
// this.caretShow = true
|
||||
})
|
||||
this.editor.addEventListener('blur', e => {
|
||||
// this.caretShow = false
|
||||
})
|
||||
},
|
||||
moveArtificialCaret(rect = null){
|
||||
|
||||
//Lets not use the artificial caret for now
|
||||
return
|
||||
|
||||
//If rect isn't present, grab by selection
|
||||
if(!rect || rect.left == 0){ //Left should always be greater than 0, because of a margin
|
||||
rect = this.editor.getCursorPosition()
|
||||
//Another way to get range
|
||||
// window.getSelection().getRangeAt(0)
|
||||
}
|
||||
|
||||
const textArea = document.getElementById('text-box-container').getBoundingClientRect()
|
||||
|
||||
this.caretLeft = (rect.left - textArea.left - 1)
|
||||
this.caretTop = (rect.top - textArea.top - 1 )
|
||||
},
|
||||
openEditAttachment(){
|
||||
|
||||
this.$router.push('/attachments/note/'+this.currentNoteId)
|
||||
@@ -845,7 +817,7 @@
|
||||
// clearTimeout(this.editDebounce)
|
||||
|
||||
if(this.statusText == 'saving'){
|
||||
return reject(false)
|
||||
return resolve(true)
|
||||
}
|
||||
|
||||
//Don't save note if its hash doesn't change
|
||||
@@ -1081,38 +1053,45 @@
|
||||
|
||||
.note-mini-tag-area {
|
||||
position: fixed;
|
||||
width: 100px;
|
||||
left: calc(15% - 100px);
|
||||
width: 120px;
|
||||
left: calc(15% - 125px);
|
||||
top: 46px;
|
||||
bottom: 0;
|
||||
height: 500px;
|
||||
height: calc(100vh - 55px);
|
||||
z-index: 1000;
|
||||
overflow-y: scroll;
|
||||
scrollbar-width: none;
|
||||
scrollbar-color: transparent transparent;
|
||||
}
|
||||
.note-mini-tag-area {
|
||||
scrollbar-width: auto;
|
||||
scrollbar-color: inherit inherit;
|
||||
}
|
||||
.subtle-tag {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
padding: 2px 1px 2px 4px;
|
||||
margin: 0 0 2px;
|
||||
padding: 1px 1px 1px 5px;
|
||||
margin: 0 0 0;
|
||||
border: 1px solid transparent;
|
||||
border-right: none;
|
||||
border-top-left-radius: 4px;
|
||||
border-bottom-left-radius: 4px;
|
||||
color: var(--text_color);
|
||||
border-radius: 3px;
|
||||
background-color: transparent;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
transition: color ease 0.3s, background ease 0.3s;
|
||||
font-size: 12px;
|
||||
font-size: 11px;
|
||||
cursor: pointer;
|
||||
opacity: 0;
|
||||
text-transform:capitalize;
|
||||
}
|
||||
.note-mini-tag-area:hover .subtle-tag {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
.note-mini-tag-area:hover .active-mini-tag {
|
||||
background-color: var(--main-accent);
|
||||
color: white;
|
||||
}
|
||||
.note-mini-tag-area:hover .subtle-tag:not(.active-mini-tag) {
|
||||
border-right: none;
|
||||
color: var(--text_color);
|
||||
@@ -1120,9 +1099,9 @@
|
||||
opacity: 1;
|
||||
}
|
||||
.active-mini-tag {
|
||||
opacity: 0.6;
|
||||
background-color: #16ab39;
|
||||
color: white;
|
||||
opacity: 0.7;
|
||||
background-color: var(--small_element_bg_color);
|
||||
color: var(--text_color)
|
||||
}
|
||||
|
||||
|
||||
|
@@ -32,7 +32,7 @@
|
||||
class="big-text"><p>{{ note.title }}</p></span>
|
||||
|
||||
<!-- Sub text display -->
|
||||
<span v-if="note.subtext.length > 0 && !isShowingSearchResults()"
|
||||
<span v-if="note.subtext.length > 0"
|
||||
class="small-text"
|
||||
v-html="note.subtext"></span>
|
||||
|
||||
@@ -49,15 +49,6 @@
|
||||
</span>
|
||||
</span>
|
||||
|
||||
<!-- Display highlights from solr results -->
|
||||
<span v-if="note.note_highlights.length > 0" class="term-usage">
|
||||
<span
|
||||
class="usage-row"
|
||||
v-for="highlight in note.note_highlights"
|
||||
:class="{ 'big-text':(highlight <= 100), 'small-text-title':(highlight >= 100) }"
|
||||
v-html="cleanHighlight(highlight)"></span>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
|
||||
<div v-if="titleView" class="single-line-text" @click="cardClicked">
|
||||
@@ -179,12 +170,6 @@
|
||||
|
||||
return updated
|
||||
},
|
||||
isShowingSearchResults(){
|
||||
if(this.note.note_highlights.length > 0 || this.note.attachment_highlights.length > 0 || this.note.tag_highlights.length > 0){
|
||||
return true
|
||||
}
|
||||
return false
|
||||
},
|
||||
splitTags(text){
|
||||
return text.split(',')
|
||||
},
|
||||
|
@@ -8,8 +8,12 @@
|
||||
<div class="ui grid" v-if="shareUsername == null">
|
||||
|
||||
<div v-if="!isNoteShared" class="sixteen wide column">
|
||||
<div class="ui button" v-on:click="makeShared()">Enable Shared</div>
|
||||
<p>Shared notes are different and junk.</p>
|
||||
<div class="ui button" v-on:click="makeShared()">Enable Sharing</div>
|
||||
<ul>
|
||||
<li>Shared notes can be read and edited by you and all shared users.</li>
|
||||
<li>Shared notes can only be shared by the creator of the note.</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
||||
<div v-if="isNoteShared" class="sixteen wide column">
|
||||
@@ -17,14 +21,10 @@
|
||||
<div class="ui button" v-on:click="removeShared()">Remove Shared</div>
|
||||
|
||||
<div class="ui button" v-on:click="getSharedUrl()">Get Shareable URL</div>
|
||||
|
||||
<div v-if="sharedUrl.length > 0">
|
||||
<a target="_blank" :href="sharedUrl">{{ sharedUrl }}</a>
|
||||
<div class="ui input">
|
||||
<input type="text" v-model="sharedUrl">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="sixteen wide column" v-if="isNoteShared && sharedUrl.length > 0">
|
||||
<p>Public Link - this link can be disabled by turning off sharing</p>
|
||||
<a target="_blank" :href="sharedUrl">{{ sharedUrl }}</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
Reference in New Issue
Block a user