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°2847 - Rework iTopWebPage layout (WIP Part VIII)

Browse Source 
- Navigation menu: Change scrollbar color to something more visible
- Navigation menu: Close drawer when filter focused and "Escape" key hit
- Top bar: Fix element's ID in its standard delivery
- Top bar: Fix drawers opening under the top bar but above the main content
- iTopWebPage: Add AddUiBlock() method to easily add a layout/component in the page
- iTopWebPage: Fix Header/Footer parts (formerly North/South Panels) and Banner part
- WebPage: Handle duplicate stylesheets (like it was already doing for JS scripts)
This commit is contained in:
Molkobain
2020-07-30 17:42:43 +02:00
parent f59de920c1
commit 61d611c136
10 changed files with 80 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
application/itopwebpage.class.inc.php
View File

@@ -22,9 +22,11 @@ require_once(APPROOT."/application/applicationcontext.class.inc.php");
require_once(APPROOT."/application/user.preferences.class.inc.php");
use Combodo\iTop\Application\TwigBase\Twig\TwigHelper;
use Combodo\iTop\Application\UI\iUIBlock;
use Combodo\iTop\Application\UI\Layout\NavigationMenu\NavigationMenuFactory;
use Combodo\iTop\Application\UI\Layout\TopBar\TopBarFactory;
use Combodo\iTop\Application\UI\UIBlock;
use Combodo\iTop\Renderer\BlockRenderer;
/**
* Web page with some associated CSS and scripts (jquery) for a fancier display
@@ -983,6 +985,8 @@ EOF
{
$sFooterHtml .= $oExtensionInstance->GetSouthPaneHtml($this);
}
return $sFooterHtml;
}
/**
@@ -1425,19 +1429,19 @@ EOF;
// $GoHomeInitialStyle = $this->IsMenuPaneVisible() ? 'display: none;' : '';
$sHtml .= ' <table id="top-bar-table">';
$sHtml .= ' <tr>';
$sHtml .= ' <td id="open-left-pane" class="menu-pane-exclusive" style="'.$GoHomeInitialStyle.'" onclick="$(\'body\').layout().open(\'west\');">';
$sHtml .= ' <i class="fas fa-bars"></i>';
$sHtml .= ' </td>';
$sHtml .= ' <td id="go-home" class="menu-pane-exclusive" style="'.$GoHomeInitialStyle.'">';
$sHtml .= ' <a href="'.utils::GetAbsoluteUrlAppRoot().'pages/UI.php"><i class="fas fa-home"></i></a>';
$sHtml .= ' </td>';
$sHtml .= ' <td class="top-bar-spacer menu-pane-exclusive" style="'.$GoHomeInitialStyle.'">';
$sHtml .= ' </td>';
$sHtml .= ' <td id="top-bar-table-breadcrumb">';
$sHtml .= ' <div id="itop-breadcrumb"></div>';
$sHtml .= ' </td>';
// $sHtml .= ' <table id="top-bar-table">';
// $sHtml .= ' <tr>';
// $sHtml .= ' <td id="open-left-pane" class="menu-pane-exclusive" style="'.$GoHomeInitialStyle.'" onclick="$(\'body\').layout().open(\'west\');">';
// $sHtml .= ' <i class="fas fa-bars"></i>';
// $sHtml .= ' </td>';
// $sHtml .= ' <td id="go-home" class="menu-pane-exclusive" style="'.$GoHomeInitialStyle.'">';
// $sHtml .= ' <a href="'.utils::GetAbsoluteUrlAppRoot().'pages/UI.php"><i class="fas fa-home"></i></a>';
// $sHtml .= ' </td>';
// $sHtml .= ' <td class="top-bar-spacer menu-pane-exclusive" style="'.$GoHomeInitialStyle.'">';
// $sHtml .= ' </td>';
// $sHtml .= ' <td id="top-bar-table-breadcrumb">';
// $sHtml .= ' <div id="itop-breadcrumb"></div>';
// $sHtml .= ' </td>';
$sHtml .= ' <td id="top-bar-table-search">';
$sHtml .= ' <div id="global-search"><form action="'.utils::GetAbsoluteUrlAppRoot().'pages/UI.php">';
$sHtml .= ' <table id="top-left-buttons-area"><tr>';
@@ -1446,9 +1450,9 @@ EOF;
$sHtml .= ' <td id="top-left-newsroom-cell">'.$sNewsRoomInitialImage.'</td>';
$sHtml .= ' <td id="top-left-logoff-cell">'.self::FilterXSS($sLogOffMenu).'</td>';
$sHtml .= ' </tr></table></form></div>';
$sHtml .= ' </td>';
$sHtml .= ' </tr>';
$sHtml .= ' </table>';
// $sHtml .= ' </td>';
// $sHtml .= ' </tr>';
// $sHtml .= ' </table>';
// $sHtml .= ' <div id="global-search"><form action="'.utils::GetAbsoluteUrlAppRoot().'pages/UI.php"><table><tr><td></td><td><div id="global-search-area"><input id="global-search-input" type="text" name="text" placeholder="'.$sText.'"></input><div '.$sOnClick.' id="global-search-image"></div></div></td>';
// $sHtml .= '<td><a id="help-link" href="'.$sOnlineHelpUrl.'" target="_blank"><img title="'.Dict::S('UI:Help').'" src="../images/help.png?t='.utils::GetCacheBusterTimestamp().'"/></td>';
@@ -1718,6 +1722,41 @@ EOF
);
}
/**
* Add a UIBlock in the page by dispatching its parts in the right places (CSS, JS, HTML)
*
* @param \Combodo\iTop\Application\UI\iUIBlock $oBlock
*
* @return void
* @throws \ReflectionException
* @throws \Twig\Error\LoaderError
* @throws \Twig\Error\RuntimeError
* @throws \Twig\Error\SyntaxError
* @throws \Exception
* @since 2.8.0
*/
public function AddUiBlock(iUIBlock $oBlock)
{
$oBlockRenderer = new BlockRenderer($oBlock);
// Add HTML
$this->add($oBlockRenderer->RenderHtml());
// Add inline CSS and JS
$this->add_style($oBlockRenderer->RenderCssInline());
$this->add_ready_script($oBlockRenderer->RenderJsInline());
// Add external files
foreach($oBlockRenderer->GetCssFiles() as $sFile)
{
$this->add_linked_stylesheet($sFile);
}
foreach($oBlockRenderer->GetJsFiles() as $sFile)
{
$this->add_linked_script($sFile);
}
}
/**
* Adds a script to be executed when the DOM is ready (typical JQuery use), right before add_ready_script
*