Switch placeholder widget to using Et2Dialog

This commit is contained in:
nathan 2022-03-23 11:01:36 -06:00
parent 39baec10ab
commit f5c1e21ee8
3 changed files with 33 additions and 30 deletions

View File

@ -15,7 +15,7 @@
et2_widget_description; et2_widget_description;
*/ */
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 {ClassWithAttributes} from "./et2_core_inheritance";
import {et2_dialog} from "./et2_widget_dialog"; import {et2_dialog} from "./et2_widget_dialog";
import {et2_inputWidget} from "./et2_core_inputWidget"; import {et2_inputWidget} from "./et2_core_inputWidget";
@ -24,6 +24,7 @@ import {et2_selectbox} from "./et2_widget_selectbox";
import {et2_description} from "./et2_widget_description"; import {et2_description} from "./et2_widget_description";
import {et2_link_entry} from "./et2_widget_link"; import {et2_link_entry} from "./et2_widget_link";
import type {et2_button} from "./et2_widget_button"; import type {et2_button} from "./et2_widget_button";
import {Et2Dialog} from "./Et2Dialog/Et2Dialog";
/** /**
@ -48,7 +49,7 @@ export class et2_placeholder_select extends et2_inputWidget
button : JQuery; button : JQuery;
submit_callback : any; submit_callback : any;
dialog : et2_dialog; dialog : Et2Dialog;
protected value : any; protected value : any;
protected LIST_URL = 'EGroupware\\Api\\Etemplate\\Widget\\Placeholder::ajax_get_placeholders'; protected LIST_URL = 'EGroupware\\Api\\Etemplate\\Widget\\Placeholder::ajax_get_placeholders';
@ -116,7 +117,7 @@ export class et2_placeholder_select extends et2_inputWidget
let self = this; let self = this;
let buttons = [ let buttons = [
{ {
text: this.egw().lang("Insert"), label: this.egw().lang("Insert"),
id: "submit", id: "submit",
image: "export" image: "export"
} }
@ -133,7 +134,7 @@ export class et2_placeholder_select extends et2_inputWidget
} }
} }
buttons.push({text: this.egw().lang("Cancel"), id: "cancel", image: "cancel"}); buttons.push({label: this.egw().lang("Cancel"), id: "cancel", image: "cancel"});
let data = { let data = {
content: {app: '', group: '', entry: {}}, content: {app: '', group: '', entry: {}},
@ -178,22 +179,17 @@ export class et2_placeholder_select extends et2_inputWidget
} }
}.bind(this); }.bind(this);
this.dialog = <et2_dialog>et2_createWidget("dialog", this.dialog = new Et2Dialog(this.egw());
{ this.dialog.transformAttributes({
callback: this.submit_callback, callback: this.submit_callback,
title: this.egw().lang(this.options.dialog_title) || this.egw().lang("Insert Placeholder"), title: this.options.dialog_title || "Insert Placeholder",
buttons: buttons, buttons: buttons,
minWidth: 500,
minHeight: 400,
width: 400,
value: data, value: data,
template: this.egw().webserverUrl + this.TEMPLATE, template: this.egw().webserverUrl + this.TEMPLATE,
resizable: true resizable: true
}, et2_dialog._create_parent('api')); });
this.dialog.template.uniqueId = 'api.insert_merge_placeholder'; document.body.appendChild(<HTMLElement><unknown>this.dialog);
this.dialog.addEventListener('load', this._on_template_load.bind(this));
this.dialog.div.on('load', this._on_template_load.bind(this));
} }
doLoadingFinished() doLoadingFinished()

View File

@ -25,17 +25,17 @@
</vbox> </vbox>
<styles> <styles>
/** Structural stuff **/ /** Structural stuff **/
#api\.insert_merge_placeholder_outer_box > #api\.insert_merge_placeholder_selects { #insert_merge_placeholder #_outer_box > #api\.insert_merge_placeholder_selects {
flex: 1 1 80%; flex: 1 1 80%;
} }
#api\.insert_merge_placeholder_outer_box > label.et2_label { #insert_merge_placeholder #_outer_box > label.et2_label {
flex: 0 1 auto; flex: 0 1 auto;
} }
#api\.insert_merge_placeholder_outer_box .preview { #insert_merge_placeholder #_outer_box .preview {
flex: 1 1 2em; flex: 1 1 2em;
font-size: larger; font-size: larger;
} }
select#api\.insert_merge_placeholder_app { select#_app {
flex-grow: 0; flex-grow: 0;
} }
.ui-dialog-content, div.et2_box_widget, div.et2_box_widget > div.et2_box_widget { .ui-dialog-content, div.et2_box_widget, div.et2_box_widget > div.et2_box_widget {
@ -78,7 +78,11 @@
} }
/** Cosmetics **/ /** Cosmetics **/
#api\.insert_merge_placeholder_outer_box option:first-letter { #insert_merge_placeholder {
min-width: 500px;
min-height: 250px;
}
#_outer_box option:first-letter {
text-transform: capitalize; text-transform: capitalize;
} }
</styles> </styles>

View File

@ -15,18 +15,21 @@
</hbox> </hbox>
</vbox> </vbox>
<styles> <styles>
#placeholder_snippet {
#api\.insert_merge_placeholder_outer_box > #api\.insert_merge_placeholder_selects { min-width: 500px;
min-height: 300px;
}
#_outer_box > #_selects {
flex: 1 1 50%; flex: 1 1 50%;
} }
#api\.insert_merge_placeholder_outer_box > label.et2_label { #_outer_box > label.et2_label {
flex: 0 1 auto; flex: 0 1 auto;
} }
#api\.insert_merge_placeholder_outer_box .preview { #_outer_box .preview {
flex: 1 1 50%; flex: 1 1 50%;
font-size: larger; font-size: larger;
} }
select#api\.insert_merge_placeholder_app { select#_app {
flex-grow: 0; flex-grow: 0;
} }
.ui-dialog-content, div.et2_box_widget, div.et2_box_widget > div.et2_box_widget { .ui-dialog-content, div.et2_box_widget, div.et2_box_widget > div.et2_box_widget {