Add unread counter to buffer nav
This commit is contained in:
parent
befe6e9160
commit
599cf0733f
3 changed files with 59 additions and 39 deletions
|
@ -1,7 +1,10 @@
|
||||||
body {
|
body {
|
||||||
color: white;
|
color: white;
|
||||||
background-color: #222;
|
background-color: #222;
|
||||||
padding: 5px;
|
padding-left: 5px;
|
||||||
|
padding-right: 5px;
|
||||||
|
padding-bottom:70px;
|
||||||
|
padding-top: 70px;
|
||||||
}
|
}
|
||||||
.bufferlines {
|
.bufferlines {
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
|
|
78
index.html
78
index.html
|
@ -7,7 +7,8 @@
|
||||||
<title ng-bind-template="WeeChat {{ pageTitle}}"></title>
|
<title ng-bind-template="WeeChat {{ pageTitle}}"></title>
|
||||||
|
|
||||||
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" media="screen">
|
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" media="screen">
|
||||||
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js" rel="stylesheet" media="screen">
|
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
|
||||||
|
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
|
||||||
<link rel="shortcut icon" type="image/png" href="img/favicon.png" >
|
<link rel="shortcut icon" type="image/png" href="img/favicon.png" >
|
||||||
<link href="css/glowingbear.css" rel="stylesheet" media="screen">
|
<link href="css/glowingbear.css" rel="stylesheet" media="screen">
|
||||||
<script type="text/javascript" src="js/angular.min.js"></script>
|
<script type="text/javascript" src="js/angular.min.js"></script>
|
||||||
|
@ -20,14 +21,14 @@
|
||||||
<div ng-controller="WeechatCtrl">
|
<div ng-controller="WeechatCtrl">
|
||||||
<div ng-hide="connected" class="container">
|
<div ng-hide="connected" class="container">
|
||||||
<h2>
|
<h2>
|
||||||
<img src="img/favicon.png">
|
<img src="img/favicon.png">
|
||||||
glowing bear
|
glowing bear
|
||||||
<small>
|
<small>
|
||||||
WeeChat web frontend
|
WeeChat web frontend
|
||||||
</small>
|
</small>
|
||||||
</h2>
|
</h2>
|
||||||
<div>To start using, please enable relay in your WeeChat client:
|
<div>To start using, please enable relay in your WeeChat client:
|
||||||
<pre>
|
<pre>
|
||||||
/set relay.network.password yourpassword
|
/set relay.network.password yourpassword
|
||||||
/relay add weechat 9001</pre>
|
/relay add weechat 9001</pre>
|
||||||
Note: The communication goes directly between your browser and your weechat in clear text.
|
Note: The communication goes directly between your browser and your weechat in clear text.
|
||||||
|
@ -35,36 +36,45 @@
|
||||||
</div>
|
</div>
|
||||||
<h3>Connection settings</h3>
|
<h3>Connection settings</h3>
|
||||||
<form role="form">
|
<form role="form">
|
||||||
<div class="alert alert-danger" ng-show="errorMessage">
|
<div class="alert alert-danger" ng-show="errorMessage">
|
||||||
<strong>Oh no!</strong> We cannot connect!
|
<strong>Oh no!</strong> We cannot connect!
|
||||||
</div>
|
</div>
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label class="control-label" for="hostport">Hostname and port</label>
|
<label class="control-label" for="hostport">Hostname and port</label>
|
||||||
<input type="text" class="form-control" id="hostport" ng-model="hostport" placeholder="Hostport">
|
<input type="text" class="form-control" id="hostport" ng-model="hostport" placeholder="Hostport">
|
||||||
<p class="help-block">Enter the hostname and the port to the WeeChat relay, separated by a :</p>
|
<p class="help-block">Enter the hostname and the port to the WeeChat relay, separated by a :</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label class="control-label" for="password">WeeChat relay password</label>
|
<label class="control-label" for="password">WeeChat relay password</label>
|
||||||
<input type="password"class="form-control" id="password" ng-model="password" placeholder="Password">
|
<input type="password"class="form-control" id="password" ng-model="password" placeholder="Password">
|
||||||
<p class="help-block">Password will be stored in your browser session</p>
|
<p class="help-block">Password will be stored in your browser session</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label class="control-label" for="proto">Proto</label>
|
<label class="control-label" for="proto">Proto</label>
|
||||||
<input type="text" class="form-control" id="proto" ng-model="proto" placeholder="proto">
|
<input type="text" class="form-control" id="proto" ng-model="proto" placeholder="proto">
|
||||||
<p class="help-block">Default is fine.</p>
|
<p class="help-block">Default is fine.</p>
|
||||||
</div>
|
</div>
|
||||||
<button class="btn btn-lg btn-primary" ng-click="connect()">Connect!</button>
|
<button class="btn btn-lg btn-primary" ng-click="connect()">Connect!</button>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
<div ng-show="connected">
|
<div ng-show="connected">
|
||||||
|
<nav class="navbar navbar-default navbar-inverse navbar-fixed-top" role="navigation">
|
||||||
<div class="navbar navbar-inverse navbar-fixed-top">
|
<div class="navbar-header">
|
||||||
<ul class="nav nav-pills">
|
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
|
||||||
<li class="label" ng-class="{'active': content.notification }" ng-repeat="(key, content) in buffers | toArray | orderBy:'content.number':true">
|
<span class="sr-only">Toggle navigation</span>
|
||||||
<a ng-click="setActiveBuffer(content.id)" title="{{ content.full_name }}">{{ content.short_name }}</a>
|
<span class="icon-bar"></span>
|
||||||
</li>
|
<span class="icon-bar"></span>
|
||||||
</ul>
|
<span class="icon-bar"></span>
|
||||||
</div>
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="navbar-collapse collapse">
|
||||||
|
<ul class="nav navbar-nav ">
|
||||||
|
<li class="label" ng-class="{'active': content.active }" ng-repeat="(key, content) in buffers | toArray | orderBy:'content.number':true">
|
||||||
|
<a ng-click="setActiveBuffer(content.id)" title="{{ content.full_name }}">{{ content.short_name }} <span class="badge" ng-bind="content.unread"></span></a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
<div class="bufferlines">
|
<div class="bufferlines">
|
||||||
<div class="bufferline" ng-repeat="bufferline in activeBuffer.lines">
|
<div class="bufferline" ng-repeat="bufferline in activeBuffer.lines">
|
||||||
<span class="date text-muted">
|
<span class="date text-muted">
|
||||||
|
|
|
@ -290,7 +290,11 @@ weechat.factory('handlers', ['$rootScope', 'colors', 'pluginManager', function($
|
||||||
|
|
||||||
|
|
||||||
if (!_isActiveBuffer(buffer) && !initial) {
|
if (!_isActiveBuffer(buffer) && !initial) {
|
||||||
$rootScope.buffers[buffer]['notification'] = true;
|
|
||||||
|
if ($rootScope.buffers[buffer]['unread'] == '') {
|
||||||
|
$rootScope.buffers[buffer]['unread'] == 0;
|
||||||
|
}
|
||||||
|
$rootScope.buffers[buffer]['unread'] += 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (text[0] != undefined) {
|
if (text[0] != undefined) {
|
||||||
|
@ -365,10 +369,12 @@ weechat.factory('handlers', ['$rootScope', 'colors', 'pluginManager', function($
|
||||||
var pointer = bufferInfo['pointers'][0];
|
var pointer = bufferInfo['pointers'][0];
|
||||||
bufferInfo['id'] = pointer;
|
bufferInfo['id'] = pointer;
|
||||||
bufferInfo['lines'] = [];
|
bufferInfo['lines'] = [];
|
||||||
|
bufferInfo['unread'] = '';
|
||||||
buffers[pointer] = bufferInfo
|
buffers[pointer] = bufferInfo
|
||||||
if (i == 0) {
|
if (i == 0) {
|
||||||
// first buffer is active buffer by default
|
// first buffer is active buffer by default
|
||||||
$rootScope.activeBuffer = buffers[pointer];
|
$rootScope.activeBuffer = buffers[pointer];
|
||||||
|
$rootScope.activeBuffer['active'] = true;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
$rootScope.buffers = buffers;
|
$rootScope.buffers = buffers;
|
||||||
|
@ -412,7 +418,7 @@ weechat.factory('handlers', ['$rootScope', 'colors', 'pluginManager', function($
|
||||||
_buffer_closing: handleBufferClosing,
|
_buffer_closing: handleBufferClosing,
|
||||||
_buffer_line_added: handleBufferLineAdded,
|
_buffer_line_added: handleBufferLineAdded,
|
||||||
_buffer_opened: handleBufferOpened,
|
_buffer_opened: handleBufferOpened,
|
||||||
_buffer_title_changed: handleBufferTitleChanged,
|
_buffer_title_changed: handleBufferTitleChanged
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
@ -536,8 +542,9 @@ weechat.controller('WeechatCtrl', ['$rootScope', '$scope', '$store', 'connection
|
||||||
}
|
}
|
||||||
|
|
||||||
$scope.setActiveBuffer = function(key) {
|
$scope.setActiveBuffer = function(key) {
|
||||||
$rootScope.activeBuffer['notification'] = false;
|
$rootScope.activeBuffer['active'] = false;
|
||||||
$rootScope.buffers[key]['notification'] = true;
|
$rootScope.buffers[key]['active'] = true;
|
||||||
|
$rootScope.buffers[key]['unread'] = '';
|
||||||
$rootScope.activeBuffer = $rootScope.buffers[key];
|
$rootScope.activeBuffer = $rootScope.buffers[key];
|
||||||
$rootScope.pageTitle = $rootScope.activeBuffer['short_name'] + ' | ' + $rootScope.activeBuffer['title'];
|
$rootScope.pageTitle = $rootScope.activeBuffer['short_name'] + ' | ' + $rootScope.activeBuffer['title'];
|
||||||
};
|
};
|
||||||
|
|
Loading…
Reference in a new issue