Page form with front end style

app/views/admin/items/_form_error.js.erb

@@ -0,0 +1 @@
+$("#pageslide #page_error").html("<%= j @error %>");

app/views/admin/items/update.js.erb

@@ -1,6 +0,0 @@
-<% if @error %>
-	$("#pageslide #page_error").html("<%= j @error %>");
-<% else %>
-	$("#<%= @item.id.to_s %>").html("<%= j render 'admin/items/node_and_children', node: @item %>");
-	reloadStructure();
-<% end %>

app/views/admin/pages/_custom_front.html.erb

@@ -0,0 +1,2 @@
+<label><%= t("default_widget.select_widget_style") %></label>
+<%= select 'page', 'frontend_style', @frontend_styles, {:selected => (@item && @item[:frontend_style])}, class: "input-xlarge" %>

app/views/admin/pages/_default_front.html.erb

@@ -0,0 +1,98 @@
+<label><%= t("default_widget.select_widget_style") %></label>
+<ul class="typesetting">
+  <% if @enabled_styles.include?("typeA") %>
+    <li class="active">
+      <input type="radio" class="d-theme" name="page[frontend_style]" value="typeA" checked="checked">
+      <%= radio_button_tag "page[frontend_style]", "typeA", @checked_style ? @checked_style.eql?("typeA") : true, class: "d-theme" %>
+      <%= image_tag 'module/default_widgets/style01.png'%>
+      <span class="style_description"><%= t("default_widget.caption.typeA") %></span>  
+    </li>
+  <% end %>
+  <% if @enabled_styles.include?("typeB_style2") %>
+    <li>
+      <%= radio_button_tag "page[frontend_style]", "typeB_style2", @checked_style ? @checked_style.eql?("typeB_style2") : false, class: "d-theme" %>
+      <%= image_tag 'module/default_widgets/style02.png'%>
+      <span class="style_description"><%= t("default_widget.caption.typeB_style2") %></span>
+    </li>
+  <% end %>
+  <% if @enabled_styles.include?("typeB_style3") %>
+    <li>
+      <%= radio_button_tag "page[frontend_style]", "typeB_style3", @checked_style ? @checked_style.eql?("typeB_style3") : false, class: "d-theme" %>
+      <%= image_tag 'module/default_widgets/style03.png'%>
+      <span class="style_description"><%= t("default_widget.caption.typeB_style3") %></span>
+    </li>
+  <% end %>
+  <% if @enabled_styles.include?("typeB_style4") %>
+    <li>
+      <%= radio_button_tag "page[frontend_style]", "typeB_style4", @checked_style ? @checked_style.eql?("typeB_style4") : false, class: "d-theme" %>
+      <%= image_tag 'module/default_widgets/style04.png'%>
+      <span class="style_description"><%= t("default_widget.caption.typeB_style4") %></span>
+    </li>
+  <% end %>
+  <% if @enabled_styles.include?("typeC") %>
+    <li>
+      <%= radio_button_tag "page[frontend_style]", "typeC", @checked_style ? @checked_style.eql?("typeC") : false, class: "d-theme" %>
+      <%= image_tag 'module/default_widgets/style05.png'%>
+      <span class="style_description"><%= t("default_widget.caption.typeC") %></span>
+    </li>
+  <% end %>
+</ul>
+<label><%= t("default_widget.fields_") %></label>
+<table>
+  <thead>
+    <tr>
+      <th><%= t "default_widget.fields_order" %></th>
+      <th></th>
+      <th><%= t "default_widget.fields_style" %></th>
+      <th class="span1"></th>
+    </tr>
+  </thead>
+  <tbody class="form-inline">
+    <% @widget_fields.count.times do |i| %>
+      <tr>
+        <td>
+          <%= select_tag "page[frontend_field][][field_name]", options_for_select(@widget_fields, (@item.frontend_field_name[i] if @item)), include_blank: true, class: "input-small widget_field" %>
+        </td>
+        <td><i class="icons-arrow-right-6"></i></td>
+        <td>
+          <%= select_tag "page[frontend_field][][class]", options_for_select(@class_options, (@item.frontend_class[i] if @item)), include_blank: true, class: "input-small" %>
+        </td>
+        <td>
+          <label class="checkbox">
+            <span class="checkbox_link hide"><%= check_box_tag 'page[frontend_field][][sat_to_link]', true, @item && @item.frontend_with_link[i] || false %> <%= t(:link) %></span>
+          </label>
+        </td>
+      </tr>
+    <% end %>
+  </tbody>
+</table>
+
+
+<script>
+  $(document).ready(function() {
+    $('#pageslide').on(clickEvent, '.typesetting input[type="radio"]', function(event) {
+      $(this).prop('checked') ? $(this).closest('li').addClass('active').siblings('li').removeClass('active') : '';
+    });
+    $('#pageslide select.widget_field').each(function() {
+      if($(this).find(":selected").prop('class') == 'link') {
+        $(this).closest('tr').find('.checkbox_link').show();
+      }
+    });
+    $('#pageslide').on('change', '.widget_field', function() {
+      if($(this).find(":selected").prop('class') == 'link') {
+        $(this).closest('tr').find('.checkbox_link')
+                              .show()
+                              .end()
+                              .find('.checkbox_link input[type="checkbox"]')
+                              .prop('checked', false);
+      }
+      else {
+        $(this).closest('tr').find('.checkbox_link')
+                              .hide()
+                              .end()
+                              .find('.checkbox_link input[type="checkbox"]')
+                              .prop('checked', false);
+      }
+    });
+  });
+</script>

app/views/admin/pages/get_display_style.js.erb

@@ -0,0 +1,5 @@
+<% if @partial %>
+	$("#pageslide .display-mode").html("<%= j render @partial %>")
+<% else %>
+	$("#pageslide .display-mode").html('')
+<% end %>