overlay.js 2.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. /**
  2. * Script for overlay.ejs
  3. */
  4. //document.getElementById('overlayDismiss').href = 'javascript:void(0);'
  5. /* Overlay Wrapper Functions */
  6. /**
  7. * Toggle the visibility of the overlay.
  8. *
  9. * @param {boolean} toggleState True to display, false to hide.
  10. * @param {boolean} dismissable Optional. True to show the dismiss option, otherwise false.
  11. * @param {string} content Optional. The content div to be shown.
  12. */
  13. function toggleOverlay(toggleState, dismissable = false, content = 'overlayContent'){
  14. if(toggleState == null){
  15. toggleState = !document.getElementById('main').hasAttribute('overlay')
  16. }
  17. if(typeof dismissable === 'string'){
  18. content = dismissable
  19. }
  20. if(toggleState){
  21. document.getElementById('main').setAttribute('overlay', true)
  22. $('#' + content).parent().children().hide()
  23. $('#' + content).show()
  24. if(dismissable){
  25. $('#overlayDismiss').show()
  26. } else {
  27. $('#overlayDismiss').hide()
  28. }
  29. $('#overlayContainer').fadeIn(250)
  30. } else {
  31. document.getElementById('main').removeAttribute('overlay')
  32. $('#overlayContainer').fadeOut(250, () => {
  33. $('#' + content).parent().children().hide()
  34. $('#' + content).show()
  35. if(dismissable){
  36. $('#overlayDismiss').show()
  37. } else {
  38. $('#overlayDismiss').hide()
  39. }
  40. })
  41. }
  42. }
  43. /**
  44. * Set the content of the overlay.
  45. *
  46. * @param {string} title Overlay title text.
  47. * @param {string} description Overlay description text.
  48. * @param {string} acknowledge Acknowledge button text.
  49. * @param {string} dismiss Dismiss button text.
  50. */
  51. function setOverlayContent(title, description, acknowledge, dismiss = 'Dismiss'){
  52. document.getElementById('overlayTitle').innerHTML = title
  53. document.getElementById('overlayDesc').innerHTML = description
  54. document.getElementById('overlayAcknowledge').innerHTML = acknowledge
  55. document.getElementById('overlayDismiss').innerHTML = dismiss
  56. }
  57. /**
  58. * Set the onclick handler of the overlay acknowledge button.
  59. * If the handler is null, a default handler will be added.
  60. *
  61. * @param {function} handler
  62. */
  63. function setOverlayHandler(handler){
  64. if(handler == null){
  65. document.getElementById('overlayAcknowledge').onclick = () => {
  66. toggleOverlay(false)
  67. }
  68. } else {
  69. document.getElementById('overlayAcknowledge').onclick = handler
  70. }
  71. }
  72. /**
  73. * Set the onclick handler of the overlay dismiss button.
  74. * If the handler is null, a default handler will be added.
  75. *
  76. * @param {function} handler
  77. */
  78. function setDismissHandler(handler){
  79. if(handler == null){
  80. document.getElementById('overlayDismiss').onclick = () => {
  81. toggleOverlay(false)
  82. }
  83. } else {
  84. document.getElementById('overlayDismiss').onclick = handler
  85. }
  86. }