Commit 05f125a6 authored by Rafael Ostertag's avatar Rafael Ostertag
Browse files

Refactored Element.js, i.e. deleted it, since it has been degenerated to a...

Refactored Element.js, i.e. deleted it, since it has been degenerated to a proxy object, with no added value.
parent 4585cecd
......@@ -2,7 +2,7 @@
* @author Rafael Ostertag <rafael.ostertag@math.uzh.ch>
*/
/* @depend Element.js */
/* @depend FormGroup.js */
if (!QfqNS) {
var QfqNS = {};
......@@ -22,22 +22,22 @@ if (!QfqNS.Element) {
* @constructor
*/
function Checkbox($element) {
n.Element.call(this, $element);
n.FormGroup.call(this, $element);
if (!this.isType("checkbox")) {
throw new Error("$element is not of type 'checkbox'");
}
}
Checkbox.prototype = Object.create(n.Element.prototype);
Checkbox.prototype = Object.create(n.FormGroup.prototype);
Checkbox.prototype.constructor = Checkbox;
Checkbox.prototype.setValue = function (val) {
this.formGroup.$element.prop('checked', val);
this.$element.prop('checked', val);
};
Checkbox.prototype.getValue = function () {
return this.formGroup.$element.prop('checked');
return this.$element.prop('checked');
};
n.Checkbox = Checkbox;
......
/**
* @author Rafael Ostertag <rafael.ostertag@math.uzh.ch>
*/
/* global $ */
if (!QfqNS) {
var QfqNS = {};
}
if (!QfqNS.Element) {
QfqNS.Element = {};
}
(function (n) {
'use strict';
/**
* The Form element.
*
* It is not intended to be used directly. Use the specialized Objects such as Text and Radio.
*
* Its sole purpose is, to provide the means to check the type of $element
*
* @param $element {jQuery} jQuery object representing the Form Control.
*
* @constructor
*/
n.Element = function ($element) {
if (!$element || $element.length === 0) {
throw new Error("No element");
}
this.formGroup = new n.FormGroup($element);
};
/**
*
* @param type
* @returns {boolean}
*
* @protected
*/
n.Element.prototype.isType = function (type) {
var lowerCaseType = type.toLowerCase();
var isOfType = true;
this.formGroup.$element.each(function () {
if (this.hasAttribute('type')) {
if (this.getAttribute('type') === lowerCaseType) {
return true;
} else {
isOfType = false;
return false;
}
} else {
// <select> is not an attribute value, obviously, so check for nodename
if (this.nodeName.toLowerCase() === lowerCaseType) {
return true;
} else if (lowerCaseType === 'text') {
return true;
} else {
isOfType = false;
return false;
}
}
});
return isOfType;
};
n.Element.prototype.setReadOnly = function (readOnly) {
this.formGroup.setReadOnly(readOnly);
};
n.Element.prototype.setEnabled = function (enabled) {
this.formGroup.setEnabled(enabled);
};
})(QfqNS.Element);
\ No newline at end of file
......@@ -16,7 +16,7 @@ if (!QfqNS.Element) {
/**
* Form Group represents a `<input>/<select>` element including the label and help block.
*
* It is not meant to be used directly. Use Element instead.
* It is not meant to be used directly. Use the specialized objects instead.
*
* @param $enclosedElement {jQuery} a jQuery object contained in the Form Group. It used to find the enclosing
* HTML element having the `.form-group` class assigned.
......@@ -35,6 +35,33 @@ if (!QfqNS.Element) {
this.$helpBlock = this.$formGroup.find(".help-block");
};
n.FormGroup.prototype.isType = function (type) {
var lowerCaseType = type.toLowerCase();
var isOfType = true;
this.$element.each(function () {
if (this.hasAttribute('type')) {
if (this.getAttribute('type') === lowerCaseType) {
return true;
} else {
isOfType = false;
return false;
}
} else {
// <select> is not an attribute value, obviously, so check for nodename
if (this.nodeName.toLowerCase() === lowerCaseType) {
return true;
} else if (lowerCaseType === 'text') {
return true;
} else {
isOfType = false;
return false;
}
}
});
return isOfType;
};
/**
*
* @param $enclosedElement
......
......@@ -20,23 +20,23 @@ if (!QfqNS.Element) {
* @constructor
*/
function Radio($element) {
n.Element.call(this, $element);
n.FormGroup.call(this, $element);
if (!this.isType("radio")) {
throw new Error("$element is not of type 'radio'");
}
}
Radio.prototype = Object.create(n.Element.prototype);
Radio.prototype = Object.create(n.FormGroup.prototype);
Radio.prototype.constructor = Radio;
Radio.prototype.setValue = function (val) {
this.formGroup.$element.prop('checked', false);
this.formGroup.$element.filter('[value=' + val + "]").prop('checked', true);
this.$element.prop('checked', false);
this.$element.filter('[value=' + val + "]").prop('checked', true);
};
Radio.prototype.getValue = function () {
return this.formGroup.$element.filter(':checked').val();
return this.$element.filter(':checked').val();
};
n.Radio = Radio;
......
......@@ -22,14 +22,14 @@ if (!QfqNS.Element) {
* @constructor
*/
function Select($element) {
n.Element.call(this, $element);
n.FormGroup.call(this, $element);
if (!this.isType("select")) {
throw new Error("$element is not of type 'select'");
}
}
Select.prototype = Object.create(n.Element.prototype);
Select.prototype = Object.create(n.FormGroup.prototype);
Select.prototype.constructor = Select;
/**
......@@ -42,7 +42,7 @@ if (!QfqNS.Element) {
if (['string', 'number'].indexOf(typeof(val)) !== -1) {
this.setSelection(val);
} else if (Array.isArray(val)) {
this.formGroup.$element.empty();
this.$element.empty();
// Fill array with new <select> elements first and add it to the dom in one step, instead of appending
// each '<select>' separately.
......@@ -54,7 +54,7 @@ if (!QfqNS.Element) {
.append(selectObj.text);
selectArray.push($option);
});
this.formGroup.$element.append(selectArray);
this.$element.append(selectArray);
} else {
throw Error('Unsupported type of argument in Select.setValue: "' + typeof(val) + '". Expected either' +
' "string" or "array"');
......@@ -72,11 +72,11 @@ if (!QfqNS.Element) {
// First, see if we find an <option> tag having an attribute 'value' matching val. If that doesn't work,
// fall back to comparing text content of <option> tags.
var $selectionByValue = this.formGroup.$element.find('option[value=' + val + ']');
var $selectionByValue = this.$element.find('option[value=' + val + ']');
if ($selectionByValue.length > 0) {
$selectionByValue.prop('selected', true);
} else {
this.formGroup.$element.find('option').each(function () {
this.$element.find('option').each(function () {
var $element = $(this);
if ($element.text() === val) {
$element.prop('selected', true);
......@@ -91,14 +91,14 @@ if (!QfqNS.Element) {
* @private
*/
Select.prototype.clearSelection = function () {
this.formGroup.$element.find(':selected').each(function () {
this.$element.find(':selected').each(function () {
$(this).prop('selected', false);
});
};
Select.prototype.getValue = function () {
var returnValue = [];
this.formGroup.$element.find(':selected').each(
this.$element.find(':selected').each(
function () {
if (this.hasAttribute('value')) {
returnValue.push(this.getAttribute('value'));
......
......@@ -20,22 +20,22 @@ if (!QfqNS.Element) {
* @constructor
*/
function Text($element) {
n.Element.call(this, $element);
n.FormGroup.call(this, $element);
if (!this.isType("text")) {
throw new Error("$element is not of type 'text'");
}
}
Text.prototype = Object.create(n.Element.prototype);
Text.prototype = Object.create(n.FormGroup.prototype);
Text.prototype.constructor = Text;
Text.prototype.setValue = function (val) {
this.formGroup.$element.val(val);
this.$element.val(val);
};
Text.prototype.getValue = function () {
return this.formGroup.$element.val();
return this.$element.val();
};
n.Text = Text;
......
......@@ -23,7 +23,6 @@
<!-- include spec files here... -->
<script src="spec/HelperFunctionListSpec.js"></script>
<script src="spec/ElementFormGroupSpec.js"></script>
<script src="spec/ElementElementSpec.js"></script>
<script src="spec/ElementTextSpec.js"></script>
<script src="spec/ElementRadioSpec.js"></script>
<script src="spec/ElementSelectSpec.js"></script>
......
/**
* @author Rafael Ostertag <rafael.ostertag@math.uzh.ch>
*/
/* global describe */
/* global it */
/* global expect */
/* global QfqNS */
/* global beforeAll */
/* global jasmine */
/* global $ */
describe("Element Element", function () {
'use strict';
it("should identify type properly", function () {
var element = new QfqNS.Element.Element($('#firstname'));
expect(element.isType("text")).toBe(true);
element = new QfqNS.Element.Element($("input[name='gender']"));
expect(element.isType("radio")).toBe(true);
expect(element.isType("checkbox")).toBe(false);
});
});
......@@ -22,6 +22,16 @@ describe("Element FormGroup", function () {
personGender = new QfqNS.Element.FormGroup($("input[name='gender']"));
});
it("should identify type properly", function () {
var element = new QfqNS.Element.FormGroup($('#firstname'));
expect(element.isType("text")).toBe(true);
element = new QfqNS.Element.FormGroup($("input[name='gender']"));
expect(element.isType("radio")).toBe(true);
expect(element.isType("checkbox")).toBe(false);
});
it("should throw exception on non-form elements", function () {
expect(function () {
new QfqNS.Element.FormGroup($("#person2"));
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment