editable_components 0.1.0

data/app/models/editable_components/item_integer.rb

@@ -0,0 +1,23 @@
+module EditableComponents
+  class ItemInteger < Item
+    alias_attribute :data, :data_integer
+
+    def init
+      self.data = 0
+      self
+    end
+
+    def update_data( value )
+      self.data = value.to_i
+      self.save
+    end
+
+    def to_s
+      self.data.to_s
+    end
+
+    def self.type_name
+      'integer'
+    end
+  end
+end

data/app/models/editable_components/item_string.rb

@@ -0,0 +1,29 @@
+module EditableComponents
+  class ItemString < Item
+    alias_attribute :data, :data_string
+
+    validate :on_validate
+
+    def init
+      self.data = self.name.gsub( /-/, ' ' ).humanize
+      self
+    end
+
+    def on_validate
+      if self.block.validations[self.name]
+        if self.block.validations[self.name] == 'required'
+          self.errors.add( :base, "#{self.name} is required" ) if self.data_string.blank?
+        end
+      end
+    end
+
+    def update_data( value )
+      self.data = ActionController::Base.helpers.sanitize( value, tags: [] )
+      self.save
+    end
+
+    def self.type_name
+      'string'
+    end
+  end
+end

data/app/models/editable_components/item_text.rb

@@ -0,0 +1,19 @@
+module EditableComponents
+  class ItemText < Item
+    alias_attribute :data, :data_text
+
+    def init
+      self.data = self.name.gsub( /-/, ' ' ).humanize
+      self
+    end
+
+    def update_data( value )
+      self.data = ActionController::Base.helpers.sanitize( CGI.unescapeHTML( value ) )
+      self.save
+    end
+
+    def self.type_name
+      'text'
+    end
+  end
+end

data/app/views/editable_components/_admin_toolbar.html.erb

@@ -0,0 +1,105 @@
+<% if EditableComponents::Engine.edit_mode && local_assigns[:page] %>
+  <!-- Modal dialogs -->
+  <div data-ec-dlg="options" class="c-overlay c-overlay--fullpage">
+    <div class="o-modal">
+      <div class="c-card">
+        <header class="c-card__header">
+          <h4 class="c-heading">Block {{ dlg_block_type }}</h4>
+        </header>
+        <div class="c-card__body">
+          <div v-for="block in sub_blocks" :data-ec-sub-block="block.block" :data-ec-destroy="block.destroy">
+            <div data-ec-dlg-buttons class="c-input-group">
+              <button class="c-button c-button--error" v-on:click="removeSubBlock( block.block )"><i data-ec-icon="icon-bin" title="Remove"></i></button>
+              <button class="c-button c-button--warning"><i data-ec-icon="icon-move-down" class="sortable" title="Move"></i></button>
+            </div>
+            <div v-for="item in block.items" is="edit-block">
+              <div v-if="item.input != 'file_image'" :data-ec-input="item.input" :data-ec-item="item.item" :data-ec-type="item.type" v-html="item.value"></div>
+              <img v-else :src="item.src" :data-ec-input="item.input" :data-ec-item="item.item" :data-ec-type="item.type" v-html="item.value"/>
+            </div>
+          </div>
+          <div v-for="(block, index) in new_sub_blocks" data-ec-new-sub-block>
+            New sub block
+            <button type="button" class="c-button c-button--error" v-on:click="cancelNewSubBlock(index)">
+              <i data-ec-icon="icon-bin"></i>
+            </button>
+          </div>
+        </div>
+        <footer class="c-card__footer">
+          <button v-show="dlg_block_container" type="button" class="c-button c-button--success" v-on:click="addSubBlock">
+            <i data-ec-icon="icon-plus"></i> add sub block
+          </button>
+          <button type="button" class="c-button c-button--error" v-on:click="removeBlock">
+            <i data-ec-icon="icon-bin"></i> remove block
+          </button>
+          <button type="button" class="c-button c-button--brand" v-on:click="dlgOptionsClose">
+            <i data-ec-icon="icon-floppy-disk"></i> done
+          </button>
+        </footer>
+      </div>
+    </div>
+  </div>
+  <div data-ec-dlg="preview" class="c-overlay c-overlay--fullpage">
+    <div class="o-modal">
+      <header class="c-card__header">
+        <button type="button" class="c-button c-button--close" onclick="ecMain.dlgPreviewClose()">×</button>
+      </header>
+      <div class="c-card__body"></div>
+    </div>
+  </div>
+  <div data-ec-dlg="menu" class="c-overlay c-overlay--fullpage"></div>
+  <!-- Toolbar -->
+  <ul data-ec-toolbar class="c-nav c-nav--inline c-nav--fixed c-nav--bottom">
+    <li class="c-nav__item">
+      <!-- <a class="c-link" href="/admin" title="Open admin interface">Admin</a> -->
+      Admin
+    </li>
+    <li class="c-nav__item" onclick="ecMain.showMenu('menu-preview')">
+      <i data-ec-icon="icon-mobile2" title="Open preview options"></i>
+      <ul class="c-card c-card--menu" data-ec-menu-dropup="menu-preview">
+        <li class="c-card__item" onclick="ecMain.dlgPreviewOpen('mobile')">Mobile</li>
+        <li class="c-card__item" onclick="ecMain.dlgPreviewOpen('tablet')">Tablet</li>
+      </ul>
+    </li>
+    <li class="c-nav__item item-menu-add" onclick="ecMain.showMenu('menu-add');">
+      <i data-ec-icon="icon-plus" title="Open add options"></i>
+      <ul class="c-card c-card--menu" data-ec-menu-dropup="menu-add">
+        <% EditableComponents::Block::block_types.each do |type| %>
+          <li class="c-card__item" v-on:click="addBlock('<%= type %>')">New <%= type %></li>
+        <% end %>
+      </ul>
+    </li>
+    <li class="c-nav__item c-nav__item--right last-item">
+      <button data-edit-button class="c-button" onclick="ecMain.setEditMode()" title="Edit components"><i data-ec-icon="icon-pencil"></i> edit</button>
+    </li>
+    <% page = local_assigns[:page] %>
+    <% model = page.class.to_s.underscore %>
+    <!-- <li class="c-nav__item c-nav__item--right">
+      <%= form_for page, url: EditableComponents::Engine::routes.url_helpers.ec_publish_path( model, page ), method: :post, as: :ec_cmp, namespace: 'ec' do |f| %>
+        <input type="hidden" name="version" value="<%= @version.to_i %>"/>
+        <%= button_tag( type: 'submit', class: 'c-button c-button--success', title: 'Publish', 'data-ec-menu-publish': '' ) do %>
+          <i data-ec-icon="icon-floppy-disk"></i> publish
+        <% end %>
+      <% end %>
+    </li> -->
+    <li class="c-nav__item c-nav__item--right">
+      <%= form_for page, url: EditableComponents::Engine::routes.url_helpers.ec_update_path( model, page ), method: :patch, as: :ec_cmp, namespace: 'ec', html: { 'data-ec-form': '', 'data-ec-model': model, 'v-cloak': '', 'v-on:submit': 'onSubmit( $event )' } do |f| %>
+        <input type="hidden" name="version" value="<%= @version.to_i %>"/>
+        <div data-ec-fields></div>
+        <input v-for="input in inputs" type="hidden" v-bind:name="input.name" v-bind:value="input.value"/>
+        <%= button_tag( type: 'submit', class: 'c-button c-button--info', title: 'Save changes', 'data-ec-menu-save': '' ) do %>
+          <i data-ec-icon="icon-floppy-disk"></i> save
+        <% end %>
+      <% end %>
+    </li>
+  </ul>
+  <script type="text/x-template" id="ec-block-buttons-template">
+    <div data-ec-block-buttons class="c-input-group">
+      <button class="c-button c-button--brand" v-on:click="openDialogOptions">
+        <i data-ec-icon="icon-pencil" title="Options"></i>
+      </button>
+      <button class="c-button c-button--warning">
+        <i class="sortable" data-ec-icon="icon-move-down" title="Reorder"></i>
+      </button>
+    </div>
+  </script>
+<% end %>

data/app/views/editable_components/_block.html.erb

@@ -0,0 +1,6 @@
+<% if local_assigns[:block] %>
+  <% block = local_assigns[:block] %>
+  <div class="block-<%= block.block_type %>" <%= block.editable %>><%=
+    render partial: "editable_components/block_#{block.block_type}", locals: { block: block }
+  %></div>
+<% end %>

data/app/views/editable_components/_block_image.html.erb

@@ -0,0 +1,6 @@
+<% block = local_assigns[:block] %>
+<% if block %>
+  <% if block.props.file %>
+    <%= image_tag block.props.file.data, block.props.file.editable %>
+  <% end %>
+<% end %>

data/app/views/editable_components/_block_multi_text.html.erb

@@ -0,0 +1,7 @@
+<% if local_assigns[:block] %>
+  <% local_assigns[:block].ec_blocks.each do |sb| %>
+    <div class="sub-block" <%= sb.editable %>><%=
+      render partial: "editable_components/block_#{sb.block_type}", locals: { block: sb }
+    %></div>
+  <% end %>
+<% end %>

data/app/views/editable_components/_block_slide.html.erb

@@ -0,0 +1,6 @@
+<% block = local_assigns[:block] %>
+<% if block %>
+  <% if block.props.file %>
+    <%= image_tag block.props.file.data, block.props.file.editable %>
+  <% end %>
+<% end %>

data/app/views/editable_components/_block_slider.html.erb

@@ -0,0 +1,7 @@
+<% if local_assigns[:block] %>
+  <% local_assigns[:block].ec_blocks.each do |sb| %>
+    <div class="sub-block" <%= sb.editable %>><%=
+      render partial: "editable_components/block_#{sb.block_type}", locals: { block: sb }
+    %></div>
+  <% end %>
+<% end %>

data/app/views/editable_components/_block_text.html.erb

@@ -0,0 +1,5 @@
+<% block = local_assigns[:block] %>
+<% if block %>
+  <div class="title"<%= block.props.string.editable %>><%== block.props.string %></div>
+  <div class="content"<%= block.props.text.editable %>><%== block.props.text %></div>
+<% end %>

data/app/views/editable_components/_block_text_with_image.html.erb

@@ -0,0 +1,12 @@
+<% block = local_assigns[:block] %>
+<% if block %>
+  <div>
+    <% if block.props.image %>
+      <%= image_tag block.props.image.data, block.props.image.editable %>
+    <% end %>
+    <% if block.props.string %>
+      <div class="title"<%= block.props.string.editable %>><%== block.props.string %></div>
+      <div class="content"<%= block.props.text.editable %>><%== block.props.text %></div>
+    <% end %>
+  </div>
+<% end %>

data/app/views/editable_components/_blocks.html.erb

@@ -0,0 +1,12 @@
+<% if local_assigns[:container] %>
+  <div data-ec>
+    <% blocks = local_assigns[:container].current_blocks( params[:version] ) %>
+    <% if blocks %>
+      <div id="ec_blocks" <%= EditableComponents::Engine.edit_mode ? "data-ec-blocks=#{blocks.length}" : '' %>><%= yield blocks %></div>
+      <% if EditableComponents::Engine.edit_mode %>
+        <div data-ec-new-blocks></div>
+      <% end %>
+    <% end %>
+    <%= render( partial: 'editable_components/admin_toolbar', locals: { page: local_assigns[:container] } ) %>
+  </div>
+<% end %>

data/config/initializers/editable_components.rb

@@ -0,0 +1,72 @@
+
+module EditableComponents
+  @@config = {
+    ec_blocks: {
+      multi_text: {
+        children_type: :text,
+        name: 'Multi columns block',
+        items: {
+          column: :text
+        }
+      },
+      text: {
+        name: 'Text block',
+        items: {
+          title: :item_string,
+          content: :item_text
+        }
+      },
+    },
+    items: {
+      boolean: {},
+      datetime: {},
+      float: {},
+      hash: {},
+      file: {
+        input: :file_image
+      },
+      integer: {},
+      string: {},
+      text: {
+        input: :html
+      },
+    }
+  }
+
+  if defined? CarrierWave
+    @@config[:ec_blocks].merge!({
+      image: {
+        name: 'Image block',
+        items: {
+          img: :item_file
+        }
+      },
+      slide: {
+        name: 'Slide block',
+        items: {
+          img: :item_file,
+          title: :item_string
+        }
+      },
+      slider: {
+        children_type: :slide,
+        name: 'Slider block',
+        items: {
+          slide: :slide
+        }
+      },
+      text_with_image: {
+        name: 'Text with image block',
+        items: {
+          img: :item_file,
+          title: :item_string,
+          content: :item_text
+        }
+      },
+    })
+
+    # ItemImage.class_eval do
+    #   mount_uploader :data, ImageUploader
+    # end
+  end
+end

data/config/routes.rb

@@ -0,0 +1,4 @@
+EditableComponents::Engine.routes.draw do
+  match 'ec_update/:container/:container_id', to: 'blocks#update', via: [ :patch, :put ], as: :ec_update
+  post 'ec_publish/:container/:container_id', to: 'blocks#publish', as: :ec_publish
+end

data/db/migrate/20170414173603_create_editable_components_blocks.rb

@@ -0,0 +1,18 @@
+class CreateEditableComponentsBlocks < ActiveRecord::Migration[5.0]
+  def change
+    create_table :editable_components_blocks do |t|
+      t.string :block_type, null: false, default: 'text'
+      t.integer :version, null: false, default: 0
+      t.string :name, null: false, default: ''
+      t.integer :position, null: false, default: 0
+      t.boolean :published, null: false, default: true
+      t.boolean :_init, null: false, default: false
+      t.string :options, null: false, default: '{}'
+      t.string :validations, null: false, default: '{}'
+      t.integer :parent_id
+      t.string :parent_type
+    end
+
+    add_index :editable_components_blocks, [:parent_id, :parent_type]
+  end
+end

data/db/migrate/20170414173610_create_editable_components_items.rb

@@ -0,0 +1,11 @@
+class CreateEditableComponentsItems < ActiveRecord::Migration[5.0]
+  def change
+    create_table :editable_components_items do |t|
+      t.string :type
+      t.string :name, null: false, default: 'data'
+      t.integer :block_id
+    end
+
+    add_index :editable_components_items, :block_id
+  end
+end

data/db/migrate/20170414173611_add_items_booleans.rb

@@ -0,0 +1,5 @@
+class AddItemsBooleans < ActiveRecord::Migration[5.0]
+  def change
+    add_column :editable_components_items, :data_boolean, :boolean
+  end
+end

data/db/migrate/20170414173612_add_items_datetimes.rb

@@ -0,0 +1,5 @@
+class AddItemsDatetimes < ActiveRecord::Migration[5.0]
+  def change
+    add_column :editable_components_items, :data_datetime, :datetime
+  end
+end

data/db/migrate/20170414173613_add_items_files.rb

@@ -0,0 +1,5 @@
+class AddItemsFiles < ActiveRecord::Migration[5.0]
+  def change
+    add_column :editable_components_items, :data_file, :string  # , null: false, default: ''
+  end
+end

data/db/migrate/20170414173614_add_items_floats.rb

@@ -0,0 +1,5 @@
+class AddItemsFloats < ActiveRecord::Migration[5.0]
+  def change
+    add_column :editable_components_items, :data_float, :float
+  end
+end

data/db/migrate/20170414173615_add_items_hashes.rb

@@ -0,0 +1,5 @@
+class AddItemsHashes < ActiveRecord::Migration[5.0]
+  def change
+    add_column :editable_components_items, :data_hash, :string  # , null: false, default: ''
+  end
+end

data/db/migrate/20170414173616_add_items_integers.rb

@@ -0,0 +1,5 @@
+class AddItemsIntegers < ActiveRecord::Migration[5.0]
+  def change
+    add_column :editable_components_items, :data_integer, :integer
+  end
+end

data/db/migrate/20170414173617_add_items_strings.rb

@@ -0,0 +1,5 @@
+class AddItemsStrings < ActiveRecord::Migration[5.0]
+  def change
+    add_column :editable_components_items, :data_string, :string  # , null: false, default: ''
+  end
+end

data/db/migrate/20170414173618_add_items_texts.rb

@@ -0,0 +1,5 @@
+class AddItemsTexts < ActiveRecord::Migration[5.0]
+  def change
+    add_column :editable_components_items, :data_text, :text
+  end
+end

data/lib/editable_components.rb

@@ -0,0 +1,87 @@
+require "editable_components/engine"
+
+module EditableComponents
+  def self.config( options = {} )
+    #   p '> [TODO] EditableComponents.config'
+    @@config.merge! options
+    @@config
+  end
+
+  def self.publish( parent, version )
+    v = version.to_i
+    if v > 0
+      v2 = Time.now.to_i
+      parent.ec_blocks.where( version: 0 ).update_all( version: v2 )
+      parent.ec_blocks.where( version: v ).update_all( version: 0 )
+      v2
+    else
+      v = Time.now.to_i
+      blocks = []
+      parent.ec_blocks.where( version: 0 ).each do |block|
+        blocks << block.amoeba_dup
+        blocks.last.version = v
+      end
+      parent.ec_blocks << blocks
+      parent.save
+      # TODO: delete old versions
+      v
+    end
+  end
+
+  def self.update( parent, params )
+    ret = true
+    if params[:ec_cmp]
+      # TODO: return false on errors and set errors
+      version = params[:version].to_i
+      params[:ec_cmp].each do |type, fields|
+        model = ( 'EditableComponents::' + type ).constantize rescue nil
+        if model
+          if model.ancestors.include?( EditableComponents::Item )
+            # Update an item
+            fields.each do |k, v|
+              item = model.find_by_id k
+              if item
+                if !item.update_data( v )
+                  ret = false
+                  parent.errors.add :base, item.errors[:base]
+                end
+              end
+            end
+          elsif type == 'Block'
+            fields.each do |k, v|
+              block = EditableComponents::Block.find_by_id k
+              if block
+                if v.delete( '_destroy' )
+                  # Destroy a block
+                  block.destroy
+                else
+                  if( add = v.delete( '_add' ) )
+                    # Create new sub blocks
+                    t = block.block_type.to_sym
+                    add.keys.each do
+                      if @@config[:ec_blocks][t] && @@config[:ec_blocks][t][:children_type]
+                        sub_block = EditableComponents::Block.new( parent: block, block_type: @@config[:ec_blocks][t][:children_type], version: version, _init: true )
+                        sub_block.save
+                        # TODO: return errors
+                      end
+                    end
+                  end
+                  # Update a block
+                  block.update( v.permit( :position, :published ) )
+                end
+              elsif( add = v.delete( '_add' ) )
+                # Create new blocks
+                add.each do |index, new_type|
+                  t = new_type.to_sym
+                  # TODO: check if t is a valid block type
+                  EditableComponents::Block.new( parent: parent, block_type: t, version: version, _init: true ).save
+                end
+              end
+            end
+          end
+        end
+      end
+    end
+    ret
+  end
+end