composer/iTop
6
0
Fork 0
mirror of https://github.com/Combodo/iTop.git synced 2026-02-13 07:24:13 +01:00
Code Issues Packages Projects Releases Wiki Activity

N°1217 Console UI improvements in object forms.

Browse Source 
- Columns size optimization.
- Tooltip on (none empty) String attribute so long value can be seen without scrolling to the end of the input.
- OQL attribute displayed as Text/HTML attributes.

SVN:trunk[5170]
This commit is contained in:
Guillaume Lajarige
2017-12-27 15:51:50 +00:00
parent 76a9978fc5
commit 4fa6f85c2e
3 changed files with 39 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
application/cmdbabstract.class.inc.php
View File

@@ -1,5 +1,5 @@
<?php
// Copyright (C) 2010-2017 Combodo SARL
// Copyright (C) 2010-2018 Combodo SARL
//
// This file is part of iTop.
//
@@ -626,6 +626,8 @@ EOF
$aDetails[$sTab] = array();
$aTableStyles[] = 'vertical-align:top';
$aTableClasses = array();
$aColStyles[] = 'vertical-align:top';
$aColClasses = array();
ksort($aCols);
$iColCount = count($aCols);
@@ -633,6 +635,8 @@ EOF
{
$aTableClasses[] = 'n-cols-details';
$aTableClasses[] = $iColCount.'-cols-details';
$aColStyles[] = 'width:'.floor(100/$iColCount).'%';
}
else
{
@@ -643,7 +647,7 @@ EOF
$oPage->add('<table style="'.implode('; ', $aTableStyles).'" class="'.implode(' ', $aTableClasses).'" data-mode="'.$sEditMode.'"><tr>');
foreach($aCols as $sColIndex => $aFieldsets)
{
$oPage->add('<td style="vertical-align:top">');
$oPage->add('<td style="'.implode('; ', $aColStyles).'" class="'.implode(' ', $aColClasses).'">');
//$aDetails[$sTab][$sColIndex] = array();
$sLabel = '';
$sPreviousLabel = '';
@@ -745,7 +749,8 @@ EOF
// Checking how the field should be rendered
// Note: For view mode, this is done in cmdbAbstractObject::GetFieldAsHtml()
if(in_array($oAttDef->GetEditClass(), array('Text', 'HTML', 'CaseLog', 'CustomFields')))
// Note 2: Shouldn't this be a property of the AttDef instead an array that we have to maintain?
if(in_array($oAttDef->GetEditClass(), array('Text', 'HTML', 'CaseLog', 'CustomFields', 'OQLExpression')))
{
$val['layout'] = 'large';
}
@@ -2157,6 +2162,31 @@ EOF
$sHTMLValue = "<div class=\"field_input_zone field_input_string\"><input title=\"$sHelpText\" type=\"text\" maxlength=\"$iFieldSize\" name=\"attr_{$sFieldPrefix}{$sAttCode}{$sNameSuffix}\" value=\"".htmlentities($sDisplayValue, ENT_QUOTES, 'UTF-8')."\" id=\"$iId\"/></div>{$sValidationSpan}{$sReloadSpan}";
$aEventsList[] ='keyup';
$aEventsList[] ='change';
// Adding tooltip so we can read the whole value when its very long (eg. URL)
if(!empty($sDisplayValue))
{
$oPage->add_ready_script(
<<<EOF
$('#{$iId}').qtip( { content: $('#{$iId}').val(), show: 'mouseover', hide: 'mouseout', style: { name: 'dark', tip: 'bottomLeft' }, position: { corner: { target: 'topLeft', tooltip: 'bottomLeft' }, adjust: { y: -15}} } );
$('#{$iId}').bind('keyup', function(evt, sFormId){
var oQTipAPI = $(this).qtip('api');
if($(this).val() === '')
{
oQTipAPI.hide();
oQTipAPI.disable(true);
}
else
{
oQTipAPI.disable(false);
}
oQTipAPI.updateContent($(this).val());
});
EOF
);
}
}
break;
}
@@ -2825,7 +2855,8 @@ EOF
// Checking how the field should be rendered
// Note: For edit mode, this is done in self::GetBareProperties()
if(in_array($oAttDef->GetEditClass(), array('Text', 'HTML', 'CaseLog', 'CustomFields')))
// Note 2: Shouldn't this be a AttDef property instead of an array to maintain?
if(in_array($oAttDef->GetEditClass(), array('Text', 'HTML', 'CaseLog', 'CustomFields', 'OQLExpression')))
{
$retVal['layout'] = 'large';
}

4
css/light-grey.css
View File

@@ -1167,7 +1167,7 @@ span.form_validation {
}
/* Helper classes for object details display. */
.one-col-details {
min-width: 300px;
min-width: 400px;
max-width: 600px;
}
.n-cols-details {
@@ -1380,7 +1380,7 @@ fieldset .details > .field_container {
/* On a single column, field labels can take more width but they are limited so it doesn't feel weird when all labels are short */
}
.one-col-details .details .field_container.field_small div.field_label {
width: 145px;
width: 160px;
}
/* This is extracted from the ".details > .field_container ..." because of the fullscreen option (element is moved at the end of the body */
.field_input_text {

4
css/light-grey.scss
View File

@@ -1266,7 +1266,7 @@ span.form_validation {
/* Helper classes for object details display. */
.one-col-details {
min-width: 300px;
min-width: 400px;
max-width: 600px;
}
.n-cols-details {
@@ -1536,7 +1536,7 @@ fieldset .details>.field_container {
.one-col-details .details .field_container.field_small {
div.field_label {
/* On a single column, field labels can take more width but they are limited so it doesn't feel weird when all labels are short */
width: 145px;
width: 160px;
}
}
/* This is extracted from the ".details > .field_container ..." because of the fullscreen option (element is moved at the end of the body */