Splitting widget into widget and field

Splitting IPA.widget into IPA.field (logical part) and IPA.widget, IPA.input_widget (visual part).

https://fedorahosted.org/freeipa/ticket/2040
This commit is contained in:
Petr Vobornik 2011-11-22 14:58:10 +01:00 committed by Endi S. Dewata
parent fd43a625a2
commit a17bf5e754
5 changed files with 422 additions and 275 deletions

View File

@ -22,6 +22,7 @@ app_DATA = \
extension.js \
facet.js \
favicon.ico \
field.js \
group.js \
hbac.js \
host.js \

384
install/ui/field.js Normal file
View File

@ -0,0 +1,384 @@
/*jsl:import ipa.js */
/* Authors:
* Endi Sukma Dewata <edewata@redhat.com>
* Adam Young <ayoung@redhat.com>
* Pavel Zuna <pzuna@redhat.com>
* Petr Vobornik <pvoborni@redhat.com>
*
* Copyright (C) 2011 Red Hat
* see file 'COPYING' for use and warranty information
*
* This program is free software; you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
/* REQUIRES: ipa.js, widget.js */
IPA.field = function(spec) {
spec = spec || {};
var that = {};
that.entity = spec.entity;
that.container = null;
that.name = spec.name;
that.label = spec.label;
that.tooltip = spec.tooltip;
that.widget = null;
that.widget_name = spec.widget;
// override the required flag in metadata
that.required = spec.required;
// read_only is set when widget is created
that.read_only = spec.read_only;
// writable is set during load
that.writable = true;
that.undo = spec.undo === undefined ? true : spec.undo;
that.join = spec.join;
that.metadata = spec.metadata;
that.priority = spec.priority;
that.values = [];
that.dirty = false;
that.valid = true;
that.dirty_changed = IPA.observer();
var init = function() {
if (!that.metadata && that.entity) {
that.metadata = IPA.get_entity_param(that.entity.name, that.name);
}
if (that.metadata) {
if (that.label === undefined) {
that.label = that.metadata.label;
}
if (that.tooltip === undefined) {
that.tooltip = that.metadata.doc;
}
}
};
that.is_required = function() {
if (that.read_only) return false;
if (!that.writable) return false;
if (that.required !== undefined) return that.required;
return that.metadata && that.metadata.required;
};
that.set_required = function(required) {
that.required = required;
that.update_required();
};
that.update_required = function() {
if(that.widget) {
that.widget.set_required(that.is_required());
}
};
that.validate_required = function() {
var values = that.save();
if (!values || !values.length || values[0] === '') {
if (that.is_required()) {
that.valid = false;
that.show_error(IPA.messages.widget.validation.required);
return false;
}
}
return true;
};
/*returns true and clears the error message if the field value passes
* the validation pattern. If the field value does not pass validation,
* displays the error message and returns false. */
that.validate = function() {
that.hide_error();
that.valid = true;
var values = that.save();
if (!values) {
return that.valid;
}
if (values.length === 0) {
return that.valid;
}
var value = values[0];
if (!value) {
return that.valid;
}
if (!that.metadata) {
return that.valid;
}
var message;
if (that.metadata.type == 'int') {
if (!value.match(/^-?\d+$/)) {
that.valid = false;
that.show_error(IPA.messages.widget.validation.integer);
return that.valid;
}
if (that.metadata.minvalue !== undefined && value < that.metadata.minvalue) {
that.valid = false;
message = IPA.messages.widget.validation.min_value;
message = message.replace('${value}', that.metadata.minvalue);
that.show_error(message);
return that.valid;
}
if (that.metadata.maxvalue !== undefined && value > that.metadata.maxvalue) {
that.valid = false;
message = IPA.messages.widget.validation.max_value;
message = message.replace('${value}', that.metadata.maxvalue);
that.show_error(message);
return that.valid;
}
}
if (that.metadata.pattern) {
var regex = new RegExp(that.metadata.pattern);
if (!value.match(regex)) {
that.valid = false;
that.show_error(that.metadata.pattern_errmsg);
return that.valid;
}
}
return that.valid;
};
/**
* This function stores the entire record and the values
* of the field, then invoke reset() to update the UI.
*/
that.load = function(record) {
that.record = record;
var value = record[that.name];
if (value instanceof Array) {
that.values = value;
} else {
that.values = value !== undefined ? [value] : [];
}
if (!that.values.length) {
that.values = [''];
}
that.writable = true;
if (that.metadata) {
if (that.metadata.primary_key) {
that.writable = false;
}
if (that.metadata.flags && 'no_update' in that.metadata.flags) {
that.writable = false;
}
}
if (that.record.attributelevelrights) {
var rights = that.record.attributelevelrights[that.name];
if (!rights || rights.indexOf('w') < 0) {
that.writable = false;
}
}
that.reset();
};
that.reset = function() {
that.update_required();
that.update();
that.validate();
that.set_dirty(false);
};
that.update = function() {
if(that.widget && that.widget.update) that.widget.update(that.values);
};
that.get_update_info = function() {
var update_info = IPA.update_info_builder.new_update_info();
if(that.is_dirty()) {
update_info.fields.push(IPA.update_info_builder.new_field_info(
that,
that.save()));
}
return update_info;
};
/**
* This function saves the values entered in the UI.
* It returns the values in an array, or null if
* the field should not be saved.
*/
that.save = function(record) {
var values = that.values;
if(that.widget) {
values = that.widget.save();
}
if(record) {
record[that.name] = values;
}
return values;
};
/**
* This function compares the original values and the
* values entered in the UI. If the values have changed
* it will return true.
*/
that.test_dirty = function() {
if (that.read_only) {
return false;
}
var values = that.save();
if (!values) { // ignore null values
return false;
}
if (!that.values) {
if (values instanceof Array) {
if ((values.length === 0) ||
(values.length === 1) &&
(values[0] === '')) {
return false;
}
}
return true;
}
if (values.length != that.values.length) {
return true;
}
values.sort();
that.values.sort();
for (var i=0; i<values.length; i++) {
if (values[i] != that.values[i]) {
return true;
}
}
return false;
};
/**
* This function compares the original values and the
* values entered in the UI. If the values have changed
* it will return true.
*/
that.is_dirty = function() {
return that.dirty;
};
that.set_dirty = function(dirty) {
var old = that.dirty;
that.dirty = dirty;
if (that.undo) {
that.show_undo(dirty);
}
if(old !== dirty) {
that.dirty_changed.notify([], that);
}
};
that.show_error = function(message) {
if(that.widget) that.widget.show_error(message);
};
that.hide_error = function() {
if(that.widget) that.widget.hide_error();
};
that.show_undo = function(value) {
if(that.widget) {
if(value) { that.widget.show_undo(); }
else { that.widget.hide_undo();}
}
};
that.set_enabled = function() {
};
that.refresh = function() {
};
that.set_widget_flags = function() {
that.widget.label = that.label;
that.widget.title = that.title;
that.widget.undo = that.undo;
that.widget.writable = that.writable;
that.widget.read_only = that.read_only;
};
that.widgets_created = function() {
that.widget = that.container.widgets.get_widget(that.widget_name);
if(that.widget) {
that.set_widget_flags();
that.widget.value_changed.attach(that.widget_value_changed);
that.widget.undo_clicked.attach(that.widget_undo_clicked);
}
};
that.widget_value_changed = function() {
that.set_dirty(that.test_dirty());
that.validate();
};
that.widget_undo_clicked = function() {
that.reset();
};
init();
// methods that should be invoked by subclasses
that.field_load = that.load;
that.field_reset = that.reset;
that.field_save = that.save;
that.field_set_dirty = that.set_dirty;
that.field_show_error = that.show_error;
that.field_test_dirty = that.test_dirty;
that.field_widgets_created = that.widgets_created;
return that;
};

View File

@ -13,6 +13,7 @@
<script type="text/javascript" src="ipa.js"></script>
<script type="text/javascript" src="widget.js"></script>
<script type="text/javascript" src="field.js"></script>
<script type="text/javascript" src="dialog.js"></script>
<script type="text/javascript" src="search.js"></script>
<script type="text/javascript" src="details.js"></script>

View File

@ -115,7 +115,7 @@
+define window
+define document
+define alert
+define $
+define $
+define JSON
+define jQuery
@ -128,6 +128,7 @@
+process jquery.ordered-map.js
+process ipa.js
+process widget.js
+process field.js
+process dialog.js
+process search.js
+process details.js

View File

@ -32,55 +32,43 @@ IPA.widget = function(spec) {
var that = {};
that.entity = spec.entity;
that.id = spec.id;
that.name = spec.name;
that.id = spec.id;
that.label = spec.label;
that.tooltip = spec.tooltip;
that.entity = spec.entity; //some old widgets still need it
that.disabled = spec.disabled;
that.hidden = spec.hidden;
that.create = function(container) {
container.addClass('widget');
that.container = container;
};
// override the required flag in metadata
that.required = spec.required;
that.clear = function() {
};
// read_only is set when widget is created
that.read_only = spec.read_only;
that.widget_create = that.create;
// writable is set during load
that.writable = true;
return that;
};
IPA.input_widget = function(spec) {
spec = spec || {};
var that = IPA.widget(spec);
that.width = spec.width;
that.height = spec.height;
that.undo = spec.undo === undefined ? true : spec.undo;
that.join = spec.join;
that.writable = spec.writable;
that.read_only = spec.read_only;
that.metadata = spec.metadata;
that.priority = spec.priority;
that.values = [];
that.dirty = false;
that.valid = true;
that.dirty_changed = IPA.observer();
//events
//each widget can contain several events
that.value_changed = IPA.observer();
that.undo_clicked = IPA.observer();
var init = function() {
if (!that.metadata && that.entity) {
that.metadata = IPA.get_entity_param(that.entity.name, that.name);
}
if (that.metadata) {
if (that.label === undefined) {
that.label = that.metadata.label;
}
if (that.tooltip === undefined) {
that.tooltip = that.metadata.doc;
}
}
};
that.create_error_link = function(container) {
container.append(' ');
@ -101,225 +89,16 @@ IPA.widget = function(spec) {
}).appendTo(container);
};
that.is_required = function() {
if (that.read_only) return false;
if (!that.writable) return false;
if (that.required !== undefined) return that.required;
return that.metadata && that.metadata.required;
};
that.set_required = function(required) {
that.required = required;
that.update_required();
};
that.update_required = function() {
if (that.required_indicator) {
that.required_indicator.css('display', that.is_required() ? 'inline' : 'none');
}
};
that.validate_required = function() {
var values = that.save();
if (!values || !values.length || values[0] === '') {
if (that.is_required()) {
that.valid = false;
that.show_error(IPA.messages.widget.validation.required);
return false;
}
}
return true;
};
/*returns true and clears the error message if the field value passes
the validation pattern. If the field value does not pass validation,
displays the error message and returns false. */
that.validate = function() {
that.hide_error();
that.valid = true;
var values = that.save();
if (!values) {
return that.valid;
}
if (values.length === 0) {
return that.valid;
}
var value = values[0];
if (!value) {
return that.valid;
}
if (!that.metadata) {
return that.valid;
}
var message;
if (that.metadata.type == 'int') {
if (!value.match(/^-?\d+$/)) {
that.valid = false;
that.show_error(IPA.messages.widget.validation.integer);
return that.valid;
}
if (that.metadata.minvalue !== undefined && value < that.metadata.minvalue) {
that.valid = false;
message = IPA.messages.widget.validation.min_value;
message = message.replace('${value}', that.metadata.minvalue);
that.show_error(message);
return that.valid;
}
if (that.metadata.maxvalue !== undefined && value > that.metadata.maxvalue) {
that.valid = false;
message = IPA.messages.widget.validation.max_value;
message = message.replace('${value}', that.metadata.maxvalue);
that.show_error(message);
return that.valid;
}
}
if (that.metadata.pattern) {
var regex = new RegExp(that.metadata.pattern);
if (!value.match(regex)) {
that.valid = false;
that.show_error(that.metadata.pattern_errmsg);
return that.valid;
}
}
return that.valid;
};
/**
* This function compares the original values and the
* values entered in the UI. If the values have changed
* it will return true.
*/
that.test_dirty = function() {
if (that.read_only) {
return false;
}
var values = that.save();
if (!values) { // ignore null values
return false;
}
if (!that.values) {
if (values instanceof Array) {
if ((values.length === 0) ||
(values.length === 1) &&
(values[0] === '')) {
return false;
}
}
return true;
}
if (values.length != that.values.length) {
return true;
}
values.sort();
that.values.sort();
for (var i=0; i<values.length; i++) {
if (values[i] != that.values[i]) {
return true;
}
}
return false;
};
that.create = function(container) {
container.addClass('widget');
that.container = container;
};
/**
* This function stores the entire record and the values
* of the field, then invoke reset() to update the UI.
*/
that.load = function(record) {
that.record = record;
var value = record[that.name];
if (value instanceof Array) {
that.values = value;
} else {
that.values = value ? [value] : [];
}
that.writable = true;
if (that.metadata) {
if (that.metadata.primary_key) {
that.writable = false;
}
if (that.metadata.flags && 'no_update' in that.metadata.flags) {
that.writable = false;
}
}
if (that.record.attributelevelrights) {
var rights = that.record.attributelevelrights[that.name];
if (!rights || rights.indexOf('w') < 0) {
that.writable = false;
}
}
that.reset();
};
that.reset = function() {
that.update_required();
that.update();
that.validate();
that.set_dirty(false);
};
that.update = function() {
};
that.get_update_info = function() {
var update_info = IPA.update_info_builder.new_update_info();
if(that.is_dirty()) {
update_info.fields.push(IPA.update_info_builder.new_field_info(
that,
that.save()));
}
return update_info;
};
/**
* This function saves the values entered in the UI.
* It returns the values in an array, or null if
* the field should not be saved.
*/
that.save = function() {
return that.values;
};
/**
* This function compares the original values and the
* values entered in the UI. If the values have changed
* it will return true.
*/
that.is_dirty = function() {
return that.dirty;
return [];
};
/**
@ -341,7 +120,7 @@ IPA.widget = function(spec) {
if(on_undo === undefined) {
on_undo = function() {
that.reset();
that.undo_clicked.notify([], that);
};
}
@ -350,28 +129,12 @@ IPA.widget = function(spec) {
}
};
that.set_dirty = function(dirty) {
var old = that.dirty;
that.dirty = dirty;
if (that.undo) {
if (dirty) {
that.show_undo();
} else {
that.hide_undo();
}
}
if(old !== dirty) {
that.dirty_changed.notify([], that);
}
};
that.get_undo = function() {
return $(that.undo_span);
};
that.show_undo = function() {
$(that.undo_span).css('display', 'inline');
that.get_undo().css('display', 'inline');
};
that.hide_undo = function() {
@ -393,26 +156,23 @@ IPA.widget = function(spec) {
error_link.css('display', 'none');
};
that.clear = function() {
that.set_required = function(required) {
that.required = required;
if (that.required_indicator) {
that.required_indicator.css('display', that.required ? 'inline' : 'none');
}
};
that.set_enabled = function() {
};
that.focus_input = function() {};
that.set_deleted = function() {};
that.refresh = function() {
};
init();
// methods that should be invoked by subclasses
that.widget_create = that.create;
that.widget_hide_error = that.hide_error;
that.widget_load = that.load;
that.widget_reset = that.reset;
that.widget_save = that.save;
that.widget_set_dirty = that.set_dirty;
that.widget_show_error = that.show_error;
that.widget_test_dirty = that.test_dirty;
return that;
};