Skip to content
This repository has been archived by the owner on Oct 30, 2018. It is now read-only.

Commit

Permalink
begin refactoring views
Browse files Browse the repository at this point in the history
  • Loading branch information
Gordon Hall committed Nov 27, 2015
1 parent 6a00060 commit 501b0f1
Show file tree
Hide file tree
Showing 19 changed files with 226 additions and 144 deletions.
1 change: 1 addition & 0 deletions .nvmrc
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
4.2.2
14 changes: 14 additions & 0 deletions app/client.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
/**
* @module drivshare-gui/client
*/

'use strict';

// load helpers
require('./lib/electron_boilerplate/external_links');

// load application
require('./lib/views');
// require('./lib/userdata').init();
// require('./lib/process').init();
// require('./lib/setup').init();
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
77 changes: 31 additions & 46 deletions app/driveshare.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,21 +2,23 @@
<html lang="en">
<title>DriveShare</title>
<head>
<link href="lib/css/bootstrap.min.css" rel="stylesheet">
<link href="lib/css/style.css" rel="stylesheet">
<link href="lib/css/fonts.css" rel="stylesheet">
<link href="lib/ladda/ladda-themeless.min.css" rel="stylesheet">
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<link href="css/fonts.css" rel="stylesheet">
<link href="node_modules/ladda/dist/ladda-themeless.min.css" rel="stylesheet">
</head>

<body>

<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-8 col-sm-push-2 col-md-6 col-md-push-3">

<header>
<div class="row">
<div class="col-xs-12">
<h2 class="title"><a href="http://driveshare.org/" class="js-external-link">DriveShare</a></h2>
<h2 class="title">
<a href="http://driveshare.org/" class="js-external-link">DriveShare</a>
</h2>
</div>
</div>
</header>
Expand All @@ -33,10 +35,10 @@ <h2 class="title"><a href="http://driveshare.org/" class="js-external-link">Driv
<!--Tabs will be filled dynamically-->
</div>

<footer>
<footer id="footer">
<div class="row">
<div class="col-xs-4 text-left">
<p><a href="#" onclick="require('./modules/logs').showLogs();return false;">View Logs</a></p>
<p><a href="#" v-on:click="showLogs">View Logs</a></p>
</div>
<div class="col-xs-4 text-center">
<p><a href="http://storj.io/" class="js-external-link">Powered by Storj</a></p>
Expand Down Expand Up @@ -180,74 +182,57 @@ <h4 class="modal-title">Please Install dataserv-client</h4>
</div>
</div>

<div class="modal fade text-center" id="modalUpdateAvailable" tabindex="-1" role="dialog" aria-labelledby="modalUpdateAvailable">
<div class="modal fade text-center" id="updater" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Update DriveShare</h4>
<h4 v-if="update" class="modal-title">Update DriveShare</h4>
<h4 v-if="!update" class="modal-title">No Update Available</h4>
</div>
<div class="modal-body">There is an update available, would you like to download the update now?</div>
<div v-if="!update" class="modal-body">You are already using the latest version.</div>
<div v-if="update" class="modal-body">There is an update available, would you like to download the update now?</div>
<div class="modal-footer">
<div class="btn-group">
<button type="button" class="btn btn-blue" data-dismiss="modal" onclick="require('shell').openExternal('https://github.com/Storj/driveshare-gui/releases')">Yes</button>
<button v-if="!update" type="button" class="btn btn-blue" data-dismiss="modal">Close</button>
<div v-if="update" class="btn-group">
<button type="button" class="btn btn-blue" data-dismiss="modal" v-on:click="download">Yes</button>
<button type="button" class="btn btn-blue" data-dismiss="modal">No</button>
</div>
</div>
</div>
</div>
</div>

<div class="modal fade text-center" id="modalNoUpdateAvailable" tabindex="-1" role="dialog" aria-labelledby="modalNoUpdateAvailable">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">No Update Available</h4>
</div>
<div class="modal-body" id="updateContents">You are already using the latest version.</div>
<div class="modal-footer">
<button type="button" class="btn btn-blue" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>

<div class="modal fade text-center" id="modalAbout" tabindex="-1" role="dialog" aria-labelledby="modalAbout">
<div class="modal fade text-center" id="about" tabindex="-1" role="dialog" aria-labelledby="modalAbout">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
<h4 class="modal-title">About DriveShare</h4>
</div>
<div class="modal-body" id="modalAboutBody"><!--Contents are populated by ./modules/about.js--></div>
<div class="modal-body">Storj DriveShare version {{version}}</div>
</div>
</div>
</div>

<div class="modal fade text-center" id="modalLogs" tabindex="-1" role="dialog" aria-labelledby="modalLogs">
<div class="modal fade text-center" id="logs" tabindex="-1" role="dialog" aria-labelledby="modalLogs">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
<h4 class="modal-title">Console Logs</h4>
</div>
<div class="modal-body">
<pre class="pre-scrollable text-left" id="modalLogsCode"><!--Contents are populated by ./modules/logs.js--></pre>
<pre class="pre-scrollable text-left">{{output}}</pre>
</div>
</div>
</div>
</div>
</body>

<script type="text/javascript" src="lib/ladda/spin.min.js"></script>
<script type="text/javascript" src="lib/electron_boilerplate/env_config.js"></script>
<script type="text/javascript" src="lib/electron_boilerplate/context_menu.js"></script>
<script type="text/javascript" src="lib/electron_boilerplate/external_links.js"></script>
<script>
require('./lib/logs');
require('./lib/about').init();
require('./lib/userdata').init();
require('./lib/updater');
require('./lib/process').init();
require('./lib/setup').init();
</script>
<script src="client.js"></script>

</body>
</html>
16 changes: 0 additions & 16 deletions app/lib/about.js

This file was deleted.

32 changes: 11 additions & 21 deletions app/lib/logs.js → app/lib/logger.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,24 +4,27 @@

'use strict';

var $ = require('jquery');
var ipc = require('electron-safe-ipc/guest');
var events = require('events');
var util = require('util');

/**
* Creates a logger and bind to view
* @constructor
*/
function Logger() {
if (!(this instanceof Logger)) {
return new Logger();
}

events.EventEmitter.call(this);

this._output = '';
this._maxLength = 1048576 / 16; // approximately 1 MB of string memory
this._view = $('#modalLogs');
this._log = $('#modalLogsCode');
this._showTrigger = $('#view-output');

this._showTrigger.click(this.show.bind(this));
ipc.on('showLogs', this.show.bind(this));
}

util.inherits(Logger, events.EventEmitter);

/**
* Sets the logger output and trims if over maximum length
* #_realize
Expand All @@ -33,20 +36,7 @@ Logger.prototype._realize = function() {
this._output = this._output.substr(index, this._output.length);
}

this.log.text(this._output);
};

/**
* Opens the logger window
* #show
* @param {Object} event - optional dom event to prevent
*/
Logger.prototype.show = function(event) {
if (event) {
event.preventDefault();
}

this.view.modal('show');
this.emit('log');
};

/**
Expand Down
10 changes: 10 additions & 0 deletions app/lib/updater.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,8 @@

'use strict';

var events = require('events');
var util = require('util');
var request = require('request');
var ipc = require('electron-safe-ipc/guest');
var about = require('../package');
Expand All @@ -13,12 +15,20 @@ var about = require('../package');
* @constructor
*/
function Updater() {
if (!(this instanceof Updater)) {
return new Updater();
}

events.EventEmitter.call(this);

this._versionCheckURL = about.config.versionCheckURL;

ipc.on('checkForUpdates', this.check.bind(this));
this.check(true);
}

util.inherits(Updater, events.EventEmitter);

/**
* Fetches remote package metadata and determines if update is available
* #check
Expand Down
124 changes: 124 additions & 0 deletions app/lib/views.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,124 @@
/**
* @module driveshare-gui/views
*/

'use strict';

var ipc = require('electron-safe-ipc/guest');
var shell = require('shell');
var about = require('../package');
var $ = window.jQuery = require('jquery');
var bootstrap = require('bootstrap');
var Vue = require('vue');

var logger = require('./logger');
var Updater = require('./updater').Updater;

/**
* Logger View
*/
var logs = new Vue({
el: '#logs',
data: {
output: ''
},
methods: {
show: function(event) {
if (event) {
event.preventDefault();
}

$('#logs').modal('show');
}
},
created: function() {
var view = this;

logger.on('log', function() {
view.output = logger._output;
});

ipc.on('showLogs', this.show.bind(this));
}
});

/**
* About View
*/
var about = new Vue({
el: '#about',
data: {
version: about.version
},
methods: {
show: function(event) {
if (event) {
event.preventDefault();
}

$('#about').modal('show');
}
},
created: function() {
var view = this;

ipc.on('showAboutDialog', function() {
view.show();
});
}
});

/**
* Updater View
*/
var updater = new Vue({
el: '#updater',
data: {
update: false
},
methods: {
download: function(event) {
if (event) {
event.preventDefault();
}

shell.openExternal('https://github.com/Storj/driveshare-gui/releases');
}
},
created: function() {
var view = this;
var updater = new Updater();

updater.on('update_available', function() {
view.update = true;
});
}
});

/**
* Footer View
*/
var footer = new Vue({
el: '#footer',
data: {},
methods: {
showLogs: function(event) {
if (event) {
event.preventDefault();
}

logs.show();
}
}
});

/**
* Expose view objects
* #exports
*/
module.exports = {
logs: logs,
updater: updater,
about: about,
footer: footer
};
Loading

0 comments on commit 501b0f1

Please sign in to comment.