Commit e219e5f5 authored by Carsten  Rose's avatar Carsten Rose
Browse files

Merge remote-tracking branch 'origin/fabric-updates'

parents c137f0f3 a73bbf5a
Pipeline #928 passed with stage
in 1 minute and 47 seconds
<?xml version="1.0" encoding="UTF-8" standalone="no"?><svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 47.5 47.5" style="enable-background:new 0 0 47.5 47.5;" xml:space="preserve" version="1.1" id="svg2"><metadata id="metadata8"><rdf:RDF><cc:Work rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/></cc:Work></rdf:RDF></metadata><defs id="defs6"><clipPath id="clipPath16" clipPathUnits="userSpaceOnUse"><path id="path18" d="M 0,38 38,38 38,0 0,0 0,38 Z"/></clipPath></defs><g transform="matrix(1.25,0,0,-1.25,0,47.5)" id="g10"><g id="g12"><g clip-path="url(#clipPath16)" id="g14"><g transform="translate(5,26)" id="g20"><path id="path22" style="fill:#a0041e;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 0,-12.375 c 0,-2.042 1.093,-2.484 1.093,-2.484 0,0 9.752,-7.667 11.574,-9.099 1.821,-1.432 1.333,1.583 1.333,1.583 L 14,-11 0,0 Z"/></g><g transform="translate(33,26)" id="g24"><path id="path26" style="fill:#dd2e44;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 0,-12.375 c 0,-2.042 -1.063,-2.484 -1.063,-2.484 0,0 -9.767,-7.667 -11.588,-9.099 -1.823,-1.432 -1.349,1.583 -1.349,1.583 L -14,-11 0,0 Z"/></g><g transform="translate(20.2891,36.5)" id="g28"><path id="path30" style="fill:#ea596e;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c -0.753,0.61 -1.988,0.61 -2.742,0 l -11.982,-9.529 c -0.754,-0.61 -0.754,-1.607 0,-2.216 l 12.023,-9.647 c 0.755,-0.609 1.989,-0.609 2.743,0 l 12.104,9.731 c 0.753,0.609 0.753,1.606 0,2.216 L 0,0 Z"/></g><g transform="translate(22.416,26)" id="g32"><path id="path34" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c 0,-1.289 -1.306,-2.333 -2.916,-2.333 -1.611,0 -2.916,1.044 -2.916,2.333 0,1.289 1.305,2.333 2.916,2.333 C -1.306,2.333 0,1.289 0,0"/></g><g transform="translate(29.5439,16.4668)" id="g36"><path id="path38" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M 0,0 C -0.872,0 -1.375,0.902 -1.123,2.017 -0.872,3.13 0.039,4.033 0.911,4.033 1.784,4.033 2.287,3.13 2.035,2.017 1.784,0.902 0.872,0 0,0"/></g><g transform="translate(26.4541,11.2578)" id="g40"><path id="path42" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c -0.883,0 -1.392,0.949 -1.138,2.121 0.255,1.172 1.179,2.121 2.062,2.121 0.884,0 1.392,-0.949 1.138,-2.121 C 1.808,0.949 0.884,0 0,0"/></g><g transform="translate(23.0195,6.0508)" id="g44"><path id="path46" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c -0.838,0 -1.322,0.921 -1.08,2.058 0.242,1.136 1.118,2.057 1.957,2.057 0.839,0 1.322,-0.921 1.081,-2.057 C 1.716,0.921 0.839,0 0,0"/></g><g transform="translate(8.188,18.999)" id="g48"><path id="path50" style="fill:#e1e8ed;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c -0.994,0 -1.567,-1.007 -1.28,-2.249 0.286,-1.243 1.325,-2.25 2.319,-2.25 0.994,0 1.567,1.007 1.28,2.25 C 2.033,-1.007 0.994,0 0,0"/></g><g transform="translate(13.7715,11.5)" id="g52"><path id="path54" style="fill:#e1e8ed;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c -0.994,0 -1.567,-1.007 -1.281,-2.25 0.287,-1.242 1.326,-2.25 2.32,-2.25 0.994,0 1.567,1.008 1.28,2.25 C 2.033,-1.007 0.994,0 0,0"/></g><g transform="translate(19,1.25)" id="g56"><path id="path58" style="fill:#ea596e;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c -0.552,0 -1,0.482 -1,1.078 l 0,12.927 c 0,0.596 0.448,1.078 1,1.078 0.553,0 1,-0.482 1,-1.078 L 1,1.078 C 1,0.482 0.553,0 0,0"/></g></g></g></g></svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?><svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 47.5 47.5" style="enable-background:new 0 0 47.5 47.5;" xml:space="preserve" version="1.1" id="svg2" height="32px" width="32px"><metadata id="metadata8"><rdf:RDF><cc:Work rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/></cc:Work></rdf:RDF></metadata><defs id="defs6"><clipPath id="clipPath16" clipPathUnits="userSpaceOnUse"><path id="path18" d="M 0,38 38,38 38,0 0,0 0,38 Z"/></clipPath></defs><g transform="matrix(1.25,0,0,-1.25,0,47.5)" id="g10"><g id="g12"><g clip-path="url(#clipPath16)" id="g14"><g transform="translate(5,26)" id="g20"><path id="path22" style="fill:#a0041e;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 0,-12.375 c 0,-2.042 1.093,-2.484 1.093,-2.484 0,0 9.752,-7.667 11.574,-9.099 1.821,-1.432 1.333,1.583 1.333,1.583 L 14,-11 0,0 Z"/></g><g transform="translate(33,26)" id="g24"><path id="path26" style="fill:#dd2e44;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 0,-12.375 c 0,-2.042 -1.063,-2.484 -1.063,-2.484 0,0 -9.767,-7.667 -11.588,-9.099 -1.823,-1.432 -1.349,1.583 -1.349,1.583 L -14,-11 0,0 Z"/></g><g transform="translate(20.2891,36.5)" id="g28"><path id="path30" style="fill:#ea596e;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c -0.753,0.61 -1.988,0.61 -2.742,0 l -11.982,-9.529 c -0.754,-0.61 -0.754,-1.607 0,-2.216 l 12.023,-9.647 c 0.755,-0.609 1.989,-0.609 2.743,0 l 12.104,9.731 c 0.753,0.609 0.753,1.606 0,2.216 L 0,0 Z"/></g><g transform="translate(22.416,26)" id="g32"><path id="path34" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c 0,-1.289 -1.306,-2.333 -2.916,-2.333 -1.611,0 -2.916,1.044 -2.916,2.333 0,1.289 1.305,2.333 2.916,2.333 C -1.306,2.333 0,1.289 0,0"/></g><g transform="translate(29.5439,16.4668)" id="g36"><path id="path38" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M 0,0 C -0.872,0 -1.375,0.902 -1.123,2.017 -0.872,3.13 0.039,4.033 0.911,4.033 1.784,4.033 2.287,3.13 2.035,2.017 1.784,0.902 0.872,0 0,0"/></g><g transform="translate(26.4541,11.2578)" id="g40"><path id="path42" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c -0.883,0 -1.392,0.949 -1.138,2.121 0.255,1.172 1.179,2.121 2.062,2.121 0.884,0 1.392,-0.949 1.138,-2.121 C 1.808,0.949 0.884,0 0,0"/></g><g transform="translate(23.0195,6.0508)" id="g44"><path id="path46" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c -0.838,0 -1.322,0.921 -1.08,2.058 0.242,1.136 1.118,2.057 1.957,2.057 0.839,0 1.322,-0.921 1.081,-2.057 C 1.716,0.921 0.839,0 0,0"/></g><g transform="translate(8.188,18.999)" id="g48"><path id="path50" style="fill:#e1e8ed;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c -0.994,0 -1.567,-1.007 -1.28,-2.249 0.286,-1.243 1.325,-2.25 2.319,-2.25 0.994,0 1.567,1.007 1.28,2.25 C 2.033,-1.007 0.994,0 0,0"/></g><g transform="translate(13.7715,11.5)" id="g52"><path id="path54" style="fill:#e1e8ed;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c -0.994,0 -1.567,-1.007 -1.281,-2.25 0.287,-1.242 1.326,-2.25 2.32,-2.25 0.994,0 1.567,1.008 1.28,2.25 C 2.033,-1.007 0.994,0 0,0"/></g><g transform="translate(19,1.25)" id="g56"><path id="path58" style="fill:#ea596e;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c -0.552,0 -1,0.482 -1,1.078 l 0,12.927 c 0,0.596 0.448,1.078 1,1.078 0.553,0 1,-0.482 1,-1.078 L 1,1.078 C 1,0.482 0.553,0 0,0"/></g></g></g></g></svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?><svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 47.5 47.5" style="enable-background:new 0 0 47.5 47.5;" xml:space="preserve" version="1.1" id="svg2"><metadata id="metadata8"><rdf:RDF><cc:Work rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/></cc:Work></rdf:RDF></metadata><defs id="defs6"><clipPath id="clipPath16" clipPathUnits="userSpaceOnUse"><path id="path18" d="M 0,38 38,38 38,0 0,0 0,38 Z"/></clipPath></defs><g transform="matrix(1.25,0,0,-1.25,0,47.5)" id="g10"><g id="g12"><g clip-path="url(#clipPath16)" id="g14"><g transform="translate(6,32)" id="g20"><path id="path22" style="fill:#ffac33;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M 0,0 6,0 C 7.104,0 8,0.104 8,-1 L 8,1 C 8,2.104 7.104,3 6,3 l -8,0 c -2,0 -3.583,-2.125 -3,-5 0,0 1.791,-9.375 1.917,-9.958 C -2.75,-13.5 -0.958,-15 0.958,-15 l 6.959,0 C 9.021,-15 8,-13.104 8,-12 l 0,2 c 0,-1.104 -0.896,-2 -2,-2 l -4,0 c -1.104,0 -1.833,1.042 -2,2 -0.167,0.958 -1.583,7.333 -1.583,7.333 C -1.917,-0.75 -1.104,0 0,0"/></g><g transform="translate(31.8125,32)" id="g24"><path id="path26" style="fill:#ffac33;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 -6,0 c -1.104,0 -2.813,0.104 -2.813,-1 l 0,2 c 0,1.104 1.709,2 2.813,2 l 8,0 c 2,0 3.584,-2.125 3,-5 0,0 -1.633,-9.419 -1.771,-10 -0.354,-1.5 -2.042,-3 -4,-3 l -7.145,0 c -1.105,0 -0.897,1.896 -0.897,3 l 0,2 c 0,-1.104 1.709,-2 2.813,-2 l 4,0 c 1.104,0 1.834,1.042 2,2 0.166,0.958 1.584,7.333 1.584,7.333 C 1.916,-0.75 1.104,0 0,0"/></g><g transform="translate(21.709,15)" id="g28"><path id="path30" style="fill:#ffac33;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c 0,6.958 -2.709,0 -2.709,0 0,0 -3,6.958 -3,0 C -5.709,-6.958 -9,-10 -9,-10 l 6.291,0 6,0 C 3.291,-10 0,-6.958 0,0"/></g><g transform="translate(30,30.4233)" id="g32"><path id="path34" style="fill:#ffcc4d;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c 0,-6.775 -6.77,-18.192 -11,-18.192 -4.231,0 -11,11.417 -11,18.192 0,5.195 1,6.319 3,6.319 1.374,0 6.025,0.027 8,0.027 1.391,0 5.914,0.002 7,0.002 2.917,0 4,-0.685 4,-6.348"/></g><g transform="translate(28,4)" id="g36"><path id="path38" style="fill:#c1694f;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c 0,-1.104 0.104,-2 -1,-2 l -16,0 c -1.104,0 -1,0.896 -1,2 l 0,1 c 0,1.104 1.042,2 2.083,2 L -2,3 C -0.958,3 0,2.104 0,1 L 0,0 Z"/></g><g transform="translate(30,2.375)" id="g40"><path id="path42" style="fill:#c1694f;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c 0,-0.76 0.042,-1.375 -1.375,-1.375 l -19.25,0 C -21.917,-1.375 -22,-0.76 -22,0 l 0,0.25 c 0,0.76 0.616,1.375 1.375,1.375 l 19.25,0 C -0.615,1.625 0,1.01 0,0.25 L 0,0 Z"/></g></g></g></g></svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?><svg width="32px" height="32px" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 47.5 47.5" style="enable-background:new 0 0 47.5 47.5;" xml:space="preserve" version="1.1" id="svg2"><metadata id="metadata8"><rdf:RDF><cc:Work rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/></cc:Work></rdf:RDF></metadata><defs id="defs6"><clipPath id="clipPath16" clipPathUnits="userSpaceOnUse"><path id="path18" d="M 0,38 38,38 38,0 0,0 0,38 Z"/></clipPath></defs><g transform="matrix(1.25,0,0,-1.25,0,47.5)" id="g10"><g id="g12"><g clip-path="url(#clipPath16)" id="g14"><g transform="translate(6,32)" id="g20"><path id="path22" style="fill:#ffac33;fill-opacity:1;fill-rule:nonzero;stroke:none" d="M 0,0 6,0 C 7.104,0 8,0.104 8,-1 L 8,1 C 8,2.104 7.104,3 6,3 l -8,0 c -2,0 -3.583,-2.125 -3,-5 0,0 1.791,-9.375 1.917,-9.958 C -2.75,-13.5 -0.958,-15 0.958,-15 l 6.959,0 C 9.021,-15 8,-13.104 8,-12 l 0,2 c 0,-1.104 -0.896,-2 -2,-2 l -4,0 c -1.104,0 -1.833,1.042 -2,2 -0.167,0.958 -1.583,7.333 -1.583,7.333 C -1.917,-0.75 -1.104,0 0,0"/></g><g transform="translate(31.8125,32)" id="g24"><path id="path26" style="fill:#ffac33;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 -6,0 c -1.104,0 -2.813,0.104 -2.813,-1 l 0,2 c 0,1.104 1.709,2 2.813,2 l 8,0 c 2,0 3.584,-2.125 3,-5 0,0 -1.633,-9.419 -1.771,-10 -0.354,-1.5 -2.042,-3 -4,-3 l -7.145,0 c -1.105,0 -0.897,1.896 -0.897,3 l 0,2 c 0,-1.104 1.709,-2 2.813,-2 l 4,0 c 1.104,0 1.834,1.042 2,2 0.166,0.958 1.584,7.333 1.584,7.333 C 1.916,-0.75 1.104,0 0,0"/></g><g transform="translate(21.709,15)" id="g28"><path id="path30" style="fill:#ffac33;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c 0,6.958 -2.709,0 -2.709,0 0,0 -3,6.958 -3,0 C -5.709,-6.958 -9,-10 -9,-10 l 6.291,0 6,0 C 3.291,-10 0,-6.958 0,0"/></g><g transform="translate(30,30.4233)" id="g32"><path id="path34" style="fill:#ffcc4d;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c 0,-6.775 -6.77,-18.192 -11,-18.192 -4.231,0 -11,11.417 -11,18.192 0,5.195 1,6.319 3,6.319 1.374,0 6.025,0.027 8,0.027 1.391,0 5.914,0.002 7,0.002 2.917,0 4,-0.685 4,-6.348"/></g><g transform="translate(28,4)" id="g36"><path id="path38" style="fill:#c1694f;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c 0,-1.104 0.104,-2 -1,-2 l -16,0 c -1.104,0 -1,0.896 -1,2 l 0,1 c 0,1.104 1.042,2 2.083,2 L -2,3 C -0.958,3 0,2.104 0,1 L 0,0 Z"/></g><g transform="translate(30,2.375)" id="g40"><path id="path42" style="fill:#c1694f;fill-opacity:1;fill-rule:nonzero;stroke:none" d="m 0,0 c 0,-0.76 0.042,-1.375 -1.375,-1.375 l -19.25,0 C -21.917,-1.375 -22,-0.76 -22,0 l 0,0.25 c 0,0.76 0.616,1.375 1.375,1.375 l 19.25,0 C -0.615,1.625 0,1.01 0,0.25 L 0,0 Z"/></g></g></g></g></svg>
......@@ -19,7 +19,7 @@ var QfqNS = QfqNS || {};
'use strict';
/**
* Dragging and dropping area!
*
*/
n.DragAndDrop = function ($hook) {
this.$container = $hook;
......@@ -266,5 +266,4 @@ var QfqNS = QfqNS || {};
}
};
})(QfqNS);
\ No newline at end of file
/**
* @author Benjamin Baer <benjamin.baer@math.uzh.ch>
*/
/* global $ */
/* global EventEmitter */
/* @depend QfqEvents.js */
/* @depend Alert.js */
/* @depend Element/ElementBuilder.js */
/**
* Qfq Namespace
*
* @namespace QfqNS
*/
var QfqNS = QfqNS || {};
(function (n) {
n.Droplet = function (url, color) {
this._$trigger = {};
this.position = {};
this._$container = {};
this.visible = false;
this.eventEmitter = new EventEmitter();
this.content = {};
this.forms = [];
this.url = url;
this.color = color;
};
n.Droplet.prototype.on = n.EventEmitter.onMixin;
n.Droplet.prototype.setTrigger = function($trigger) {
this._$trigger = $trigger;
var that = this;
this._$trigger.click(function() {that.toggleDroplet();});
};
n.Droplet.prototype.setContainer = function($container) {
this._$container = $container;
};
n.Droplet.prototype.setPosition = function(left, top) {
this.position = {
left: left,
top: top
};
};
n.Droplet.prototype.getContent = function() {
var that = this;
var response = jQuery.getJSON(this.url, function(data) {
that._processResponse(data);
});
this._$container.text("Getting Data...");
};
n.Droplet.prototype._processResponse = function(data) {
this._$container.text('');
for(var i=0; i < data.elements.length; i++) {
var element = data.elements[i];
var $element = new n.ElementBuilder(element);
this._$container.append($element.display());
var that = this;
if (element.type === "form") this.forms.push($element);
}
this.forms[0].on('form.submit.success',
function() { that.toggleDroplet(); });
};
n.Droplet.prototype.createContainerBellowTrigger = function () {
this.setPosition(
this._$trigger.offset().left,
this._$trigger.offset().top + this._$trigger.outerHeight()
);
var $container = $("<div />", {
class: "qfq-droplet-container qfq-droplet-" + this.color
});
$container.css({
position: 'absolute',
zIndex: '100',
top: this.position.top + 10 + "px",
left: this.position.left + "px"
});
$(document.body).append($container);
$container.addClass("qfq-droplet-container");
$container.hide();
return $container;
};
n.Droplet.prototype.getContainer = function() {
if (this._$container) {
console.error("No container has been created");
} else {
return this._$container;
}
};
n.Droplet.prototype.toggleDroplet = function () {
if (this.visible) {
this._$container.hide();
this.visible = false;
this.forms = [];
} else {
this.eventEmitter.emitEvent('droplet.toggle',
n.EventEmitter.makePayload(this, "toggle"));
this._$container.show();
this.visible = true;
if (this.url) {
this.getContent();
}
}
};
n.Droplet.prototype.hideDroplet = function() {
if (this.visible) {
this._$container.hide();
this.visible = false;
}
};
})(QfqNS);
/**
* @author Benjamin Baer <benjamin.baer@math.uzh.ch>
*/
/* global $ */
/* global EventEmitter */
/* @depend QfqEvents.js */
/* @depend Alert.js */
/* @depend Droplet.js */
/**
* Qfq Namespace
*
* @namespace QfqNS
*/
var QfqNS = QfqNS || {};
(function (n) {
'use strict';
n.DropletController = function() {
this.droplets = [];
this.eventEmitter = new EventEmitter();
};
n.DropletController.prototype.setUpDroplets = function() {
var that = this;
$(".qfq-droplet").each(function() {
var url = false;
var color = "grey";
if ($(this).data("content")) {
url = $(this).data("content");
}
if ($(this).data("color")) {
color = $(this).data("color");
}
var droplet = new QfqNS.Droplet(url, color);
droplet.setTrigger($(this));
droplet.setContainer(droplet.createContainerBellowTrigger());
that.droplets.push(droplet);
droplet.on('droplet.toggle', function() { that.hideDroplets(); });
});
};
n.DropletController.prototype.getDroplet = function(reference) {
if (reference < this.droplets.length && reference >= 0) {
return this.droplets[reference];
}
};
n.DropletController.prototype.hideDroplets = function() {
for(var i=0; i < this.droplets.length; i++) {
this.droplets[i].hideDroplet();
}
};
})(QfqNS);
\ No newline at end of file
/**
* @author Benjamin Baer <benjamin.baer@math.uzh.ch>
*/
/* global $ */
/* global EventEmitter */
/* @depend ../QfqEvents.js */
/**
* Qfq Namespace
*
* @namespace QfqNS
*/
var QfqNS = QfqNS || {};
(function (n) {
'use strict';
n.ElementBuilder = function(obj, parent) {
this.type = obj.type;
this.class = obj.class || false;
this.text = obj.text || false;
this.tooltip = obj.tooltip || false;
this.label = obj.label || false;
this.value = obj.value || false;
this.width = obj.width || false;
this.name = obj.name || false;
this.onClick = obj.onClick || false;
this.parent = parent || false;
this.submitTo = obj.submitTo || false;
this.checked = obj.checked || false;
this.$element = {};
this.children = [];
this.eventEmitter = new EventEmitter();
if (obj.children) {
for (var i = 0; i < obj.children.length; i++) {
var iparent = this;
if (this.type !== "form") {
iparent = this.parent;
}
var element = new n.ElementBuilder(obj.children[i], iparent);
this.children.push(element);
}
}
};
n.ElementBuilder.prototype.on = n.EventEmitter.onMixin;
n.ElementBuilder.prototype.display = function() {
var $element = {};
if (this.type === "form") {
$element = this._buildForm();
var that = this;
$element.submit(function(event) {
event.preventDefault();
that.handleSubmit();
});
this.$form = $element;
}
if (this.type === "row") $element = this._buildRow();
if (this.type === "checkbox" ||
this.type === "radio" ||
this.type === "hidden") $element = this._buildInput();
if (this.type === "label") $element = this._buildLabel();
if (this.children) {
for (var i = 0; i < this.children.length; i++) {
var $child = this.children[i].display();
$element.append($child);
}
}
this.$element = $element;
return $element;
};
n.ElementBuilder.prototype._buildRow = function() {
var options = {
class: "row" + this._getOption(this.class),
text: this._getOption(this.text)
};
return $("<div />", options);
};
n.ElementBuilder.prototype._buildInput = function() {
var $block = {};
if (this.type !== "hidden") {
$block = this._buildBlock(this.width);
}
var options = {
class: this._getOption(this.class),
type: this._getOption(this.type),
name: this._getOption(this.name),
value: this._getOption(this.value)
};
if (this.type === "checkbox" || this.type === "radio") {
options.checked = this.checked;
}
var $input = $("<input />", options);
if (this.onClick === "submit") {
var that = this;
$input.on("click", function() {
that.submit();
});
}
if (this.type !== "hidden") {
$block.append($input);
return $block;
} else {
return $input;
}
};
n.ElementBuilder.prototype._buildLabel = function() {
var $block = this._buildBlock(this.width, "qfq-label");
var options = {
class: "control-label" + this._prepareClass(this.class, true),
text: this._getOption(this.text)
};
var $label = $("<span />", options);
$block.append($label);
return $block;
};
n.ElementBuilder.prototype._buildBlock = function(size, cssClass) {
var options = {
class: "col-md-" + size + this._prepareClass(cssClass, true)
};
return $("<div />", options);
};
n.ElementBuilder.prototype._prepareClass = function(value, isAddition) {
if (isAddition) return " " + value;
return "" + value;
};
n.ElementBuilder.prototype._buildForm = function() {
return $("<form />");
};
n.ElementBuilder.prototype._getOption = function(o) {
if (o !== undefined && o) {
return o;
} else {
return "";
}
};
n.ElementBuilder.prototype.submit = function() {
if (this.type !== "form") {
this.parent.$element.submit();
} else {
this.$element.submit();
}
};
n.ElementBuilder.prototype.handleSubmit = function() {
$.post(this.submitTo, this.$element.serialize())
.done(this.submitSuccessHandler.bind(this))
.fail(this.submitFailureHandler.bind(this));
};
n.ElementBuilder.prototype.submitSuccessHandler = function(data, textStatus, jqXHR) {
var configuration = data['element-update'];
n.ElementUpdate.updateAll(configuration);
this.eventEmitter.emitEvent('form.submit.success',
n.EventEmitter.makePayload(this, "submit"));
};
n.ElementBuilder.prototype.submitFailureHandler = function (data, textStatus, jqXHR) {
console.error("Submit failed");
};
})(QfqNS);
......@@ -20,6 +20,7 @@ $(function (n) {
this.parentElement = {};
this.rotation = 0;
this.controlElement = $('<div>', {
class: 'qfq-fabric-bar',
id: 'qfq-fabric-control'
});
this.emojiContainer = {};
......@@ -86,7 +87,7 @@ $(function (n) {
ModeSettings.prototype.setUpButtons = function() {
var $controlWrapper = this.qFabric.controlElement;
var $buttonGroup = $("<div>", {class: "btn-group"});
var $buttonGroup = $("<div>", {class: "btn-group pull-left"});
var that = this;
this.myModes.modes.forEach(function(o) {
var $button = $("<button>", {
......@@ -112,7 +113,7 @@ $(function (n) {
$controlWrapper.append($buttonGroup);
var $colorSelector = $("<div>", {class: "color-picker"});
var $colorSelector = $("<div>", {class: "color-picker pull-right"});
$controlWrapper.append($colorSelector);
if (this.myModes.colors instanceof Array) {
this.myModes.colors.forEach(function (o) {
......@@ -235,6 +236,7 @@ $(function (n) {
$emojiField.append($img);
$img.on("dragstart", function() {
that.qFabric.dragAndDrop = true;
//that.qFabric.parentElement.css('cursor', 'url("' + o.url + '"), auto');
that.qFabric.dndData = o.url;
});
})
......@@ -262,6 +264,7 @@ $(function (n) {
this.outputField = $("#" + inputField);
this.imageOutput = $("#" + imageOutput);
this.getMeta(this.backgroundImage, function(width, height) { that.prepareImageEditor(width, height);});
var jsonButtons = $fabricElement.data('buttons');
this.modeSettings.initialize(this, jsonButtons);
} else {
this.outputField = $("#" + inputField);
......
......@@ -209,6 +209,23 @@ select.qfq-locked:invalid {
}
// Fabric Plugin classes
.qfq-fabric-bar {
position: -webkit-sticky;
position: sticky;
top: 0;
width: 100%;
min-height: 41px;
z-index: 100;
border: 1px solid #ccc;
background-color: #ededed;
padding: 5px;
}
.qfq-fabric-bar .btn {
padding: 3px 8px;
}
.fabric-text {
width: 100%;
height: 80px;
......@@ -228,7 +245,7 @@ select.qfq-locked:invalid {
}
.color-picker {
margin-top: 5px;
margin-top: 2px;
}
.color-picker > button {
......@@ -669,4 +686,55 @@ select.qfq-locked:invalid {
.qfqTargetDisplay {
border: 1px dashed #25adf1;
}
// Droplets
.qfq-droplet-container {
position: absolute;
border-radius: 6px;
padding: 15px;
}
.qfq-droplet-container:before {
content: ' ';
position: absolute;
left: 10px;
top: -10px;
border: 5px solid;
}
.qfq-droplet-container:after {
content: ' ';
position: absolute;
left: 20px;
top: -10px;
border: 5px solid;
}
.qfq-droplet-grey {
border: 2px solid #ccc;
background-image: linear-gradient(to bottom,#f0f0f0 0,#e0e0e0 100%);
box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 1px rgba(0,0,0,.075);
}
.qfq-droplet-container.qfq-droplet-grey:after {
border-color: transparent transparent #ccc #ccc;
}
.qfq-droplet-container.qfq-droplet-grey:before {
border-color: transparent #ccc #ccc transparent;
}
.qfq-droplet-blue {
border: 2px solid #25adf1;
background-image: linear-gradient(to bottom,#d9edf7 0,#b9def0 100%);
}
.qfq-droplet-container.qfq-droplet-blue:after {
border-color: transparent transparent #25adf1 #25adf1;
}
.qfq-droplet-container.qfq-droplet-blue:before {
border-color: transparent #25adf1 #25adf1 transparent;
}
\ No newline at end of file
{
"status": "ok",
"message": "Success",
"element-update": {
"div": "bla"
}
}
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="../css/bootstrap.min.css">
<link rel="stylesheet" href="../css/bootstrap-theme.min.css">
<link rel="stylesheet" href="../css/jqx.base.css">
<link rel="stylesheet" href="../css/jqx.bootstrap.css">
<link rel="stylesheet" href="../extension/Resources/Public/Css/qfq-bs.css">
<title>Input Mode Switcher</title>
</head>
<body>
<div class="container-fluid">
<div class="row">
<div class="col-md-10 ">
<div class="btn-toolbar pull-right" role="toolbar">
<div class="btn-group" role="group">
<button id="save-button" type="button" class="btn btn-default navbar-btn"><span
class="glyphicon glyphicon-ok"></span></button>
<button id="close-button" type="button" class="btn btn-default navbar-btn"><span
class="glyphicon glyphicon-remove"></span></button>
</div>
<div class="btn-group" role="group">
<button id="delete-button" type="button" class="btn btn-default navbar-btn"><span
class="glyphicon glyphicon-trash"></span></button>
</div>
<div class="btn-group" role="group">
<a id="form-new-button" href="personmock.html?s=badcaffe1" class="btn btn-default navbar-btn"><span
class="glyphicon glyphicon-plus"></span></a>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-4">
<!--
Class qfq-droplet so that process starts
Color: grey, blue, green, orange, red
-->
<button
id="i343"
class="btn btn-primary qfq-droplet"
data-content="mockData/checkboxlist.json"
data-color="blue"
>
Test
</button>
<button
id="i344"
class="btn btn-default qfq-droplet"
style="position: relative; left: 30px; top: 90px;"
data-content="mockData/checkboxlist.json"