API for Welcome Popup

This commit is contained in:
denis.flaven@combodo.com
2023-05-25 17:33:38 +02:00
parent bd1e4389f7
commit 1e41e805a2
21 changed files with 750 additions and 68 deletions

View File

@@ -0,0 +1,10 @@
<div class="ibo-welcome-popup--columns">
<div class="ibo-welcome-popup--image ibo-svg-illustration--container">
{{ source("images/illustrations/undraw_relaunch_day.svg") }}
</div>
<div class="ibo-welcome-popup--text">
<div>
{{ 'UI:WelcomeMenu:Text'| dict_s|raw }}
</div>
</div>
</div>

View File

@@ -1,14 +1,25 @@
<div id="welcome_popup">
<div class="ibo-welcome-popup--image ibo-svg-illustration--container">
{{ source("images/illustrations/undraw_relaunch_day.svg") }}
</div>
<div class="ibo-welcome-popup--text">
<div>
{{ 'UI:WelcomeMenu:Text'| dict_s|raw }}
</div>
<div class="ibo-welcome-popup--text--options">
<input type="checkbox" checked id="display_welcome_popup"/><label for="display_welcome_popup">{{'UI:DisplayThisMessageAtStartup'| dict_s}}</label>
</div>
</div>
<div id="welcome_popup_dialog" class="ibo-welcome-popup--dialog ibo-is-hidden">
<div class="ibo-welcome-popup--content">
{% for message in messages %}
<div class="ibo-welcome-popup--message {% if not loop.first %}ibo-is-hidden{% endif %}" data-message-uuid="{{ message.uuid }}" data_role="welcome-popup-title" data-title="{{ message.title }}">
{% if message.twig is defined %}
{{ include([message.twig ~ '.html.twig', message.twig ~ '.twig', message.twig], message.parameters ?? {}, sandboxed = true) }}
{% else %}
{{ message.html|raw }}
{% endif %}
<div class="ibo-welcome-popup--button" data-message-uuid="{{ message.uuid }}">
{% UIButton ForPrimaryAction{'sLabel':'UI:WelcomePopup:Button:Acknowledge'|dict_s, 'bIsSubmit': false } %}
</div>
</div>
{% endfor %}
</div>
<div class="ibo-welcome-popup--indicators">
{% if messages|length > 1 %}
{% for message in messages %}
<span class="ibo-welcome-popup--indicator {% if loop.first %}ibo-welcome-popup--active{% endif %}" data-message-uuid="{{ message.uuid }}"></span>
{% endfor %}
{% endif %}
</div>
</div>

View File

@@ -1,14 +1,38 @@
$('#welcome_popup').dialog( { width:'60%', height: 'auto', title: '{{ 'UI:WelcomeMenu:Title'|dict_s }}', autoOpen: true, modal:true,
close: function() {
var bDisplay = $('#display_welcome_popup:checked').length;
SetUserPreference('welcome_popup', bDisplay, true);
},
buttons: [{
text: "{{ 'UI:Button:Ok'|dict_s }}", click: function() {
$(this).dialog( "close" ); $(this).remove();
}}],
$('#welcome_popup_dialog').removeClass('ibo-is-hidden');
$('#welcome_popup_dialog').dialog({
modal: true,
width: '60%',
autoOpen: true,
title: $('div[data_role=welcome-popup-title]').first().attr('data-title'),
close: function() { $('#welcome_popup_dialog').remove(); }
});
$('.ui-widget-overlay').click(function() { $('#welcome_popup_dialog').dialog('close'); } );
$('.ibo-welcome-popup--indicator').click(function() {
const id = $(this).attr('data-message-uuid');
const escaped_id = id.replace(/\\/g, '\\\\'); // All backslashes must be doubled in a jQuery selector
const new_title = $('.ibo-welcome-popup--message[data-message-uuid="'+escaped_id+'"]').attr('data-title');
$('.ibo-welcome-popup--message').addClass('ibo-is-hidden');
$('.ibo-welcome-popup--indicator').removeClass('ibo-welcome-popup--active');
$('.ibo-welcome-popup--message[data-message-uuid="'+escaped_id+'"]').removeClass('ibo-is-hidden');
$('.ibo-welcome-popup--indicator[data-message-uuid="'+escaped_id+'"]').addClass('ibo-welcome-popup--active');
$('#welcome_popup_dialog').dialog('option', 'title', new_title);
$('.ibo-welcome-popup--message[data-message-uuid="'+escaped_id+'"] button').focus();
});
$('.ibo-welcome-popup--button').click('button', function() {
const id = $(this).attr('data-message-uuid');
$.post(GetAbsoluteUrlAppRoot()+'pages/ajax.render.php', {operation: 'welcome_popup.acknowledge_message', message_uuid: id});
const escaped_id = id.replace(/\\/g, '\\\\');; // All backslashes must be doubled in a jQuery selector
$('.ibo-welcome-popup--message[data-message-uuid="'+escaped_id+'"]').remove();
if($('.ibo-welcome-popup--message').length == 0) {
// Last message, close the dialog
$('#welcome_popup_dialog').dialog('close');
} else {
// Move the active state to the next message
$('.ibo-welcome-popup--indicator[data-message-uuid="'+escaped_id+'"]').siblings().first().trigger('click');
$('.ibo-welcome-popup--indicator[data-message-uuid="'+escaped_id+'"]').remove();
if ($('.ibo-welcome-popup--indicator').length == 1) {
// Last indicator, remove it
$('.ibo-welcome-popup--indicator').remove();
}
}
});
if ($('#welcome_popup').height() > ($(window).height()-70))
{
$('#welcome_popup').height($(window).height()-70);
}