pass event as 1. parameter to click handlers to be able to call preventDefault() or stopPropagation()

This commit is contained in:
Ralf Becker 2014-02-10 18:25:02 +00:00
parent 795cfe3e6f
commit 4195633c82
2 changed files with 60 additions and 49 deletions

View File

@ -22,10 +22,10 @@
* Class which manages the DOM node itself. The simpleWidget class is derrived * Class which manages the DOM node itself. The simpleWidget class is derrived
* from et2_DOMWidget and implements the getDOMNode function. A setDOMNode * from et2_DOMWidget and implements the getDOMNode function. A setDOMNode
* function is provided, which attatches the given node to the DOM if possible. * function is provided, which attatches the given node to the DOM if possible.
* *
* @augments et2_DOMWidget * @augments et2_DOMWidget
*/ */
var et2_baseWidget = et2_DOMWidget.extend(et2_IAligned, var et2_baseWidget = et2_DOMWidget.extend(et2_IAligned,
{ {
attributes: { attributes: {
"statustext": { "statustext": {
@ -47,10 +47,10 @@ var et2_baseWidget = et2_DOMWidget.extend(et2_IAligned,
"description": "JS code which is executed when the element is clicked." "description": "JS code which is executed when the element is clicked."
} }
}, },
/** /**
* Constructor * Constructor
* *
* @memberOf et2BaseWidget * @memberOf et2BaseWidget
*/ */
init: function() { init: function() {
@ -202,7 +202,7 @@ var et2_baseWidget = et2_DOMWidget.extend(et2_IAligned,
if (this.node) if (this.node)
{ {
$j(this.node).bind("click.et2_baseWidget", this, function(e) { $j(this.node).bind("click.et2_baseWidget", this, function(e) {
return e.data.click.call(e.data, this); return e.data.click.call(e.data, e, this);
}); });
if (typeof this.onclick == 'function') $j(this.node).addClass('et2_clickable'); if (typeof this.onclick == 'function') $j(this.node).addClass('et2_clickable');
} }
@ -237,7 +237,7 @@ var et2_baseWidget = et2_DOMWidget.extend(et2_IAligned,
/** /**
* Click handler calling custom handler set via onclick attribute to this.onclick * Click handler calling custom handler set via onclick attribute to this.onclick
* *
* @param _ev * @param _ev
* @returns * @returns
*/ */
@ -247,7 +247,7 @@ var et2_baseWidget = et2_DOMWidget.extend(et2_IAligned,
// Make sure function gets a reference to the widget, splice it in as 2. argument if not // Make sure function gets a reference to the widget, splice it in as 2. argument if not
var args = Array.prototype.slice.call(arguments); var args = Array.prototype.slice.call(arguments);
if(args.indexOf(this) == -1) args.splice(1, 0, this); if(args.indexOf(this) == -1) args.splice(1, 0, this);
return this.onclick.apply(this, args); return this.onclick.apply(this, args);
} }
@ -295,14 +295,14 @@ var et2_baseWidget = et2_DOMWidget.extend(et2_IAligned,
/** /**
* Simple container object * Simple container object
* *
* @augments et2_baseWidget * @augments et2_baseWidget
*/ */
var et2_container = et2_baseWidget.extend( var et2_container = et2_baseWidget.extend(
{ {
/** /**
* Constructor * Constructor
* *
* @memberOf et2_container * @memberOf et2_container
*/ */
init: function() { init: function() {
@ -336,14 +336,14 @@ var et2_container = et2_baseWidget.extend(
/** /**
* Container object for not-yet supported widgets * Container object for not-yet supported widgets
* *
* @augments et2_baseWidget * @augments et2_baseWidget
*/ */
var et2_placeholder = et2_baseWidget.extend([et2_IDetachedDOM], var et2_placeholder = et2_baseWidget.extend([et2_IDetachedDOM],
{ {
/** /**
* Constructor * Constructor
* *
* @memberOf et2_placeholder * @memberOf et2_placeholder
*/ */
init: function() { init: function() {

View File

@ -22,10 +22,10 @@
/** /**
* Class which implements the "vfs" XET-Tag * Class which implements the "vfs" XET-Tag
* *
* @augments et2_valueWidget * @augments et2_valueWidget
*/ */
var et2_vfs = et2_valueWidget.extend([et2_IDetachedDOM], var et2_vfs = et2_valueWidget.extend([et2_IDetachedDOM],
{ {
attributes: { attributes: {
"value": { "value": {
@ -41,7 +41,7 @@ var et2_vfs = et2_valueWidget.extend([et2_IDetachedDOM],
/** /**
* Constructor * Constructor
* *
* @memberOf et2_vfs * @memberOf et2_vfs
*/ */
init: function() { init: function() {
@ -112,11 +112,11 @@ var et2_vfs = et2_valueWidget.extend([et2_IDetachedDOM],
.text(text + (i < path_parts.length-1 ? '/' : '')) .text(text + (i < path_parts.length-1 ? '/' : ''))
//.attr('title', egw.decodePath(path)) //.attr('title', egw.decodePath(path))
.addClass("et2_clickable et2_link") .addClass("et2_clickable et2_link")
.click({data:data, egw: this.egw()}, function(e) { .click({data:data, egw: this.egw()}, function(e) {
if(!self.onclick) { if(!self.onclick) {
e.data.egw.open(e.data.data, "file"); e.data.egw.open(e.data.data, "file");
} }
else if (self.click()) else if (self.click(e))
{ {
e.data.egw.open(e.data.data, "file"); e.data.egw.open(e.data.data, "file");
} }
@ -127,6 +127,8 @@ var et2_vfs = et2_valueWidget.extend([et2_IDetachedDOM],
/** /**
* Code for implementing et2_IDetachedDOM (data grid) * Code for implementing et2_IDetachedDOM (data grid)
*
* @param {array} _attrs array of attribute-names to push further names onto
*/ */
getDetachedAttributes: function(_attrs) getDetachedAttributes: function(_attrs)
{ {
@ -154,14 +156,14 @@ et2_register_widget(et2_vfs, ["vfs"]);
/** /**
* vfs-name * vfs-name
* filename automatically urlencoded on return (urldecoded on display to user) * filename automatically urlencoded on return (urldecoded on display to user)
* *
* @augments et2_textbox * @augments et2_textbox
*/ */
var et2_vfsName = et2_textbox.extend( var et2_vfsName = et2_textbox.extend(
{ {
/** /**
* Constructor * Constructor
* *
* @memberOf et2_vfsName * @memberOf et2_vfsName
*/ */
init: function() { init: function() {
@ -185,14 +187,14 @@ et2_register_widget(et2_vfsName, ["vfs-name"]);
/** /**
* vfs-name * vfs-name
* filename automatically urlencoded on return (urldecoded on display to user) * filename automatically urlencoded on return (urldecoded on display to user)
* *
* @augments et2_textbox_ro * @augments et2_textbox_ro
*/ */
var et2_vfsName_ro = et2_textbox_ro.extend( var et2_vfsName_ro = et2_textbox_ro.extend(
{ {
/** /**
* Constructor * Constructor
* *
* @memberOf et2_vfsName_ro * @memberOf et2_vfsName_ro
*/ */
init: function() { init: function() {
@ -215,7 +217,7 @@ et2_register_widget(et2_vfsName_ro, ["vfs-name_ro"]);
/** /**
* vfs-mime: icon for mimetype of file, or thumbnail * vfs-mime: icon for mimetype of file, or thumbnail
* incl. optional link overlay icon, if file is a symlink * incl. optional link overlay icon, if file is a symlink
* *
* Creates following structure * Creates following structure
* <span class="iconOverlayContainer"> * <span class="iconOverlayContainer">
* <img class="et2_vfs vfsMimeIcon" src="..."/> * <img class="et2_vfs vfsMimeIcon" src="..."/>
@ -223,12 +225,12 @@ et2_register_widget(et2_vfsName_ro, ["vfs-name_ro"]);
* <img class="overlay" src="etemplate/templates/default/images/link.png"/> * <img class="overlay" src="etemplate/templates/default/images/link.png"/>
* </span> * </span>
* </span> * </span>
* *
* span.overlayContainer is optional and only generated for symlinks * span.overlayContainer is optional and only generated for symlinks
* *
* @augments et2_valueWidget * @augments et2_valueWidget
*/ */
var et2_vfsMime = et2_valueWidget.extend([et2_IDetachedDOM], var et2_vfsMime = et2_valueWidget.extend([et2_IDetachedDOM],
{ {
attributes: { attributes: {
"value": { "value": {
@ -247,7 +249,7 @@ var et2_vfsMime = et2_valueWidget.extend([et2_IDetachedDOM],
/** /**
* Constructor * Constructor
* *
* @memberOf et2_vfsMime * @memberOf et2_vfsMime
*/ */
init: function() { init: function() {
@ -283,7 +285,7 @@ var et2_vfsMime = et2_valueWidget.extend([et2_IDetachedDOM],
{ {
if (typeof this.overlayContainer == 'undefined') if (typeof this.overlayContainer == 'undefined')
{ {
this.overlayContainer = jQuery(document.createElement('span')).addClass('overlayContainer'); this.overlayContainer = jQuery(document.createElement('span')).addClass('overlayContainer');
this.overlayContainer.append(jQuery(document.createElement('img')) this.overlayContainer.append(jQuery(document.createElement('img'))
.addClass('overlay').attr('src', this.egw().image('link', 'etemplate'))); .addClass('overlay').attr('src', this.egw().image('link', 'etemplate')));
@ -299,6 +301,8 @@ var et2_vfsMime = et2_valueWidget.extend([et2_IDetachedDOM],
/** /**
* Implementation of "et2_IDetachedDOM" for fast viewing in gridview * Implementation of "et2_IDetachedDOM" for fast viewing in gridview
* Override to add needed attributes * Override to add needed attributes
*
* @param {array} _attrs array of attribute-names to push further names onto
*/ */
getDetachedAttributes: function(_attrs) { getDetachedAttributes: function(_attrs) {
_attrs.push("value", "class"); _attrs.push("value", "class");
@ -324,18 +328,18 @@ et2_register_widget(et2_vfsMime, ["vfs-mime"]);
/** /**
* vfs-size * vfs-size
* Human readable file sizes * Human readable file sizes
* *
* @augments et2_description * @augments et2_description
*/ */
var et2_vfsSize = et2_description.extend({ var et2_vfsSize = et2_description.extend({
attributes: { attributes: {
"value": { "value": {
"type": "integer", "type": "integer"
} }
}, },
/** /**
* Constructor * Constructor
* *
* @memberOf et2_vfsSize * @memberOf et2_vfsSize
*/ */
init: function() { init: function() {
@ -382,7 +386,7 @@ et2_register_widget(et2_vfsSize, ["vfs-size"]);
/** /**
* vfs-mode: textual representation of permissions + extra bits * vfs-mode: textual representation of permissions + extra bits
* *
* @augments et2_description * @augments et2_description
*/ */
var et2_vfsMode = et2_description.extend({ var et2_vfsMode = et2_description.extend({
@ -396,7 +400,7 @@ var et2_vfsMode = et2_description.extend({
'b': 0x6000, // Block special 'b': 0x6000, // Block special
'-': 0x8000 // Regular '-': 0x8000 // Regular
}, },
// Sticky / UID / GID // Sticky / UID / GID
sticky: [ sticky: [
{ mask: 0x200, "char": "T", position: 9 }, // Sticky { mask: 0x200, "char": "T", position: 9 }, // Sticky
{ mask: 0x400, "char": "S", position: 6 }, // sGID { mask: 0x400, "char": "S", position: 6 }, // sGID
@ -407,10 +411,10 @@ var et2_vfsMode = et2_description.extend({
'w': 0x2, // Write 'w': 0x2, // Write
'r': 0x4 // Read 'r': 0x4 // Read
}, },
/** /**
* Constructor * Constructor
* *
* @memberOf et2_vfsMode * @memberOf et2_vfsMode
*/ */
init: function() { init: function() {
@ -422,6 +426,8 @@ var et2_vfsMode = et2_description.extend({
* Get text for file stuff * Get text for file stuff
* Result will be like -rwxr--r--. First char is type, then read, write, execute (or other bits) for * Result will be like -rwxr--r--. First char is type, then read, write, execute (or other bits) for
* user, group, world * user, group, world
*
* @param {number} _value vfs mode
*/ */
text_mode: function(_value) { text_mode: function(_value) {
var text = []; var text = [];
@ -495,7 +501,7 @@ et2_register_widget(et2_vfsMode, ["vfs-mode"]);
/** /**
* vfs-uid / vfs-gid: Displays the name for an ID. * vfs-uid / vfs-gid: Displays the name for an ID.
* Same as read-only selectAccount, except if there's no user it shows "root" * Same as read-only selectAccount, except if there's no user it shows "root"
* *
* @augments et2_selectAccount_ro * @augments et2_selectAccount_ro
*/ */
var et2_vfsUid = et2_selectAccount_ro.extend( var et2_vfsUid = et2_selectAccount_ro.extend(
@ -522,11 +528,11 @@ et2_register_widget(et2_vfsUid, ["vfs-uid","vfs-gid"]);
* and calling app is responsible to move content of that dir to entry directory, after entry is saved * and calling app is responsible to move content of that dir to entry directory, after entry is saved
* + option: required mimetype or regular expression for mimetype to match, eg. '/^text\//i' for all text files * + option: required mimetype or regular expression for mimetype to match, eg. '/^text\//i' for all text files
* + if path ends in a slash, multiple files can be uploaded, their original filename is kept then * + if path ends in a slash, multiple files can be uploaded, their original filename is kept then
* *
* @augments et2_file * @augments et2_file
*/ */
var et2_vfsUpload = et2_file.extend( var et2_vfsUpload = et2_file.extend(
{ {
legacyOptions: ["mime"], legacyOptions: ["mime"],
asyncOptions: { asyncOptions: {
@ -535,7 +541,7 @@ var et2_vfsUpload = et2_file.extend(
/** /**
* Constructor * Constructor
* *
* @param _parent * @param _parent
* @param attrs * @param attrs
* @memberof et2_vfsUpload * @memberof et2_vfsUpload
@ -561,7 +567,7 @@ var et2_vfsSelect = et2_inputWidget.extend(
{ {
// Allowed mode options // Allowed mode options
modes: ['open','open-multiple','saveas','select-dir'], modes: ['open','open-multiple','saveas','select-dir'],
attributes: { attributes: {
"mode": { "mode": {
name: "Dialog mode", name: "Dialog mode",
@ -600,10 +606,10 @@ var et2_vfsSelect = et2_inputWidget.extend(
"description": "Array of paths (strings)" "description": "Array of paths (strings)"
} }
}, },
/** /**
* Constructor * Constructor
* *
* @param _parent * @param _parent
* @param _attrs * @param _attrs
* @memberOf et2_vfsSelect * @memberOf et2_vfsSelect
@ -618,15 +624,15 @@ var et2_vfsSelect = et2_inputWidget.extend(
this.button = $j(document.createElement("img")) this.button = $j(document.createElement("img"))
.attr("src", this.egw().image("filemanager/navbar")) .attr("src", this.egw().image("filemanager/navbar"))
.attr("title", this.egw().lang("Select file(s) from VFS")) .attr("title", this.egw().lang("Select file(s) from VFS"))
.addClass("et2_button et2_button_icon") .addClass("et2_button et2_button_icon");
this.setDOMNode(egw.userData.apps.filemanager ? this.button[0]:document.createElement('span')); this.setDOMNode(egw.userData.apps.filemanager ? this.button[0]:document.createElement('span'));
}, },
click: function(e) { click: function(e) {
// No permission // No permission
if(typeof egw.userData.apps.filemanager == 'undefined') return; if(typeof egw.userData.apps.filemanager == 'undefined') return;
var self = this; var self = this;
var attrs = { var attrs = {
@ -644,7 +650,7 @@ var et2_vfsSelect = et2_inputWidget.extend(
{ {
attrs.mime = this.options.mime; attrs.mime = this.options.mime;
}; };
// Open the filemanager select in a popup // Open the filemanager select in a popup
var popup = this.egw().open_link( var popup = this.egw().open_link(
this.egw().link('/index.php', attrs), this.egw().link('/index.php', attrs),
@ -658,15 +664,15 @@ var et2_vfsSelect = et2_inputWidget.extend(
function() { function() {
if(popup.closed) { if(popup.closed) {
self.egw().window.clearInterval(poll); self.egw().window.clearInterval(poll);
// Update path to where the user wound up // Update path to where the user wound up
var path = popup.etemplate2.getByApplication('filemanager')[0].widgetContainer.getArrayMgr("content").getEntry('path') || ''; var path = popup.etemplate2.getByApplication('filemanager')[0].widgetContainer.getArrayMgr("content").getEntry('path') || '';
self.options.path = path; self.options.path = path;
// Get the selected files // Get the selected files
var files = popup.selected_files || []; var files = popup.selected_files || [];
self.value = files; self.value = files;
// Fire a change event so any handlers run // Fire a change event so any handlers run
$j(self.node).change(); $j(self.node).change();
} }
@ -676,9 +682,10 @@ var et2_vfsSelect = et2_inputWidget.extend(
}, },
/** /**
* Set the dialog's mode. * Set the dialog's mode.
* Valid options are in et2_vfsSelect.modes * Valid options are in et2_vfsSelect.modes
* *
* @param {string} mode 'open', 'open-multiple', 'saveas' or 'select-dir'
*/ */
set_mode: function(mode) { set_mode: function(mode) {
// Check mode // Check mode
@ -692,6 +699,8 @@ var et2_vfsSelect = et2_inputWidget.extend(
/** /**
* Set the label on the dialog's OK button. * Set the label on the dialog's OK button.
*
* @param {string} label
*/ */
set_button_label: function(label) set_button_label: function(label)
{ {
@ -700,6 +709,8 @@ var et2_vfsSelect = et2_inputWidget.extend(
/** /**
* Set the ID passed to the server side callback * Set the ID passed to the server side callback
*
* @param {string} id
*/ */
set_method_id: function(id) { set_method_id: function(id) {
this.options.method_id = id; this.options.method_id = id;