client/src/assets/semantic-helper.css

@@ -37,17 +37,11 @@ div.ui.basic.segment.no-fluf-segment {
 
 /* Night mode modifiers */
 
-	/*Make images sepia in night mode */
+/*Make images sepia in night mode */
-	.night-mode img {
+.night-mode img {
-		filter: grayscale(50%) brightness(80%) sepia(80%);
+	filter: grayscale(50%) brightness(80%) sepia(80%);
-	}
+
-	.night-mode i.green {
+}
-		color: #877A61 !important;
-	}
-	.night-mode .green.label {
-		background-color: #877A61 !important;
-		border-color: #877A61 !important;
-	}
 
 /* OVERWRITE DEFAULT SEMANTIC STYLES FOR CUSTOM/NIGHT MODES*/
 body {

client/src/components/GlobalNotificationComponent.vue

@@ -3,16 +3,18 @@
 	.popup-body {
 		position: fixed;
 		bottom: 15px;
-		left: 15px;
+		right: 15px;
 		min-height: 50px;
 		min-width: 200px;
 		max-width: calc(100% - 20px);
 		z-index: 1002;
-
 		border-top: 2px solid #21ba45;
 		box-shadow: 0px 0px 5px 2px rgba(140,140,140,1);
 		border-top-right-radius: 4px;
 		border-top-left-radius: 4px;
+
+		color: white;
+		background-color: #21ba45;
 	}
 	.popup-row {
 		padding: 1em 5px;
@@ -31,45 +33,11 @@
 		border-top: 1px solid #FFF;
 	}
 
-	.slide-in-bottom {
-		animation: slide-in-bottom 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
-	}
-	@keyframes slide-in-bottom {
-		0% {
-			transform: translateY(1000px);
-			opacity: 0;
-		}
-		100% {
-			transform: translateY(0);
-			opacity: 1;
-		}
-	}
-
-	.color-fade {
-		animation: color-fade-animation 0.7s ease-out both;
-	}
-	@keyframes color-fade-animation {
-		0% {
-			color: black;
-			background-color: black;
-		}
-		50% {
-			color: black;
-			background-color: black;
-		}
-		100% {
-			color: white;
-			background-color: #21ba45;
-		}
-	}
-
-
-
 </style>
 
 <template>
-	<div class="popup-body slide-in-bottom" v-on:click="dismiss" v-if="notifications.length > 0">
+	<div class="popup-body" v-on:click="dismiss" v-if="notifications.length > 0">
-		<div class="popup-row color-fade" v-for="item in notifications">
+		<div class="popup-row" v-for="item in notifications">
 			<i class="disabled angle left icon"></i>
 			<span>{{ item }}</span>
 			<i class="disabled angle right icon"></i>

client/src/components/NoteInputPanel.vue

@@ -424,12 +424,12 @@
 
 			this.$io.emit('leave_room', this.rawTextId)
 
-			this.$bus.$off('new_file_upload')
-
 			document.removeEventListener('visibilitychange', this.checkForUpdatedNote)
 
 			this.editor.destroy()
 
+			this.$bus.$off('new_file_upload')
+			
 		},
 		mounted: function() {
 

client/src/components/NoteTitleDisplayCard.vue

@@ -1,7 +1,7 @@
 <template>
 	<div class="note-title-display-card" 
 		:style="{'background-color':color, 'color':fontColor, 'border-color':color }"
-		:class="{'currently-open':currentlyOpen, 'bgboy':triggerClosedAnimation}"
+		:class="{'currently-open':currentlyOpen}"
 	>
 
 
@@ -164,25 +164,17 @@
 			openEditAttachment(){
 				this.$router.push('/attachments/note/'+this.note.id)
 			},
-			pinNote(){ //togglePinned() <- old name
+			pinNote(){
 				let postData = {'pinned': !this.note.pinned, 'noteId':this.note.id}
 				axios.post('/api/note/setpinned', postData)
 				.then(data => {
 					this.$bus.$emit('update_single_note', this.note.id)
 				})
 			},
-			archiveNote(){ //toggleArchived() <- old name
+			archiveNote(){
 				let postData = {'archived': !this.note.archived, 'noteId':this.note.id}
 				axios.post('/api/note/setarchived', postData)
 				.then(data => {
-
-					//Show message so no one worries where note went
-					let message = 'Moved to Archive'
-					if(postData.archived != 1){
-						message = 'Move to main list'
-					}
-					this.$bus.$emit('notification', message)
-
 					this.$bus.$emit('update_single_note', this.note.id)
 				})
 			},
@@ -195,27 +187,6 @@
 				}
 				
 			},
-			justClosed(){
-
-				//Scroll note into view
-				this.$el.scrollIntoView({
-					behavior: 'smooth',
-					block: 'center',
-					inline: 'center'
-				})
-
-				//After scroll, trigger green outline animation
-				setTimeout(() => {
-
-					this.triggerClosedAnimation = true
-					setTimeout(()=>{
-						//After 3 seconds, hide it
-						this.justClosed = false
-					}, 3000)
-
-				}, 500)
-				
-			},
 		},
 		data () {
 			return {
@@ -226,7 +197,6 @@
 				iconColor: null,
 				beenClicked: false,
 				showTagSlideMenu: false,
-				triggerClosedAnimation: false, //Show just closed animation
 			}
 		},
 		computed: {
@@ -474,50 +444,4 @@
 			margin: 0px -5px 10px -5px;
 		}
 	}
-
-	/*Animations for cool border effects*/
-	@keyframes bgin {
-    	0% {
-		    background-image:   
-		    linear-gradient(to right, #21BA45 50%, #21BA45 100%), /* TopLeft to Right */
-            linear-gradient(to bottom, #21BA45 50%, #21BA45 100%), /* TopRight to Bottom */
-            linear-gradient(to right, #21BA45 50%, #21BA45 100%), /* BottomLeft to Right*/
-            linear-gradient(to bottom, #21BA45 50%, #21BA45 100%); /* TopLeft to Bottom */
-            /*Initial state, no BG*/
-	        background-size: 0 2px, 2px 0, 0 2px, 2px 0;
-	    }
-	    15% {
-	    	/*Middre state, some filled */
-	        background-size: 100% 2px, 2px 0, 100% 2px, 2px 0;
-	    }
-	    30% {
-	    	/*final state, all filled */
-	        background-size: 100% 2px, 2px 100%, 100% 2px, 2px 100%;
-	    }
-	    45% {
-	    	background-size: 100% 2px, 2px 100%, 100% 2px, 2px 100%;
-	    	background-image:   
-		    linear-gradient(to right, #21BA45 50%, #21BA45 100%), /* TopLeft to Right */
-            linear-gradient(to bottom, #21BA45 50%, #21BA45 100%), /* TopRight to Bottom */
-            linear-gradient(to right, #21BA45 50%, #21BA45 100%), /* BottomLeft to Right*/
-            linear-gradient(to bottom, #21BA45 50%, #21BA45 100%); /* TopLeft to Bottom */
-	    }
-	    100% {
-    	    background-image:
-    	    linear-gradient(to right, transparent 50%, transparent 100%), /* TopLeft to Right */
-            linear-gradient(to bottom, transparent 50%, transparent 100%), /* TopRight to Bottom */
-            linear-gradient(to right, transparent 50%, transparent 100%), /* BottomLeft to Right*/
-            linear-gradient(to bottom, transparent 50%, transparent 100%); /* TopLeft to Bottom */
-	    }
-	}
-
-.bgboy {
-
-	overflow: hidden;
-    background-repeat: no-repeat;
-    background-size:    100% 0, 0 100%, 100% 0, 0 100%;
-    background-position: 0 0, 100% 0, 100% 100%, 0 100%;
-    animation: bgin 2s cubic-bezier(0.19, 1, 0.22, 1) 1;
-}
-
 </style>

client/src/pages/NotesPage.vue

@@ -91,7 +91,6 @@
 						<div class="note-card-display-area">
 							<note-title-display-card 
 								v-for="note in section"
-								:ref="'note-'+note.id"
 								:onClick="openNote"
 								:data="note"
 								:currently-open="(activeNoteId1 == note.id || activeNoteId2 == note.id)"
@@ -452,8 +451,6 @@
 					}
 				}
 
-				
-
 				axios.post('/api/note/search', postData)
 				.then(results => {
 
@@ -492,13 +489,6 @@
 								this.noteSections[key].splice(index, 1)
 								this.noteSections[key].unshift(note)
 
-								this.$nextTick( () => {
-
-									if(this.$refs['note-'+noteId] && this.$refs['note-'+noteId][0]){
-										this.$refs['note-'+noteId][0].justClosed()
-									}
-								})
-
 								return
 							}
 						})
@@ -599,7 +589,6 @@
 				//Sort notes into defined sections
 				notes.forEach(note => {
 
-					//Show archived notes
 					if(note.archived == 1 && this.fastFilters.onlyArchived == 1){
 						this.noteSections.archived.push(note)
 						return
@@ -626,10 +615,8 @@
 						this.noteSections.pinned.push(note)
 						return
 					}
-					//If the note is not archived, push it.
+
-					if(note.archived != 1 && this.fastFilters.onlyArchived != 1){
+					this.noteSections.notes.push(note)
-						this.noteSections.notes.push(note)
-					}
 				})
 
 			},