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

coping with new et2-tab-box widget:

Browse Source 
- change preprocessor to always us it
- giving tab-panels again some padding-top
- change et2_grid to NOT set a width, if cell has a colspan
- switching table-layout: fixed off again, as it does not work well with infolog.edit
- remove dropped Chosen, jQuery-UI, MagicSuggest and old blueimp gallery from Gruntfile
- simplified infolog.edit a bit, which gives better results
This commit is contained in:
ralf 2022-08-03 10:57:49 +02:00
parent ddfee2483d
commit b00136f178
9 changed files with 41 additions and 149 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
Gruntfile.js
View File

@ -41,10 +41,6 @@ module.exports = function (grunt) {
files: {
"pixelegg/css/pixelegg.min.css": [
"node_modules/flatpickr/dist/themes/light.css",
"api/js/jquery/chosen/chosen.css",
"api/js/jquery/jquery-ui/themes/themes/redmond/jquery-ui.css",
"vendor/egroupware/magicsuggest/magicsuggest.css",
"api/js/jquery/blueimp/css/blueimp-gallery.min.css",
"api/js/dhtmlxtree/codebase/dhtmlxtree.css",
"api/js/egw_action/test/skins/dhtmlxmenu_egw.css",
"vendor/bower-asset/diff2html/dist/diff2html.css",
@ -59,10 +55,6 @@ module.exports = function (grunt) {
],
"pixelegg/css/mobile.min.css": [
"node_modules/flatpickr/dist/themes/light.css",
"api/js/jquery/chosen/chosen.css",
"api/js/jquery/jquery-ui/themes/themes/redmond/jquery-ui.css",
"vendor/egroupware/magicsuggest/magicsuggest.css",
"api/js/jquery/blueimp/css/blueimp-gallery.min.css",
"api/js/dhtmlxtree/codebase/dhtmlxtree.css",
"api/js/egw_action/test/skins/dhtmlxmenu_egw.css",
"vendor/bower-asset/diff2html/dist/diff2html.css",
@ -77,10 +69,6 @@ module.exports = function (grunt) {
],
"pixelegg/mobile/fw_mobile.min.css": [
"node_modules/flatpickr/dist/themes/light.css",
"api/js/jquery/chosen/chosen.css",
"api/js/jquery/jquery-ui/themes/themes/redmond/jquery-ui.css",
"vendor/egroupware/magicsuggest/magicsuggest.css",
"api/js/jquery/blueimp/css/blueimp-gallery.min.css",
"api/js/dhtmlxtree/codebase/dhtmlxtree.css",
"api/js/egw_action/test/skins/dhtmlxmenu_egw.css",
"api/js/etemplate/lib/jsdifflib/diffview.css",
@ -94,10 +82,6 @@ module.exports = function (grunt) {
],
"pixelegg/css/monochrome.min.css": [
"node_modules/flatpickr/dist/themes/light.css",
"api/js/jquery/chosen/chosen.css",
"api/js/jquery/jquery-ui/themes/themes/redmond/jquery-ui.css",
"vendor/egroupware/magicsuggest/magicsuggest.css",
"api/js/jquery/blueimp/css/blueimp-gallery.min.css",
"api/js/dhtmlxtree/codebase/dhtmlxtree.css",
"api/js/egw_action/test/skins/dhtmlxmenu_egw.css",
"vendor/bower-asset/diff2html/dist/diff2html.css",
@ -112,10 +96,6 @@ module.exports = function (grunt) {
],
"pixelegg/css/modern.min.css": [
"node_modules/flatpickr/dist/themes/light.css",
"api/js/jquery/chosen/chosen.css",
"api/js/jquery/jquery-ui/themes/themes/redmond/jquery-ui.css",
"vendor/egroupware/magicsuggest/magicsuggest.css",
"api/js/jquery/blueimp/css/blueimp-gallery.min.css",
"api/js/dhtmlxtree/codebase/dhtmlxtree.css",
"api/js/egw_action/test/skins/dhtmlxmenu_egw.css",
"vendor/bower-asset/diff2html/dist/diff2html.css",
@ -134,10 +114,6 @@ module.exports = function (grunt) {
files: {
"jdots/css/high-contrast.min.css": [
"node_modules/flatpickr/dist/themes/light.css",
"api/js/jquery/chosen/chosen.css",
"api/js/jquery/jquery-ui/themes/themes/redmond/jquery-ui.css",
"vendor/egroupware/magicsuggest/magicsuggest.css",
"api/js/jquery/blueimp/css/blueimp-gallery.min.css",
"api/js/dhtmlxtree/codebase/dhtmlxtree.css",
"api/js/egw_action/test/skins/dhtmlxmenu_egw.css",
"vendor/bower-asset/diff2html/dist/diff2html.css",
@ -155,10 +131,6 @@ module.exports = function (grunt) {
],
"jdots/css/jdots.min.css": [
"node_modules/flatpickr/dist/themes/light.css",
"api/js/jquery/chosen/chosen.css",
"api/js/jquery/jquery-ui/themes/themes/redmond/jquery-ui.css",
"vendor/egroupware/magicsuggest/magicsuggest.css",
"api/js/jquery/blueimp/css/blueimp-gallery.min.css",
"api/js/dhtmlxtree/codebase/dhtmlxtree.css",
"api/js/egw_action/test/skins/dhtmlxmenu_egw.css",
"vendor/bower-asset/diff2html/dist/diff2html.css",
@ -175,10 +147,6 @@ module.exports = function (grunt) {
],
"jdots/css/orange-green.min.css": [
"node_modules/flatpickr/dist/themes/light.css",
"api/js/jquery/chosen/chosen.css",
"api/js/jquery/jquery-ui/themes/themes/redmond/jquery-ui.css",
"vendor/egroupware/magicsuggest/magicsuggest.css",
"api/js/jquery/blueimp/css/blueimp-gallery.min.css",
"api/js/dhtmlxtree/codebase/dhtmlxtree.css",
"api/js/egw_action/test/skins/dhtmlxmenu_egw.css",
"vendor/bower-asset/diff2html/dist/diff2html.css",

14
api/etemplate.php
View File

@ -13,12 +13,12 @@
use EGroupware\Api;
// add et2- prefix to following widgets/tags, if NO <overlay legacy="true"
const ADD_ET2_PREFIX_REGEXP = '#<((/?)([vh]?box|tabbox))(/?|\s[^>]*)>#m';
const ADD_ET2_PREFIX_REGEXP = '#<((/?)([vh]?box))(/?|\s[^>]*)>#m';
const ADD_ET2_PREFIX_LAST_GROUP = 4;
// unconditional of legacy add et2- prefix to this widgets
const ADD_ET2_PREFIX_LEGACY_REGEXP = '#<(description|details|searchbox|textbox|label|avatar|lavatar|image|colorpicker|checkbox|url(-email|-phone|-fax)?|vfs-mime|vfs-uid|vfs-gid|link|link-[a-z]+|favorites)\s([^>]+)/>#m';
const ADD_ET2_PREFIX_LEGACY_LAST_GROUP = 3;
const ADD_ET2_PREFIX_LEGACY_REGEXP = '#<((/?)(tabbox|description|details|searchbox|textbox|label|avatar|lavatar|image|colorpicker|checkbox|url(-email|-phone|-fax)?|vfs-mime|vfs-uid|vfs-gid|link|link-[a-z]+|favorites))(/?|\s[^>]*)>#m';
const ADD_ET2_PREFIX_LEGACY_LAST_GROUP = 5;
// switch evtl. set output-compression off, as we can't calculate a Content-Length header with transparent compression
ini_set('zlib.output_compression', 0);
@ -176,8 +176,12 @@ function send_template()
}, $str);
// modify <(vfs-mime|link-string|link-list) --> <et2-*
$str = preg_replace(ADD_ET2_PREFIX_LEGACY_REGEXP, '<et2-$1 $'.ADD_ET2_PREFIX_LEGACY_LAST_GROUP.'></et2-$1>',
str_replace('<description/>', '<et2-description></et2-description>', $str));
$str = preg_replace_callback(ADD_ET2_PREFIX_LEGACY_REGEXP, static function (array $matches) {
return '<' . $matches[2] . 'et2-' . $matches[3] .
// web-components must not be self-closing (no "<et2-button .../>", but "<et2-button ...></et2-button>")
(substr($matches[ADD_ET2_PREFIX_LEGACY_LAST_GROUP], -1) === '/' ? substr($matches[ADD_ET2_PREFIX_LEGACY_LAST_GROUP], 0, -1) .
'></et2-' . $matches[3] : $matches[ADD_ET2_PREFIX_LEGACY_LAST_GROUP]) . '>';
}, $str);
// change link attribute only_app to et2-link attribute app and map r/o link-entry to link
$str = preg_replace_callback('#<et2-link(-[a-z]+)?([^>]*?)></et2-link(-[a-z]+)?>#su', static function ($matches)

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

@ -797,7 +797,8 @@ export class et2_grid extends et2_DOMWidget implements et2_IDetachedDOM, et2_IAl
}
}
if(cell.width != "auto")
// do NOT set cell width, if we have a colspan
if(cell.width !== "auto" && cell.colSpan <= 1)
{
td.width(cell.width);
}

3
api/src/Framework.php
View File

@ -993,9 +993,6 @@ abstract class Framework extends Framework\Extra
// Load these first
// Cascade should go:
// Libs < etemplate2 < framework/theme < app < print
// Enhanced selectboxes (et1)
self::includeCSS('/api/js/jquery/chosen/chosen.css');
// Et2Date uses flatpickr
self::includeCSS('/node_modules/flatpickr/dist/themes/light.css');

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

@ -804,7 +804,7 @@ action buttons, left aligned for "extra" controls
}
.et2_customfield_list tr td:first-child {
width: 30%;
width: 12%; /* this is somehow equivalent to 100px we usually have in the first column */
}
.et2_customfield_list tr td:nth-child(2) > *:not(.et2_checkbox):not(.et2_file):not(.et2_vfs_btn):not(.et2_button):not(.et2_radiobox),
@ -1453,6 +1453,13 @@ div.et2_vfsPath li img {
white-space: pre-wrap;
}
/**
* New et2-tabbox widget
*/
et2-tab-panel {
padding-top: 1em;
}
/**
* Tabs widget
*/
@ -2031,7 +2038,7 @@ hr {
*/
table.et2_grid {
border-collapse: collapse;
table-layout: fixed;
/* table-layout: fixed; check with infolog.edit before switching that on again! */
}
.et2_grid td {

3
infolog/templates/default/app.css
View File

@ -26,9 +26,6 @@ table.infolog_fullWidth { width: 100%; }
.inputFullWidth input { width: 100%; }
.infolog_image16 img { height: 16px; }
.infolog_responsible select {width: 120px;}
#info_contact select { width: 117px; }
#info_contact input {width: 134px;}
#info_subject {width: 100%;}
.infolog_date_duration select.et2_date_duration {

42
infolog/templates/default/edit.xet
View File

@ -36,7 +36,7 @@
<rows>
<row class="row">
<description value="Project"/>
<link-entry span="2" id="pm_id" only_app="projectmanager" onchange="app.infolog.submit_if_not_empty" blur="None" class="infolog_projectName" width="99%"/>
<link-entry span="2" id="pm_id" only_app="projectmanager" onchange="app.infolog.submit_if_not_empty" blur="None" class="infolog_projectName"/>
<description/>
</row>
<row class="row">
@ -72,9 +72,9 @@
<template id="infolog.edit.details" template="" lang="" group="0" version="1.9.001">
<grid width="100%">
<columns>
<column width="46%"/>
<column width="60"/>
<column width="49%"/>
<column width="370"/>
<column width="40"/>
<column width="390"/>
</columns>
<rows>
<row height="20" class="th">
@ -146,39 +146,40 @@
<grid width="100%">
<columns>
<column width="100"/>
<column width="215"/>
<column width="30"/>
<column width="270"/>
<column width="40"/>
<column width="100"/>
<column width="135"/>
<column width="30"/>
<column width="50"/>
<column width="250"/>
<column width="40"/>
</columns>
<rows>
<row class="dialogHeader">
<description value="Title" for="info_subject"/>
<textbox statustext="a short subject for the entry" id="info_subject" class="et2_fullWidth et2_required" maxlength="255" span="4" tabindex="1"></textbox>
<textbox type="integer" id="info_number" readonly="true"/>
<appicon src="infolog" for="info_number"/>
<hbox span="4">
<textbox statustext="a short subject for the entry" id="info_subject" class="et2_fullWidth et2_required" maxlength="255" tabindex="1"></textbox>
<description id="info_id" readonly="true" width="5em"/>
</hbox>
<appicon src="infolog" for="info_id"/>
</row>
<row class="dialogHeader2">
<description value="Type" for="info_type"/>
<menulist class="et2_fullWidth">
<menupopup statustext="Type of the log-entry: Note, Phonecall or ToDo" id="info_type" no_lang="1" onchange="widget.getInstanceManager().submit(null,false,true); return false;" />
</menulist>
<select statustext="Type of the log-entry: Note, Phonecall or ToDo" id="info_type" no_lang="1" onchange="widget.getInstanceManager().submit(null,false,true); return false;" />
<description/>
<description value="Startdate" for="info_startdate"/>
<date-time id="info_startdate" class="et2_fullWidth"
statustext="when should the ToDo or Phonecall be started, it shows up from that date in the filter open or own open (startpage)"/>
<description/>
</row>
<row class="dialogHeader3">
<description value="Contact"/>
<link-entry id="info_contact" app_icons="true"/>
<description/>
<description value="Enddate" for="info_enddate"/>
<date-time statustext="til when should the ToDo or Phonecall be finished" id="info_enddate" class="et2_fullWidth" span="4"/>
<date-time statustext="til when should the ToDo or Phonecall be finished" id="info_enddate" class="et2_fullWidth"/>
<description/>
</row>
<row class="et2_toolbar">
<description id="spacer" span="6"/>
<description id="spacer" span="5"/>
<hbox class="tab_toolbar">
<timestamper statustext="Insert timestamp into description field" id="timestamp" class="infologExtraButton infologTimestamp" target="info_des"/>
<buttononly statustext="Encrypt description" id="encrypt" class="infologExtraButton infologEncrypt" background_image="1" image="lock" onclick="app.infolog.toggleEncrypt"/>
@ -204,15 +205,13 @@
</tabpanels>
</tabbox>
</row>
<row class="th" disabled="1">
<description value="Dates, Status, Access" span="all"/>
</row>
<row class="dialogOperators">
<description value="Status" for="info_status"/>
<select class="et2_fullWidth" statustext="@status_help" id="info_status" onchange="app.infolog.statusChanged"/>
<description/>
<description value="Completed" for="info_percent"/>
<select-percent class="et2_fullWidth" statustext="Percent completed" id="info_percent" onchange="app.infolog.statusChanged"/>
<description/>
</row>
<row disabled="!@info_owner" class="dialogOperators">
<description value="Owner"/>
@ -226,6 +225,7 @@
<select-account id="info_modifier" readonly="true"/>
<date-time id="info_datemodified" readonly="true" align="right"/>
</hbox>
<description/>
</row>
<row class="dialogFooterToolbar">
<hbox span="all">
@ -241,7 +241,7 @@
statustext="Do not notify of these changes"/>
<button align="right" statustext="delete this entry" label="Delete" id="button[delete]"
onclick="if($cont[info_anz_subs]) return $cont[info_anz_subs]; et2_dialog.confirm(widget,'Delete this entry','Delete');"
image="delete" background_image="1" span="all"/>
image="delete" background_image="1"/>
</hbox>
</row>
</rows>

30
infolog/templates/pixelegg/app.css
View File

@ -68,9 +68,6 @@ table.infolog_fullWidth {
#infolog-edit_info_number:before {
content: "#";
}
#infolog-edit_info_contact {
width: 98%;
}
.infolog_fixedHeight {
height: 12px;
overflow: hidden;
@ -92,15 +89,6 @@ table.infolog_fullWidth {
.infolog_responsible select {
width: 120px;
}
#info_contact select {
width: 117px;
}
#info_contact input {
width: 134px;
}
#info_subject {
width: 100%;
}
.infolog_date_duration select.et2_date_duration {
width: 69%;
margin-left: 2px;
@ -200,9 +188,6 @@ span#infolog-index_\$\{row\}\[info_des\] {
#infolog-edit {
margin: 0;
}
#infolog-edit .et2_tabheader {
background: transparent;
}
#infolog-edit table.egwGridView_outer {
max-width: 100%;
}
@ -212,18 +197,6 @@ span#infolog-index_\$\{row\}\[info_des\] {
.infolog_fixedHeight {
height: auto;
}
div#infolog-edit_info_contact input.ui-autocomplete-input span.ui-icon-close {
background-color: #FFFFFF;
background-size: contain;
background-position: 5px 5px;
top: 9px !important;
}
.searchParent input.ui-autocomplete-input {
width: 95% !important;
}
input#infolog-edit_info_subject {
width: 98% !important;
}
/*#############################################*/
/*Tabs */
/*Beschreibung************************************/
@ -242,9 +215,6 @@ input#infolog-edit_info_subject {
#infolog-edit_infolog-edit-delegation .inputFullWidth input {
width: 96%;
}
#infolog-edit_infolog-edit-responsible .chzn-container .chzn-results {
max-height: 150px;
}
/*Historie*/
#infolog-index table.egwGridView_grid img {
height: 16px;

52
infolog/templates/pixelegg/app.less
View File

@ -44,11 +44,6 @@
#infolog-edit{
margin: 0;
// input{ max-width: 95%; }
.et2_tabheader{
background: transparent;
}
table.egwGridView_outer{
max-width: 100%;
}
@ -61,49 +56,6 @@
height: auto;
}
//TYP
select#infolog-edit_info_type {}
// Nummer hinter Typ
span#infolog-edit_info_number{}
//Kontakt
div#infolog-edit_info_contact{
input.ui-autocomplete-input {
span.ui-icon-close {
background-color: @gray_0;
background-size: contain;
background-position: 5px 5px;
top: 9px !important;
}
}
}
label.et2_label {}
// Eingabe via Select + Input
div.et2_box_widget {}
//
input.infolog-edit_info_custom_from {}
// Kategorie
// Eltereintrag
.searchParent {
input.ui-autocomplete-input {width: 95% !important;}
}
// Titel
input#infolog-edit_info_subject {width: 98% !important;}
@ -146,10 +98,6 @@ input#infolog-edit_info_subject {width: 98% !important;}
}
#infolog-edit_infolog-edit-responsible .chzn-container .chzn-results {
max-height: 150px;
}
/*Historie*/
#infolog-index table.egwGridView_grid {
img{height: 16px;}