Skip to content

Commit a1db06c

Browse files
committed
Newest list: Replaced reload modal with less intrusive message box
1 parent 5978e60 commit a1db06c

6 files changed

Lines changed: 126 additions & 80 deletions

File tree

src/Translations/ca/lang.php

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -211,12 +211,10 @@
211211
'index-complete-check' => 'Assegureu-vos de revisar els tiquets tancats si no pot trobar el seu tiquet.',
212212
'ticket-notices-title' => 'Avisos',
213213
'ticket-notices-empty' => 'No hi ha cap avís actiu',
214-
/*
214+
215215
// Newest tickets page reload Modal
216-
'page-reload-modal-title' => 'Recàrrega de pàgina',
217-
'page-reload-modal-countdown' => 'Aquesta pàgina es recarregarà en <kbd><span id="counter">:num</span></kbd> segons.',
216+
'page-reload-modal-countdown' => 'Aquesta pàgina es recarregarà en <kbd class=":num_class"><span id="counter">:num</span></kbd> segons.',
218217
'page-reload-modal-reloading' => 'Aquesta pàgina està recarregant... si us plau, espera',
219-
'page-reload-modal-button-now' => 'Recarrega ara!',*/
220218

221219
// Ticket forms messages
222220
'update-agent-same' => 'No has canviat l\'agent! Tiquet <a href=":link" title=":title"><u>:name</u></a>',

src/Translations/en/lang.php

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -215,10 +215,8 @@
215215
'ticket-notices-empty' => 'There are no active notices',
216216

217217
// Newest tickets page reload Modal
218-
'page-reload-modal-title' => 'Page reload',
219-
'page-reload-modal-countdown' => 'This page will reload in <kbd><span id="counter">:num</span></kbd> seconds.',
218+
'page-reload-modal-countdown' => 'This page will reload in <kbd class=":num_class"><span id="counter">:num</span></kbd> seconds.',
220219
'page-reload-modal-reloading' => 'This page is reloading... please wait',
221-
'page-reload-modal-button-now' => 'Reload now!',
222220

223221
// Ticket forms messages
224222
'update-agent-same' => 'Agent was not changed! Ticket <a href=":link" title=":title"><u>:name</u></a>',
@@ -330,7 +328,7 @@
330328
'show-ticket-email-resend-agent' => '(Ticket agent)',
331329
'show-ticket-email-resend-owner' => '(Ticket owner)',
332330
'notification-resend-confirmation' => 'Notifications were correctly resended',
333-
'notification-resend-no-recipients'=> 'No recipients were selected',
331+
'notification-resend-no-recipients'=> 'No recipients were selected',
334332

335333
// Validations
336334
'validation-error' => 'This form has not been sent',
Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
@section('panichd_assets')
2+
<style>
3+
/* Message at the bottom of the screen */
4+
/* Source code from https://www.w3schools.com/howto/howto_js_snackbar.asp */
5+
6+
#bottom_toast {
7+
visibility: hidden;
8+
min-width: 250px;
9+
margin-left: -125px;
10+
text-align: center;
11+
border-radius: 2px;
12+
padding: 16px;
13+
position: fixed;
14+
z-index: 1;
15+
left: 50%;
16+
bottom: 30px;
17+
font-size: 17px;
18+
}
19+
20+
#bottom_toast.show {
21+
visibility: visible;
22+
-webkit-animation: bottom_toast_fadein 0.5s @if(isset($toast_fadeout)) , bottom_toast_fadeout 0.5s {{ $toast_fadeout }}s @endif ;
23+
animation: bottom_toast_fadein 0.5s @if(isset($toast_fadeout)) , bottom_toast_fadeout 0.5s {{ $toast_fadeout }}s @endif ;
24+
}
25+
26+
@-webkit-keyframes bottom_toast_fadein {
27+
from {bottom: 0; opacity: 0;}
28+
to {bottom: 30px; opacity: 1;}
29+
}
30+
31+
@keyframes bottom_toast_fadein {
32+
from {bottom: 0; opacity: 0;}
33+
to {bottom: 30px; opacity: 1;}
34+
}
35+
36+
@if(isset($toast_fadeout))
37+
@-webkit-keyframes bottom_toast_fadeout {
38+
from {bottom: 30px; opacity: 1;}
39+
to {bottom: 0; opacity: 0;}
40+
}
41+
42+
@keyframes bottom_toast_fadeout {
43+
from {bottom: 30px; opacity: 1;}
44+
to {bottom: 0; opacity: 0;}
45+
}
46+
@endif
47+
</style>
48+
@append
49+
50+
@section('footer')
51+
<div id="bottom_toast">{!! $toast_html !!}</div>
52+
@append

src/Views/tickets/datatable/events.blade.php

Lines changed: 4 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -1,55 +1,11 @@
1+
<div id="page-reload-box" class="text-center" style="position: absolute; bottom: 0;">
2+
<div style="display: inline-block;">Hola</div>
3+
</div>
4+
15
<script>
26
$(function(){
3-
4-
57
// Ticket List: Change ticket agent
68
$('#tickets-table').on('draw.dt', function(e){
7-
@if ($ticketList == 'newest' && $setting->grab('newest_list_reload_seconds'))
8-
9-
var modal_countdown = ({{ $setting->grab('newest_list_reload_seconds') }} - 5)*1000;
10-
11-
setTimeout(function(){ $('#modal-page-reload').modal('show'); }, modal_countdown);
12-
var reload_secs = 6;
13-
var page_reload = "";
14-
15-
$('#modal-page-reload').on('show.bs.modal', function () {
16-
17-
$('#modal-page-reload #text_countdown').show();
18-
$('#modal-page-reload #text_reloading').hide();
19-
20-
$('#modal-page-reload #counter').text(reload_secs-1);
21-
22-
// Update the count down every 1 second
23-
page_reload = setInterval(function() {
24-
reload_secs = reload_secs - 1;
25-
26-
// Output the result in an element with id="demo"
27-
$('#modal-page-reload #counter').text(reload_secs);
28-
29-
// If the count down is over, write some text
30-
if (reload_secs == 0) {
31-
$('#modal-page-reload #text_countdown').hide();
32-
$('#modal-page-reload #text_reloading').show();
33-
clearInterval(page_reload);
34-
window.location.reload(false);
35-
}
36-
}, 1000);
37-
});
38-
39-
$('#modal-page-reload').on('hidden.bs.modal', function () {
40-
clearInterval(page_reload);
41-
42-
setTimeout(function(){ $('#modal-page-reload').modal('show'); }, modal_countdown);
43-
page_reload = "";
44-
reload_secs = 6;
45-
});
46-
47-
$('#modal-page-reload #confirm').click(function(e){
48-
$('#modal-page-reload #text_countdown').hide();
49-
$('#modal-page-reload #text_reloading').show();
50-
window.location.reload(false);
51-
});
52-
@endif
539
5410
// Plus / less buttons for text fields
5511
$('.jquery_ticket_text_toggle').click(function(e){

src/Views/tickets/datatable/modal_page_reload.blade.php

Lines changed: 0 additions & 19 deletions
This file was deleted.

src/Views/tickets/index.blade.php

Lines changed: 66 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -27,14 +27,75 @@
2727
</div>
2828
@include('panichd::tickets.partials.modal_agent')
2929
@include('panichd::tickets.partials.priority_popover_form')
30-
31-
@if($ticketList == 'newest')
32-
@include('panichd::tickets.datatable.modal_page_reload')
33-
@endif
3430
@stop
3531

3632
@section('footer')
3733
@include('panichd::tickets.datatable.loader')
3834
@include('panichd::tickets.datatable.events')
3935
@append
40-
@endif
36+
@endif
37+
38+
@if($ticketList == 'newest' && $setting->grab('newest_list_reload_seconds'))
39+
@php
40+
$toast_html = '<div class="alert alert-info">'
41+
. '<span id="toast_countdown">' . trans('panichd::lang.page-reload-modal-countdown', ['num' => '3', 'num_class' => 'bg-info'])
42+
. ' <button id="toast_cancel" type="button" class="btn btn-light btn-xs ml-2" data-new-countdown="no">' . trans('panichd::lang.btn-cancel') . '</button></span>'
43+
. '<span id="toast_reloading">' . trans('panichd::lang.page-reload-modal-reloading') . '</span>'
44+
. ''
45+
. '</div>';
46+
@endphp
47+
@include('panichd::shared.bottom_toast', ['toast_html' => $toast_html])
48+
@section('footer')
49+
<script type="text/javascript">
50+
var page_reload = "";
51+
52+
function show_bottom_toast(reload_secs)
53+
{
54+
// Show bottom toast
55+
$('#toast_countdown #counter').text(reload_secs-1);
56+
$('#toast_countdown').show();
57+
$('#toast_reloading').hide();
58+
$('#bottom_toast').addClass('show');
59+
60+
// Update the count down every 1 second
61+
page_reload = setInterval(function() {
62+
reload_secs = reload_secs - 1;
63+
64+
// Output the result in an element with id="demo"
65+
$('#toast_countdown #counter').text(reload_secs);
66+
67+
// If the count down is over, replace text
68+
if (reload_secs == 0) {
69+
$('#toast_countdown').hide();
70+
$('#toast_reloading').show();
71+
72+
clearInterval(page_reload);
73+
window.location.reload(false);
74+
}
75+
}, 1000);
76+
}
77+
78+
$(function(){
79+
var toast_countdown = ({{ $setting->grab('newest_list_reload_seconds') }} - 3)*1000;
80+
var toast_countdown = 2000;
81+
var reload_secs = 4;
82+
83+
setTimeout(function(){ show_bottom_toast(reload_secs) }, toast_countdown);
84+
85+
$('#toast_cancel').click( function () {
86+
// Clear countdown
87+
clearInterval(page_reload);
88+
$('#bottom_toast').removeClass('show');
89+
90+
// If set to create a new countdown
91+
if ($(this).data('new-countdown') == 'yes'){
92+
page_reload = "";
93+
reload_secs = 4;
94+
setTimeout(function(){ show_bottom_toast(reload_secs) }, toast_countdown);
95+
96+
}
97+
});
98+
});
99+
</script>
100+
@append
101+
@endif

0 commit comments

Comments
 (0)