From 6a997661dc5c259f844531382a90a4ca120f1233 Mon Sep 17 00:00:00 2001 From: RaNaN Date: Sun, 29 Sep 2013 13:03:17 +0200 Subject: basics for web setup --- pyload/web/app/index.html | 1 + pyload/web/app/scripts/default.js | 18 +++-- pyload/web/app/scripts/helpers/ifEq.js | 14 ++++ pyload/web/app/scripts/models/Setup.js | 14 ++++ pyload/web/app/scripts/setup.js | 33 ++++++++ pyload/web/app/scripts/views/setup/setupView.js | 89 ++++++++++++++++++++++ pyload/web/app/scripts/views/setup/systemView.js | 20 +++++ pyload/web/app/scripts/views/setup/welcomeView.js | 20 +++++ pyload/web/app/styles/default/style.less | 10 ++- pyload/web/app/templates/default/setup.html | 16 ---- .../web/app/templates/default/setup/actionbar.html | 24 ++++++ pyload/web/app/templates/default/setup/layout.html | 7 ++ pyload/web/app/templates/default/setup/system.html | 5 ++ .../web/app/templates/default/setup/welcome.html | 16 ++++ 14 files changed, 262 insertions(+), 25 deletions(-) create mode 100644 pyload/web/app/scripts/helpers/ifEq.js create mode 100644 pyload/web/app/scripts/models/Setup.js create mode 100644 pyload/web/app/scripts/setup.js create mode 100644 pyload/web/app/scripts/views/setup/setupView.js create mode 100644 pyload/web/app/scripts/views/setup/systemView.js create mode 100644 pyload/web/app/scripts/views/setup/welcomeView.js delete mode 100644 pyload/web/app/templates/default/setup.html create mode 100644 pyload/web/app/templates/default/setup/actionbar.html create mode 100644 pyload/web/app/templates/default/setup/layout.html create mode 100644 pyload/web/app/templates/default/setup/system.html create mode 100644 pyload/web/app/templates/default/setup/welcome.html (limited to 'pyload/web/app') diff --git a/pyload/web/app/index.html b/pyload/web/app/index.html index 4a4195b13..bf75d40ed 100644 --- a/pyload/web/app/index.html +++ b/pyload/web/app/index.html @@ -41,6 +41,7 @@ // TODO window.pathPrefix = '/'; window.wsAddress = configValue('{{ws}}', 'ws://%s:7227'); + window.setup = configValue('{{setup}}', 'false'); require(['config'], function(Config) { require(['default'], function(App) { diff --git a/pyload/web/app/scripts/default.js b/pyload/web/app/scripts/default.js index 428ec2b28..91b46715e 100644 --- a/pyload/web/app/scripts/default.js +++ b/pyload/web/app/scripts/default.js @@ -1,5 +1,5 @@ -define('default', ['backbone', 'jquery', 'app', 'router', 'models/UserSession'], - function(Backbone, $, App, Router, UserSession) { +define('default', ['require', 'backbone', 'jquery', 'app', 'router', 'models/UserSession'], + function(require, Backbone, $, App, Router, UserSession) { 'use strict'; // Global ajax options @@ -21,9 +21,17 @@ define('default', ['backbone', 'jquery', 'app', 'router', 'models/UserSession'], }; $(function() { - App.user = new UserSession(); - App.router = new Router(); - App.start(); + // load setup async + if (window.setup === 'true') { + require(['setup'], function(SetupRouter) { + App.router = new SetupRouter(); + App.start(); + }); + } else { + App.user = new UserSession(); + App.router = new Router(); + App.start(); + } }); return App; diff --git a/pyload/web/app/scripts/helpers/ifEq.js b/pyload/web/app/scripts/helpers/ifEq.js new file mode 100644 index 000000000..1c8a71b61 --- /dev/null +++ b/pyload/web/app/scripts/helpers/ifEq.js @@ -0,0 +1,14 @@ +define('helpers/ifEq', ['underscore', 'handlebars'], + function(_, Handlebars) { + /*jshint validthis:true */ + 'use strict'; + function ifEq(v1, v2, options) { + if (v1 === v2) { + return options.fn(this); + } + return options.inverse(this); + } + + Handlebars.registerHelper('ifEq', ifEq); + return ifEq; + }); diff --git a/pyload/web/app/scripts/models/Setup.js b/pyload/web/app/scripts/models/Setup.js new file mode 100644 index 000000000..82a2978db --- /dev/null +++ b/pyload/web/app/scripts/models/Setup.js @@ -0,0 +1,14 @@ +define(['jquery', 'backbone', 'underscore', 'app', 'utils/apitypes'], + function($, Backbone, _, App, Api) { + 'use strict'; + + return Backbone.Model.extend({ + + defaults: { + lang: 'en', + user: null, + password: null + } + + }); + }); \ No newline at end of file diff --git a/pyload/web/app/scripts/setup.js b/pyload/web/app/scripts/setup.js new file mode 100644 index 000000000..94d370078 --- /dev/null +++ b/pyload/web/app/scripts/setup.js @@ -0,0 +1,33 @@ +/** + * Router and controller used in setup mode + */ +define([ + // Libraries + 'backbone', + 'marionette', + 'app', + + // Views + 'views/setup/setupView' +], + function(Backbone, Marionette, App, SetupView) { + 'use strict'; + + return Backbone.Marionette.AppRouter.extend({ + + appRoutes: { + '': 'setup' + }, + + controller: { + + setup: function() { + + var view = new SetupView(); + App.actionbar.show(new view.actionbar()); + App.content.show(view); + } + + } + }); + }); diff --git a/pyload/web/app/scripts/views/setup/setupView.js b/pyload/web/app/scripts/views/setup/setupView.js new file mode 100644 index 000000000..7636a0bc2 --- /dev/null +++ b/pyload/web/app/scripts/views/setup/setupView.js @@ -0,0 +1,89 @@ +define(['jquery', 'backbone', 'underscore', 'app', 'models/Setup', 'hbs!tpl/setup/layout', 'hbs!tpl/setup/actionbar', + './welcomeView', './systemView'], + function($, Backbone, _, App, Setup, template, templateBar, welcomeView, systemView) { + 'use strict'; + + return Backbone.Marionette.ItemView.extend({ + template: template, + + events: { + }, + + ui: { + page: '.setup-page' + }, + + pages: [ + welcomeView, + systemView + ], + + page: 0, + view: null, + + initialize: function() { + var self = this; + this.model = new Setup(); + + this.actionbar = Backbone.Marionette.ItemView.extend({ + template: templateBar, + view: this, + events: { + 'click .select-page': 'selectPage' + }, + + initialize: function() { + this.listenTo(self.model, 'page:changed', this.render); + }, + + serializeData: function() { + return { + page: this.view.page, + max: this.view.pages.length - 1, + pages: _.map(this.view.pages, function(p) { + return p.prototype.name; + }) + }; + }, + + selectPage: function(e) { + this.view.openPage(parseInt($(e.target).data('page'), 10)); + } + + }); + this.listenTo(this.model, 'page:next', function() { + self.openPage(self.page++); + }); + this.listenTo(this.model, 'page:prev', function() { + self.openPage(self.page--); + }); + }, + + openPage: function(page) { + console.log('Change page', page); + // check if number is reasonable + if (!_.isNumber(page) || !_.isFinite(page)) + return; + + if (page === this.page) + return; + + this.page = page; + this.onRender(); + + this.model.trigger('page:changed', page); + }, + + onRender: function() { + // close old opened view + if (this.view) + this.view.close(); + + // TODO: animation + this.view = new this.pages[this.page]({model: this.model}); + this.ui.page.empty(); + this.ui.page.append(this.view.render().$el); + } + + }); + }); \ No newline at end of file diff --git a/pyload/web/app/scripts/views/setup/systemView.js b/pyload/web/app/scripts/views/setup/systemView.js new file mode 100644 index 000000000..11e50213d --- /dev/null +++ b/pyload/web/app/scripts/views/setup/systemView.js @@ -0,0 +1,20 @@ +define(['jquery', 'backbone', 'underscore', 'app', 'hbs!tpl/setup/system'], + function($, Backbone, _, App, template) { + 'use strict'; + + return Backbone.Marionette.ItemView.extend({ + + name: 'System', + template: template, + + events: { + }, + + ui: { + }, + + onRender: function() { + } + + }); + }); \ No newline at end of file diff --git a/pyload/web/app/scripts/views/setup/welcomeView.js b/pyload/web/app/scripts/views/setup/welcomeView.js new file mode 100644 index 000000000..4affc9075 --- /dev/null +++ b/pyload/web/app/scripts/views/setup/welcomeView.js @@ -0,0 +1,20 @@ +define(['jquery', 'backbone', 'underscore', 'app', 'hbs!tpl/setup/welcome'], + function($, Backbone, _, App, template) { + 'use strict'; + + return Backbone.Marionette.ItemView.extend({ + + name: 'Language', + template: template, + + events: { + }, + + ui: { + }, + + onRender: function() { + } + + }); + }); \ No newline at end of file diff --git a/pyload/web/app/styles/default/style.less b/pyload/web/app/styles/default/style.less index b24e5ff21..da0e68991 100644 --- a/pyload/web/app/styles/default/style.less +++ b/pyload/web/app/styles/default/style.less @@ -231,15 +231,13 @@ header { // background-color: @greyDark; } .actionbar { + padding-top: 2px; padding-bottom: 3px; - margin-bottom: 0; + margin-bottom: 5px; border-bottom: 1px dashed @grey; height: @actionbar-height; - padding-top: 2px; - margin-bottom: 5px; - & > li > a, & > li > button { margin-top: 4px; } @@ -259,6 +257,10 @@ header { // background-color: @greyDark; margin-bottom: 0; } + select { + margin: 2px 0 0; + } + input, button { padding-top: 2px; padding-bottom: 2px; diff --git a/pyload/web/app/templates/default/setup.html b/pyload/web/app/templates/default/setup.html deleted file mode 100644 index e5c9f4b8c..000000000 --- a/pyload/web/app/templates/default/setup.html +++ /dev/null @@ -1,16 +0,0 @@ -{% extends 'default/base.html' %} -{% block title %} - {{_("Setup")}} - {{ super()}} -{% endblock %} - -{% block content %} -
-

You did it!

-

pyLoad is running and ready for configuration.

-

- - Go on - -

-
-{% endblock %} \ No newline at end of file diff --git a/pyload/web/app/templates/default/setup/actionbar.html b/pyload/web/app/templates/default/setup/actionbar.html new file mode 100644 index 000000000..b109025b7 --- /dev/null +++ b/pyload/web/app/templates/default/setup/actionbar.html @@ -0,0 +1,24 @@ + \ No newline at end of file diff --git a/pyload/web/app/templates/default/setup/layout.html b/pyload/web/app/templates/default/setup/layout.html new file mode 100644 index 000000000..7b75e53b1 --- /dev/null +++ b/pyload/web/app/templates/default/setup/layout.html @@ -0,0 +1,7 @@ +
+

+ {{ _ "Setup" }} +

+
+
+
\ No newline at end of file diff --git a/pyload/web/app/templates/default/setup/system.html b/pyload/web/app/templates/default/setup/system.html new file mode 100644 index 000000000..84a217b19 --- /dev/null +++ b/pyload/web/app/templates/default/setup/system.html @@ -0,0 +1,5 @@ +

{{ _ "System" }}

+ +

{{_ "Dependencies" }}

+ +

{{ _ "Optional" }}

\ No newline at end of file diff --git a/pyload/web/app/templates/default/setup/welcome.html b/pyload/web/app/templates/default/setup/welcome.html new file mode 100644 index 000000000..f5c5af4d7 --- /dev/null +++ b/pyload/web/app/templates/default/setup/welcome.html @@ -0,0 +1,16 @@ +
+

{{ _ "Welcome!" }}

+ +

{{ _ "pyLoad is running and ready for configuration." }}

+ +

+ {{ _ "Select your language:" }} + +

+ + +
\ No newline at end of file -- cgit v1.2.3