Merge remote-tracking branch 'upstream/master'

5 files changed, 77 insertions, 3 deletions

diff --git a/pyload/web/app/scripts/views/input/clickInput.js b/pyload/web/app/scripts/views/input/clickInput.js
new file mode 100644
index 000000000..ca8a954b8
--- /dev/null
+++ b/pyload/web/app/scripts/views/input/clickInput.js
@@ -0,0 +1,43 @@
+define(['jquery', 'backbone', 'underscore', 'helpers/gettext', './inputView'], function($, Backbone, _, gettext, inputView) {
+    'use strict';
+
+    return inputView.extend({
+
+        tagName: 'input',
+        events: {
+            'keyup': 'onChange',
+            'focus': 'showTooltip',
+            'focusout': 'hideTooltip'
+        },
+
+        renderInput: function() {
+            this.$el.attr('disabled', 'on');
+            this.$el.attr('type', 'text');
+            this.$el.attr('name', 'textInput');
+
+            if (this.default_value)
+                this.$el.attr('placeholder', this.default_value);
+            else
+                this.$el.attr('placeholder', gettext('Please click on the right position in the captcha.'));
+
+            if (this.value)
+                this.$el.val(this.value);
+
+            return this;
+        },
+
+        onClick: function(x,y) {
+            this.$el.val(x + ',' + y);
+            this.onChange();
+        },
+
+        clear: function() {
+            this.$el.val('');
+        },
+
+        onChange: function(e) {
+            this.setVal(this.$el.val());
+        }
+
+    });
+});
diff --git a/pyload/web/app/scripts/views/input/inputLoader.js b/pyload/web/app/scripts/views/input/inputLoader.js
index 04d591d30..c28572c6c 100644
--- a/pyload/web/app/scripts/views/input/inputLoader.js
+++ b/pyload/web/app/scripts/views/input/inputLoader.js
@@ -1,8 +1,13 @@
-define(['./textInput'], function(textInput) {
+define(['utils/apitypes', './textInput', './clickInput'], function(Api, textInput, clickInput) {
     'use strict';
 
     // selects appropriate input element
     return function(input) {
+        console.log('Select input', input);
+
+        if (input.type == Api.InputType.Click)
+            return clickInput;
+
         return textInput;
     };
 });
\ No newline at end of file
diff --git a/pyload/web/app/scripts/views/input/inputView.js b/pyload/web/app/scripts/views/input/inputView.js
index 1860fcaf1..394e33aef 100644
--- a/pyload/web/app/scripts/views/input/inputView.js
+++ b/pyload/web/app/scripts/views/input/inputView.js
@@ -38,6 +38,11 @@ define(['jquery', 'backbone', 'underscore'], function($, Backbone, _) {
             return this;
         },
 
+        // triggered by captcha clicks
+        onClick: function(x,y) {
+
+        },
+
         renderInput: function() {
             // Overwrite this
         },
diff --git a/pyload/web/app/scripts/views/queryModal.js b/pyload/web/app/scripts/views/queryModal.js
index ce624814a..6877687b3 100644
--- a/pyload/web/app/scripts/views/queryModal.js
+++ b/pyload/web/app/scripts/views/queryModal.js
@@ -1,9 +1,12 @@
-define(['jquery', 'underscore', 'app', 'views/abstract/modalView', './input/inputLoader', 'hbs!tpl/dialogs/interactionTask'],
-    function($, _, App, modalView, load_input, template) {
+define(['jquery', 'underscore', 'app', 'utils/apitypes', 'views/abstract/modalView', './input/inputLoader', 'hbs!tpl/dialogs/interactionTask'],
+    function($, _, App, Api, modalView, load_input, template) {
         'use strict';
         return modalView.extend({
 
+            className: 'query-modal',
+
             events: {
+                'click #captchaImage': 'onClick',
                 'click .btn-success': 'submit',
                 'submit form': 'submit'
             },
@@ -40,10 +43,22 @@ define(['jquery', 'underscore', 'app', 'views/abstract/modalView', './input/inpu
                 var input = this.model.get('input');
                 var InputView = load_input(input);
                 this.input = new InputView({input: input});
+                if (input.type == Api.InputType.Click)
+                    this.$('#captchaImage').css('cursor', 'crosshair');
+
                 // only renders after wards
                 this.$('#inputField').append(this.input.render().el);
             },
 
+            onClick: function(e) {
+                var el = $(e.target);
+                var posX = el.offset().left,
+                    posY = el.offset().top;
+
+                 // TODO: calculate image size, scale positions to displayed / real image size
+                this.input.onClick(Math.round(e.pageX - posX), Math.round(e.pageY - posY));
+            },
+
             submit: function(e) {
                 e.stopPropagation();
                 // TODO: load next task
diff --git a/pyload/web/app/styles/default/style.less b/pyload/web/app/styles/default/style.less
index ad60e5b59..fb441b882 100644
--- a/pyload/web/app/styles/default/style.less
+++ b/pyload/web/app/styles/default/style.less
@@ -222,6 +222,12 @@ header { //  background-color: @greyDark;
 
 }
 
+.query-modal {
+  img {
+    max-width: none;
+  }
+}
+
 /*
    Actionbar
 */