Skip to content
GitLab
Unverified Commit e1809817 authored by Côme Chilliet's avatar Côme Chilliet
Browse files

:tractor: feat(dialogs) Clean up dialog pop-ups template 

Move styling to CSS theme
Move HTML to smarty template
Render everything in one pass
Cleaned up some variable and function names
Add some strict typing

Should render and behave the same as before
parent 53af319e
dev 6342-update-the-locales-for-1-5 6344-template-issue-when-creating-a-template-with-empty-password-error-message-should-not-be-seen 6365-core-locking-mechanism-is-not-changing-the-mail-ressource-it-does-lock-the-mail-account 6365-core-when-lock-mechanism-is-trigger-the-user-should-not-be-editable-if-not-unlock 6378-orcid-test-method-is-wrong-and-break-orcid-saving core-php8 master fusiondirectory-1.5 fusiondirectory-1.4
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 271 additions and 242 deletions
+271 -242
html/themes/breezy/dialog.css
+ 80
− 0
View file @ e1809817
div.msgbackground {
position: absolute;
left: 0px;
top: 0px;
right: 0px;
bottom: 0px;
z-index: 100;
overflow: hidden;
background-image: url(../../images/opacity_black.png);
}
div.msgtrace {
position: absolute;
left: 0px;
top: 0px;
right: 0px;
}
div.msgtitle {
width: auto;
background-color: #f0f0f0;
......@@ -15,6 +31,10 @@ div.msgdialog {
margin: auto;
top: 200px;
}
div.msgdialog div.msgcontent {
z-index: 250;
width: 100%;
}
div.msgdialog .description {
font-style: italic;
}
......@@ -30,3 +50,63 @@ div.msgdialog .description {
width: auto;
}
}
.error,
.notice,
.success,
.info {
border: 2px solid #c0c2c3;
margin: .2em;
padding: .3em;
}
.error {
background: #fbe3e4;
color: #8a1f11;
border-color: #fbc2c4;
}
.error h1,
.error h2,
.error h3,
.error h4,
.error h5,
.error h6 {
color: #8a3700;
}
.notice {
background: #fff6bf;
color: #514721;
border-color: #ffd324;
}
.notice h1,
.notice h2,
.notice h3,
.notice h4,
.notice h5,
.notice h6 {
color: #412701;
}
.success {
background: #f3f4f4;
color: #264409;
border-color: #f3f4f4;
}
.success h1,
.success h2,
.success h3,
.success h4,
.success h5,
.success h6 {
color: #378a00;
}
.info {
background: #d5edf8;
color: #205791;
border-color: #92cae4;
}
.info h1,
.info h2,
.info h3,
.info h4,
.info h5,
.info h6 {
color: #31363b;
}
html/themes/breezy/less/dialog.less
+ 60
− 0
View file @ e1809817
@import "colors";
div.msgbackground {
position: absolute;
left: 0px;
top: 0px;
right: 0px;
bottom: 0px;
z-index: 100;
overflow: hidden;
background-image: url(../../images/opacity_black.png);
}
div.msgtrace {
position: absolute;
left: 0px;
top: 0px;
right: 0px;
}
div.msgtitle {
width: auto;
background-color: @background-header-color;
......@@ -11,6 +29,10 @@ div.msgtitle {
}
div.msgdialog {
div.msgcontent {
z-index: 250;
width: 100%;
}
width: 60%;
z-index: 150;
position: relative;
......@@ -31,3 +53,41 @@ div.msgdialog {
width: auto;
}
}
.error, .notice, .success, .info {
border: 2px solid @border-color-1;
margin: .2em;
padding: .3em;
}
.error {
background: @error-background-color;
color: @error-text-color;
border-color: @error-border-color;
h1,h2,h3,h4,h5,h6 {
color: @error-title-color;
}
}
.notice {
background: @notice-background-color;
color: @notice-text-color;
border-color: @notice-border-color;
h1,h2,h3,h4,h5,h6 {
color: @notice-title-color;
}
}
.success {
background: @success-background-color;
color: @success-text-color;
border-color: @success-border-color;
h1,h2,h3,h4,h5,h6 {
color: @success-title-color;
}
}
.info {
background: @info-background-color;
color: @info-text-color;
border-color: @info-border-color;
h1,h2,h3,h4,h5,h6 {
color: @info-title-color;
}
}
html/themes/breezy/less/style.less
+ 0
− 38
View file @ e1809817
......@@ -376,44 +376,6 @@ span.mark {
color: @text-color-mark;
}
.error, .notice, .success, .info {
border: 2px solid @border-color-1;
margin: .2em;
padding: .3em;
}
.error {
background: @error-background-color;
color: @error-text-color;
border-color: @error-border-color;
h1,h2,h3,h4,h5,h6 {
color: @error-title-color;
}
}
.notice {
background: @notice-background-color;
color: @notice-text-color;
border-color: @notice-border-color;
h1,h2,h3,h4,h5,h6 {
color: @notice-title-color;
}
}
.success {
background: @success-background-color;
color: @success-text-color;
border-color: @success-border-color;
h1,h2,h3,h4,h5,h6 {
color: @success-title-color;
}
}
.info {
background: @info-background-color;
color: @info-text-color;
border-color: @info-border-color;
h1,h2,h3,h4,h5,h6 {
color: @info-title-color;
}
}
/* Header */
div#header-left {
......
html/themes/breezy/style.css
+ 0
− 60
View file @ e1809817
......@@ -358,66 +358,6 @@ span.informal {
span.mark {
color: #dd0000;
}
.error,
.notice,
.success,
.info {
border: 2px solid #c0c2c3;
margin: .2em;
padding: .3em;
}
.error {
background: #fbe3e4;
color: #8a1f11;
border-color: #fbc2c4;
}
.error h1,
.error h2,
.error h3,
.error h4,
.error h5,
.error h6 {
color: #8a3700;
}
.notice {
background: #fff6bf;
color: #514721;
border-color: #ffd324;
}
.notice h1,
.notice h2,
.notice h3,
.notice h4,
.notice h5,
.notice h6 {
color: #412701;
}
.success {
background: #f3f4f4;
color: #264409;
border-color: #f3f4f4;
}
.success h1,
.success h2,
.success h3,
.success h4,
.success h5,
.success h6 {
color: #378a00;
}
.info {
background: #d5edf8;
color: #205791;
border-color: #92cae4;
}
.info h1,
.info h2,
.info h3,
.info h4,
.info h5,
.info h6 {
color: #31363b;
}
/* Header */
html.ltr div#header-left {
float: left;
......
ihtml/themes/breezy/msg_dialog.tpl
+ 55
− 62
View file @ e1809817
{if $frame}
<div
id="e_layer2"
style="
position:absolute;
left:0px;
top:0px;
right:0px;
bottom:0px;
z-index:100;
overflow:hidden;
background-image:url(images/opacity_black.png);">
{else}
<div
id="e_layer2"
class="msgbackground">
{if $s_Trace != "" && $i_TraceCnt != 0}
<div id="trace_{$i_ID}"
style="
display:none;
position:absolute;
left:0px;
top:0px;
right:0px;">
{$s_Trace}
</div>
{/if}
{foreach from=$dialogInfos item=dialog}
{if $i_Type == $smarty.const.INFO_DIALOG || $i_Type == $smarty.const.CONFIRM_DIALOG}
<div id="e_layer{$i_ID}" class="info msgdialog">
{elseif $i_Type == $smarty.const.WARNING_DIALOG}
<div id="e_layer{$i_ID}" class="notice msgdialog">
{else}
<div id="e_layer{$i_ID}" class="error msgdialog">
{/if}
<div id="e_layerTitle{$i_ID}" class="msgtitle">
<h2>
{if $i_Type == $smarty.const.ERROR_DIALOG}
<img src="geticon.php?context=status&amp;icon=dialog-error&amp;size=32" class="center" alt="{t}Error{/t}"/>
{elseif $i_Type == $smarty.const.WARNING_DIALOG}
<img src="geticon.php?context=status&amp;icon=dialog-warning&amp;size=32" class="center" alt="{t}Warning{/t}"/>
{elseif $i_Type == $smarty.const.INFO_DIALOG || $i_Type == $smarty.const.CONFIRM_DIALOG}
<img src="geticon.php?context=status&amp;icon=dialog-information&amp;size=32" class="center" alt="{t}Information{/t}"/>
{/if}
{$s_Title}
</h2>
{if ($dialog.trace != "")}
<div id="trace_{$dialog.id}"
class="msgtrace"
style="display:none;">
{$dialog.trace}
</div>
{/if}
<div style="z-index:250;width:100%;">
{$s_Message}
</div>
<div class="plugbottom">
{if $s_Trace != "" && $i_TraceCnt != 0}
<input type="button" id="Trace" name="Trace"
onClick="$('trace_{$i_ID}').toggle();" value="{t}Trace{/t}"/>
{/if}
<input type="button" id="MSG_OK{$i_ID}" name="MSG_OK{$i_ID}"
onClick="next_msg_dialog();" value="{t}Ok{/t}"/>
{if $i_Type == $smarty.const.CONFIRM_DIALOG}
<input type="button" name="MSG_CANCEL{$i_ID}"
onClick="next_msg_dialog();" value="{t}Cancel{/t}"/>
{/if}
{if $dialog.type == $smarty.const.INFO_DIALOG || $dialog.type == $smarty.const.CONFIRM_DIALOG}
<div id="e_layer{$dialog.id}" class="info msgdialog">
{elseif $dialog.type == $smarty.const.WARNING_DIALOG}
<div id="e_layer{$dialog.id}" class="notice msgdialog">
{else}
<div id="e_layer{$dialog.id}" class="error msgdialog">
{/if}
<div id="e_layerTitle{$dialog.id}" class="msgtitle">
<h2>
{if $dialog.type == $smarty.const.ERROR_DIALOG}
<img src="geticon.php?context=status&amp;icon=dialog-error&amp;size=32" class="center" alt="{t}Error{/t}"/>
{elseif $dialog.type == $smarty.const.WARNING_DIALOG}
<img src="geticon.php?context=status&amp;icon=dialog-warning&amp;size=32" class="center" alt="{t}Warning{/t}"/>
{elseif $dialog.type == $smarty.const.INFO_DIALOG || $dialog.type == $smarty.const.CONFIRM_DIALOG}
<img src="geticon.php?context=status&amp;icon=dialog-information&amp;size=32" class="center" alt="{t}Information{/t}"/>
{/if}
{$dialog.title}
</h2>
</div>
<div class="msgcontent">
{$dialog.message}
</div>
<div class="plugbottom">
{if ($dialog.trace != "")}
<input type="button" id="Trace" name="Trace"
onClick="$('trace_{$dialog.id}').toggle();" value="{t}Trace{/t}"/>
{/if}
<input type="button" id="MSG_OK{$dialog.id}" name="MSG_OK{$dialog.id}"
onClick="next_msg_dialog();" value="{t}Ok{/t}"/>
{if $dialog.type == $smarty.const.CONFIRM_DIALOG}
<input type="button" name="MSG_CANCEL{$dialog.id}"
onClick="next_msg_dialog();" value="{t}Cancel{/t}"/>
{/if}
</div>
</div>
</div>
<script type="text/javascript">
focus_field('MSG_OK{$i_ID}');
</script>
<script type="text/javascript">
focus_field('MSG_OK{$dialog.id}');
</script>
{/foreach}
{/if}
</div>
<input type="hidden" name="pending_msg_dialogs" id="pending_msg_dialogs" value="{','|implode:$dialogIds}"/>
<input type="hidden" name="closed_msg_dialogs" id="closed_msg_dialogs" value=""/>
<input type="hidden" name="current_msg_dialogs" id="current_msg_dialogs" value=""/>
<input type="hidden" name="js_debug" id="js_debug"/>
include/class_msg_dialog.inc
+ 76
− 82
View file @ e1809817
......@@ -2,7 +2,7 @@
/*
This code is part of FusionDirectory (http://www.fusiondirectory.org/)
Copyright (C) 2003-2010 Cajus Pollmeier
Copyright (C) 2011-2016 FusionDirectory
Copyright (C) 2011-2020 FusionDirectory
This program is free software; you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
......@@ -37,32 +37,32 @@ define('FATAL_ERROR_DIALOG', 10006);
*/
class msg_dialog
{
private $s_Title = 'Undefined';
private $s_Message = 'Undefined';
private $i_Type = INFO_DIALOG;
private $i_ID = 0;
private $s_Title;
private $s_Message;
private $i_Type;
private $i_ID;
private $a_Trace = [];
/*!
* \brief Message dialog constructor
*
* \param string $s_title The title of the message dialog
* \param string $title The title of the message dialog
*
* \param string $s_message The message of the message dialog
* \param string $message The message of the message dialog
*
* \param string $i_type The type of the message dialog, by default = INFO_DIALOG
* \param string $type The type of the message dialog, by default = INFO_DIALOG
*/
public function __construct ($s_title, $s_message, $i_type)
public function __construct ($title, $message, $type = INFO_DIALOG)
{
if (!in_array($i_type, [INFO_DIALOG,WARNING_DIALOG,ERROR_DIALOG,CONFIRM_DIALOG,FATAL_ERROR_DIALOG])) {
if (!in_array($type, [INFO_DIALOG,WARNING_DIALOG,ERROR_DIALOG,CONFIRM_DIALOG,FATAL_ERROR_DIALOG])) {
trigger_error('Invalid msg_dialog type.');
$i_type = INFO_DIALOG;
$type = INFO_DIALOG;
}
$this->i_ID = preg_replace('/[^0-9]*/', '', microtime());
$this->s_Title = $s_title;
$this->s_Message = $s_message;
$this->i_Type = $i_type;
$this->i_ID = (int)preg_replace('/[^0-9]*/', '', microtime());
$this->s_Title = $title;
$this->s_Message = $message;
$this->i_Type = $type;
}
protected function show ()
......@@ -98,7 +98,7 @@ class msg_dialog
if ($this->i_Type == FATAL_ERROR_DIALOG) {
restore_error_handler();
error_reporting(E_ALL);
echo $this->execute();
echo $this->renderFatalErrorDialog();
} else {
if (session::is_set('msg_dialogs')) {
$msg_dialogs = session::get('msg_dialogs');
......@@ -113,15 +113,15 @@ class msg_dialog
/*!
* \brief Display a message dialog
*
* \param string $s_title The title of the message dialog
* \param string $title The title of the message dialog
*
* \param string $s_message The message of the message dialog
* \param string $message The message of the message dialog
*
* \param string $i_type The type of the message dialog, by default = INFO_DIALOG
* \param string $type The type of the message dialog, by default = INFO_DIALOG
*/
public static function display ($s_title, $s_message, $i_type = INFO_DIALOG)
public static function display ($title, $message, $type = INFO_DIALOG)
{
$dialog = new msg_dialog($s_title, $s_message, $i_type);
$dialog = new msg_dialog($title, $message, $type);
$dialog->show();
}
......@@ -142,7 +142,7 @@ class msg_dialog
*
* \return The identifier of the message dialog
*/
public function get_ID ()
public function getId (): int
{
return $this->i_ID;
}
......@@ -150,47 +150,35 @@ class msg_dialog
/*!
* \brief Run the message dialog
*/
public function execute ()
protected function renderFatalErrorDialog ()
{
global $config;
if ($this->i_Type == FATAL_ERROR_DIALOG) {
$display =
'<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/transitional.dtd">
<html><head>
<title>FusionDirectory startup failed</title>
</head><body>';
if (isset($config) && is_object($config) &&
$config->get_cfg_value('displayerrors') == 'TRUE') {
list($trace, ) = html_trace();
$display .= $trace;
}
$display .=
'<table style="width:100%; border:2px solid red;">
<tr>
<td style="vertical-align:top;padding:10px">
<img src="geticon.php?context=status&amp;icon=dialog-error&amp;size=32" alt="'._('Error').'"/>
</td>
<td style="width:100%">
<b>'.$this->s_Title.'</b><br/>
'.$this->s_Message.'<br><br/>
'._('Please fix the above error and reload the page.').'
</td>
</tr>
</table></body></html>';
return $display;
} else {
$smarty = get_smarty();
$smarty->assign('s_Trace', print_a($this->a_Trace, TRUE));
$smarty->assign('i_TraceCnt', count($this->a_Trace));
$smarty->assign('i_Type', $this->i_Type);
$smarty->assign('s_Message', $this->s_Message);
$smarty->assign('s_Title', $this->s_Title);
$smarty->assign('i_ID', $this->i_ID);
$smarty->assign('frame', FALSE);
$smarty->assign('JS', TRUE);
return $smarty->fetch(get_template_path('msg_dialog.tpl'));
$display =
'<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/transitional.dtd">
<html><head>
<title>FusionDirectory startup failed</title>
</head><body>';
if (isset($config) && is_object($config) &&
$config->get_cfg_value('displayerrors') == 'TRUE') {
list($trace, ) = html_trace();
$display .= $trace;
}
$display .=
'<table style="width:100%; border:2px solid red;">
<tr>
<td style="vertical-align:top;padding:10px">
<img src="geticon.php?context=status&amp;icon=dialog-error&amp;size=32" alt="'._('Error').'"/>
</td>
<td style="width:100%">
<b>'.$this->s_Title.'</b><br/>
'.$this->s_Message.'<br><br/>
'._('Please fix the above error and reload the page.').'
</td>
</tr>
</table></body></html>';
return $display;
}
/*!
......@@ -198,44 +186,50 @@ class msg_dialog
*
* \return True if is confirmed, else return false
*/
public function is_confirmed ()
public function is_confirmed (): bool
{
return isset($_POST['MSG_OK'.$this->i_ID]);
}
/*!
* \brief Accessor of the message dialog
* \brief Return an array with infos for the template
*/
public static function get_dialogs ()
protected function getDialogInfos (): array
{
$return = "";
$dialog_ids = "";
return [
'id' => $this->i_ID,
'type' => $this->i_Type,
'title' => $this->s_Title,
'message' => $this->s_Message,
'trace' => ((count($this->a_Trace) > 0) ? print_a($this->a_Trace, TRUE) : ''),
];
}
/*!
* \brief Accessor of the message dialog rendered HTML
*/
public static function get_dialogs (): string
{
if (session::is_set('msg_dialogs') &&
is_array(session::get('msg_dialogs')) &&
count(session::get('msg_dialogs'))) {
/* Get frame one */
$smarty = get_smarty();
$smarty->assign('frame', TRUE);
$return = $smarty->fetch(get_template_path('msg_dialog.tpl'));
$msg_dialogs = session::get('msg_dialogs');
$msg_dialogs = session::get('msg_dialogs');
$dialogInfos = [];
$dialogIds = [];
foreach ($msg_dialogs as $key => $dialog) {
if (!preg_match('/'.$dialog->get_ID().'/', '')) {
$return .= $dialog->execute();
$dialog_ids = $dialog->get_ID().','.$dialog_ids;
}
unset($msg_dialogs[$key]);
$dialogInfos[] = $dialog->getDialogInfos();
$dialogIds[] = $dialog->getId();
}
session::set('msg_dialogs', $msg_dialogs);
$dialog_ids = preg_replace('/,$/', '', $dialog_ids);
session::set('msg_dialogs', []);
$smarty->assign('dialogInfos', $dialogInfos);
$smarty->assign('dialogIds', $dialogIds);
$return .= '</div>'."\n";
$return .= '<input type="hidden" style="width:400px;" name="pending_msg_dialogs" id="pending_msg_dialogs" value="'.$dialog_ids.'"/>'."\n";
$return .= '<input type="hidden" style="width:400px;" name="closed_msg_dialogs" id="closed_msg_dialogs" value=""/>'."\n";
$return .= '<input type="hidden" style="width:400px;" name="current_msg_dialogs" id="current_msg_dialogs" value=""/>'."\n";
$return .= '<input type="hidden" style="width:700px;" name="js_debug" id="js_debug">'."\n";
return $smarty->fetch(get_template_path('msg_dialog.tpl'));
} else {
return '';
}
return $return;
}
}
  • bmortier @bmortier ·
    Maintainer

    SonarQube analysis reported 1 issue

    • :warning: 1 major

    Note: The following issues were found on lines that were not modified in the commit. Because these issues can't be reported as line comments, they are summarized here:

    1. :warning: Remove this unused "$key" local variable. :blue_book:

    By Ghost User on 2020-02-11T16:32:52 (imported from GitLab)

Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment