extern/egroupware_official
1
0
Fork 0
mirror of https://github.com/EGroupware/egroupware.git synced 2025-01-24 23:09:13 +01:00
Code Issues Packages Projects Releases Wiki Activity

Add overlay attribute for seachbox widget

Browse Source
This commit is contained in:
Hadi Nategh 2016-02-18 11:16:47 +00:00
parent eeb2b8adcd
commit 5612a16c76
3 changed files with 40 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
etemplate/js/et2_extension_nextmatch.js
View File

@ -2288,11 +2288,18 @@ var et2_nextmatch_header_bar = et2_DOMWidget.extend(et2_INextmatchHeader,
this.search_box = jQuery(document.createElement("div")) this.search_box = jQuery(document.createElement("div"))
.addClass('search') .addClass('search')
.prependTo(egwIsMobile()?this.nextmatch.div:this.row_div); .prependTo(egwIsMobile()?this.nextmatch.div:this.row_div);
// searchbox widget
this.et2_searchbox = et2_createWidget('searchbox', {id:"search",onchange:function(){ // searchbox widget options
var searchbox_options = {
id:"search",
overlay:(typeof settings.searchbox != 'undefined' && typeof settings.searchbox.overlay != 'undefined')?settings.searchbox.overlay:true,
onchange:function(){
self.nextmatch.applyFilters({search: this.get_value()}); self.nextmatch.applyFilters({search: this.get_value()});
} },
},this); value:settings.search
};
// searchbox widget
this.et2_searchbox = et2_createWidget('searchbox', searchbox_options,this);
// Set activeFilters to current value // Set activeFilters to current value
this.nextmatch.activeFilters.search = settings.search; this.nextmatch.activeFilters.search = settings.search;

23
etemplate/js/et2_widget_textbox.js
View File

@ -415,9 +415,16 @@ et2_register_widget(et2_textbox_ro, ["textbox_ro"]);
var et2_searchbox = et2_textbox.extend( var et2_searchbox = et2_textbox.extend(
{ {
/** /**
* Ignore all more advanced attributes. * Advanced attributes
*/ */
attributes: {}, attributes: {
overlay:{
name:"Overlay searchbox",
type:"boolean",
default:true,
description:"Define wheter the searchbox overlays while it's open (true) or stay as solid box infront of the search button (false). Default is true."
}
},
/** /**
* Constructor * Constructor
@ -439,10 +446,11 @@ var et2_searchbox = et2_textbox.extend(
_createWidget:function() _createWidget:function()
{ {
var self = this; var self = this;
if (this.options.overlay) this.flex.addClass('overlay');
// search button indicator // search button indicator
this.button = et2_createWidget('button',{image:"search","background_image":"1"},this); this.button = et2_createWidget('button',{image:"search","background_image":"1"},this);
this.button.onclick= function(){ this.button.onclick= function(){
self._show_hide(true); self._show_hide(jQuery(self.flex).hasClass('hide'));
self.search.input.focus(); self.search.input.focus();
}; };
this.div.prepend(this.button.getDOMNode()); this.div.prepend(this.button.getDOMNode());
@ -474,8 +482,11 @@ var et2_searchbox = et2_textbox.extend(
}, },
blur: function(event){ blur: function(event){
self._show_hide(false); if (!event.relatedTarget || !jQuery(event.relatedTarget.parentNode).hasClass('et2_searchbox'))
if (self._oldValue != self.get_value()) { {
self._show_hide((!self.options.overlay && self.get_value()));
}
if (typeof self.oldValue !='undefined' && self._oldValue != self.get_value()) {
self.change(); self.change();
} }
}, },
@ -524,10 +535,12 @@ var et2_searchbox = et2_textbox.extend(
if (!this.get_value()) if (!this.get_value())
{ {
jQuery(this.button.getDOMNode()).removeClass('toolbar_toggled'); jQuery(this.button.getDOMNode()).removeClass('toolbar_toggled');
this.button.set_statustext('');
} }
else else
{ {
jQuery(this.button.getDOMNode()).addClass('toolbar_toggled'); jQuery(this.button.getDOMNode()).addClass('toolbar_toggled');
this.button.set_statustext(egw.lang('search for ')+this.get_value());
} }
}, },

15
etemplate/templates/default/etemplate2.css
View File

@ -2316,9 +2316,10 @@ td.avatar {
z-index: 500; z-index: 500;
white-space: nowrap; white-space: nowrap;
} }
.et2_searchbox input { .et2_searchbox .flex.overlay input {
position: absolute; position: absolute;
/* top: 1px; */ }
.et2_searchbox .flex input{
height: 18px; height: 18px;
width: 100%; width: 100%;
} }
@ -2331,9 +2332,15 @@ td.avatar {
top: 3px; top: 3px;
} }
.et2_searchbox .flex { .et2_searchbox .flex {
width: 150px; width: 200px;
position: absolute; position:relative;
display: inline-block; display: inline-block;
padding-right: 7px;
float: right;
}
.et2_searchbox .flex.overlay {
width: 150px;
position: absolute;
} }
.et2_searchbox .hide { .et2_searchbox .hide {
display: none !important; display: none !important;