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

I swear, I'm going to start doing regular commits

Browse Source 
+ Added a ton of shit
+ About to add socket.io oh god.
This commit is contained in:
Max G
2020-01-03 01:26:55 +00:00
parent 8d07a8e11a
commit 4216c1825e
24 changed files with 3171 additions and 360 deletions
Download Patch File Download Diff File Expand all files Collapse all files

83
client/src/components/GlobalSiteMenu.vue
View File

@@ -21,10 +21,10 @@
.menu-item {
color: #fff;
padding: 10px 0px 10px 10px;
padding: 0.8em 0px 0.8em 0.8em;
display: inline-block;
width: 100%;
font-size: 1.1rem;
font-size: 1.15em;
box-sizing: border-box;
}
.sub {
@@ -60,28 +60,60 @@
cursor: pointer;
}
.top-menu-bar {
color: var(--text_color);
width: calc(100% - 20px);
/*color: var(--text_color);*/
/*width: 100%;*/
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 999;
background-color: var(--background_color);
border-bottom: 1px solid;
border-color: var(--border_color);
padding: 5px 1rem 5px;
}
.place-holder {
width: 100%;
height: 50px;
}
.top-menu-bar img {
width: 20px;
height: 20px;
width: 30px;
height: 30px;
}
</style>
<template>
<div>
<div class="place-holder" v-if="collapsed && !menuOpen"></div>
<!-- collapsed menu, appears as a bar -->
<div class="top-menu-bar menu-item" v-if="collapsed || mobile" v-on:click="collapseMenu">
<div class="top-menu-bar" v-if="(collapsed || mobile) && !menuOpen">
<div class="ui grid">
<div class="five wide column">
<i class="bars icon"></i> Menu
<div class="three wide column">
<div class="ui large basic compact icon button" v-on:click="collapseMenu">
<i class="green bars icon"></i>
</div>
</div>
<div class="six wide center aligned column">
<img src="/api/static/assets/favicon.ico" alt="logo" />
<div class="ten wide center aligned column">
<img v-if="!loggedIn" src="/api/static/assets/favicon.ico" alt="logo" />
<search-input v-if="loggedIn"></search-input>
</div>
<div class="three wide right aligned column">
<!-- mobile create note button -->
<div v-if="loggedIn">
<div v-if="!disableNewNote" @click="createNote" class="ui large basic compact icon button">
<i class="green plus icon"></i>
</div>
<div v-if="disableNewNote" class="ui large basic compact icon button">
<i class="grey plus icon"></i>
</div>
</div>
</div>
<div class="five wide right aligned column"></div>
</div>
</div>
@@ -94,7 +126,7 @@
<div class="menu-section">
<div class="menu-item menu-button" v-on:click="collapseMenu">
<i class="caret square left icon"></i>
<i class="caret square left outline icon"></i>
</div>
</div>
@@ -108,7 +140,7 @@
</div>
<div class="menu-section" v-if="loggedIn">
<router-link exact-active-class="active" class="menu-item menu-button" to="/notes">
<router-link exact-active-class="active" class="menu-item menu-button" to="/notes" v-on:click.native="emitReloadEvent()">
<i class="file icon"></i>Notes
</router-link>
<div>
@@ -168,13 +200,16 @@
import axios from 'axios'
export default {
components: {
'search-input': require('@/components/SearchInput.vue').default,
},
data: function(){
return {
username: '',
collapsed: false,
mobile: false,
disableNewNote: false
disableNewNote: false,
menuOpen: true,
}
},
beforeCreate: function(){
@@ -182,6 +217,10 @@
mounted: function(){
this.mobile = this.$store.getters.getIsUserOnMobile
this.collapsed = this.$store.getters.getIsUserOnMobile
if(this.mobile){
this.menuOpen = false
}
},
computed: {
loggedIn () {
@@ -194,10 +233,18 @@
//Collapse menu when item is clicked in mobile
if(this.mobile && !this.collapsed){
this.collapsed = true
this.menuOpen = false
}
},
collapseMenu(){
this.collapsed = !this.collapsed
if(!this.collapsed){
this.menuOpen = true
} else {
this.menuOpen = false
}
},
createNote(event){
const title = ''
@@ -227,6 +274,10 @@
return $1.toUpperCase()
})
},
emitReloadEvent(){
//Reloads note page to initial state
this.$bus.$emit('note_reload')
},
updateFastFilters(index){
//A little hacky, brings user to notes page then filters on click