mirror of
https://github.com/CHOMPStation2/CHOMPStation2.git
synced 2025-12-10 10:12:45 +00:00
Better notifications
This commit is contained in:
ShadowLarkens
committed by
Arokha Sieyes
Arokha Sieyes
parent
22c85075f4
commit
d443e332dd
@@ -1,85 +1,109 @@
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<link rel="stylesheet" type="text/css" href="semantic.css" />
|
||||
<link rel="stylesheet" type="text/css" href="semantic.min.css" />
|
||||
<link rel="stylesheet" type="text/css" href="vchat-font-embedded.css" />
|
||||
<link rel="stylesheet" type="text/css" href="ss13styles.css" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="ui segment">
|
||||
<span class='game say'><b>Test Person</b> says, "Testing say message."</span><br>
|
||||
<span class='notice'>Testing notice message.</span><br>
|
||||
<span class='danger'>Testing danger message.</span><br>
|
||||
<span class='secradio'>[Security] <b>Secu Person</b> says, "Testing radio message."</span><br>
|
||||
<span class='ooc'><span class='everyone'>Testing OOC message.</span></span><br>
|
||||
<span class='ooc'><span class='looc'>Testing LOOC message.</span></span><br>
|
||||
<span class='admin_channel'>Testing asay message.</span><br>
|
||||
<span class='game say'><b>Test Person</b> says, "Testing say message 2."</span><br>
|
||||
<span class='notice'>Testing notice message 2.</span><br>
|
||||
<span class='danger'>Testing danger message 2.</span><br>
|
||||
<span class='secradio'>[Security] <b>Secu Person</b> says, "Testing radio message 2".</span><br>
|
||||
<span class='ooc'><span class='everyone'>Testing OOC message 2.</span></span><br>
|
||||
<span class='ooc'><span class='looc'>Testing LOOC message 2.</span></span><br>
|
||||
<span class='admin_channel'>Testing asay message 2.</span><br>
|
||||
<span class='game say'><b>Test Person</b> says, "Testing say message 3."</span><br>
|
||||
<span class='notice'>Testing notice message 3.</span><br>
|
||||
<span class='danger'>Testing danger message 3.</span><br>
|
||||
<span class='secradio'>[Security] <b>Secu Person</b> says, "Testing radio message 3".</span><br>
|
||||
<span class='ooc'><span class='everyone'>Testing OOC message 3.</span></span><br>
|
||||
<span class='ooc'><span class='looc'>Testing LOOC message 3.</span></span><br>
|
||||
<span class='admin_channel'>Testing asay message 3.</span><br>
|
||||
<span class='game say'><b>Test Person</b> says, "Testing say message 4."</span><br>
|
||||
<span class='notice'>Testing notice message 4.</span><br>
|
||||
<span class='danger'>Testing danger message 4.</span><br>
|
||||
<span class='secradio'>[Security] <b>Secu Person</b> says, "Testing radio message 4".</span><br>
|
||||
<span class='ooc'><span class='everyone'>Testing OOC message 4.</span></span><br>
|
||||
<span class='ooc'><span class='looc'>Testing LOOC message 4.</span></span><br>
|
||||
<span class='admin_channel'>Testing asay message 4.</span><br>
|
||||
<span class='game say'><b>Test Person</b> says, "Testing say message 5."</span><br>
|
||||
<span class='notice'>Testing notice message 5.</span><br>
|
||||
<span class='danger'>Testing danger message 5.</span><br>
|
||||
<span class='secradio'>[Security] <b>Secu Person</b> says, "Testing radio message 5".</span><br>
|
||||
<span class='ooc'><span class='everyone'>Testing OOC message 5.</span></span><br>
|
||||
<span class='ooc'><span class='looc'>Testing LOOC message 5.</span></span><br>
|
||||
<span class='admin_channel'>Testing asay message 5.</span><br>
|
||||
<div class="ui top fixed pointing menu">
|
||||
<div class="item">
|
||||
Main
|
||||
</div>
|
||||
<div class="item">
|
||||
OOC
|
||||
<div class="ui top right attached red label">15</div>
|
||||
</div>
|
||||
|
||||
<div class="right menu">
|
||||
<div class="item" style="cursor: pointer;" title="New Tab"><i class="icon-folder-add"></i></div>
|
||||
<div class="item" style="cursor: pointer;" title="Pause Autoscroll">
|
||||
<i class="icon-pause-outline" :class="{ blinkwarn: paused }"></i>
|
||||
</div>
|
||||
<div class="item" style="cursor: pointer;" title="Edit Mode">
|
||||
<i class="icon-cog-outline" :class="{ blinkwarn: editing }"></i>
|
||||
</div>
|
||||
<div class="item" style="padding-left: 0px !important;"><span class="ui circular label" title="VChat Latency (Not exactly network latency)" :class="ping_classes">{{latency}}ms</span></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="ui segment inverted">
|
||||
<span class='game say'><b>Test Person</b> says, "Testing say message."</span><br>
|
||||
<span class='notice'>Testing notice message.</span><br>
|
||||
<span class='danger'>Testing danger message.</span><br>
|
||||
<span class='secradio'>[Security] <b>Secu Person</b> says, "Testing radio message."</span><br>
|
||||
<span class='ooc'><span class='everyone'>Testing OOC message.</span></span><br>
|
||||
<span class='ooc'><span class='looc'>Testing LOOC message.</span></span><br>
|
||||
<span class='admin_channel'>Testing asay message.</span><br>
|
||||
<span class='game say'><b>Test Person</b> says, "Testing say message 2."</span><br>
|
||||
<span class='notice'>Testing notice message 2.</span><br>
|
||||
<span class='danger'>Testing danger message 2.</span><br>
|
||||
<span class='secradio'>[Security] <b>Secu Person</b> says, "Testing radio message 2".</span><br>
|
||||
<span class='ooc'><span class='everyone'>Testing OOC message 2.</span></span><br>
|
||||
<span class='ooc'><span class='looc'>Testing LOOC message 2.</span></span><br>
|
||||
<span class='admin_channel'>Testing asay message 2.</span><br>
|
||||
<span class='game say'><b>Test Person</b> says, "Testing say message 3."</span><br>
|
||||
<span class='notice'>Testing notice message 3.</span><br>
|
||||
<span class='danger'>Testing danger message 3.</span><br>
|
||||
<span class='secradio'>[Security] <b>Secu Person</b> says, "Testing radio message 3".</span><br>
|
||||
<span class='ooc'><span class='everyone'>Testing OOC message 3.</span></span><br>
|
||||
<span class='ooc'><span class='looc'>Testing LOOC message 3.</span></span><br>
|
||||
<span class='admin_channel'>Testing asay message 3.</span><br>
|
||||
<span class='game say'><b>Test Person</b> says, "Testing say message 4."</span><br>
|
||||
<span class='notice'>Testing notice message 4.</span><br>
|
||||
<span class='danger'>Testing danger message 4.</span><br>
|
||||
<span class='secradio'>[Security] <b>Secu Person</b> says, "Testing radio message 4".</span><br>
|
||||
<span class='ooc'><span class='everyone'>Testing OOC message 4.</span></span><br>
|
||||
<span class='ooc'><span class='looc'>Testing LOOC message 4.</span></span><br>
|
||||
<span class='admin_channel'>Testing asay message 4.</span><br>
|
||||
<span class='game say'><b>Test Person</b> says, "Testing say message 5."</span><br>
|
||||
<span class='notice'>Testing notice message 5.</span><br>
|
||||
<span class='danger'>Testing danger message 5.</span><br>
|
||||
<span class='secradio'>[Security] <b>Secu Person</b> says, "Testing radio message 5".</span><br>
|
||||
<span class='ooc'><span class='everyone'>Testing OOC message 5.</span></span><br>
|
||||
<span class='ooc'><span class='looc'>Testing LOOC message 5.</span></span><br>
|
||||
<span class='admin_channel'>Testing asay message 5.</span><br>
|
||||
|
||||
<div id="contentbox">
|
||||
<div class="ui segment">
|
||||
<span class='game say'><b>Test Person</b> says, "Testing say message."</span><br>
|
||||
<span class='notice'>Testing notice message.</span><br>
|
||||
<span class='danger'>Testing danger message.</span><br>
|
||||
<span class='secradio'>[Security] <b>Secu Person</b> says, "Testing radio message."</span><br>
|
||||
<span class='ooc'><span class='everyone'>Testing OOC message.</span></span><br>
|
||||
<span class='ooc'><span class='looc'>Testing LOOC message.</span></span><br>
|
||||
<span class='admin_channel'>Testing asay message.</span><br>
|
||||
<span class='game say'><b>Test Person</b> says, "Testing say message 2."</span><br>
|
||||
<span class='notice'>Testing notice message 2.</span><br>
|
||||
<span class='danger'>Testing danger message 2.</span><br>
|
||||
<span class='secradio'>[Security] <b>Secu Person</b> says, "Testing radio message 2".</span><br>
|
||||
<span class='ooc'><span class='everyone'>Testing OOC message 2.</span></span><br>
|
||||
<span class='ooc'><span class='looc'>Testing LOOC message 2.</span></span><br>
|
||||
<span class='admin_channel'>Testing asay message 2.</span><br>
|
||||
<span class='game say'><b>Test Person</b> says, "Testing say message 3."</span><br>
|
||||
<span class='notice'>Testing notice message 3.</span><br>
|
||||
<span class='danger'>Testing danger message 3.</span><br>
|
||||
<span class='secradio'>[Security] <b>Secu Person</b> says, "Testing radio message 3".</span><br>
|
||||
<span class='ooc'><span class='everyone'>Testing OOC message 3.</span></span><br>
|
||||
<span class='ooc'><span class='looc'>Testing LOOC message 3.</span></span><br>
|
||||
<span class='admin_channel'>Testing asay message 3.</span><br>
|
||||
<span class='game say'><b>Test Person</b> says, "Testing say message 4."</span><br>
|
||||
<span class='notice'>Testing notice message 4.</span><br>
|
||||
<span class='danger'>Testing danger message 4.</span><br>
|
||||
<span class='secradio'>[Security] <b>Secu Person</b> says, "Testing radio message 4".</span><br>
|
||||
<span class='ooc'><span class='everyone'>Testing OOC message 4.</span></span><br>
|
||||
<span class='ooc'><span class='looc'>Testing LOOC message 4.</span></span><br>
|
||||
<span class='admin_channel'>Testing asay message 4.</span><br>
|
||||
<span class='game say'><b>Test Person</b> says, "Testing say message 5."</span><br>
|
||||
<span class='notice'>Testing notice message 5.</span><br>
|
||||
<span class='danger'>Testing danger message 5.</span><br>
|
||||
<span class='secradio'>[Security] <b>Secu Person</b> says, "Testing radio message 5".</span><br>
|
||||
<span class='ooc'><span class='everyone'>Testing OOC message 5.</span></span><br>
|
||||
<span class='ooc'><span class='looc'>Testing LOOC message 5.</span></span><br>
|
||||
<span class='admin_channel'>Testing asay message 5.</span><br>
|
||||
</div>
|
||||
<div class="ui segment inverted">
|
||||
<span class='game say'><b>Test Person</b> says, "Testing say message."</span><br>
|
||||
<span class='notice'>Testing notice message.</span><br>
|
||||
<span class='danger'>Testing danger message.</span><br>
|
||||
<span class='secradio'>[Security] <b>Secu Person</b> says, "Testing radio message."</span><br>
|
||||
<span class='ooc'><span class='everyone'>Testing OOC message.</span></span><br>
|
||||
<span class='ooc'><span class='looc'>Testing LOOC message.</span></span><br>
|
||||
<span class='admin_channel'>Testing asay message.</span><br>
|
||||
<span class='game say'><b>Test Person</b> says, "Testing say message 2."</span><br>
|
||||
<span class='notice'>Testing notice message 2.</span><br>
|
||||
<span class='danger'>Testing danger message 2.</span><br>
|
||||
<span class='secradio'>[Security] <b>Secu Person</b> says, "Testing radio message 2".</span><br>
|
||||
<span class='ooc'><span class='everyone'>Testing OOC message 2.</span></span><br>
|
||||
<span class='ooc'><span class='looc'>Testing LOOC message 2.</span></span><br>
|
||||
<span class='admin_channel'>Testing asay message 2.</span><br>
|
||||
<span class='game say'><b>Test Person</b> says, "Testing say message 3."</span><br>
|
||||
<span class='notice'>Testing notice message 3.</span><br>
|
||||
<span class='danger'>Testing danger message 3.</span><br>
|
||||
<span class='secradio'>[Security] <b>Secu Person</b> says, "Testing radio message 3".</span><br>
|
||||
<span class='ooc'><span class='everyone'>Testing OOC message 3.</span></span><br>
|
||||
<span class='ooc'><span class='looc'>Testing LOOC message 3.</span></span><br>
|
||||
<span class='admin_channel'>Testing asay message 3.</span><br>
|
||||
<span class='game say'><b>Test Person</b> says, "Testing say message 4."</span><br>
|
||||
<span class='notice'>Testing notice message 4.</span><br>
|
||||
<span class='danger'>Testing danger message 4.</span><br>
|
||||
<span class='secradio'>[Security] <b>Secu Person</b> says, "Testing radio message 4".</span><br>
|
||||
<span class='ooc'><span class='everyone'>Testing OOC message 4.</span></span><br>
|
||||
<span class='ooc'><span class='looc'>Testing LOOC message 4.</span></span><br>
|
||||
<span class='admin_channel'>Testing asay message 4.</span><br>
|
||||
<span class='game say'><b>Test Person</b> says, "Testing say message 5."</span><br>
|
||||
<span class='notice'>Testing notice message 5.</span><br>
|
||||
<span class='danger'>Testing danger message 5.</span><br>
|
||||
<span class='secradio'>[Security] <b>Secu Person</b> says, "Testing radio message 5".</span><br>
|
||||
<span class='ooc'><span class='everyone'>Testing OOC message 5.</span></span><br>
|
||||
<span class='ooc'><span class='looc'>Testing LOOC message 5.</span></span><br>
|
||||
<span class='admin_channel'>Testing asay message 5.</span><br>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
|
||||
@@ -27,7 +27,7 @@
|
||||
<div class="ui top fixed pointing menu" :class="{ inverted: inverted }">
|
||||
<div v-for="tab in tabs" class="item" :class="{ active: tab.active, inverted: inverted }" @click="switchtab(tab)" @click.ctrl="editmode">
|
||||
{{tab.name}}
|
||||
<div class="ui empty circular label" :class="tab_unread_classes(tab)"></div>
|
||||
<div v-if="tab_unread_count(tab) > 0" class="ui top right attached red label">{{tab_unread_count(tab)}}</div>
|
||||
</div>
|
||||
|
||||
<div class="right menu">
|
||||
|
||||
@@ -312,7 +312,7 @@ function start_vue() {
|
||||
tab.active = true;
|
||||
|
||||
tab.classes.forEach( function(cls) {
|
||||
this.unread_messages[cls] = false;
|
||||
this.unread_messages[cls] = 0;
|
||||
}, this);
|
||||
},
|
||||
//Toggle edit mode
|
||||
@@ -354,6 +354,16 @@ function start_vue() {
|
||||
this.switchtab(this.tabs[0]);
|
||||
this.tabs.splice(this.tabs.indexOf(doomed_tab), 1);
|
||||
},
|
||||
tab_unread_count: function(tab) {
|
||||
var unreads = 0;
|
||||
var thisum = this.unread_messages;
|
||||
tab.classes.find( function(cls){
|
||||
if(thisum[cls]) {
|
||||
unreads += thisum[cls];
|
||||
}
|
||||
});
|
||||
return unreads;
|
||||
},
|
||||
tab_unread_classes: function(tab) {
|
||||
var unreads = false;
|
||||
var thisum = this.unread_messages;
|
||||
@@ -378,7 +388,10 @@ function start_vue() {
|
||||
//Get a category
|
||||
newmessage.category = this.get_category(newmessage.content);
|
||||
if(!this.active_tab.classes.some(function(cls) { return (cls == newmessage.category || cls == "vc_showall"); })) {
|
||||
this.unread_messages[newmessage.category] = true;
|
||||
if (isNaN(this.unread_messages[newmessage.category])) {
|
||||
this.unread_messages[newmessage.category] = 0;
|
||||
}
|
||||
this.unread_messages[newmessage.category] += 1;
|
||||
}
|
||||
|
||||
//Try to crush it with one of the last few
|
||||
|
||||
Reference in New Issue
Block a user