Convert GUI from Coffeescript to Javascript

app/assets/javascripts/alchemy/admin.js

@@ -23,7 +23,6 @@
 //= require alchemy/alchemy.elements_window
 //= require alchemy/alchemy.fixed_elements
 //= require alchemy/alchemy.growler
-//= require alchemy/alchemy.gui
 //= require alchemy/alchemy.hotkeys
 //= require alchemy/alchemy.image_overlay
 //= require alchemy/alchemy.string_extension

app/javascript/alchemy_admin.js

@@ -1,6 +1,7 @@
 import "@hotwired/turbo-rails"
 
 import Buttons from "alchemy_admin/buttons"
+import GUI from "alchemy_admin/gui"
 import translate from "alchemy_admin/i18n"
 import Dirty from "alchemy_admin/dirty"
 import translationData from "alchemy_admin/translations"
@@ -24,6 +25,7 @@ if (typeof window.Alchemy === "undefined") {
 Object.assign(Alchemy, {
   Buttons,
   ...Dirty,
+  GUI,
   t: translate, // Global utility method for translating a given string
   translations: Object.assign(Alchemy.translations || {}, translationData),
   fileEditors,

app/javascript/alchemy_admin/gui.js

@@ -0,0 +1,32 @@
+function init(scope) {
+  Alchemy.SelectBox(scope)
+  Alchemy.Datepicker(scope && scope.selector)
+  Alchemy.Tooltips(scope)
+  Alchemy.Buttons.observe(scope)
+  if (!scope) {
+    Alchemy.watchForDialogs()
+  }
+  Alchemy.Hotkeys(scope)
+  Alchemy.ListFilter(scope)
+  Alchemy.Autocomplete.tags(scope)
+  $("[data-alchemy-char-counter]", scope).each(function () {
+    new Alchemy.CharCounter(this)
+  })
+}
+
+function initElement($el) {
+  Alchemy.ElementDirtyObserver($el)
+  init($el && $el.selector)
+  Alchemy.ImageLoader($el[0])
+  Alchemy.fileEditors(
+    $el.find(
+      ".ingredient-editor.file, .ingredient-editor.audio, .ingredient-editor.video"
+    ).selector
+  )
+  Alchemy.pictureEditors($el.find(".ingredient-editor.picture").selector)
+}
+
+export default {
+  init,
+  initElement
+}