Revision | cb43cde8df437edddec88f95f42c8eb1ecd24d89 (tree) |
---|---|
Time | 2018-05-14 00:57:11 |
Author | umorigu <umorigu@gmai...> |
Commiter | umorigu |
BugTrack/2433 search2 plugin: Show search progress
@@ -300,6 +300,8 @@ EOD; | ||
300 | 300 | |
301 | 301 | $plain_search_link = '<a href="' . $script . '?cmd=search' . '">' . htmlsc($_btn_search) . '</a>'; |
302 | 302 | $alt_msg = str_replace('$1', $plain_search_link, $_msg_use_alternative_link); |
303 | + $status_span_text = '<span class="_plugin_search2_search_status_text1"></span>' . | |
304 | + '<span class="_plugin_search2_search_status_text2"></span>'; | |
303 | 305 | $form =<<<EOD |
304 | 306 | <form action="$script" method="GET" class="_plugin_search2_form"> |
305 | 307 | <div> |
@@ -312,7 +314,7 @@ $base_option | ||
312 | 314 | EOD; |
313 | 315 | $second_form =<<<EOD |
314 | 316 | <div class="_plugin_search2_second_form" style="display:none;"> |
315 | -<div class="_plugin_search2_search_status"></div> | |
317 | +<div class="_plugin_search2_search_status">$status_span_text</span></div> | |
316 | 318 | <div class="_plugin_search2_message"></div> |
317 | 319 | $form |
318 | 320 | </div> |
@@ -349,12 +351,41 @@ EOD; | ||
349 | 351 | <noscript> |
350 | 352 | <p>$_msg_unsupported_webbrowser $alt_msg</p> |
351 | 353 | </noscript> |
354 | +<style> | |
355 | +input#_plugin_search2_detail:checked ~ ul > div.search-result-detail { | |
356 | + display:block; | |
357 | +} | |
358 | +input#_plugin_search2_detail ~ ul > div.search-result-detail { | |
359 | + display:none; | |
360 | +} | |
361 | +._plugin_search2_search_status { | |
362 | + min-height:1.5em; | |
363 | +} | |
364 | +@keyframes plugin-search2-searching { | |
365 | + 10% { opacity: 1; } | |
366 | + 40% { opacity: 0; } | |
367 | + 70% { opacity: 0; } | |
368 | + 90% { opacity: 1; } | |
369 | +} | |
370 | +span.plugin-search2-progress { | |
371 | + animation: plugin-search2-searching 1.5s infinite ease-out; | |
372 | +} | |
373 | +span.plugin-search2-progress1 { | |
374 | + animation-delay: -1s; | |
375 | +} | |
376 | +span.plugin-search2-progress2 { | |
377 | + animation-delay: -0.8s; | |
378 | +} | |
379 | +span.plugin-search2-progress3 { | |
380 | + animation-delay: -0.6s; | |
381 | +} | |
382 | +</style> | |
352 | 383 | <p class="_plugin_search2_nosupport_message" style="display:none;"> |
353 | 384 | $_msg_unsupported_webbrowser $alt_msg |
354 | 385 | </p> |
355 | 386 | $search_props |
356 | 387 | $form |
357 | -<div class="_plugin_search2_search_status"></div> | |
388 | +<div class="_plugin_search2_search_status">$status_span_text</div> | |
358 | 389 | <div class="_plugin_search2_message"></div> |
359 | 390 | $result_page_panel |
360 | 391 | $second_form |
@@ -655,15 +655,6 @@ tr.bugtrack_state_undef td { | ||
655 | 655 | } |
656 | 656 | |
657 | 657 | /* search2.inc.php */ |
658 | -input#_plugin_search2_detail:checked ~ ul > div.search-result-detail { | |
659 | - display:block; | |
660 | -} | |
661 | -input#_plugin_search2_detail ~ ul > div.search-result-detail { | |
662 | - display:none; | |
663 | -} | |
664 | -._plugin_search2_search_status { | |
665 | - min-height:1.5em; | |
666 | -} | |
667 | 658 | .search-result-page-summary { |
668 | 659 | font-size:70%; |
669 | 660 | color:gray; |
@@ -289,10 +289,35 @@ window.addEventListener && window.addEventListener('DOMContentLoaded', function( | ||
289 | 289 | /** |
290 | 290 | * @param {string} statusText |
291 | 291 | */ |
292 | - function setSearchStatus(statusText) { | |
292 | + function setSearchStatus(statusText, statusText2) { | |
293 | 293 | var statusList = document.querySelectorAll('._plugin_search2_search_status'); |
294 | 294 | forEach(statusList, function(statusObj) { |
295 | - statusObj.textContent = statusText; | |
295 | + var textObj1 = statusObj.querySelector('._plugin_search2_search_status_text1'); | |
296 | + var textObj2 = statusObj.querySelector('._plugin_search2_search_status_text2'); | |
297 | + if (textObj1) { | |
298 | + var prevText = textObj1.getAttribute('data-text'); | |
299 | + if (prevText !== statusText) { | |
300 | + textObj1.setAttribute('data-text', statusText); | |
301 | + if (statusText.substr(statusText.length - 3) === '...') { | |
302 | + var firstHalf = statusText.substr(0, statusText.length - 3); | |
303 | + textObj1.textContent = firstHalf; | |
304 | + var span = document.createElement('span'); | |
305 | + span.innerHTML = '<span class="plugin-search2-progress plugin-search2-progress1">.</span>' | |
306 | + + '<span class="plugin-search2-progress plugin-search2-progress2">.</span>' | |
307 | + + '<span class="plugin-search2-progress plugin-search2-progress3">.</span>'; | |
308 | + textObj1.appendChild(span); | |
309 | + } else { | |
310 | + textObj1.textContent = statusText; | |
311 | + } | |
312 | + } | |
313 | + } | |
314 | + if (textObj2) { | |
315 | + if (statusText2) { | |
316 | + textObj2.textContent = ' ' + statusText2; | |
317 | + } else { | |
318 | + textObj2.textContent = ''; | |
319 | + } | |
320 | + } | |
296 | 321 | }); |
297 | 322 | } |
298 | 323 | /** |
@@ -723,7 +748,7 @@ window.addEventListener && window.addEventListener('DOMContentLoaded', function( | ||
723 | 748 | if (prevTimestamp) { |
724 | 749 | setSearchStatus(searchProps.searchingMsg); |
725 | 750 | } else { |
726 | - setSearchStatus(searchProps.searchingMsg + ' ' + | |
751 | + setSearchStatus(searchProps.searchingMsg, | |
727 | 752 | getSearchProgress(session)); |
728 | 753 | } |
729 | 754 | if (searchDone) { |
@@ -733,7 +758,7 @@ window.addEventListener && window.addEventListener('DOMContentLoaded', function( | ||
733 | 758 | if (singlePageResult) { |
734 | 759 | setSearchStatus(''); |
735 | 760 | } else { |
736 | - setSearchStatus(searchProps.showingResultMsg + ' ' + progress); | |
761 | + setSearchStatus(searchProps.showingResultMsg, progress); | |
737 | 762 | } |
738 | 763 | }, 2000); |
739 | 764 | } |
@@ -777,7 +802,7 @@ window.addEventListener && window.addEventListener('DOMContentLoaded', function( | ||
777 | 802 | localStorage[key] = JSON.stringify(session); |
778 | 803 | // Stop API calling |
779 | 804 | setSearchMessage(msg + ' ' + getOffsetLinks(session, maxResults)); |
780 | - setSearchStatus(searchProps.showingResultMsg + ' ' + | |
805 | + setSearchStatus(searchProps.showingResultMsg, | |
781 | 806 | getSearchProgress(session)); |
782 | 807 | } else { |
783 | 808 | setTimeout(function() { |
@@ -823,7 +848,7 @@ window.addEventListener && window.addEventListener('DOMContentLoaded', function( | ||
823 | 848 | var moreResultHtml = getOffsetLinks(session, maxResults); |
824 | 849 | setSearchMessage(msg + ' ' + moreResultHtml); |
825 | 850 | var progress = getSearchProgress(session); |
826 | - setSearchStatus(searchProps.showingResultMsg + ' ' + progress); | |
851 | + setSearchStatus(searchProps.showingResultMsg, progress); | |
827 | 852 | } else { |
828 | 853 | setSearchStatus(''); |
829 | 854 | } |
@@ -531,15 +531,6 @@ tr.bugtrack_state_undef td { | ||
531 | 531 | } |
532 | 532 | |
533 | 533 | /* search2.inc.php */ |
534 | -input#_plugin_search2_detail:checked ~ ul > div.search-result-detail { | |
535 | - display:block; | |
536 | -} | |
537 | -input#_plugin_search2_detail ~ ul > div.search-result-detail { | |
538 | - display:none; | |
539 | -} | |
540 | -._plugin_search2_search_status { | |
541 | - min-height:1.5em; | |
542 | -} | |
543 | 534 | .search-result-page-summary { |
544 | 535 | font-size:70%; |
545 | 536 | color:gray; |