2013-02-16 19:18:14 +01:00
<!DOCTYPE html>
2013-10-07 00:12:44 +02:00
< html ng-app = "weechat" ng-cloak >
2013-02-16 18:49:20 +01:00
< head >
2013-10-09 17:53:25 +02:00
< meta charset = "utf-8" >
< meta http-equiv = "X-UA-Compatible" content = "IE=Edge" >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
< title ng-bind-template = "WeeChat {{ pageTitle}}" > < / title >
2013-12-19 16:34:48 +01:00
< link href = "//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel = "stylesheet" media = "screen" >
2013-10-06 12:34:41 +02:00
< link rel = "shortcut icon" type = "image/png" href = "img/favicon.png" >
2013-10-26 10:30:35 +02:00
< link href = "css/style.css" rel = "stylesheet" media = "screen" >
2013-10-02 01:39:24 +02:00
< link href = "css/glowingbear.css" rel = "stylesheet" media = "screen" >
2013-12-19 16:34:48 +01:00
< script src = "//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" > < / script >
< script src = "//ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2/angular.min.js" > < / script >
< script src = "//ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2/angular-route.min.js" > < / script >
< script src = "//ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2/angular-sanitize.min.js" > < / script >
< script src = "//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.5.2/underscore-min.js" > < / script >
2013-10-05 16:05:16 +02:00
< script type = "text/javascript" src = "js/localstorage.js" > < / script >
2013-10-16 23:10:49 +02:00
< script type = "text/javascript" src = "js/weechat.js" > < / script >
2013-10-27 00:44:48 +02:00
< script type = "text/javascript" src = "js/irc-utils.js" > < / script >
2013-02-16 19:18:14 +01:00
< script type = "text/javascript" src = "js/websockets.js" > < / script >
2013-10-08 02:42:19 +02:00
< script type = "text/javascript" src = "js/models.js" > < / script >
2013-10-08 23:06:47 +02:00
< script type = "text/javascript" src = "js/plugins.js" > < / script >
2013-12-19 16:34:48 +01:00
< script type = "text/javascript" src = "js/bindonce.js" > < / script >
< script type = "text/javascript" src = "js/favico-0.3.0.min.js" > < / script >
< script src = "//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js" > < / script >
2013-02-16 18:49:20 +01:00
< / head >
2013-10-11 16:24:25 +02:00
< body ng-controller = "WeechatCtrl" ng-keydown = "handleKeyPress($event)" >
2013-10-09 17:53:25 +02:00
< div ng-hide = "connected" class = "container" >
< h2 >
2013-10-16 14:13:23 +02:00
< img alt = "logo" src = "img/favicon.png" >
2013-10-09 17:53:25 +02:00
glowing bear
< small >
WeeChat web frontend
< / small >
< / h2 >
2013-10-11 23:38:30 +02:00
< div class = "alert alert-danger" ng-show = "errorMessage" >
< strong > Oh no!< / strong > We cannot connect!
< / div >
2013-10-15 16:09:08 +02:00
< div class = "panel-group" id = "accordion" >
2013-10-22 13:26:35 +02:00
< div class = "panel" >
2013-10-15 16:09:08 +02:00
< div class = "panel-heading" >
< h4 class = "panel-title" >
< a class = "accordion-toggle" data-toggle = "collapse" data-parent = "#accordion" href = "#collapseOne" >
Connection settings
< / a >
< / h4 >
2013-02-16 19:18:14 +01:00
< / div >
2013-10-15 16:09:08 +02:00
< div id = "collapseOne" class = "panel-collapse collapse in" >
< div class = "panel-body" >
< form class = "form-signin" role = "form" >
< div class = "form-group" >
2013-10-25 13:43:03 +02:00
< label class = "control-label" for = "host" > WeeChat relay hostname and port number< / label >
< div class = "input-group" >
2013-10-27 08:09:39 +01:00
< input type = "text" class = "form-control monospace" id = "host" ng-model = "host" placeholder = "Address" >
< input type = "text" class = "form-control monospace" id = "port" ng-model = "port" placeholder = "9001" >
2013-10-25 13:43:03 +02:00
< / div >
2013-10-17 18:36:53 +02:00
< div class = "alert alert-danger" ng-show = "passwordError" >
2013-12-19 15:54:45 +01:00
Error: wrong password
2013-10-17 18:36:53 +02:00
< / div >
2013-10-25 13:43:03 +02:00
< label class = "control-label" for = "password" > WeeChat relay password< / label >
2013-10-27 08:09:39 +01:00
< input type = "password" class = "form-control monospace" id = "password" ng-model = "password" placeholder = "Password" >
2013-10-25 13:43:03 +02:00
< div class = "checkbox" >
< label >
< input type = "checkbox" class = "checkbox" id = "savepassword" ng-model = "savepassword" >
Save password in your browser
< / label >
< / div >
< div class = "checkbox" >
< label class = "control-label " for = "ssl" >
< input type = "checkbox" class = "" id = "ssl" ng-model = "ssl" >
Encryption. Read instructions for help
< / label >
< / div >
2013-10-15 16:09:08 +02:00
< / div >
< div class = "form-group" >
< label class = "control-label" for = "port" > Lines< / label >
2013-10-27 08:09:39 +01:00
< input type = "text" class = "form-control monospace" id = "lines" ng-model = "lines" placeholder = "40" >
2013-10-15 16:09:08 +02:00
< p class = "help-block" > Enter number of lines to sync from WeeChat on connect< / p >
< / div >
2013-10-16 14:25:07 +02:00
< button class = "btn btn-lg btn-primary" ng-click = "connect()" > Connect < i class = "glyphicon glyphicon-chevron-right" > < / i > < / button >
2013-10-15 16:09:08 +02:00
< / form >
< / div >
< / div >
< / div >
2013-10-22 13:26:35 +02:00
< div class = "panel" >
2013-10-15 16:09:08 +02:00
< div class = "panel-heading" >
< h4 class = "panel-title" >
< a class = "accordion-toggle" data-toggle = "collapse" data-parent = "#accordion" href = "#collapseTwo" >
Usage instructions
< / a >
< / h4 >
< / div >
< div id = "collapseTwo" class = "panel-collapse collapse" >
< div class = "panel-body" >
2013-12-19 15:00:24 +01:00
< h3 > Configuring the relay< / h3 >
2013-12-19 15:54:45 +01:00
< div > To start using glowing bear, please enable the relay plugin in your WeeChat client:
2013-10-26 08:36:06 +02:00
< pre >
/set relay.network.password yourpassword
/relay add weechat 9001
< / pre >
2013-12-19 15:54:45 +01:00
< span class = "label label-danger" > WeeChat version 0.4.2 or higher is required.< / span > < br >
The communication goes directly between your browser and your WeeChat relay in plain text. Check the instructions below for help on setting up encrypted communication.
Connection settings, including your password, are saved locally in your own browser between sessions.
2013-12-19 15:00:24 +01:00
< br >
< h3 > Shortcuts< / h3 >
Glowing Bear has a few shortcuts:
< ul >
< li > ALT+n: Toggle nicklist< / li >
< li > ALT+l: Focus on input bar< / li >
< li > ALT-[0-9]: Focus on buffer< / li >
< li > ALT-a: Focus on next buffer with activity< / li >
< / ul >
2013-10-22 13:26:35 +02:00
< / div >
2013-10-15 16:09:08 +02:00
< / div >
< / div >
< / div >
< div class = "panel " >
< div class = "panel-heading" >
< h4 class = "panel-title" >
< a class = "accordion-toggle" data-toggle = "collapse" data-parent = "#accordion" href = "#collapseThree" >
Encryption instructions
< / a >
< / h4 >
< / div >
< div id = "collapseThree" class = "panel-collapse collapse" >
< div class = "panel-body" >
2013-12-19 15:54:45 +01:00
If you check the encryption box, the communication between browser and WeeChat will be encrypted.< br >
< strong > Note< / strong > : Due to a < a href = "https://bugzilla.mozilla.org/show_bug.cgi?id=594502" > bug< / a > encryption will not work in Firefox. Unless you are using a certificate trusted by your browser, you must also first visit the URL https://weechathost:relayport/ to accept the certificate.< / p >
If you want to use an encrypted session you first have to set up the relay using SSL. It is easiest to use a self-signed certificate, which you can create like this:
2013-10-26 08:36:06 +02:00
< pre >
$ mkdir -p ~/.weechat/ssl
$ cd ~/.weechat/ssl
$ openssl req -nodes -newkey rsa:2048 -keyout relay.pem -x509 -days 365 -out relay.pem
< / pre >
2013-12-19 15:54:45 +01:00
If WeeChat is already running, you can reload the certificate and private key with these commands:
2013-10-26 08:36:06 +02:00
< pre >
/relay sslcertkey
/relay add ssl.weechat 8000
< / pre >
2013-10-21 15:51:05 +02:00
< / div >
< / div >
< / div >
< div class = "panel" ng-hide = "isinstalled" >
< div class = "panel-heading" >
< h4 class = "panel-title" >
< a class = "accordion-toggle" data-toggle = "collapse" data-parent = "#accordion" href = "#collapseFour" >
Install app
< / a >
< / h4 >
< / div >
< div id = "collapseFour" class = "panel-collapse collapse" >
< div class = "panel-body" >
2013-12-19 15:54:45 +01:00
< p > If you have a very recent version of Firefox you can install the frontend as an app. Click the button to install.< / p >
2013-10-21 15:51:05 +02:00
< button class = "btn btn-lg btn-primary" ng-click = "install()" > Install app < i class = "glyphicon glyphicon-chevron-right" > < / i > < / button >
2013-10-15 16:09:08 +02:00
< / div >
< / div >
< / div >
2013-10-11 23:21:51 +02:00
< / div >
2013-10-11 23:38:30 +02:00
< / div >
< / div >
2013-10-09 17:53:25 +02:00
< div class = "content" ng-show = "connected" >
2013-10-26 23:41:37 +02:00
< div id = "topbar" class = "horizontal-line" >
2013-10-16 16:04:37 +02:00
< div class = "brand" >
2013-10-31 00:18:10 +01:00
< img alt = "brand" src = "img/favicon.png" title = "Connected to {{ host }}:{{ port}}" >
2013-10-16 14:13:23 +02:00
< / div >
2013-12-16 17:09:17 +01:00
< button ng-show = "debugMode" ng-click = "countWatchers()" > Count Watchers< / button >
2013-10-28 15:13:11 +01:00
< div class = "title" ng-bind-html = "activeBuffer().title | linky:'_blank'" > < / div >
2013-10-19 12:45:16 +02:00
< div class = "actions pull-right vertical-line-left" >
2013-10-16 15:09:27 +02:00
< div class = "dropdown pull-left" >
< a href = "#" class = "dropdown-toggle" data-toggle = "dropdown" >
< i class = "glyphicon glyphicon-cog" > < / i >
< span class = "caret" > < / span >
< / a >
< ul class = "dropdown-menu pull-right" >
< li class = "" >
< form class = "form-inline" role = "form" >
< div class = "checkbox" >
< label >
< input type = "checkbox" ng-model = "onlyUnread" >
Only show unread
< / label >
< / div >
< / form >
< / li >
2013-10-17 10:50:29 +02:00
< li class = "" >
< form class = "form-inline" role = "form" >
< div class = "checkbox" >
< label >
< input type = "checkbox" ng-model = "notimestamp" >
2013-10-28 13:21:51 +01:00
Hide timestamps
< / label >
< / div >
< / form >
< / li >
< li class = "" >
< form class = "form-inline" role = "form" >
< div class = "checkbox" >
< label >
< input type = "checkbox" ng-model = "noembed" >
Hide embedded content by default
2013-10-17 10:50:29 +02:00
< / label >
< / div >
< / form >
< / li >
2013-10-19 12:14:32 +02:00
< li class = "" >
< form class = "form-inline" role = "form" >
< div class = "checkbox" >
< label >
< input type = "checkbox" ng-model = "hotlistsync" >
Sync hotlist with WeeChat
< / label >
< / div >
< / form >
< / li >
2013-10-26 22:56:52 +02:00
< li class = "" >
< form class = "form-inline" role = "form" >
< div class = "checkbox" >
< label >
< input type = "checkbox" ng-model = "nonicklist" >
Hide nicklist
< / label >
< / div >
< / form >
< / li >
2013-12-08 22:29:48 +01:00
< li class = "" >
< form class = "form-inline" role = "form" >
< div class = "checkbox" >
< label >
< input type = "checkbox" ng-model = "orderbyserver" >
Order channels by server
< / label >
2013-12-16 17:09:17 +01:00
< / div >
< / form >
< / li >
< li class = "" >
< form class = "form-inline" role = "form" >
< div class = "checkbox" >
< label >
< input type = "checkbox" ng-model = "debugMode" >
Debug Mode
< / label >
2013-12-08 22:29:48 +01:00
< / div >
< / form >
< / li >
2013-10-16 15:09:27 +02:00
< / ul >
< / div >
2013-10-16 14:25:07 +02:00
< a ng-click = "disconnect()" >
< i class = "glyphicon glyphicon-remove" > < / i >
< / a >
< / div >
2013-10-16 14:13:23 +02:00
< / div >
2013-10-16 23:27:47 +02:00
< div id = "sidebar" class = "vertical-line" >
2013-10-11 00:51:18 +02:00
< ul class = "nav nav-pills nav-stacked" >
2013-10-11 14:44:05 +02:00
< li class = "bufferfilter" >
< form role = "form" >
2013-10-27 08:09:39 +01:00
< input class = "form-control monospace" type = "text" id = "bufferFilter" ng-model = "search" ng-keydown = "handleSearchBoxKey($event)" placeholder = "Search" >
2013-10-11 14:44:05 +02:00
< / form >
< / li >
2013-12-08 21:42:30 +01:00
< li class = "buffer" ng-class = "{'active': content.active }" ng-repeat = "(key, content) in buffers | toArray | filter:{fullName:search} | filter:hasUnread | orderBy:predicate" >
2013-10-11 00:51:18 +02:00
< a href = "#" ng-click = "setActiveBuffer(content.id)" title = "{{ content.fullName }}" >
2013-10-15 14:59:06 +02:00
< span class = "badge pull-right" ng-hide = "content.notification" ng-if = "content.unread" ng-bind = "content.unread" > < / span >
2013-10-15 14:31:41 +02:00
< span class = "badge pull-right danger" ng-show = "content.notification" ng-bind = "content.notification" > < / span >
2013-12-08 22:29:48 +01:00
{{ content.indent(predicate) }}{{ content.shortName }}< span ng-hide = "content.shortName" > {{ content.fullName }}< / span >
2013-10-11 00:51:18 +02:00
< / a >
< / li >
< / ul >
< / div >
2013-10-27 10:48:20 +01:00
< div id = "bufferlines" class = "monospace" ng-class = "{'withnicklist': showNicklist}" >
< div id = "nicklist" ng-show = "showNicklist" class = "vertical-line-left" >
2013-10-27 00:26:17 +02:00
< ul class = "nicklistgroup list-unstyled" ng-repeat = "group in activeBuffer().nicklist" >
2013-12-14 15:42:25 +01:00
< li class = "" ng-repeat = "nick in group.nicks|orderBy:'name'" ng-click = "openQuery(nick.name)" >
< a ng-click = "nickAction(nick)" > < span ng-class = "nick.prefixClasses" > {{nick.prefix}}< / span > < span ng-class = "nick.nameClasses" > {{nick.name}}< / span > < / a >
2013-10-26 22:56:52 +02:00
< / li >
< / ul >
< / div >
2013-10-12 02:37:11 +02:00
< table >
2013-12-16 17:05:54 +01:00
< tbody bindonce ng-repeat = "bufferline in (bufferlines = activeBuffer().lines)" >
2013-11-01 11:15:35 +01:00
< tr class = "bufferline" >
2013-12-16 17:05:54 +01:00
< td bo-hide = "notimestamp" class = "time" >
< span class = "date" bo-class = "{'repeated-time': bufferline.shortTime==bufferlines[$index-1].shortTime}" >
< span class = "cof-chat_time cob-chat_time coa-chat_time" bo-text = "bufferline.date|date:'HH'" > < / span > < span class = "cof-chat_time_delimiters cob-chat_time_delimiters coa-chat_time_delimiters" > :< / span > < span class = "cof-chat_time cob-chat_time coa-chat_time" bo-text = "bufferline.date|date:'mm'" > {{ bufferline.date | date:'mm' }}< / span >
2013-10-12 02:37:11 +02:00
< / span >
< / td >
2013-12-16 17:05:54 +01:00
< td class = "prefix" > < span bindonce ng-repeat = "part in bufferline.prefix" bo-class = "part.classes" bo-html = "part.text" > < / span > < / td >
2013-10-12 11:49:14 +02:00
< td class = "message" >
2013-12-16 17:05:54 +01:00
< span bindonce ng-repeat = "part in bufferline.content" class = "text" bo-class = "part.classes" bo-html = "part.text|linky:'_blank'" > < / span >
2013-10-08 15:55:07 +02:00
2013-12-16 17:05:54 +01:00
< div bindonce ng-repeat = "metadata in bufferline.metadata" >
< div bo-show = "metadata.visible" >
< button class = "btn btn-primary pull-right" bo-click = "metadata.visible = false" bo-text = "'Hide ' + metadata.name" > Hide {{ metadata.name }}< / button >
< div bo-html = "metadata.content" > < / div >
2013-08-06 23:07:29 +02:00
2013-10-12 02:37:11 +02:00
< / div >
2013-12-16 17:05:54 +01:00
< div bo-hide = "metadata.visible" >
< button class = "btn pull-right" bo-class = "{'btn-warning': metadata.nsfw, 'btn-primary': !metadata.nsfw}" ng-click = "metadata.visible = true" > Show {{ metadata.name }}< / button >
2013-10-12 02:37:11 +02:00
< / div >
< / div >
< / td >
< / tr >
2013-11-01 11:15:35 +01:00
< tr class = "readmarker" ng-if = "activeBuffer().lastSeen==$index" >
2013-10-12 20:44:40 +02:00
< td colspan = "3" >
2013-11-01 11:15:35 +01:00
< hr id = "readmarker" >
2013-10-12 20:44:40 +02:00
< / td >
< / tr >
2013-10-12 02:37:11 +02:00
< / tbody >
< / table >
2013-10-05 18:40:01 +02:00
< / div >
2013-10-12 02:37:11 +02:00
< div class = "push" > < / div >
2013-10-05 18:40:01 +02:00
< / div >
< div id = "footer" ng-show = "connected" >
2013-10-27 10:48:20 +01:00
< div class = "navbar navbar-inverse navbar-fixed-bottom" ng-class = "{'withnicklist': showNicklist}" >
2013-10-27 21:41:27 +01:00
< div input-bar > < / div >
2013-10-05 18:40:01 +02:00
< / div >
< / body >
2013-02-16 18:49:20 +01:00
< / html >
