mirror of
https://github.com/sudoxnym/habitica-self-host.git
synced 2026-04-14 19:47:03 +00:00
Add ui connection alert
This commit is contained in:
parent
699fc9ab1b
commit
aafcfbbb69
6 changed files with 62 additions and 2 deletions
|
|
@ -1,7 +1,7 @@
|
|||
derby = require('derby')
|
||||
{get, view, ready} = derby.createApp module
|
||||
derby.use require('derby-ui-boot')
|
||||
#derby.use(require('../../ui'))
|
||||
derby.use(require('../../ui'))
|
||||
|
||||
## ROUTES ##
|
||||
|
||||
|
|
|
|||
15
styles/ui.styl
Normal file
15
styles/ui.styl
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
.connection {
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 0;
|
||||
z-index: 99;
|
||||
}
|
||||
.connection > .alert {
|
||||
border-top: 0;
|
||||
border-radius: 0 0 4px 4px;
|
||||
padding-right: 14px;
|
||||
display: inline-block;
|
||||
}
|
||||
15
ui/connectionAlert/index.html
Normal file
15
ui/connectionAlert/index.html
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
<connectionAlert:>
|
||||
<div class="connection">
|
||||
{#unless connected}
|
||||
<p class="alert">
|
||||
{#if canConnect}
|
||||
Offline
|
||||
{#unless :self.hideReconnect}
|
||||
– <a x-bind="click:connect">Reconnect</a>
|
||||
{/}
|
||||
{else}
|
||||
Unable to reconnect – <a x-bind="click:reload">Reload</a>
|
||||
{/}
|
||||
</p>
|
||||
{/}
|
||||
</div>
|
||||
15
ui/connectionAlert/index.js
Normal file
15
ui/connectionAlert/index.js
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
exports.create = function(model) {
|
||||
|
||||
this.connect = function() {
|
||||
// Hide the reconnect link for a second after clicking it
|
||||
model.set('hideReconnect', true)
|
||||
setTimeout(function() {
|
||||
model.set('hideReconnect', false)
|
||||
}, 1000)
|
||||
model.socket.socket.connect()
|
||||
}
|
||||
|
||||
this.reload = function() {
|
||||
window.location.reload()
|
||||
}
|
||||
}
|
||||
14
ui/index.js
Normal file
14
ui/index.js
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
var config = {
|
||||
filename: __filename
|
||||
, styles: '../styles/ui'
|
||||
, scripts: {
|
||||
connectionAlert: require('./connectionAlert')
|
||||
}
|
||||
};
|
||||
|
||||
module.exports = ui
|
||||
ui.decorate = 'derby'
|
||||
|
||||
function ui(derby, options) {
|
||||
derby.createLibrary(config, options)
|
||||
}
|
||||
|
|
@ -2,7 +2,8 @@
|
|||
HabitRPG
|
||||
|
||||
<Header:>
|
||||
<app:alert>
|
||||
<body>
|
||||
<ui:connectionAlert>
|
||||
|
||||
<taskList: nonvoid>
|
||||
<div class="{{{type}}}s">
|
||||
|
|
|
|||
Loading…
Reference in a new issue