kalugin66/webtorrent-desktop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

improve loading experience

Browse Source
This commit is contained in:
Nate Goldman
2016-03-07 12:42:39 -08:00
parent 0d18641bcb
commit 5f0c8e86ad
3 changed files with 41 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
renderer/index.css
View File

@@ -23,6 +23,29 @@ body {
overflow: hidden; overflow: hidden;
} }
.loading {
display: flex;
flex-direction: column;
justify-content: center;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
}
.loading .icon {
font-size: 42px;
display: block;
text-align: center;
animation: spin 2s infinite linear;
}
@keyframes spin {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
.app { .app {
-webkit-user-select: none; -webkit-user-select: none;
-webkit-app-region: drag; -webkit-app-region: drag;

3
renderer/index.html
View File

@@ -6,6 +6,7 @@
<link rel="stylesheet" href="index.css" charset="utf-8"> <link rel="stylesheet" href="index.css" charset="utf-8">
</head> </head>
<body> <body>
<script src='index.js'></script> <div class="loading"><i class="icon">sync</i></div>
<script async src="index.js"></script>
</body> </body>
</html> </html>

24
renderer/index.js
View File

@@ -1,5 +1,6 @@
/* global URL, Blob */ /* global URL, Blob */
console.time('init')
var airplay = require('airplay-js') var airplay = require('airplay-js')
var chromecasts = require('chromecasts')() var chromecasts = require('chromecasts')()
var createTorrent = require('create-torrent') var createTorrent = require('create-torrent')
@@ -49,6 +50,8 @@ loadState(init)
* the dock icon and drag+drop. * the dock icon and drag+drop.
*/ */
function init () { function init () {
document.querySelector('.loading').remove()
// Connect to the WebTorrent and BitTorrent networks // Connect to the WebTorrent and BitTorrent networks
// WebTorrent.app is a hybrid client, as explained here: https://webtorrent.io/faq // WebTorrent.app is a hybrid client, as explained here: https://webtorrent.io/faq
state.client = new WebTorrent() state.client = new WebTorrent()
@@ -81,14 +84,7 @@ function init () {
// OS integrations: // OS integrations:
// ...Chromecast and Airplay // ...Chromecast and Airplay
chromecasts.on('update', function (player) { detectDevices()
state.devices.chromecast = player
update()
})
airplay.createBrowser().on('deviceOn', function (player) {
state.devices.airplay = player
}).start()
// ...drag and drop a torrent or video file to play or seed // ...drag and drop a torrent or video file to play or seed
dragDrop('body', onFiles) dragDrop('body', onFiles)
@@ -121,6 +117,8 @@ function init () {
window.addEventListener('blur', function () { window.addEventListener('blur', function () {
state.isFocused = false state.isFocused = false
}) })
console.timeEnd('init')
} }
// This is the (mostly) pure funtion from state -> UI. Returns a virtual DOM // This is the (mostly) pure funtion from state -> UI. Returns a virtual DOM
@@ -213,6 +211,16 @@ function setupIpc () {
}) })
} }
function detectDevices () {
chromecasts.on('update', function (player) {
state.devices.chromecast = player
})
airplay.createBrowser().on('deviceOn', function (player) {
state.devices.airplay = player
}).start()
}
// Load state.saved from the JSON state file // Load state.saved from the JSON state file
function loadState (callback) { function loadState (callback) {
cfg.read(function (err, data) { cfg.read(function (err, data) {