holm/egroupware
1
1
Fork 0
forked from extern/egroupware
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Change over some more dialogs

Browse Source
This commit is contained in:
nathan 2022-03-30 13:24:52 -06:00
parent 763ed85668
commit bfdb53b1cf
11 changed files with 194 additions and 130 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
api/js/etemplate/Et2Dialog/Et2Dialog.ts
View File

@ -540,7 +540,7 @@ export class Et2Dialog extends Et2Widget(ScopedElementsMixin(SlotMixin(LionDialo
}
}
// set template-name as id, to allow to style dialogs
this._template_widget.DOMContainer.setAttribute('id', this.__template.replace(/^(.*\/)?([^/]+?)(\.xet)?(\?.*)$/, '$2').replace(/\./g, '-'));
this._template_widget.DOMContainer.setAttribute('id', this.__template.replace(/^(.*\/)?([^/]+?)(\.xet)?(\?.*)?$/, '$2').replace(/\./g, '-'));
// Look for buttons after load
this.addEventListener("load", this._adoptTemplateButtons);
@ -818,7 +818,7 @@ export class Et2Dialog extends Et2Widget(ScopedElementsMixin(SlotMixin(LionDialo
message: _message
}
},
template: egw.webserverUrl + '/api/templates/default/prompt.xet',
template: egw.webserverUrl + '/api/etemplate.php/api/templates/default/prompt.xet',
class: "et2_prompt"
});
@ -915,7 +915,7 @@ export class Et2Dialog extends Et2Widget(ScopedElementsMixin(SlotMixin(LionDialo
];
let dialog = new Et2Dialog(_egw_or_appname);
dialog.transformAttributes({
template: egw.webserverUrl + '/api/templates/default/long_task.xet',
template: egw.webserverUrl + '/api/etemplate.php/api/templates/default/long_task.xet',
value: {
content: {
message: _message

78
api/js/etemplate/et2_widget_image.ts
View File

@ -18,13 +18,13 @@
*/
import {et2_baseWidget} from './et2_core_baseWidget';
import {et2_createWidget, et2_register_widget, WidgetConfig} from "./et2_core_widget";
import {et2_register_widget, WidgetConfig} from "./et2_core_widget";
import {ClassWithAttributes} from "./et2_core_inheritance";
import {et2_IDetachedDOM} from "./et2_core_interfaces";
import {et2_no_init} from "./et2_core_common";
import {egw} from "../jsapi/egw_global";
import {et2_dialog} from "./et2_widget_dialog";
import '../../../vendor/bower-asset/cropper/dist/cropper.min.js';
import {Et2Dialog} from "./Et2Dialog/Et2Dialog";
/**
* Class which implements the "image" XET-Tag
@ -546,41 +546,43 @@ export class et2_avatar extends et2_image
.addClass('emlEdit')
.click(function(){
let buttons = [
{"button_id": 1,"text": self.egw().lang('save'), id: 'save', image: 'check', "default":true},
{"button_id": 0,"text": self.egw().lang('cancel'), id: 'cancel', image: 'cancelled'}
{"button_id": 1, label: self.egw().lang('save'), id: 'save', image: 'check', "default": true},
{"button_id": 0, label: self.egw().lang('cancel'), id: 'cancel', image: 'cancelled'}
];
let dialog = function(_title, _value, _buttons, _egw_or_appname)
{
return et2_createWidget("dialog",
let dialog = new Et2Dialog(self.egw());
dialog.transformAttributes({
callback: function(_buttons, _value)
{
callback: function(_buttons, _value)
if(_buttons == 'save')
{
if (_buttons == 'save')
{
let canvas = jQuery('#_cropper_image').cropper('getCroppedCanvas');
self.image.attr('src', canvas.toDataURL("image/jpeg", 1.0));
self.egw().json('addressbook.addressbook_ui.ajax_update_photo',
[self.getInstanceManager().etemplate_exec_id, canvas.toDataURL('image/jpeg',1.0)],
function(res)
let canvas = jQuery('#_cropper_image').cropper('getCroppedCanvas');
self.image.attr('src', canvas.toDataURL("image/jpeg", 1.0));
self.egw().json('addressbook.addressbook_ui.ajax_update_photo',
[self.getInstanceManager().etemplate_exec_id, canvas.toDataURL('image/jpeg', 1.0)],
function(res)
{
if(res)
{
if (res)
{
del.show();
}
}).sendRequest();
}
},
title: _title||egw.lang('Input required'),
buttons: _buttons||et2_dialog.BUTTONS_OK_CANCEL,
value: {
content: _value
},
width: "90%",
height:"450",
resizable: false,
position:"top+10",
template: egw.webserverUrl+'/api/templates/default/avatar_edit.xet?2'
}, et2_dialog._create_parent(_egw_or_appname));
del.show();
}
}).sendRequest();
}
},
title: _title || egw.lang('Input required'),
buttons: _buttons || Et2Dialog.BUTTONS_OK_CANCEL,
value: {
content: _value
},
width: "90%",
height: "450",
resizable: false,
position: "top+10",
template: egw.webserverUrl + '/api/templates/default/avatar_edit.xet?2'
});
document.body.appendChild(dialog);
return dialog;
};
dialog(egw.lang('Edit avatar'),self.options, buttons, null);
@ -590,23 +592,25 @@ export class et2_avatar extends et2_image
// delete button
var del = jQuery(document.createElement('div'))
.addClass('emlDelete')
.click(function(){
et2_dialog.show_dialog(function(_btn){
if (_btn == et2_dialog.YES_BUTTON)
.click(function()
{
Et2Dialog.show_dialog(function(_btn)
{
if(_btn == Et2Dialog.YES_BUTTON)
{
self.egw().json('addressbook.addressbook_ui.ajax_update_photo',
[self.getInstanceManager().etemplate_exec_id, null],
function(res)
{
if (res)
if(res)
{
self.image.attr('src','');
self.image.attr('src', '');
del.hide();
egw.refresh('Avatar Deleted.', egw.app_name());
}
}).sendRequest();
}
}, egw.lang('Delete this photo?'), egw.lang('Delete'), null, et2_dialog.BUTTONS_YES_NO);
}, egw.lang('Delete this photo?'), egw.lang('Delete'), null, Et2Dialog.BUTTONS_YES_NO);
})
.appendTo(eml);
if (_noDelete) del.hide();

30
api/js/etemplate/et2_widget_link.ts
View File

@ -27,7 +27,6 @@ import {et2_valueWidget} from "./et2_core_valueWidget";
import {et2_inputWidget} from "./et2_core_inputWidget";
import {et2_selectbox} from "./et2_widget_selectbox";
import {et2_button} from "./et2_widget_button";
import {et2_dialog} from "./et2_widget_dialog";
import {et2_file} from "./et2_widget_file";
import {et2_vfsSelect} from "./et2_widget_vfs";
import {egw, egw_get_file_editor_prefered_mimes} from "../jsapi/egw_global";
@ -36,6 +35,7 @@ import {et2_csvSplit, et2_no_init} from "./et2_core_common";
import {et2_IDetachedDOM, et2_IExposable} from "./et2_core_interfaces";
import {expose} from "./expose";
import {egwMenu} from "../egw_action/egw_menu.js";
import {Et2Dialog} from "./Et2Dialog/Et2Dialog";
/**
* UI widgets for Egroupware linking system
@ -1892,16 +1892,19 @@ export class et2_link_list extends et2_link_string
{
var link_id = typeof self.context.data.link_id == 'number' ? self.context.data.link_id : self.context.data.link_id.replace(/[:\.]/g, '_');
et2_dialog.show_prompt(
function (button, comment)
Et2Dialog.show_prompt(
function(button, comment)
{
if (button != et2_dialog.OK_BUTTON) return;
if(button != Et2Dialog.OK_BUTTON)
{
return;
}
var remark = jQuery('#link_' + (self.context.data.dom_id ? self.context.data.dom_id : link_id), self.list).children('.remark');
if (isNaN(self.context.data.link_id)) // new entry, not yet stored
if(isNaN(self.context.data.link_id)) // new entry, not yet stored
{
remark.text(comment);
// Look for a link-to with the same ID, refresh it
if (self.context.data.link_id)
if(self.context.data.link_id)
{
var _widget = link_id.widget || null;
self.getRoot().iterateOver(
@ -2034,10 +2037,13 @@ export class et2_link_list extends et2_link_string
{
var link_id = isNaN(self.context.data.link_id) ? self.context.data : self.context.data.link_id;
var row = jQuery('#link_' + (self.context.data.dom_id ? self.context.data.dom_id : self.context.data.link_id), self.list);
et2_dialog.show_dialog(
function (button)
Et2Dialog.show_dialog(
function(button)
{
if (button == et2_dialog.YES_BUTTON) self._delete_link(link_id, row);
if(button == Et2Dialog.YES_BUTTON)
{
self._delete_link(link_id, row);
}
},
egw.lang('Delete link?')
);
@ -2231,10 +2237,10 @@ export class et2_link_list extends et2_link_string
.addClass("delete icon")
.bind('click', function ()
{
et2_dialog.show_dialog(
function (button)
Et2Dialog.show_dialog(
function(button)
{
if (button == et2_dialog.YES_BUTTON)
if(button == Et2Dialog.YES_BUTTON)
{
self._delete_link(
self.value && typeof self.value.to_id != 'object' && _link_data.link_id ? _link_data.link_id : _link_data,

23
api/js/etemplate/et2_widget_password.ts
View File

@ -20,8 +20,8 @@ import {et2_createWidget, et2_register_widget, WidgetConfig} from "./et2_core_wi
import {et2_inputWidget} from './et2_core_inputWidget'
import {et2_button} from './et2_widget_button'
import {et2_textbox, et2_textbox_ro} from "./et2_widget_textbox";
import {et2_dialog} from "./et2_widget_dialog";
import {egw} from "../jsapi/egw_global";
import {Et2Dialog} from "./Et2Dialog/Et2Dialog";
/**
* Class which implements the "textbox" XET-Tag
@ -248,7 +248,7 @@ export class et2_password extends et2_textbox
// Need username & password to decrypt
let callback = function(button, user_password)
{
if(button == et2_dialog.CANCEL_BUTTON)
if(button == Et2Dialog.CANCEL_BUTTON)
{
return this.toggle_visibility(false);
}
@ -264,17 +264,18 @@ export class et2_password extends et2_textbox
this.input.attr("type", "textbox");
}
else
{
this.set_validation_error(this.egw().lang("invalid password"));
window.setTimeout(function() {
this.set_validation_error(false);
}.bind(this), 2000);
}
},
this,true,this
{
this.set_validation_error(this.egw().lang("invalid password"));
window.setTimeout(function()
{
this.set_validation_error(false);
}.bind(this), 2000);
}
},
this, true, this
).sendRequest();
}.bind(this);
let prompt = et2_dialog.show_prompt(
let prompt = Et2Dialog.show_prompt(
callback,
this.egw().lang("Enter your password"),
this.egw().lang("Authenticate")

3
api/js/etemplate/et2_widget_placeholder.ts
View File

@ -17,7 +17,6 @@
import {et2_register_widget, WidgetConfig} from "./et2_core_widget";
import {ClassWithAttributes} from "./et2_core_inheritance";
import {et2_dialog} from "./et2_widget_dialog";
import {et2_inputWidget} from "./et2_core_inputWidget";
import type {egw} from "../jsapi/egw_global";
import {et2_selectbox} from "./et2_widget_selectbox";
@ -417,7 +416,7 @@ export class et2_placeholder_snippet_select extends et2_placeholder_select
button : JQuery;
submit_callback : any;
dialog : et2_dialog;
dialog : Et2Dialog;
protected value : any;
protected LIST_URL = 'EGroupware\\Api\\Etemplate\\Widget\\Placeholder::ajax_get_placeholders';

41
api/js/etemplate/et2_widget_portlet.ts
View File

@ -14,15 +14,20 @@
et2_core_baseWidget;
*/
import {et2_createWidget, et2_register_widget, WidgetConfig} from "./et2_core_widget";
import {et2_register_widget, WidgetConfig} from "./et2_core_widget";
import {et2_valueWidget} from "./et2_core_valueWidget";
import {ClassWithAttributes} from "./et2_core_inheritance";
import {et2_action_object_impl, et2_DOMWidget} from "./et2_core_DOMWidget";
import {egw} from "../jsapi/egw_global";
import {et2_no_init} from "./et2_core_common";
import {et2_IResizeable} from "./et2_core_interfaces";
import {et2_dialog} from "./et2_widget_dialog";
import {egw_getAppObjectManager, egwActionObject, egwAction, egwActionObjectInterface} from "../egw_action/egw_action.js";
import {
egw_getAppObjectManager,
egwAction,
egwActionObject,
egwActionObjectInterface
} from "../egw_action/egw_action.js";
import {Et2Dialog} from "./Et2Dialog/Et2Dialog";
/**
* Class which implements the UI of a Portlet
@ -268,21 +273,25 @@ export class et2_portlet extends et2_valueWidget
*/
edit_settings()
{
let dialog = <et2_dialog>et2_createWidget("dialog", {
callback: jQuery.proxy(this._process_edit, this),
let dialog = new Et2Dialog(this.egw());
dialog.transformAttributes({
callback: this._process_edit.bind(this),
template: this.options.edit_template,
value: {
content: this.options.settings
},
buttons: et2_dialog.BUTTONS_OK_CANCEL
},this);
// Set seperately to avoid translation
dialog.set_title(this.egw().lang("Edit") + " " + (this.options.title || ''));
buttons: Et2Dialog.BUTTONS_OK_CANCEL
});
// Set separately to avoid translation
dialog.title = this.egw().lang("Edit") + " " + (this.options.title || '');
}
_process_edit(button_id, value)
{
if(button_id != et2_dialog.OK_BUTTON) return;
if(button_id != Et2Dialog.OK_BUTTON)
{
return;
}
// Save settings - server might reply with new content if the portlet needs an update,
@ -343,13 +352,17 @@ export class et2_portlet extends et2_valueWidget
remove_portlet()
{
let self = this;
et2_dialog.show_dialog(function(button_id) {
if(button_id != et2_dialog.OK_BUTTON) return;
Et2Dialog.show_dialog(function(button_id)
{
if(button_id != Et2Dialog.OK_BUTTON)
{
return;
}
self._process_edit(button_id, '~remove~');
self.getParent().removeChild(self);
self.destroy();
},this.egw().lang("Remove"), this.options.title,{},
et2_dialog.BUTTONS_OK_CANCEL, et2_dialog.QUESTION_MESSAGE
}, this.egw().lang("Remove"), this.options.title, {},
Et2Dialog.BUTTONS_OK_CANCEL, Et2Dialog.QUESTION_MESSAGE
);
}

49
api/js/etemplate/et2_widget_toolbar.ts
View File

@ -18,13 +18,14 @@
import {et2_DOMWidget} from "./et2_core_DOMWidget";
import {et2_createWidget, et2_register_widget, WidgetConfig} from "./et2_core_widget";
import {ClassWithAttributes} from "./et2_core_inheritance";
import {egwActionObject, egw_getObjectManager, egwActionObjectManager} from '../egw_action/egw_action.js';
import {et2_dialog} from "./et2_widget_dialog";
import {egw_getObjectManager, egwActionObject, egwActionObjectManager} from '../egw_action/egw_action.js';
import {et2_dropdown_button} from "./et2_widget_dropdown_button";
import {et2_checkbox} from "./et2_widget_checkbox";
import {et2_IInput} from "./et2_core_interfaces";
import {egw} from "../jsapi/egw_global";
import {egwIsMobile} from "../egw_action/egw_action_common.js";
import {Et2Dialog} from "./Et2Dialog/Et2Dialog";
/**
* This toolbar gets its contents from its actions
*
@ -32,7 +33,7 @@ import {egwIsMobile} from "../egw_action/egw_action_common.js";
*/
export class et2_toolbar extends et2_DOMWidget implements et2_IInput
{
static readonly _attributes : any = {
static readonly _attributes : any = {
"view_range": {
"name": "View range",
"type": "string",
@ -781,8 +782,8 @@ export class et2_toolbar extends et2_DOMWidget implements et2_IInput
private _admin_settings_dialog(_actions, _default_prefs)
{
let buttons = [
{text: egw.lang("Save"), id:"save"},
{text: egw.lang("Close"), id:"close"}
{label: egw.lang("Save"), id: "save"},
{label: egw.lang("Close"), id: "close"}
];
let self = this;
let sel_options = {actions:[]};
@ -805,34 +806,44 @@ export class et2_toolbar extends et2_DOMWidget implements et2_IInput
else
{
sel_options.actions.push({
id:key,
id: key,
value: key,
label: _actions[key]['caption'],
app: self.options.preference_app,
icon: _actions[key]['iconUrl']
});
}
if ((!_default_prefs || _default_prefs.length == 0) && _actions[key]['toolbarDefault']) content.actions.push(key);
}
if (_default_prefs && _default_prefs.length > 0) content.actions = _default_prefs;
et2_createWidget("dialog",
if((!_default_prefs || _default_prefs.length == 0) && _actions[key]['toolbarDefault'])
{
content.actions.push(key);
}
}
if(_default_prefs && _default_prefs.length > 0)
{
content.actions = _default_prefs;
}
let dialog = new Et2Dialog(this.egw());
dialog.transformAttributes({
callback: function(_button_id, _value)
{
if (_button_id == 'save' && _value)
if(_button_id == 'save' && _value)
{
if (_value.actions)
if(_value.actions)
{
let pref = jQuery.extend({}, self.preference);
for (let i in pref)
for(let i in pref)
{
pref[i] = true;
if (_value.actions.includes(i)) pref[i] = false;
if(_value.actions.includes(i))
{
pref[i] = false;
}
}
_value.actions = pref;
}
egw.json('EGroupware\\Api\\Etemplate\\Widget\\Toolbar::ajax_setAdminSettings',
[_value, self.options.preference_id, self.options.preference_app],function(_result){
[_value, self.options.preference_id, self.options.preference_app], function(_result)
{
egw.message(_result);
}).sendRequest(true);
}
@ -841,10 +852,12 @@ export class et2_toolbar extends et2_DOMWidget implements et2_IInput
buttons: buttons,
minWidth: 600,
minHeight: 300,
value:{content: content, sel_options: sel_options},
template: egw.webserverUrl+'/api/templates/default/toolbarAdminSettings.xet?1',
value: {content: content, sel_options: sel_options},
template: egw.webserverUrl + '/api/templates/default/toolbarAdminSettings.xet?1',
resizable: false
}, et2_dialog._create_parent('api'));
}
);
document.body.appendChild(dialog);
}
}
et2_register_widget(et2_toolbar, ["toolbar"]);

23
api/js/etemplate/expose.ts
View File

@ -16,13 +16,12 @@
"use strict";
import {et2_createWidget} from "./et2_core_widget";
import {et2_dialog} from "./et2_widget_dialog";
import {egw, egw_get_file_editor_prefered_mimes} from "../jsapi/egw_global";
import {et2_nextmatch} from "./et2_extension_nextmatch";
import {ET2_DATAVIEW_STEPSIZE} from "./et2_dataview_controller";
import "../jquery/blueimp/js/blueimp-gallery.min.js";
import "../../../vendor/bower-asset/jquery-touchswipe/jquery.touchSwipe.js";
import {Et2Dialog} from "./Et2Dialog/Et2Dialog";
type Constructor<T = {}> = new (...args: any[]) => T;
@ -465,14 +464,17 @@ export function expose<TBase extends Constructor>(Base: TBase)
// @ts-ignore
let mediaContent = this.getMedia(_value)[0];
et2_createWidget("dialog",{
callback: function(_btn, value){
if (_btn == et2_dialog.OK_BUTTON)
let dialog = new Et2Dialog();
dialog.transformAttributes({
callback: function(_btn, value)
{
if(_btn == Et2Dialog.OK_BUTTON)
{
}
},
beforeClose: function(){
beforeClose: function()
{
},
title: mediaContent.title,
@ -480,16 +482,17 @@ export function expose<TBase extends Constructor>(Base: TBase)
minWidth: 350,
minHeight: 200,
modal: false,
position:"right bottom,right-50 bottom-10",
position: "right bottom,right-50 bottom-10",
value: {
content: {
src:mediaContent.download_href
src: mediaContent.download_href
}
},
resizable: false,
template: egw.webserverUrl+'/api/templates/default/audio_player.xet',
dialogClass:"audio_player"
template: egw.webserverUrl + '/api/templates/default/audio_player.xet',
dialogClass: "audio_player"
});
document.body.appendChild(dialog);
}
/**

35
api/js/etemplate/vfsSelectUI.ts
View File

@ -15,12 +15,12 @@
import {EgwApp} from "../jsapi/egw_app";
import {et2_vfs, et2_vfsPath, et2_vfsSelect} from "./et2_widget_vfs";
import {egw} from "../jsapi/egw_global";
import {et2_dialog} from "./et2_widget_dialog";
import {et2_file} from "./et2_widget_file";
import {et2_textbox} from "./et2_widget_textbox";
import {et2_button} from "./et2_widget_button";
import {et2_selectbox} from "./et2_widget_selectbox";
import {et2_checkbox} from "./et2_widget_checkbox";
import {Et2Dialog} from "./Et2Dialog/Et2Dialog";
/**
@ -142,16 +142,25 @@ export class vfsSelectUI extends EgwApp
if (_data.uploaded[file].confirm && !_data.uploaded[file].confirmed)
{
let buttons = [
{text: this.egw.lang("Yes"), id: "overwrite", class: "ui-priority-primary", "default": true, image: 'check'},
{text: this.egw.lang("Rename"), id:"rename", image: 'edit'},
{text: this.egw.lang("Cancel"), id:"cancel"}
{
label: this.egw.lang("Yes"),
id: "overwrite",
class: "ui-priority-primary",
"default": true,
image: 'check'
},
{label: this.egw.lang("Rename"), id: "rename", image: 'edit'},
{label: this.egw.lang("Cancel"), id: "cancel"}
];
if (_data.uploaded[file].confirm === "is_dir")
if(_data.uploaded[file].confirm === "is_dir")
{
buttons.shift();
let dialog = et2_dialog.show_prompt(function(_button_id, _value) {
}
let dialog = Et2Dialog.show_prompt(function(_button_id, _value)
{
let uploaded = {};
uploaded[this.my_data.file] = this.my_data.data;
switch (_button_id)
switch(_button_id)
{
case "overwrite":
uploaded[this.my_data.file].confirmed = true;
@ -199,16 +208,18 @@ export class vfsSelectUI extends EgwApp
createdir(action, selected)
{
let self = this;
et2_dialog.show_prompt(function(button, dir){
if (button && dir)
Et2Dialog.show_prompt(function(button, dir)
{
if(button && dir)
{
let path = self.get_path();
self.egw.json('EGroupware\\Api\\Etemplate\\Widget\\Vfs::ajax_create_dir', [dir, path], function(msg){
self.egw.json('EGroupware\\Api\\Etemplate\\Widget\\Vfs::ajax_create_dir', [dir, path], function(msg)
{
self.egw.message(msg);
self.change_dir((path == '/' ? '' : path)+'/'+ dir);
self.change_dir((path == '/' ? '' : path) + '/' + dir);
}).sendRequest(false);
}
},this.egw.lang('New directory'),this.egw.lang('Create directory'));
}, this.egw.lang('New directory'), this.egw.lang('Create directory'));
}
/**

6
api/templates/default/etemplate2.css
View File

@ -2692,6 +2692,12 @@ div.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button.right {
padding-bottom: 10px;
}
.et2_prompt .dialog_icon {
margin-right: 2ex;
vertical-align: middle;
align-self: center;
}
.et2_prompt #value {
width: 100%;
}

30
api/templates/default/toolbarAdminSettings.xet
View File

@ -9,15 +9,23 @@
<column width="300px"/>
</columns>
<rows>
<row>
<description value="default visible actions" label="%s:"/>
<taglist id="actions" editModeEnabled="false" allowFreeEntries="false" autocomplete_url=' ' class="et2_fullWidth"/>
</row>
<row>
<description value="reset all to default" label="%s:"/>
<checkbox id="reset" statustext="This will reset toolbar preferences for all users and set them to configured default prefs."/>
</row>
</rows>
</grid>
</template>
<row>
<description value="default visible actions" label="%s:"/>
<taglist id="actions" editModeEnabled="false" allowFreeEntries="false" autocomplete_url=' '
class="et2_fullWidth"/>
</row>
<row>
<description value="reset all to default" label="%s:"/>
<checkbox id="reset"
statustext="This will reset toolbar preferences for all users and set them to configured default prefs."/>
</row>
</rows>
</grid>
<styles>
#toolbarAdminSettings {
min-width: 600px;
min-height: 300px;
}
</styles>
</template>
</overlay>