tyler.durden
/
pandorafms
mirror of https://github.com/pandorafms/pandorafms.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

#9073 added counter round un footer

This commit is contained in:
Daniel Cebrian 2023-02-13 16:21:37 +01:00
parent 6619cf059d
commit 887d2f8f18
4 changed files with 135 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
pandora_console/include/class/TipsWindow.class.php
View File

@ -131,33 +131,36 @@ class TipsWindow
ui_require_javascript_file('tipsWindow'); ui_require_javascript_file('tipsWindow');
ui_require_javascript_file('jquery.bxslider.min'); ui_require_javascript_file('jquery.bxslider.min');
echo '<div id="tips_window_modal"></div>'; echo '<div id="tips_window_modal"></div>';
?> $this->totalTips = $this->getTotalTips();
if ($this->totalTips > 0) {
?>
<script> <script>
var totalTips = <?php echo $this->getTotalTips(); ?>; var totalTips = <?php echo $this->totalTips; ?>;
var idTips = [<?php echo $initialTip['id']; ?>]; var idTips = [<?php echo $initialTip['id']; ?>];
var url = '<?php echo ui_get_full_url('ajax.php'); ?>'; var url = '<?php echo ui_get_full_url('ajax.php'); ?>';
var page = '<?php echo $this->ajaxController; ?>'; var page = '<?php echo $this->ajaxController; ?>';
</script> </script>
<script> <script>
if(totalTips > 0){ if(totalTips > 0){
load_tips_modal({ load_tips_modal({
target: $('#tips_window_modal'), target: $('#tips_window_modal'),
url: '<?php echo ui_get_full_url('ajax.php'); ?>', url: '<?php echo ui_get_full_url('ajax.php'); ?>',
modal: { modal: {
title: '<?php echo __('Hola! estos son los tips del día'); ?>', title: '<?php echo __('Hola! estos son los tips del día'); ?>',
next: '<?php echo __('De acuerdo'); ?>', next: '<?php echo __('De acuerdo'); ?>',
close: '<?php echo __('Quizás luego'); ?>' close: '<?php echo __('Quizás luego'); ?>'
}, },
onshow: { onshow: {
page: '<?php echo $this->ajaxController; ?>', page: '<?php echo $this->ajaxController; ?>',
method: 'renderView', method: 'renderView',
} }
}); });
} }
</script> </script>
<?php <?php
}
} }

45
pandora_console/include/javascript/tipsWindow.js
View File

@ -7,17 +7,55 @@ $(".carousel .images").ready(function() {
function render({ title, text, url, files }) { function render({ title, text, url, files }) {
$("#title_tip").html(title); $("#title_tip").html(title);
$("#text_tip").html(text); $("#text_tip").html(text);
$("#url_tip").attr("href", url); if (url) {
$("#url_tip").removeClass("invisible");
$("#url_tip").attr("href", url);
} else {
$("#url_tip").addClass("invisible");
}
$(".carousel .images").empty(); $(".carousel .images").empty();
if (files) { if (files) {
files.forEach(file => { files.forEach(file => {
$(".carousel .images").append(`<img src="${file.filename}" />`); $(".carousel .images").append(
`<img src="${file.path + file.filename}" />`
);
}); });
$(".carousel").removeClass("invisible"); $(".carousel").removeClass("invisible");
} else { } else {
$(".carousel").addClass("invisible"); $(".carousel").addClass("invisible");
} }
var limitRound = totalTips > 28 ? 28 : totalTips;
$(".count-round-tip").each(function(index) {
if ($(this).hasClass("active")) {
$(this).removeClass("active");
if (index >= limitRound - 1) {
$($(".count-round-tip")[0]).addClass("active");
} else {
$($(".count-round-tip")[index + 1]).addClass("active");
}
return false;
}
});
}
function close_dialog() {
$("#tips_window_modal").dialog("close");
$("#tips_window_modal").remove();
}
function render_counter() {
$(".counter-tips img:eq(0)").after(
"<span class='count-round-tip active'></span>"
);
if (totalTips > 1) {
for (let i = 1; i <= totalTips - 1; i++) {
$(".count-round-tip:eq(0)").after(
"<span class='count-round-tip'></span>"
);
}
}
} }
function next_tip() { function next_tip() {
@ -134,7 +172,7 @@ function load_tips_modal(settings) {
settings.onload(data); settings.onload(data);
} }
settings.target.dialog({ settings.target.dialog({
resizable: true, resizable: false,
draggable: true, draggable: true,
modal: true, modal: true,
header: false, header: false,
@ -175,6 +213,7 @@ function load_tips_modal(settings) {
$(".tips_header").remove(); $(".tips_header").remove();
$(".dialog_tips .ui-dialog-titlebar").addClass("tips_header"); $(".dialog_tips .ui-dialog-titlebar").addClass("tips_header");
$(".dialog_tips .ui-dialog-titlebar").removeClass("ui-helper-clearfix"); $(".dialog_tips .ui-dialog-titlebar").removeClass("ui-helper-clearfix");
render_counter();
}, },
error: function(data) { error: function(data) {
console.error(data); console.error(data);

19
pandora_console/include/styles/tips_window.css
View File

@ -138,3 +138,22 @@
#url_tip .arrow_tips { #url_tip .arrow_tips {
font-size: 20px; font-size: 20px;
} }
span.count-round-tip {
width: 6px !important;
height: 6px !important;
background: #dbdfe6;
border-radius: 10px;
margin: 0px 2px;
}
span.count-round-tip.active {
background-color: #1d7874;
}
.counter-tips {
display: flex;
align-items: center;
margin-top: 10px;
}
.arrow-counter {
width: 7px;
margin: 0px 5px;
}

81
pandora_console/views/dashboard/tipsWindow.php
View File

@ -3,14 +3,14 @@
* Dashboards Modal for tips * Dashboards Modal for tips
* *
* @category Console Class * @category Console Class
* @package Pandora FMS $output .= '* @packagePandora FMS';
* @subpackage Dashboards * @subpackage Dashboards
* @version 1.0.0 $output .= '* @version1.0.0';
* @license See below $output .= '* @licenseSee below';
* *
* ______ ___ _______ _______ ________ $output .= '*______ __________ _______ ________';
* | __ \.-----.--.--.--| |.-----.----.-----. | ___| | | __| $output .= '* | __ \.-----.--.--.--| |.-----.----.-----. |___| | | __|';
* | __/| _ | | _ || _ | _| _ | | ___| |__ | $output .= '* |__/| _ | | _ || _ | _| _ | |___| |__ |';
* |___| |___._|__|__|_____||_____|__| |___._| |___| |__|_|__|_______| * |___| |___._|__|__|_____||_____|__| |___._| |___| |__|_|__|_______|
* *
* ============================================================================ * ============================================================================
@ -25,34 +25,45 @@
* GNU General Public License for more details. * GNU General Public License for more details.
* ============================================================================ * ============================================================================
*/ */
?> $output = '';
<div class="window">
<div class="tips_header">
<p class="title"><?php echo __('¡Hola! estos son los tips del día.'); ?></p>
<p><?php echo html_print_checkbox('tips_in_start', true, true, true); ?>Ver típs al iniciar</p>
</div>
<div class="carousel <?php echo ($files === false) ? 'invisible' : ''; ?>">
<div class="images">
<?php if ($files !== false) : ?>
<?php foreach ($files as $key => $file) : ?>
<img src="<?php echo $file['filename']; ?>" />
<?php endforeach; ?>
<?php endif; ?>
</div>
</div>
<div class="description"> $output .= '<div class="window">';
<h2 id="title_tip"><?php echo $title; ?></h2> $output .= '<div class="tips_header">';
<p id="text_tip"> $output .= '<p class="title">'.__('¡Hola! estos son los tips del día.').'</p>';
<?php echo $text; ?> $output .= '<p>'.html_print_checkbox('tips_in_start', true, true, true).__('Ver típs al iniciar').'</p>';
</p> $output .= '</div>';
<?php if (empty($url) === false) : ?> $output .= '<div class="carousel'.(($files === false) ? 'invisible' : '').'">';
<a href="<?php echo $url; ?>" id="url_tip"><?php echo __('Ver más info'); ?> <span class="arrow_tips">→</span></a> $output .= '<div class="images">';
<?php endif; ?>
</div>
<div class="ui-dialog-buttonset"> if ($files !== false) {
<button type="button" class="submit-cancel-tips ui-button ui-corner-all ui-widget">Quizás luego</button> foreach ($files as $key => $file) {
<button type="button" class="submit-next-tips ui-button ui-corner-all ui-widget">De acuerdo</button> $output .= html_print_image($file['path'].$file['filename'], true);
</div> }
</div> }
$output .= '</div>';
$output .= '</div>';
$output .= '<div class="description">';
$output .= '<h2 id="title_tip">'.$title.'</h2>';
$output .= '<p id="text_tip">';
$output .= $text;
$output .= '</p>';
if (empty($url) === false && $url !== '') {
$output .= '<a href="'.$url.'" id="url_tip">'.__('Ver más info').'<span class="arrow_tips">→</span></a>';
}
$output .= '</div>';
$output .= '<div class="ui-dialog-buttonset">';
// TODO Delete this buttons and use html_print_button when merge new design
$output .= '<button type="button" class="submit-cancel-tips ui-button ui-corner-all ui-widget" onclick="close_dialog()">Quizás luego</button>';
$output .= '<div class="counter-tips">';
$output .= html_print_image('images/arrow-left-grey.png', true, ['class' => 'arrow-counter']);
$output .= html_print_image('images/arrow-right-grey.png', true, ['class' => 'arrow-counter']);
$output .= '</div>';
$output .= '<button type="button" class="submit-next-tips ui-button ui-corner-all ui-widget" onclick="next_tip()">De acuerdo</button>';
$output .= '</div>';
$output .= '</div>';
echo $output;