alchemy_cms 7.0.15 → 7.1.0.pre.b1

data/app/views/alchemy/admin/elements/new.html.erb

@@ -1,15 +1,13 @@
 <%- if @clipboard_items.blank? -%>
   <%= render 'form' %>
 <%- else -%>
-<div id="overlay_tabs">
-  <ul>
-    <li><a href="#create_element_tab"><%= Alchemy.t('New') %></a></li>
-    <li><a href="#paste_element_tab"><%= Alchemy.t('Paste from clipboard') %></a></li>
-  </ul>
-  <div id="create_element_tab">
+<sl-tab-group id="overlay_tabs">
+  <sl-tab slot="nav" panel="create_element_tab"><%= Alchemy.t('New') %></sl-tab>
+  <sl-tab slot="nav" panel="paste_element_tab"><%= Alchemy.t('Paste from clipboard') %></sl-tab>
+  <sl-tab-panel name="create_element_tab">
     <%= render 'form' %>
-  </div>
-  <div id="paste_element_tab">
+  </sl-tab-panel>
+  <sl-tab-panel name="paste_element_tab">
     <%= alchemy_form_for([:admin, @element]) do |f| %>
       <%= f.hidden_field :page_version_id %>
       <%= f.hidden_field :parent_element_id, value: @parent_element.try(:id) %>
@@ -17,10 +15,10 @@
         <label for="paste_from_clipboard" class="control-label"><%= Alchemy.t("Element") %></label>
         <%= select_tag 'paste_from_clipboard',
           clipboard_select_tag_options(@clipboard_items),
-          class: 'alchemy_selectbox' %>
+          is: 'alchemy-select' %>
       </div>
       <%= f.submit Alchemy.t(:paste) %>
     <% end %>
-  </div>
-</div>
+  </sl-tab-panel>
+</sl-tab-group>
 <%- end -%>

data/app/views/alchemy/admin/ingredients/_file_fields.html.erb

@@ -6,7 +6,7 @@
   <%= f.input :css_class,
     collection: css_classes,
     include_blank: Alchemy.t('None'),
-    input_html: {class: 'alchemy_selectbox'} %>
+    input_html: {is: 'alchemy-select'} %>
 <%- else -%>
   <%= f.input :css_class,
     label: Alchemy.t(:position_in_text),
@@ -14,5 +14,5 @@
       [Alchemy.t(:above), "no_float"],
       [Alchemy.t(:left), "left"],
       [Alchemy.t(:right), "right"]
-    ], include_blank: Alchemy.t('Layout default'), input_html: {class: 'alchemy_selectbox'} %>
+    ], include_blank: Alchemy.t('Layout default') %>
 <%- end -%>

data/app/views/alchemy/admin/ingredients/_picture_fields.html.erb

@@ -7,13 +7,13 @@
       [Alchemy.t('Layout default'), ""]
     ] + ingredient.settings[:sizes].to_a,
     include_blank: false,
-    input_html: {class: 'alchemy_selectbox'} %>
+    input_html: {is: 'alchemy-select'} %>
 <%- end -%>
 <%- if ingredient.settings[:css_classes].present? -%>
   <%= f.input :css_class,
     collection: ingredient.settings[:css_classes],
     include_blank: Alchemy.t('None'),
-    input_html: {class: 'alchemy_selectbox'} %>
+    input_html: {is: 'alchemy-select'} %>
 <%- else -%>
   <%= f.input :css_class,
     label: Alchemy.t(:position_in_text),
@@ -21,5 +21,5 @@
       [Alchemy.t(:above), "no_float"],
       [Alchemy.t(:left), "left"],
       [Alchemy.t(:right), "right"]
-    ], include_blank: Alchemy.t("Layout default"), input_html: {class: 'alchemy_selectbox'} %>
+    ], include_blank: Alchemy.t("Layout default") %>
 <%- end -%>

data/app/views/alchemy/admin/ingredients/_video_fields.html.erb

@@ -5,5 +5,4 @@
 <%= f.input :loop, as: :boolean %>
 <%= f.input :muted, as: :boolean %>
 <%= f.input :playsinline, as: :boolean %>
-<%= f.input :preload, collection: %w(auto none metadata),
-  include_blank: false, input_html: {class: 'alchemy_selectbox'} %>
+<%= f.input :preload, collection: %w(auto none metadata), include_blank: false %>

data/app/views/alchemy/admin/languages/_form.html.erb

@@ -8,15 +8,14 @@
   <% if language.errors[:locale].present? || language.locale.present? %>
     <%= f.input :locale,
       collection: language.matching_locales.presence || ::I18n.available_locales,
-      selected: language.locale || language.language_code || ::I18n.default_locale.to_s,
-      input_html: {class: 'alchemy_selectbox'} %>
+      selected: language.locale || language.language_code || ::I18n.default_locale.to_s %>
   <% end %>
   <%= f.input :frontpage_name %>
   <%= f.input :page_layout,
     collection: Alchemy::PageLayout.all,
     label_method: ->(p) { Alchemy::Page.human_layout_name(p['name']) },
     value_method: ->(p) { p['name'] },
-    input_html: {class: 'alchemy_selectbox'} %>
+    input_html: {is: 'alchemy-select'} %>
   <%= f.input :public %>
   <%= f.input :default %>
   <%= f.hidden_field :site_id %>

data/app/views/alchemy/admin/languages/_language.html.erb

@@ -1,4 +1,7 @@
 <tr class="<%= cycle('even', 'odd') %>">
+  <td class="icon">
+    <%= render_icon("translate-2", size: "xl", style: nil) %>
+  </td>
   <td>
     <%= language.name %>
   </td>
@@ -28,16 +31,20 @@
   </td>
   <td class="tools">
   <%- if can?(:destroy, language) -%>
-    <%= delete_button resource_path(language) %>
+    <sl-tooltip content="<%= Alchemy.t("Delete") %>">
+      <%= delete_button resource_path(language) %>
+    </sl-tooltip>
   <%- end -%>
   <%- if can?(:edit, language) -%>
-    <%= link_to_dialog render_icon(:edit),
-      alchemy.edit_admin_language_path(language),
-      {
-        title: Alchemy.t("Edit"),
-        size: "430x415"
-      },
-      title: Alchemy.t("Edit") %>
+    <sl-tooltip content="<%= Alchemy.t("Edit") %>" placement="top-end">
+      <%= link_to_dialog render_icon(:edit),
+        alchemy.edit_admin_language_path(language),
+        {
+          title: Alchemy.t("Edit"),
+          size: "430x415"
+        },
+        class: "icon_button" %>
+    </sl-tooltip>
   <%- end -%>
   </td>
 </tr>

data/app/views/alchemy/admin/languages/_table.html.erb

@@ -2,6 +2,7 @@
 <table class="list" id="languages_list">
   <thead>
     <tr>
+      <th class="icon"></th>
       <th>
         <%= sort_link @query, :name %>
       </th>

data/app/views/alchemy/admin/layoutpages/_layoutpage.html.erb

@@ -3,53 +3,65 @@
     <div class="sitemap_left_images">
     <% if layoutpage.definition.blank? %>
       <%= page_layout_missing_warning %>
+    <% elsif layoutpage.locked? %>
+      <sl-tooltip class="like-hint-tooltip" content="<%= Alchemy.t("This page is locked", name: layoutpage.locker_name) %>">
+        <i class="icon ri-file-edit-line ri-fw ri-xl"></i>
+      </sl-tooltip>
     <% else %>
-      <i class="icon far fa-file fa-lg"></i>
+      <i class="icon ri-file-line ri-xl"></i>
     <% end %>
     </div>
     <div class="sitemap_right_tools">
     <%- if can?(:configure, layoutpage) -%>
-      <div class="button_with_label sitemap_tool">
+      <sl-tooltip content="<%= Alchemy.t(:edit_page_properties) %>">
         <%= link_to_dialog(
-          render_icon(:cog),
+          render_icon("settings-3"),
           alchemy.edit_admin_layoutpage_path(layoutpage),
           {
             title: Alchemy.t(:edit_page_properties),
             size: '410x170'
-          }
+          },
+          class: "icon_button"
         ) -%>
-        <label class="center"><%= Alchemy.t(:edit_page_properties) %></label>
-      </div>
+      </sl-tooltip>
     <%- end -%>
     <%- if can?(:copy, layoutpage) -%>
-      <div class="button_with_label sitemap_tool">
+      <sl-tooltip content="<%= Alchemy.t(:copy_page) %>">
         <%= link_to(
-          render_icon(:copy),
+          render_icon("file-copy"),
           alchemy.insert_admin_clipboard_path(
             remarkable_type: layoutpage.class.name.demodulize.underscore.pluralize,
             remarkable_id: layoutpage.id
           ),
           remote: true,
-          method: 'post'
+          method: 'post',
+          class: "icon_button"
         ) %>
-        <label class="center"><%= Alchemy.t(:copy_page) %></label>
-      </div>
+      </sl-tooltip>
     <%- end -%>
     <%- if can?(:destroy, layoutpage) -%>
-      <div class="button_with_label sitemap_tool">
+      <sl-tooltip content="<%= Alchemy.t(:delete_page) %>">
         <%= link_to_confirm_dialog(
-          render_icon(:minus),
+          render_icon("delete-bin-2"),
           Alchemy.t(:confirm_to_delete_page),
           url_for(
             controller: 'pages',
             action: 'destroy',
             id: layoutpage.id
-          )
+          ),
+          class: "icon_button"
         ) -%>
-        <label class="left"><%= Alchemy.t(:delete_page) %></label>
-      </div>
+      </sl-tooltip>
     <%- end -%>
     </div>
+    <div class="page_infos">
+      <% if layoutpage.locked? %>
+        <span class="page_status locked">
+          <i class="icon ri-fw ri-1x ri-edit-line"></i>
+          <%= layoutpage.status_title(:locked) %>
+        </span>
+      <% end %>
+    </div>
     <div class="sitemap_sitename without-status">
       <%= link_to(
         layoutpage.name,

data/app/views/alchemy/admin/layoutpages/edit.html.erb

@@ -1,4 +1,4 @@
-<%= alchemy_form_for [:admin, @page], url: alchemy.admin_layoutpage_path(@page), class: 'edit_page' do |f| %>
+<%= alchemy_form_for [:admin, @page], class: 'edit_page' do |f| %>
   <%= f.input :name, autofocus: true %>
   <div class="input string">
     <%= f.label :tag_list %>

data/app/views/alchemy/admin/layoutpages/index.html.erb

@@ -3,7 +3,7 @@
   <%= render 'alchemy/admin/partials/site_select' %>
   <%= render 'alchemy/admin/partials/language_tree_select' %>
   <%= toolbar_button(
-    icon: :plus,
+    icon: "file-add",
     url: alchemy.new_admin_page_path(language: @current_language, layoutpage: true),
     hotkey: 'alt+n',
     dialog_options: {
@@ -11,8 +11,8 @@
       size: '340x170',
       overflow: true
     },
-    title: Alchemy.t('Add global page'),
     label: Alchemy.t('Add global page'),
+    tooltip_placement: "top-start",
     if_permitted_to: [:create, Alchemy::Page]
   ) %>
   <%= toolbar_button(

data/app/views/alchemy/admin/legacy_page_urls/_legacy_page_url.html.erb

@@ -1,13 +1,17 @@
 <tr class="even" id="<%= dom_id(legacy_page_url) %>">
   <td class="name"><%= legacy_page_url.urlname %></td>
   <td class="tools">
-    <%= link_to_dialog render_icon(:edit),
-      edit_admin_legacy_page_url_path(legacy_page_url, page_id: @page.id),
-      {size: '400x125', title: Alchemy.t('Edit link')},
-      {title: Alchemy.t(:edit)} %>
-    <%= link_to_confirm_dialog render_icon(:minus),
-      Alchemy.t('Are you sure?'),
-      admin_legacy_page_url_path(legacy_page_url, page_id: @page.id),
-      {title: Alchemy.t(:remove)} %>
+    <sl-tooltip content="<%= Alchemy.t(:edit) %>">
+      <%= link_to_dialog render_icon(:edit),
+        edit_admin_legacy_page_url_path(legacy_page_url, page_id: @page.id),
+        {size: '400x125', title: Alchemy.t('Edit link')},
+        class: "icon_button" %>
+    </sl-tooltip>
+    <sl-tooltip content="<%= Alchemy.t(:remove) %>">
+      <%= link_to_confirm_dialog render_icon(:minus),
+        Alchemy.t('Are you sure?'),
+        admin_legacy_page_url_path(legacy_page_url, page_id: @page.id),
+        class: "icon_button" %>
+    </sl-tooltip>
   </td>
 </tr>

data/app/views/alchemy/admin/legacy_page_urls/_new.html.erb

@@ -12,7 +12,7 @@
     </div>
     <div class="right-column">
       <button class="with_icon">
-        <%= render_icon(:plus, size: 'xs') %>
+        <%= render_icon(:plus) %>
         <%= Alchemy.t(:add) %>
       </button>
     </div>

data/app/views/alchemy/admin/nodes/_form.html.erb

@@ -1,9 +1,9 @@
-<%= alchemy_form_for([:admin, node]) do |f| %>
+<%= alchemy_form_for([:admin, node], id: "node_form") do |f| %>
   <% if node.new_record? && node.root? %>
     <%= f.input :menu_type,
       collection: Alchemy::Language.current.available_menu_names.map { |n| [I18n.t(n, scope: [:alchemy, :menu_names]), n] },
       include_blank: false,
-      input_html: { class: 'alchemy_selectbox' } %>
+      input_html: { is: 'alchemy-select' } %>
   <% else %>
     <% if node.root? %>
       <%= f.input :name %>
@@ -13,7 +13,9 @@
         value: node.page && node.read_attribute(:name).blank? ? nil : node.name,
         placeholder: node.page ? node.page.name : nil
       } %>
-      <%= f.input :page_id, label: Alchemy::Page.model_name.human, input_html: { class: 'alchemy_selectbox' } %>
+      <%= render Alchemy::Admin::PageSelect.new(node.page, allow_clear: true) do %>
+        <%= f.input :page_id, label: Alchemy::Page.model_name.human %>
+      <% end %>
       <%= f.input :url, input_html: { disabled: node.page }, hint: Alchemy.t(:node_url_hint) %>
       <%= f.input :title %>
       <%= f.input :nofollow %>
@@ -26,23 +28,20 @@
 <% end %>
 
 <script>
-  $('#node_page_id').alchemyPageSelect({
-    placeholder: "<%= Alchemy.t(:search_page) %>",
-    url: "<%= alchemy.api_pages_path %>",
-    <% if node.page %>
-    initialSelection: {
-      id: <%= node.page_id %>,
-      text: "<%= node.page.name %>",
-      url_path: "<%= node.page.url_path %>"
-    }
-    <% end %>
-  }).on('change', function(e) {
-    if (e.val === '') {
-      $('#node_name').removeAttr('placeholder')
-      $('#node_url').val('').prop('disabled', false)
-    } else {
-      $('#node_name').attr('placeholder', e.added.name)
-      $('#node_url').val(e.added.url_path).prop('disabled', true)
-    }
+  const nodeName = document.getElementById("node_name")
+  const nodeUrl = document.getElementById("node_url")
+  const form = document.getElementById("node_form")
+
+  form.addEventListener("Alchemy.PageSelect.ItemAdded", (event) => {
+    const page = event.detail
+    nodeName.setAttribute("placeholder", page.name)
+    nodeUrl.value = page.url_path
+    nodeUrl.setAttribute("disabled", "disabled")
+  })
+
+  form.addEventListener("Alchemy.PageSelect.ItemRemoved", (event) => {
+    nodeName.removeAttribute("placeholder")
+    nodeUrl.value = ""
+    nodeUrl.removeAttribute("disabled")
   })
 </script>

data/app/views/alchemy/admin/nodes/_node.html.erb

@@ -9,49 +9,54 @@
     </span>
     <span class="nodes_tree-right_tools">
       <% if can?(:edit, node) %>
-        <%= link_to_dialog(
-          render_icon(:edit),
-          alchemy.edit_admin_node_path(node),
-          {
-            title: node.root? ? Alchemy.t(:edit_menu) : Alchemy.t(:edit_node),
-            size: node.root? ? '450x120' : '450x360'
-          },
-          title: node.root? ? Alchemy.t(:edit_menu) : Alchemy.t(:edit_node)
-        ) %>
+        <sl-tooltip content="<%= node.root? ? Alchemy.t(:edit_menu) : Alchemy.t(:edit_node) %>">
+          <%= link_to_dialog(
+            render_icon(:edit),
+            alchemy.edit_admin_node_path(node),
+            {
+              title: node.root? ? Alchemy.t(:edit_menu) : Alchemy.t(:edit_node),
+              size: node.root? ? '450x120' : '450x360'
+            },
+            class: "icon_button"
+          ) %>
+        </sl-tooltip>
       <% end %>
       <% if can?(:destroy, node) %>
-        <%= link_to_confirm_dialog(
-          render_icon(:minus),
-          node.root? ? Alchemy.t(:confirm_to_delete_menu) : Alchemy.t(:confirm_to_delete_node),
-          url_for(
-            controller: 'nodes',
-            action: 'destroy',
-            id: node.id
-          ),
-          {
-            title: node.root? ? Alchemy.t(:delete_menu) : Alchemy.t(:delete_node)
-          }
-        ) %>
+        <sl-tooltip content="<%= node.root? ? Alchemy.t(:delete_menu) : Alchemy.t(:delete_node) %>">
+          <%= link_to_confirm_dialog(
+            render_icon("delete-bin-2"),
+            node.root? ? Alchemy.t(:confirm_to_delete_menu) : Alchemy.t(:confirm_to_delete_node),
+            url_for(
+              controller: 'nodes',
+              action: 'destroy',
+              id: node.id
+            ),
+            {
+              class: "icon_button"
+            },
+          ) %>
+        </sl-tooltip>
       <% end %>
       <% if can?(:create, Alchemy::Node) %>
-        <%= link_to_dialog(
-          render_icon(:plus),
-          alchemy.new_admin_node_path(parent_id: node.id),
-          {
-            title: Alchemy.t(:create_node),
-            size: '450x360',
-            overflow: true
-          },
-          title: Alchemy.t(:create_node)
-        ) %>
+        <sl-tooltip content="<%= Alchemy.t(:create_node) %>" placement="top-end">
+          <%= link_to_dialog(
+            render_icon(:add),
+            alchemy.new_admin_node_path(parent_id: node.id),
+            {
+              title: Alchemy.t(:create_node),
+              size: '450x360',
+              overflow: true
+            },
+            class: "icon_button"
+          ) %>
+        </sl-tooltip>
       <% end %>
     </span>
     <div class="node_name">
       <%= node.name || '&nbsp;'.html_safe %>
       <span class="node_page">
       <% if node.page %>
-        <i class="icon far fa-file"></i>
-        &nbsp;
+        <i class="icon ri-file-3-line"></i>
         <%= link_to [:edit, :admin, node.page], title: Alchemy.t(:edit_page) do %>
           <%= node.page.name %>
         <% end %>
@@ -61,7 +66,7 @@
         <span class="node_url">
           <%= link_to node.url, node.url, target: '_blank', title: node.url %>
           <% if node.external? %>
-            <i class="fas fa-external-link-alt fa-sm"></i>
+            <i class="ri-external-link-line ri-sm"></i>
           <% end %>
         </span>
       <% end %>

data/app/views/alchemy/admin/nodes/index.html.erb

@@ -7,7 +7,7 @@
     <%= render 'alchemy/admin/partials/site_select' %>
     <%= render 'alchemy/admin/partials/language_tree_select' %>
     <%= toolbar_button(
-      icon: 'plus',
+      icon: 'menu-add',
       label: Alchemy.t(:create_menu),
       url: alchemy.new_admin_node_path,
       hotkey: 'alt+n',

data/app/views/alchemy/admin/pages/_anchor_link.html.erb

@@ -1,4 +1,4 @@
-<%= form_tag do %>
+<form data-link-form-type="anchor">
   <%= render_message do %>
     <p><%= Alchemy.t(:anchor_link_headline) %></p>
   <% end %>
@@ -8,7 +8,7 @@
     </label>
     <%= select_tag(:anchor_link,
       options_for_select([[Alchemy.t('Please choose'), '']]),
-      class: 'alchemy_selectbox') %>
+      is: 'alchemy-select') %>
   </div>
   <div class="input text">
     <label for="anchor_link_title" class="control-label">
@@ -17,6 +17,6 @@
     <%= text_field_tag "anchor_link_title", '', class: 'link_title' %>
   </div>
   <div class="submit">
-    <%= button_tag Alchemy.t(:apply), class: 'create-link button', data: { link_type: 'anchor' } %>
+    <%= button_tag Alchemy.t(:apply) %>
   </div>
-<% end %>
+</form>

data/app/views/alchemy/admin/pages/_create_language_form.html.erb

@@ -9,7 +9,7 @@
       <p><%= Alchemy.t(:want_to_make_copy_of_existing_language) %></p>
       <div class="input select">
         <%= label_tag('languages[old_lang_id]', Alchemy.t('Language tree'), class: 'control-label') %>
-        <%= select_tag("languages[old_lang_id]", options_for_select(@languages_with_page_tree.map{ |l| [l.name, l.id] }), class: "alchemy_selectbox") %>
+        <%= select_tag("languages[old_lang_id]", options_for_select(@languages_with_page_tree.map{ |l| [l.name, l.id] }), is: "alchemy-select") %>
         <%= hidden_field_tag("languages[new_lang_id]", @language.id) %>
       </div>
       <div class="submit">
@@ -30,7 +30,7 @@
       label: Alchemy.t(:page_type),
       include_blank: Alchemy.t('Please choose'),
       required: true,
-      input_html: {class: 'alchemy_selectbox'} %>
+      input_html: {is: 'alchemy-select'} %>
     <%= form.hidden_field :language_id, value: @language.id %>
     <%= form.hidden_field :language_code, value: @language.code %>
     <%= form.hidden_field :language_root, value: true %>

data/app/views/alchemy/admin/pages/_current_page.html.erb

@@ -1,4 +1,4 @@
 <div class="page_status_and_name" id="page_<%= current_page.id %>_status">
-  <%= render 'alchemy/admin/pages/page_status', page: current_page %>
   <%= render 'alchemy/admin/pages/page_infos', page: current_page %>
+  <%= render 'alchemy/admin/pages/page_status', page: current_page %>
 </div>

data/app/views/alchemy/admin/pages/_external_link.html.erb

@@ -1,4 +1,4 @@
-<%= form_tag do %>
+<form data-link-form-type="external">
   <%= render_message do %>
     <h3><%= Alchemy.t(:enter_external_link) %></h3>
     <p><%= Alchemy.t(:external_link_notice_1) %></p>
@@ -23,9 +23,9 @@
     </label>
     <%= select_tag 'external_link_target',
       options_for_select(Alchemy::Page.link_target_options),
-      class: 'alchemy_selectbox link_target' %>
+      class: 'link_target' %>
   </div>
   <div class="submit">
-    <%= button_tag Alchemy.t(:apply), class: 'create-link button', data: { link_type: 'external' } %>
+    <%= button_tag Alchemy.t(:apply) %>
   </div>
-<% end %>
+</form>

data/app/views/alchemy/admin/pages/_file_link.html.erb

@@ -1,4 +1,4 @@
-<%= form_tag do %>
+<form data-link-form-type="file">
   <%= render_message do %>
     <h3><%= Alchemy.t(:choose_file_to_link) %></h3>
   <% end %>
@@ -9,7 +9,7 @@
     <%= select_tag "file_link",
       options_for_select(@attachments),
       prompt: Alchemy.t('Please choose'),
-      class: "alchemy_selectbox" %>
+      is: "alchemy-select" %>
   </div>
   <div class="input text">
     <label for="file_link_title" class="control-label">
@@ -23,9 +23,9 @@
     </label>
     <%= select_tag 'file_link_target',
       options_for_select(Alchemy::Page.link_target_options),
-      class: 'alchemy_selectbox link_target' %>
+      class: 'link_target' %>
   </div>
   <div class="submit">
-    <%= button_tag Alchemy.t(:apply), class: 'create-link button', data: { link_type: 'file' } %>
+    <%= button_tag Alchemy.t(:apply) %>
   </div>
-<% end %>
+</form>

data/app/views/alchemy/admin/pages/_form.html.erb

@@ -1,6 +1,8 @@
 <%= alchemy_form_for [:admin, @page], class: 'edit_page' do |f| %>
   <% unless @page.language_root? || @page.layoutpage %>
-    <%= f.input :parent_id, required: true, input_html: { class: 'alchemy_selectbox' } %>
+    <%= render Alchemy::Admin::PageSelect.new(@page.parent) do %>
+      <%= f.input :parent_id, required: true %>
+    <% end %>
   <% end %>
 
   <div class="input check_boxes">
@@ -16,8 +18,9 @@
 
   <%= f.input :name, autofocus: true %>
   <%= f.input :urlname, as: 'string', input_html: {value: @page.slug}, label: Alchemy::Page.human_attribute_name(:slug) %>
-  <%= f.input :title,
-    input_html: {'data-alchemy-char-counter' => 60} %>
+  <alchemy-char-counter max-chars="60">
+    <%= f.input :title %>
+  </alchemy-char-counter>
 
   <% if Alchemy.enable_searchable %>
     <div class="input check_boxes">
@@ -36,9 +39,10 @@
     </div>
   </div>
 
-  <%= f.input :meta_description,
-    as: 'text',
-    input_html: {'data-alchemy-char-counter' => 160} %>
+  <alchemy-char-counter max-chars="160">
+    <%= f.input :meta_description, as: 'text' %>
+  </alchemy-char-counter>
+
   <%= f.input :meta_keywords,
     as: 'text',
     hint: Alchemy.t('pages.update.comma_seperated') %>
@@ -50,18 +54,3 @@
 
   <%= f.submit Alchemy.t(:save) %>
 <% end %>
-
-<script>
-  $('#page_parent_id').alchemyPageSelect({
-    placeholder: "<%= Alchemy.t(:search_page) %>",
-    url: "<%= alchemy.api_pages_path %>",
-    allowClear: false,
-    <% if @page.parent %>
-    initialSelection: {
-      id: <%= @page.parent.id %>,
-      text: "<%= @page.parent.name %>",
-      url_path: "<%= @page.parent.url_path %>"
-    }
-    <% end %>
-  })
-</script>

data/app/views/alchemy/admin/pages/_internal_link.html.erb

@@ -1,4 +1,4 @@
-<%= form_tag do %>
+<form data-link-form-type="internal">
   <%= render_message do %>
     <h3><%= Alchemy.t(:internal_link_headline) %></h3>
     <p><%= Alchemy.t(:internal_link_page_elements_explanation) %></p>
@@ -27,9 +27,9 @@
     </label>
     <%= select_tag 'internal_link_target',
       options_for_select(Alchemy::Page.link_target_options),
-      class: 'alchemy_selectbox link_target' %>
+      class: 'link_target' %>
   </div>
   <div class="submit">
-    <%= button_tag Alchemy.t(:apply), class: 'create-link button', data: { link_type: 'internal' } %>
+    <%= button_tag Alchemy.t(:apply) %>
   </div>
-<% end %>
+</form>