@brightspot/ui 3.0.1-cms-ui-migration.0 → 3.0.1-cms-ui-migration.1

package/src/legacy/tool-ui/src/main/webapp/script/v3/input/read-only.js

@@ -0,0 +1,17 @@
+define(['../../bsp-utils'], function (bspUtils) {
+  bspUtils.onDomInsert(
+    document,
+    '.inputContainer-readOnly input[type="text"], .inputContainer-readonly textarea, .inputContainer-readOnly input:not([type])',
+    {
+      insert: function (input) {
+        if (input.classList.contains('expandable')) {
+          input.setAttribute('type', 'hidden')
+          let span = document.createElement('span')
+          span.setAttribute('class', 'readOnlyDisplay')
+          span.appendChild(document.createTextNode(input.value))
+          input.parentNode.insertBefore(span, input.nextSibling)
+        }
+      },
+    },
+  )
+})

package/src/legacy/tool-ui/src/main/webapp/script/v3/jquery.frame.js

@@ -0,0 +1,478 @@
+/** Inline FRAME/IFRAME replacement. */
+;(function ($, win, undef) {
+  var $win = $(win)
+  var doc = win.document
+  var formTargetIndex = 0
+
+  $.plugin2('frame', {
+    _defaultOptions: {
+      frameClassName: 'dari-frame',
+      loadingClassName: 'dari-frame-loading',
+      loadedClassName: 'dari-frame-loaded',
+      bodyClassName: 'dari-frame-body',
+      setBody: function (body) {
+        $(this).html(body)
+      },
+    },
+
+    _init: function (selector, options) {
+      var plugin = this
+      var $caller = plugin.$caller
+      var frameClassName = options.frameClassName
+      var loadingClassName = options.loadingClassName
+      var loadedClassName = options.loadedClassName
+      // var bodyClassName = options.bodyClassName
+      var findTargetFrame
+      var beginLoad
+      var endLoad
+      var loadPage
+
+      // Finds the target frame, creating one if necessary.
+      findTargetFrame = function (element, callback) {
+        var $element = $(element)
+        var href = $element.attr('href') || ''
+        var target =
+          $element.attr('data-frame-target') || $element.attr('target')
+        var $frame
+
+        // Standard HTML elements that can handle the target.
+        if (
+          target &&
+          $('frame[name="' + target + '"], iframe[name="' + target + '"]')
+            .length > 0
+        ) {
+          return true
+        }
+
+        // Skip processing on special target names.
+        if (target !== '_top' && target !== '_blank') {
+          if (target === '_parent') {
+            $frame = $element.frame('container').parent().frame('container')
+          } else if (target) {
+            $frame = $('.' + frameClassName + '[name="' + target + '"]')
+
+            if ($frame.length === 0) {
+              $frame = $('<div/>', { class: frameClassName, name: target })
+              $(doc.body).append($frame)
+              $frame.popup()
+              $frame
+                .popup('container')
+                .attr('data-href', href || $element.attr('action'))
+            }
+
+            $frame[0]._bspFrameLink = element
+          } else {
+            // There is no target.
+            $frame = $element.frame('container')
+
+            // Special case - if the HREF is not going to a new page, don't try to load the frame again
+            if (href.indexOf('#') === 0) {
+              return true
+            }
+          }
+
+          if ($frame.length > 0 && $frame[0] !== doc) {
+            return callback($element, $frame)
+          }
+        } else if (href && href.length > 2000) {
+          const questionAt = href.indexOf('?')
+
+          if (questionAt > -1) {
+            const params = new URLSearchParams(href.substring(questionAt + 1))
+
+            const $form = $('<form/>', {
+              method: 'post',
+              action: href.substring(0, questionAt),
+              target,
+            })
+
+            $form.append(
+              $('<input/>', {
+                type: 'hidden',
+                name: '_method',
+                value: 'get',
+              }),
+            )
+
+            for (const [name, value] of params) {
+              $form.append(
+                $('<input/>', {
+                  type: 'hidden',
+                  name,
+                  value,
+                }),
+              )
+            }
+
+            $(document.body).append($form)
+            $form[0].requestSubmit()
+
+            return false
+          }
+        }
+
+        // Natural browser event.
+        return true
+      }
+
+      // Begins loading $frame using $source.
+      beginLoad = function ($frame, $source, event) {
+        var version = ($frame.data('frame-loadVersion') || 0) + 1
+        var $popup = $frame.popup('container')
+
+        $frame
+          .add($popup)
+          .removeClass(loadedClassName)
+          .addClass(loadingClassName)
+        $frame.data('frame-loadVersion', version)
+        $frame.data('frame-$source', $source)
+
+        if ($popup[0] && $source[0] && !$.contains($popup[0], $source[0])) {
+          $frame.popup('source', $source, event)
+          $frame.empty()
+        }
+
+        if ($frame.parent().frame('container').length === 0) {
+          if (!$popup.hasClass('is-visible')) {
+            $frame.popup('open')
+          } else if (
+            $popup[0] &&
+            $source[0] &&
+            !$.contains($popup[0], $source[0])
+          ) {
+            // Source is outside this popup (e.g. nested "Add Shared" from
+            // a different popup). Move to end of parent so DOM order matches
+            // z-index stacking, then re-open to bring to front.
+            if ($popup[0].parentNode) {
+              $popup[0].parentNode.appendChild($popup[0])
+            }
+            $frame.popup('open')
+          }
+        }
+
+        return version
+      }
+
+      // Ends loading $frame by setting it using data.
+      endLoad = function ($frame, version, data) {
+        var $popup, body
+
+        if (version >= $frame.data('frame-loadVersion')) {
+          // Exit early when frame data is empty.
+          if (!data) {
+            console.warn('jquery.frame `data` was empty:', data)
+            return
+          }
+
+          $popup = $frame.popup('container')
+
+          body = data
+          body = body.replace(/^[^]*?<body[^>]*>/gi, '')
+          body = body.replace(/<\/body>[^]*?$/gi, '')
+
+          options.setBody.call($frame[0], body)
+
+          $frame.trigger('create')
+          $frame.trigger('load')
+          $frame.trigger('frame-load')
+
+          $frame[0].dispatchEvent(
+            new CustomEvent('brightspot-frame-load', {
+              bubbles: true,
+            }),
+          )
+
+          for (const c of $frame[0].classList) {
+            if (c.startsWith('_ofc')) {
+              $frame[0].classList.remove(c)
+            }
+          }
+
+          $frame.removeClass('Widget')
+
+          $frame
+            .add($popup)
+            .removeClass(loadingClassName)
+            .addClass(loadedClassName)
+
+          // Sets aria-label for the popup.
+          if ($popup[0] && !$popup[0].hasAttribute('aria-label')) {
+            const isSearch = $frame
+              .popup('source')
+              ?.is('.Page-search, .ContentSelector-search')
+
+            var popupTitle = isSearch
+              ? (popupTitle = window.BRIGHTSPOT?.ui.tooltips.search.label)
+              : $frame[0]?.querySelector('.ContentEdit-title .ContentLabel')
+                  ?.textContent
+
+            if (!popupTitle) {
+              popupTitle = $frame[0]?.querySelector(
+                '.widget > h1:not(.ContentEdit-title), .Widget > h1:not(.ContentEdit-title), .Widget-title, :scope > h1:not(.ContentEdit-title)',
+              )?.textContent
+            }
+
+            if (popupTitle) {
+              $popup[0].setAttribute('aria-label', popupTitle)
+            }
+
+            const hasAutoFocus = $frame[0]?.querySelector('.autoFocus')
+
+            // Move focus to popup close element when an inner element doesn't have autofocus.
+            // Focus is set at this point (not earlier in popup.js) so that the
+            // screen-reader will recognize the aria-label that's being set above.
+            if (!isSearch && !hasAutoFocus) {
+              $popup[0].querySelector('.Popup-content > .Popup-close')?.focus({
+                preventScroll: true,
+              })
+            }
+          }
+
+          $win.resize()
+        }
+      }
+
+      // Loads the page at url into the $frame.
+      loadPage = function ($frame, $source, method, url, data, event) {
+        // var plugin = this
+        const version = beginLoad($frame, $source, event)
+        const extraFormData = $frame.attr('data-extra-form-data')
+
+        const settings = {
+          cache: false,
+          complete: function (response) {
+            endLoad($frame, version, response.responseText)
+          },
+        }
+
+        if (
+          url.length +
+            ((data && data.length) || 0) +
+            ((extraFormData && extraFormData.length) || 0) <
+          2000
+        ) {
+          settings.type = method
+        } else {
+          const questionAt = url.indexOf('?')
+
+          if (questionAt > -1) {
+            data = url.substring(questionAt + 1) + (data ? '&' + data : '')
+            url = url.substring(0, questionAt)
+          }
+
+          settings.type = 'POST'
+          settings.headers = { 'Brightspot-Frame-Method': method }
+        }
+
+        if (extraFormData) {
+          data = (data ? data + '&' : '') + extraFormData
+        }
+
+        settings.url = url
+        settings.data = data
+
+        $.ajax(settings)
+      }
+
+      // Intercept anchor clicks to see if it's targeted.
+      $caller.delegate('a', 'click.frame', function (event) {
+        const ret = findTargetFrame(this, function ($anchor, $frame) {
+          var href = $anchor.attr('href')
+
+          if ($anchor.is('[data-frame-post]')) {
+            var questionAt = href.indexOf('?')
+            var data
+
+            if (questionAt > -1) {
+              data = href.substring(questionAt + 1)
+              href = href.substring(0, questionAt)
+            }
+
+            loadPage($frame, $anchor, 'post', href, data, event)
+          } else {
+            loadPage($frame, $anchor, 'get', href, null, event)
+          }
+
+          return false
+        })
+
+        if (!ret) {
+          event.preventDefault()
+        }
+      })
+
+      $caller.on('change', ':checkbox[data-frame-target]', function (event) {
+        const ret = findTargetFrame(this, function ($checkbox, $frame) {
+          var href = $checkbox.prop('checked')
+            ? $checkbox.attr('data-frame-check')
+            : $checkbox.attr('data-frame-uncheck')
+
+          loadPage($frame, $checkbox, 'get', href, null, event)
+        })
+
+        if (!ret) {
+          event.preventDefault()
+        }
+      })
+
+      // Intercept form submits to see if it's targeted.
+      $caller.delegate('form', 'click.frame', function (event) {
+        if (!$(event.target).is('button, input[type="submit"]')) {
+          return
+        }
+
+        $.data(this, 'frame-clicked', event.target)
+      })
+
+      $caller.delegate('form, .NestedForm', 'submit.frame', function (event) {
+        if (event.processed) {
+          return
+        } else {
+          event.processed = true
+        }
+
+        const ret = findTargetFrame(this, function ($form, $frame) {
+          var action = $form.attr('data-action') || $form.attr('action')
+          var extraFormData = $frame.attr('data-extra-form-data')
+          var clicked = $.data($form[0], 'frame-clicked')
+          var clickedName
+          var clickedValue
+
+          if (clicked) {
+            clickedName = $(clicked).prop('name')
+            clickedValue = $(clicked).prop('value')
+
+            if (clickedName && clickedValue) {
+              action +=
+                (action.indexOf('?') > -1 ? '&' : '?') +
+                encodeURIComponent(clickedName) +
+                '=' +
+                encodeURIComponent(clickedValue)
+            }
+          }
+
+          if ($form.attr('enctype') !== 'multipart/form-data') {
+            loadPage(
+              $frame,
+              $form,
+              $form.attr('data-method') || $form.attr('method'),
+              action,
+              $form.is('form')
+                ? $form.serialize()
+                : $form.find(':input').serialize(),
+            )
+            return false
+          }
+
+          $form.attr(
+            $form.attr('data-action') ? 'data-action' : 'action',
+            action +
+              (extraFormData
+                ? (action.indexOf('?') < 0 ? '?' : '&') + extraFormData
+                : ''),
+          )
+
+          if ($form.find('input[type="hidden"][name="_frame"]').length === 0) {
+            $form.prepend(
+              $('<input/>', {
+                name: '_frame',
+                type: 'hidden',
+                value: 'true',
+              }),
+            )
+          }
+
+          // Add a target for $submitFrame later in case one doesn't exist.
+          var target = $form.attr('data-target') || $form.attr('target')
+          var hasTarget = true
+          if (!target) {
+            formTargetIndex += 1
+            target = 'frameTarget' + formTargetIndex + +new Date()
+            $form.attr(
+              $form.attr('data-target') ? 'data-target' : 'target',
+              target,
+            )
+            hasTarget = false
+          }
+
+          var $submitFrame = $('iframe[name=' + target + ']')
+          if ($submitFrame.length === 0) {
+            $submitFrame = $('<iframe/>', { name: target })
+            $submitFrame.hide()
+            $(doc.body).append($submitFrame)
+          }
+
+          var version = beginLoad($frame, $form)
+          $submitFrame.unbind('.frame')
+          $submitFrame.bind('load.frame', function () {
+            $form.attr(
+              $form.attr('data-action') ? 'data-action' : 'action',
+              action,
+            )
+            endLoad(
+              $frame,
+              version,
+              $submitFrame.contents().find('textarea#frameBody').val() ||
+                $submitFrame.contents().find('body').html(),
+            )
+            if (!hasTarget) {
+              $form.removeAttr('data-target')
+              $form.removeAttr('target')
+            }
+            $submitFrame.remove()
+          })
+
+          return true
+        })
+
+        const $container = $(this).popup('container')
+        const $source = $container.popup('source')
+        const isSearch = $source?.is('.Page-search, .ContentSelector-search')
+
+        if (!$source || $source.length === 0 || !isSearch) {
+          // Move focus to popup close element
+          // when an inner element doesn't have autofocus.
+          if (!$container[0]?.querySelector('.autoFocus')) {
+            $container.find('> .Popup-content > .Popup-close').focus()
+          }
+        }
+
+        if (!ret) {
+          event.preventDefault()
+        }
+      })
+
+      // Any existing frame should be loaded.
+      $caller.onCreate('.' + frameClassName, function () {
+        var $frame = $(this)
+        var $anchor
+
+        if (
+          $frame.is(
+            ':not(.' + loadingClassName + '):not(.' + loadedClassName + ')',
+          )
+        ) {
+          $anchor = $frame.find('a:only-child:not([target])')
+
+          if ($anchor.length > 0) {
+            $anchor.click()
+          } else {
+            $frame.find('form:only-child:not([target])').submit()
+          }
+        }
+      })
+
+      return $caller
+    },
+
+    // Returns the enclosing element that contains the frame.
+    container: function () {
+      return this.$caller.closest('.' + this.option('frameClassName'))
+    },
+
+    // Returns the source element that triggered the frame to be populated.
+    source: function () {
+      return this.container().data('frame-$source')
+    },
+  })
+})(jQuery, window)