From 7ca154e613329050885b7c6a799488475266218e Mon Sep 17 00:00:00 2001 From: RaNaN Date: Sun, 24 Mar 2013 15:51:30 +0100 Subject: enter captchas on webui --- module/plugins/hoster/BasePlugin.py | 2 +- module/web/static/css/default/common.less | 20 ++++++++ module/web/static/css/default/style.less | 7 +++ .../web/static/js/collections/InteractionList.js | 13 +++--- module/web/static/js/models/InteractionTask.js | 19 ++++++-- module/web/static/js/views/abstract/modalView.js | 4 +- module/web/static/js/views/headerView.js | 7 +++ module/web/static/js/views/linkGrabberModal.js | 4 -- module/web/static/js/views/notificationView.js | 23 +++++++-- module/web/static/js/views/queryModal.js | 54 ++++++++++++++++++++++ module/web/templates/default/backbone/modal.html | 2 +- .../templates/default/backbone/queryDialog.html | 25 ++++++++++ module/web/templates/default/base.html | 6 +-- 13 files changed, 161 insertions(+), 25 deletions(-) create mode 100644 module/web/static/js/views/queryModal.js create mode 100755 module/web/templates/default/backbone/queryDialog.html diff --git a/module/plugins/hoster/BasePlugin.py b/module/plugins/hoster/BasePlugin.py index c07164161..140d0b136 100644 --- a/module/plugins/hoster/BasePlugin.py +++ b/module/plugins/hoster/BasePlugin.py @@ -31,7 +31,7 @@ class BasePlugin(Hoster): #TODO: remove debug if pyfile.url.lower().startswith("debug"): - self.decryptCaptcha("http://download.pyload.org/pie.png") + self.decryptCaptcha("http://download.pyload.org/pie.png", imgtype="png") self.download("http://download.pyload.org/random100.bin") return # diff --git a/module/web/static/css/default/common.less b/module/web/static/css/default/common.less index 97cc20463..a6b9a1e21 100644 --- a/module/web/static/css/default/common.less +++ b/module/web/static/css/default/common.less @@ -69,6 +69,26 @@ transition: @prop @time @ease; } +.stripes(@color, @color2: rgba(255, 255, 255, 0.15)) { + background-color: @color; + background-image: -webkit-linear-gradient(45deg, @color2 25%, transparent 25%, transparent 50%, @color2 50%, @color2 75%, transparent 75%, transparent); + background-image: -moz-linear-gradient(45deg, @color2 25%, transparent 25%, transparent 50%, @color2 50%, @color2 75%, transparent 75%, transparent); + background-image: -o-linear-gradient(45deg, @color2 25%, transparent 25%, transparent 50%, @color2 50%, @color2 75%, transparent 75%, transparent); + background-image: linear-gradient(45deg, @color2 25%, transparent 25%, transparent 50%, @color2 50%, @color2 75%, transparent 75%, transparent); + -webkit-background-size: 40px 40px; + -moz-background-size: 40px 40px; + -o-background-size: 40px 40px; + background-size: 40px 40px; +} +.stripes-animated { + -webkit-animation: progress-bar-stripes 2s linear infinite; + -moz-animation: progress-bar-stripes 2s linear infinite; + -ms-animation: progress-bar-stripes 2s linear infinite; + -o-animation: progress-bar-stripes 2s linear infinite; + animation: progress-bar-stripes 2s linear infinite; +} + + .default-shadow { box-shadow: 0 0 5px @dark; } \ No newline at end of file diff --git a/module/web/static/css/default/style.less b/module/web/static/css/default/style.less index f48aff9fd..120864f39 100644 --- a/module/web/static/css/default/style.less +++ b/module/web/static/css/default/style.less @@ -1,4 +1,5 @@ @import "common.less"; + /* General */ @@ -311,6 +312,12 @@ header .logo { color: @dark; background-image: none; background-color: @yellow; + + &.running { + width: 100%; + .stripes(@yellowLighter, @yellowDark); + } + } } diff --git a/module/web/static/js/collections/InteractionList.js b/module/web/static/js/collections/InteractionList.js index 88651970e..9ec175892 100644 --- a/module/web/static/js/collections/InteractionList.js +++ b/module/web/static/js/collections/InteractionList.js @@ -10,13 +10,17 @@ define(['jquery', 'backbone', 'underscore', 'app', 'models/InteractionTask'], }, fetch: function(options) { - options = App.apiRequest('getInteractionTasks/0'); + options = App.apiRequest('getInteractionTasks/0', null, options); + var self = this; + options.success = function(data) { + self.update(data); + }; - return Backbone.Collection.prototype.fetch.apply(this, options); + return $.ajax(options); }, toJSON: function() { - var data = {queries: 0, notifications: 0, empty: false}; + var data = {queries: 0, notifications: 0}; this.map(function(task) { if (task.isNotification()) @@ -25,9 +29,6 @@ define(['jquery', 'backbone', 'underscore', 'app', 'models/InteractionTask'], data.queries++; }); - if (!data.queries && !data.notifications) - data.empty = true; - return data; }, diff --git a/module/web/static/js/models/InteractionTask.js b/module/web/static/js/models/InteractionTask.js index 4ba88a539..56fdbf8bf 100644 --- a/module/web/static/js/models/InteractionTask.js +++ b/module/web/static/js/models/InteractionTask.js @@ -1,5 +1,5 @@ -define(['jquery', 'backbone', 'underscore', 'utils/apitypes'], - function($, Backbone, _, Api) { +define(['jquery', 'backbone', 'underscore', 'app', 'utils/apitypes'], + function($, Backbone, _, App, Api) { return Backbone.Model.extend({ @@ -12,7 +12,9 @@ define(['jquery', 'backbone', 'underscore', 'utils/apitypes'], default_value: null, title: "", description: "", - plugin: "" + plugin: "", + // additional attributes + result: "" }, // Model Constructor @@ -20,8 +22,19 @@ define(['jquery', 'backbone', 'underscore', 'utils/apitypes'], }, + save: function(options) { + options = App.apiRequest('setInteractionResult/' + this.get('iid'), + {result: this.get('result')}, options); + + return $.ajax(options); + }, + isNotification: function() { return this.get('type') === Api.Interaction.Notification; + }, + + isCaptcha: function() { + return this.get('type') === Api.Interaction.Captcha; } }); }); \ No newline at end of file diff --git a/module/web/static/js/views/abstract/modalView.js b/module/web/static/js/views/abstract/modalView.js index 8f5a7ed0c..d3ac34bd6 100644 --- a/module/web/static/js/views/abstract/modalView.js +++ b/module/web/static/js/views/abstract/modalView.js @@ -32,7 +32,7 @@ define(['jquery', 'backbone', 'underscore', 'omniwindow'], function($, Backbone, }, render: function() { - this.$el.html(this.template({ content: this.renderContent().html()})); + this.$el.html(this.template(this.renderContent())); this.$el.addClass('modal hide'); this.$el.css({opacity: 0, scale: 0.7}); $("body").append(this.el); @@ -73,7 +73,7 @@ define(['jquery', 'backbone', 'underscore', 'omniwindow'], function($, Backbone, return this; }, renderContent: function() { - return $('

Content!

'); + return {content: $('

Content!

').html()}; }, show: function() { diff --git a/module/web/static/js/views/headerView.js b/module/web/static/js/views/headerView.js index b5b4a9d24..25127a337 100644 --- a/module/web/static/js/views/headerView.js +++ b/module/web/static/js/views/headerView.js @@ -158,6 +158,13 @@ define(['jquery', 'underscore', 'backbone', 'app', 'models/ServerStatus', 'colle if (data['@class'] === "ServerStatus") { // TODO: load interaction when none available this.status.set(data); + + // There tasks at the server, but not in queue: so fetch them + // or there are tasks in our queue but not on the server + if (this.status.get('notifications') && !this.notificationView.tasks.hasTaskWaiting() || + !this.status.get('notifications') && this.notificationView.tasks.hasTaskWaiting()) + this.notificationView.tasks.fetch(); + this.speeds = this.speeds.slice(1); this.speeds.push([this.speeds[this.speeds.length - 1][0] + 1, Math.floor(data.speed / 1024)]); diff --git a/module/web/static/js/views/linkGrabberModal.js b/module/web/static/js/views/linkGrabberModal.js index 3d9a886db..e2b6e985d 100644 --- a/module/web/static/js/views/linkGrabberModal.js +++ b/module/web/static/js/views/linkGrabberModal.js @@ -15,10 +15,6 @@ define(['jquery', 'underscore', 'app', 'views/abstract/modalView', 'text!tpl/def this.events = _.extend({}, modalView.prototype.events, this.events); }, - renderContent: function() { - return $('

Content!

'); - }, - addOnEnter: function(e) { if (e.keyCode != 13) return; this.addPackage(e); diff --git a/module/web/static/js/views/notificationView.js b/module/web/static/js/views/notificationView.js index 22c727304..afb542eed 100644 --- a/module/web/static/js/views/notificationView.js +++ b/module/web/static/js/views/notificationView.js @@ -1,5 +1,5 @@ define(['jquery', 'backbone', 'underscore', 'app', 'collections/InteractionList'], - function($, Backbone, _, App, InteractionList) { + function($, Backbone, _, App, InteractionList, queryModal) { // Renders context actions for selection packages and files return Backbone.View.extend({ @@ -12,10 +12,10 @@ define(['jquery', 'backbone', 'underscore', 'app', 'collections/InteractionList' }, tasks: null, - // current open task - current: null, // area is slided out visible: false, + // the dialog + modal: null, initialize: function() { this.tasks = new InteractionList(); @@ -40,7 +40,10 @@ define(['jquery', 'backbone', 'underscore', 'app', 'collections/InteractionList' }, render: function() { - this.$el.html(this.template(this.tasks.toJSON())); + + // only render when it will be visible + if (this.tasks.length > 0) + this.$el.html(this.template(this.tasks.toJSON())); if (this.tasks.length > 0 && !this.visible) { this.$el.slideOut(); @@ -55,6 +58,18 @@ define(['jquery', 'backbone', 'underscore', 'app', 'collections/InteractionList' }, openQuery: function() { + var self = this; + + _.requireOnce(['views/queryModal'], function(modalView) { + if (self.modal === null) { + self.modal = new modalView(); + self.modal.parent = self; + } + + self.modal.model = self.tasks.at(0); + self.modal.render(); + self.modal.show(); + }); }, diff --git a/module/web/static/js/views/queryModal.js b/module/web/static/js/views/queryModal.js new file mode 100644 index 000000000..5d1585a0d --- /dev/null +++ b/module/web/static/js/views/queryModal.js @@ -0,0 +1,54 @@ +define(['jquery', 'underscore', 'app', 'views/abstract/modalView', 'text!tpl/default/queryDialog.html'], + function($, _, App, modalView, template) { + return modalView.extend({ + + events: { + 'click .btn-success': 'submit', + 'submit form': 'submit' + }, + + model: null, + parent: null, + template: _.compile(template), + + initialize: function() { + // Inherit parent events + this.events = _.extend({}, modalView.prototype.events, this.events); + }, + + renderContent: function() { + var data = { + title: this.model.get('title'), + plugin: this.model.get('plugin'), + description: this.model.get('description') + }; + + if (this.model.isCaptcha()) { + var input = this.model.get('input').data; + data.captcha = input[0]; + data.type = input[1]; + } + + return data; + }, + + submit: function(e) { + e.stopPropagation(); + // TODO: different input types + // TODO: load next task + + this.model.set('result', this.$('input').val()); + var self = this; + this.model.save({success: function() { + self.hide(); + }}); + + this.$('input').val(''); + }, + + onShow: function() { + this.$('input').focus(); + } + + }); + }); \ No newline at end of file diff --git a/module/web/templates/default/backbone/modal.html b/module/web/templates/default/backbone/modal.html index d1186d40a..ed618f3d0 100755 --- a/module/web/templates/default/backbone/modal.html +++ b/module/web/templates/default/backbone/modal.html @@ -4,7 +4,7 @@
{% block content %} - <%= content %> + <% content %> {% endblock %}
diff --git a/module/web/templates/default/backbone/queryDialog.html b/module/web/templates/default/backbone/queryDialog.html new file mode 100755 index 000000000..a37ac6256 --- /dev/null +++ b/module/web/templates/default/backbone/queryDialog.html @@ -0,0 +1,25 @@ +{% extends 'default/backbone/modal.html' %} +{% block header %} + <% title %> + + <% plugin %> + +{% endblock %} +{% block content %} +
+ <% description %> +
+ <%= if captcha %> + +
+ +
+ <%/if%> + <% content %> +
+
+{% endblock %} +{% block buttons %} + Submit + Close +{% endblock %} \ No newline at end of file diff --git a/module/web/templates/default/base.html b/module/web/templates/default/base.html index dfcfb9e3a..846b396a0 100644 --- a/module/web/templates/default/base.html +++ b/module/web/templates/default/base.html @@ -50,11 +50,12 @@ <%/if%> +{# TODO: active animation #}
<%= if single %>
<% else %> -
+
<%/if%>
@@ -103,9 +104,6 @@ Notifications <% notifications %> <%/if%> - <%= if empty %> - Nothing to show - <%/if%> -- cgit v1.2.3