diff --git a/etemplate/js/et2_widget_image.js b/etemplate/js/et2_widget_image.js index 3ec51bf512..b21cc04d97 100644 --- a/etemplate/js/et2_widget_image.js +++ b/etemplate/js/et2_widget_image.js @@ -16,6 +16,7 @@ jquery.jquery; et2_core_interfaces; et2_core_baseWidget; + /etemplate/js/expose.js; */ /** @@ -23,7 +24,7 @@ * * @augments et2_baseWidget */ -var et2_image = et2_baseWidget.extend([et2_IDetachedDOM], +var et2_image = expose(et2_baseWidget.extend([et2_IDetachedDOM], { attributes: { "src": { @@ -63,11 +64,11 @@ var et2_image = et2_baseWidget.extend([et2_IDetachedDOM], "type": "string", "description": "Label for image" }, - "image_tooltip":{ - "name": "Image tooltip", - "type": "string", - "default": false, - "description": "Clicking on an image would popup a tooltip which shows the actual size of the image" + "expose_view":{ + name: "Expose view", + type: "boolean", + default: false, + description: "Clicking on an image with href value would popup an expose view, and will show image referenced by href." } }, legacyOptions: ["href", "extra_link_target", "imagemap", "extra_link_popup", "id"], @@ -156,45 +157,11 @@ var et2_image = et2_baseWidget.extend([et2_IDetachedDOM], var popup = this.options.extra_link_popup; var target = this.options.extra_link_target; var self = this; - if (self.options.image_tooltip) - { - this.image.parent().tooltip({ - position: {my:"left center", at:"right+10 center", collision:"none"}, - tooltipClass:'et2_image_tooltipPopup', - content: function() - { - return jQuery('
'); - }, - close: function() - { - jQuery(this).tooltip('disable'); - } - }).tooltip('disable'); - } this.image.parent().click(function(e) { - if (self.options.image_tooltip) + if (self.options.expose_view) { - var ttElem = jQuery(e.target).parent(); - var ttOptions = ttElem.tooltip('option'); - - if (!ttOptions.disabled) - { - ttElem.tooltip('disable'); - - jQuery(e.target).trigger('mouseout'); - } - else - { - ttElem.tooltip('enable'); - jQuery(e.target).trigger('mouseover'); - } - jQuery(e.target).on('mouseout', function (event){ - if (ttOptions.disabled) - { - jQuery(event.target).trigger('mouseover'); - } - }); + self._init_blueimp_gallery(_value); } else { @@ -249,7 +216,28 @@ var et2_image = et2_baseWidget.extend([et2_IDetachedDOM], } return false; }, - + + /** + * Function to get media content to feed the expose + * @param {type} _value + * @returns {Array|Array.getMedia.mediaContent} + */ + getMedia: function (_value) + { + var base_url = egw(window).window.location.origin + egw.webserverUrl + "/"; + var mediaContent = []; + if (_value) + { + mediaContent = [{ + title: this.options.label, + href: base_url + _value, + type: this.options.type + "/*", + thumbnail: base_url + _value + }]; + } + return mediaContent; + }, + /** * Implementation of "et2_IDetachedDOM" for fast viewing in gridview * @@ -283,7 +271,7 @@ var et2_image = et2_baseWidget.extend([et2_IDetachedDOM], this.set_href(_values["href"]); } } -}); +})); et2_register_widget(et2_image, ["image"]); diff --git a/etemplate/js/expose.js b/etemplate/js/expose.js index 211e18e16e..1ae763dd2b 100644 --- a/etemplate/js/expose.js +++ b/etemplate/js/expose.js @@ -26,12 +26,12 @@ function expose (widget) { return widget.extend([et2_IExposable],{ - /** * Initialize the expose media gallery */ init: function() { this._super.apply(this, arguments); + this.expose_options = { // The Id, element or querySelector of the gallery widget: container: '#blueimp-gallery', @@ -168,7 +168,6 @@ function expose (widget) // Is called with the gallery instance as "this" object: onclosed: jQuery.proxy(this.expose_onclosed,this) }; - var self = this; var $body = jQuery('body'); if ($body.find('#blueimp-gallery').length == 0) { @@ -186,9 +185,12 @@ function expose (widget) { this._super.apply(this,arguments) var self=this; - jQuery(this.node).on('click', function(){ - self._init_blueimp_gallery(_value); + if (typeof this.options.expose_view != 'undefined' && this.options.expose_view ) + { + jQuery(this.node).on('click', function(){ + self._init_blueimp_gallery(_value); }); + } }, _init_blueimp_gallery: function (_value)