hiimgoodpack/brainlet
1
0
Fork 0
forked from hippoz/brainlet
Code Issues Pull requests Projects Releases Wiki Activity

attempt (and fail) to put message div before the textobx

Browse source
This commit is contained in:
hippoz 2020-11-20 11:59:48 +02:00
parent 94d3af7b7e
commit 9d1adfe748
2 changed files with 34 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
app/app.html
View file

@ -25,11 +25,28 @@
.cursor { .cursor {
cursor: pointer; cursor: pointer;
} }
.chat-bar {
position: fixed !important;
left: 0 !important;
bottom: 0 !important;
width: 98% !important;
margin-left: 1% !important;
}
.as-console-wrapper {
display: none !important;
}
.posts-container {
overflow-y: auto;
height: calc(90vh - 100px);
}
</style> </style>
</head> </head>
<body> <body>
<div id="app"> <div id="app">
<div v-if="showApp"> <div id="appContainer" v-if="showApp">
<md-dialog id="create-category-dialog" :md-active.sync="dialog.show.createCategory"> <md-dialog id="create-category-dialog" :md-active.sync="dialog.show.createCategory">
<md-dialog-title>Create category</md-dialog-title> <md-dialog-title>Create category</md-dialog-title>
@ -78,7 +95,7 @@
</md-dialog-actions> </md-dialog-actions>
</md-dialog-content> </md-dialog-content>
</md-dialog> </md-dialog>
<md-toolbar class="md-accent" md-elevation="5"> <md-toolbar class="md-accent" md-elevation="5">
<h3 class="md-title" style="flex: 1">Brainlet</h3> <h3 class="md-title" style="flex: 1">Brainlet</h3>
<md-menu md-size="small"> <md-menu md-size="small">
@ -96,7 +113,7 @@
<md-button @click="refresh()" v-if="!selection.category.isChatContext">Refresh</md-button> <md-button @click="refresh()" v-if="!selection.category.isChatContext">Refresh</md-button>
</md-toolbar> </md-toolbar>
<div id="posts-container" v-if="selection.category.browsing"> <div id="posts-container" class="posts-container" v-if="selection.category.browsing">
<md-card v-for="post in selection.posts" v-bind:key="post._id" v-if="!selection.category.isChatContext"> <md-card v-for="post in selection.posts" v-bind:key="post._id" v-if="!selection.category.isChatContext">
<md-card-header> <md-card-header>
<div class="md-title" v-html="post.title"></div> <div class="md-title" v-html="post.title"></div>
@ -115,13 +132,13 @@
<a class="md-dense cursor md-title" v-on:click="viewProfile(post.author._id)"><span>{{ post.author.username }}</span></a> <a class="md-dense cursor md-title" v-on:click="viewProfile(post.author._id)"><span>{{ post.author.username }}</span></a>
</md-card-header> </md-card-header>
<md-card-content v-html="post.content"></md-card-content> <md-card-content>{{ post.content }}</md-card-content>
</md-card> </md-card>
<br> <br>
</div> </div>
</div> </div>
<md-speed-dial class="md-fixed md-bottom-right" md-direction="top" md-elevation="5" style="z-index: 4000;"> <md-speed-dial class="md-fixed md-bottom-right" md-direction="top" md-elevation="5" style="z-index: 4000;" v-show="!selection.category.isChatContext">
<md-speed-dial-target> <md-speed-dial-target>
<md-icon class="md-morph-initial">add</md-icon> <md-icon class="md-morph-initial">add</md-icon>
<md-icon class="md-morph-final">edit</md-icon> <md-icon class="md-morph-final">edit</md-icon>
@ -139,6 +156,11 @@
</md-button> </md-button>
</md-speed-dial-content> </md-speed-dial-content>
</md-speed-dial> </md-speed-dial>
<md-field md-inline class="chat-bar" v-show="selection.category.isChatContext">
<label>Send message</label>
<md-input v-model="message.typed" v-on:keyup.enter="sendCurrentMessage()"></md-input>
</md-field>
</div> </div>
<md-snackbar md-position="center" :md-duration="snackbarNotificationDuration" :md-active.sync="showSnackbarNotification" md-persistent> <md-snackbar md-position="center" :md-duration="snackbarNotificationDuration" :md-active.sync="showSnackbarNotification" md-persistent>
<span>{{ snackbarNotification }}</span> <span>{{ snackbarNotification }}</span>

7
app/resources/js/app.js
View file

@ -171,6 +171,9 @@ const app = new Vue({
gateway: new GatewayConnection(), gateway: new GatewayConnection(),
messages: { messages: {
'X': [ { username: 'NONEXISTENT_TEST_ACCOUNT', content: 'TEST MSG' } ] 'X': [ { username: 'NONEXISTENT_TEST_ACCOUNT', content: 'TEST MSG' } ]
},
message: {
typed: ''
} }
}, },
mounted: async function() { mounted: async function() {
@ -234,6 +237,10 @@ const app = new Vue({
this.selection.category.title = 'Chat'; this.selection.category.title = 'Chat';
this.selection.category._id = categoryId; this.selection.category._id = categoryId;
}, },
sendCurrentMessage: async function() {
this.gateway.sendMessage(this.selection.category._id, this.message.typed);
this.message.typed = '';
},
// Category and post browsing // Category and post browsing
browseCategories: async function() { browseCategories: async function() {