some css for new dialog: left aligning buttons as everywhere in EGroupware, auto-size dialog, static show_prompt method to display a prompt, fixed not working translation of standard buttons

This commit is contained in:
Ralf Becker 2013-04-23 16:51:00 +00:00
parent 4b2b4ca336
commit 78449edd4c
6 changed files with 99 additions and 28 deletions

View File

@ -177,22 +177,22 @@ var et2_dialog = et2_widget.extend({
- button ids copied from et2_dialog static, since the constants are not defined yet
*/
//BUTTONS_OK: 0,
[{"button_id": 1,"text": egw.lang('ok'),"default":true}],
[{"button_id": 1,"text": 'ok', "default":true}],
//BUTTONS_OK_CANCEL: 1,
[
{"button_id": 1,"text": egw.lang('ok'), "default":true},
{"button_id": 0,"text": egw.lang('cancel')}
{"button_id": 1,"text": 'ok', "default":true},
{"button_id": 0,"text": 'cancel'}
],
//BUTTONS_YES_NO: 2,
[
{"button_id": 2,"text": egw.lang('yes'),"default":true},
{"button_id": 3,"text": egw.lang('no')}
{"button_id": 2,"text": 'yes', "default":true},
{"button_id": 3,"text": 'no'}
],
//BUTTONS_YES_NO_CANCEL: 3,
[
{"button_id": 2,"text": egw.lang('yes'),"default":true},
{"button_id": 3,"text": egw.lang('no')},
{"button_id": 0,"text": egw.lang('cancel')}
{"button_id": 2,"text": 'yes', "default":true},
{"button_id": 3,"text": 'no'},
{"button_id": 0,"text": 'cancel'}
]
],
@ -219,6 +219,8 @@ var et2_dialog = et2_widget.extend({
self.click(event.target,id);
};
})(this._buttons[i][j].button_id);
// translate button texts, as translations are not available before
this._buttons[i][j].text = egw.lang(this._buttons[i][j].text);
}
}
@ -394,6 +396,8 @@ var et2_dialog = et2_widget.extend({
buttons: typeof this.options.buttons == "number" ? this._buttons[this.options.buttons] : this.options.buttons,
modal: this.options.modal,
resizable: this.options.resizable,
width: "auto",
maxWidth: 640,
title: this.options.title,
open: function() {
// Focus default button so enter works
@ -436,28 +440,58 @@ jQuery.extend(et2_dialog,
/**
* Show a confirmation dialog
*
* @param function callback Function called when the user clicks a button. The context will be the et2_dialog widget, and the button constant is passed in.
* @param String message Message to be place in the dialog. Usually just text, but DOM nodes will work too.
* @param String title Text in the top bar of the dialog.
* @param integer buttons One of the BUTTONS_ constants defining the set of buttons at the bottom of the box
* @param integer type One of the message constants. This defines the style of the message.
* @param String icon URL of an icon to display. If not provided, a type-specific icon will be used.
* @param Object value Default values for display
* @param function _callback Function called when the user clicks a button. The context will be the et2_dialog widget, and the button constant is passed in.
* @param String _message Message to be place in the dialog. Usually just text, but DOM nodes will work too.
* @param String _title Text in the top bar of the dialog.
* @param any _value passed unchanged to callback as 2. parameter
* @param integer|Array _buttons One of the BUTTONS_ constants defining the set of buttons at the bottom of the box
* @param integer _type One of the message constants. This defines the style of the message.
* @param String _icon URL of an icon to display. If not provided, a type-specific icon will be used.
*/
show_dialog: function(callback, message, title, buttons, type, icon, value) {
if(!callback || typeof callback == "undefined")
{
callback = function() {return;};
}
show_dialog: function(_callback, _message, _title, _value, _buttons, _type, _icon){
// Just pass them along, widget handles defaults & missing
return et2_createWidget("dialog", {
callback: callback,
message: message,
title: title,
buttons: buttons,
dialog_type: type,
icon: icon,
value: value
callback: _callback||function(){},
message: _message,
title: _title||egw.lang('Confirmation required'),
buttons: _buttons||et2_dialog.BUTTONS_YES_NO,
dialog_type: _type||et2_dialog.QUESTION_MESSAGE,
icon: _icon,
value: _value
});
},
/**
* Show a prompt dialog
*
* @param function _callback Function called when the user clicks a button. The context will be the et2_dialog widget, and the button constant is passed in.
* @param String _message Message to be place in the dialog. Usually just text, but DOM nodes will work too.
* @param String _title Text in the top bar of the dialog.
* @param String _value for prompt, passed to callback as 2. parameter
* @param integer|Array _buttons One of the BUTTONS_ constants defining the set of buttons at the bottom of the box
*/
show_prompt: function(_callback, _message, _title, _value, _buttons)
{
var callback = _callback;
// Just pass them along, widget handles defaults & missing
return et2_createWidget("dialog", {
callback: function(_button_id, _value) {
if (typeof callback == "function")
{
callback.call(this, _button_id, _value.value);
}
},
title: _title||egw.lang('Input required'),
buttons: _buttons||et2_dialog.BUTTONS_OK_CANCEL,
value: {
content: {
value: _value,
message: _message
}
},
template: egw.webserverUrl+'/etemplate/templates/default/prompt.xet',
class: "et2_prompt"
});
}
});

View File

@ -89,6 +89,7 @@ comment etemplate de Kommentar
confirm etemplate de bestätigen
confirmation message or custom javascript (returning true or false) etemplate de Bestätigungsmeldung oder spezielles Javascript (true oder false zurückliefernd)
confirmation necesary or custom java-script etemplate de Bestätigung notwendig oder spezielles Javascript
confirmation required etemplate de Bestätigung erforderlich
contact etemplate de Kontakt
contact field to show etemplate de Kontaktfeld zum Anzeigen
contact fields etemplate de Kontaktfelder
@ -229,6 +230,7 @@ increment version to not overwrite the existing template etemplate de Version er
index/name of returned content (name of the template, link / method for image) etemplate de Index / Name des zurückgelieferten Inhalts (Name des eTemplates oder Link/Methode für Grafik)
indexed etemplate de Indiziert
indexoptions etemplate de Indexoptionen
input required etemplate de Eingabe erforderlich
insert a column before etemplate de eine Spalte davor einfügen
insert a column behind etemplate de eine Spalte dahinter einfügen
insert a row above etemplate de eine Zeile darüber einfügen

View File

@ -89,6 +89,7 @@ comment etemplate en Comment
confirm etemplate en Confirm
confirmation message or custom javascript (returning true or false) etemplate en Confirmation message or custom javascript, returning true or false.
confirmation necesary or custom java-script etemplate en Confirmation necessary or custom java-script
confirmation required etemplate en Confirmation required
contact etemplate en Contact
contact field to show etemplate en Contact field to show
contact fields etemplate en Contact fields
@ -231,6 +232,7 @@ increment version to not overwrite the existing template etemplate en Increment
index/name of returned content (name of the template, link / method for image) etemplate en Index/name of returned content, name of the Template, link / method for image.
indexed etemplate en Indexed.
indexoptions etemplate en Index options
input required etemplate en Input required
insert a column before etemplate en Insert a column before
insert a column behind etemplate en Insert a column after
insert a row above etemplate en Insert a row above

View File

@ -2,7 +2,7 @@
/**
* EGroupware - eTemplates for Application etemplate
* http://www.egroupware.org
* generated by soetemplate::dump4setup() 2013-02-20 14:04
* generated by soetemplate::dump4setup() 2013-04-23 11:56
*
* @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
* @package etemplate
@ -157,6 +157,8 @@ $templ_data[] = array('name' => 'etemplate.nm-test.rows','template' => '','lang'
$templ_data[] = array('name' => 'etemplate.popup.manual','template' => '','lang' => '','group' => '0','version' => '1.2','data' => 'a:1:{i:0;a:5:{s:4:"type";s:6:"manual";s:4:"data";a:2:{i:0;a:0:{}i:1;a:1:{s:1:"A";a:1:{s:4:"type";s:5:"label";}}}s:4:"rows";i:1;s:4:"cols";i:1;s:4:"span";s:20:",popupManual noPrint";}}','size' => '','style' => '.popupManual { position: absolute; right: 27px; top: 24px; }','modified' => '1131553453',);
$templ_data[] = array('name' => 'etemplate.prompt','template' => '','lang' => '','group' => '0','version' => '1.9.001','data' => 'a:1:{i:0;a:8:{s:4:"type";s:4:"hbox";s:4:"data";a:2:{i:0;a:0:{}i:1;a:1:{s:1:"A";a:1:{s:4:"type";s:5:"label";}}}s:4:"rows";i:1;s:4:"cols";i:1;s:4:"size";s:1:"2";i:1;a:3:{s:4:"type";s:5:"image";s:4:"name";s:11:"dialog_help";s:4:"span";s:12:",dialog_icon";}i:2;a:5:{s:4:"type";s:4:"vbox";s:4:"size";s:1:"2";i:1;a:2:{s:4:"type";s:4:"html";s:4:"name";s:7:"message";}i:2;a:2:{s:4:"type";s:4:"text";s:4:"name";s:5:"value";}s:4:"span";s:18:",ui-dialog-content";}s:4:"span";s:11:",et2_prompt";}}','size' => '','style' => '','modified' => '1366703994',);
$templ_data[] = array('name' => 'etemplate.stack-test','template' => '','lang' => '','group' => '0','version' => '','data' => 'a:1:{i:0;a:4:{s:4:"type";s:4:"grid";s:4:"data";a:2:{i:0;a:0:{}i:1;a:1:{s:1:"A";a:4:{s:4:"type";s:4:"deck";s:4:"size";s:1:"2";i:1;a:3:{s:4:"type";s:5:"label";s:5:"label";s:10:"Hallo Ralf";s:4:"name";s:4:"ralf";}i:2;a:3:{s:4:"type";s:5:"label";s:5:"label";s:10:"Hallo Welt";s:4:"name";s:4:"welt";}}}}s:4:"rows";i:1;s:4:"cols";i:1;}}','size' => '','style' => '','modified' => '1047754314',);
$templ_data[] = array('name' => 'etemplate.tab_widget','template' => '','lang' => '','group' => '0','version' => '1.3.001','data' => 'a:1:{i:0;a:5:{s:4:"type";s:4:"grid";s:4:"data";a:3:{i:0;a:1:{s:2:"c2";s:7:"row_off";}i:1;a:1:{s:1:"A";a:5:{s:4:"name";s:4:"tabs";s:4:"type";s:4:"hbox";s:4:"size";s:1:"1";i:1;a:1:{s:4:"type";s:5:"label";}s:4:"span";s:10:",TabHeader";}}i:2;a:1:{s:1:"A";a:6:{s:5:"class";s:8:"tab_body";s:4:"name";s:4:"body";s:4:"type";s:4:"deck";s:4:"size";s:1:"1";i:1;a:1:{s:4:"type";s:5:"label";}s:4:"span";s:9:",tab_body";}}}s:4:"cols";i:1;s:4:"rows";i:2;s:4:"size";s:11:"100%,,,,0,0";}}','size' => '100%,,,,0,0','style' => '','modified' => '1173408035',);

View File

@ -1061,3 +1061,21 @@ div.et2_progress > div {
color: #ffffff;
background-color: #3875d7;
}
/**
* et2_dialog: EGroupware left aligns all buttons, but [Delete]
*/
div.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
float: left;
}
div.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button {
float: left;
margin-right: 1em;
}
.et2_prompt #message {
white-space: pre-wrap;
padding-bottom: 10px;
}
.et2_prompt #value {
width: 100%;
}

View File

@ -0,0 +1,13 @@
<?xml version="1.0"?>
<!-- $Id$ -->
<overlay>
<template id="etemplate.prompt" template="" lang="" group="0" version="1.9.001">
<hbox class="et2_prompt">
<image src="dialog_help" class="dialog_icon"/>
<vbox class="ui-dialog-content">
<html id="message"/>
<textbox id="value"/>
</vbox>
</hbox>
</template>
</overlay>