[WIP] Version 2

README.md

@@ -2,19 +2,46 @@
 
 ## Installation
 
-Add this line to your application's Gemfile:
-
 ```ruby
 gem 'ouvrages_block'
 ```
 
-And then execute:
+Append your `application.js` with:
+
+```js
+# app/assets/javascripts/application.js
 
-    $ bundle
+//= require ouvrages_block
+```
 
-Or install it yourself as:
+And import css too.
 
-    $ gem install ouvrages_block
+```css
+# app/assets/stylesheets.scss
+
+@import 'ouvrages_block';
+```
+
+In model you want use `block`:
+
+```rb
+# model.rb
+
+has_blocks([:block])
+```
+
+In form:
+
+```slim
+= bootstrap_form_for ... do |f|
+  = f.blocks_form
+```
+
+You can generate new block with:
+
+```sh
+rails generate block Name
+```
 
 ## Standard blocks
 
@@ -23,8 +50,3 @@ Or install it yourself as:
 - standard_block_rich_text
 - standard_block_medium_collection
 
-## Development
-
-## Contributing
-
-## License

app/assets/javascripts/ouvrages_block.js

@@ -1,41 +1,42 @@
-//= require scrollTo
+//= require jquery
+//= require bootstrap-sprockets
+//= require sortable-rails-jquery
+//= require tinymce-jquery
+//= require jquery-fileupload
 
-$(document).on("click", ".collapse-block-buttons", function(e) {
+$(document).on("click", ".block-button", function(e) {
   e.preventDefault();
-
-  var $button = $(this);
 
-  var $buttons = $button.closest(".block-buttons-group").find(".block-button");
-  $button.closest(".list-group").find(".block-button").not($buttons).addClass("hide");
-  $buttons.toggleClass("hide");
-});
+  var $button = $(this);
+  var $buttonWrapper = $button.closest(".block-form");
+  var $blockForms = $button.closest(".ouvrages-blocks").find(".block-forms");
+  var buttonsHTML = $blockForms.data("buttons").html;
 
-$(document).on("click", ".block-buttons .block-button", function(e) {
-  e.preventDefault();
+  var $newBlock = generateBlockForm($button, buttonsHTML);
 
-  var $button = $(this);
+  $(this).closest(".collapse").collapse('hide');
 
-  var $newBlock = generateBlockForm($button);
-  $(".block-forms").append($newBlock);
+  if ($buttonWrapper.length === 0) {
+    $blockForms.append($newBlock);
+  } else {
+    $newBlock.insertBefore($buttonWrapper);
+  }
 
   updateBlockFormPositions();
   $(document).trigger("blocks:add", $newBlock);
-
-  $(document).scrollTo($newBlock, {
-    offset: $newBlock.outerHeight(),
-    duration: 500
-  });
 });
 
-generateBlockForm = function(button) {
+generateBlockForm = function(button, buttonsHTML) {
   var $button = $(button);
   var formData = $button.data("form").html;
   var blocksCount = $(".block-form").length;
 
   formData = formData.replace(/\[__.+?__\]/g, "[" + blocksCount + "]");
   formData = formData.replace(/___NEW__.+?___/g, "_" + blocksCount + "_");
 
-  return $("<div class='block-form panel panel-primary'>" + formData + "</div>");
+  buttonsHTML = buttonsHTML.replace(/__ID__/g, "_" + blocksCount + "_");
+
+  return $("<div class='block-form'><div class='block-buttons'>" + buttonsHTML + "</div><div class='panel panel-primary'>" + formData + "</div>");
 };
 
 updateBlockFormPositions = function() {
@@ -46,17 +47,6 @@ updateBlockFormPositions = function() {
 };
 
 createSortable = function() {
-  $(".block-buttons .list-group .block-buttons-group").sortable({
-    group: {
-      name: "forms",
-      pull: 'clone',
-      put: false,
-    },
-    filter: ".collapse-block-buttons",
-    sort: false,
-    animation: 150,
-  });
-
   $(".block-forms").sortable({
     group: {
       name: "forms",
@@ -95,6 +85,9 @@ $.fn.initRichTextareas = function() {
 
 $(document).on("blocks:add", function(e, block) {
   $(block).initRichTextareas();
+  $(block).find(".address_picker").each(function(index, element) {
+    $(element).addressPickerField();
+  });
   createSortable();
 });
 
@@ -106,19 +99,16 @@ $(document).on("blocks:move", function(e, block) {
   $(block).initRichTextareas();
 });
 
-$(document).on('turbolinks:before-render', function() {
+$(document).on('turbolinks:before-cache', function() {
+  $(".address_picker").each(function(index, element) {
+    $(this).find(".address").typeahead("destroy");
+  });
   tinyMCE.remove();
 });
 
 $(document).on('turbolinks:load', function() {
   $(document.body).initRichTextareas();
   createSortable();
-
-  $("#block-buttons-inner-affix").affix({
-    bottom: function() {
-      return (this.bottom = $(".block-forms").outerHeight() - $("#block-buttons-inner-affix").height());
-    },
-  })
 });
 
 $(document).on("click", ".remove-block-form-button", function(e) {
@@ -151,7 +141,11 @@ $(document).on("click", ".collapse-block-form-button", function(e) {
   }
 });
 
+$(document).on("show.bs.collapse", ".block-buttons", function(e) {
+  $(e.currentTarget).find(".blocks-toggle i").removeClass("glyphicon-plus").addClass("glyphicon-chevron-up");
+});
 
-$(window).on("scroll", function(e) {
-  $("#block-buttons-inner-affix.affix").css("top", $(window).height() - $("#block-buttons-inner-affix").outerHeight() + "px");
+$(document).on("hide.bs.collapse", ".block-buttons", function(e) {
+  $(e.currentTarget).find(".blocks-toggle i").removeClass("glyphicon-chevron-up").addClass("glyphicon-plus");
 });
+

app/assets/stylesheets/ouvrages_block.scss

@@ -0,0 +1,30 @@
+@import 'bootstrap-sprockets';
+@import 'bootstrap';
+
+.block-deleted,
+.sortable-ghost {
+  opacity: 0.6;
+}
+
+.btn-circle {
+  width: 30px;
+  height: 30px;
+  text-align: center;
+  padding: 6px 0;
+  font-size: 12px;
+  line-height: 30px;
+  border-radius: 15px;
+}
+
+.blocks-toggle {
+  margin-bottom: 10px;
+}
+
+.block-buttons {
+  padding-bottom: 10px;
+}
+
+.block-panel {
+  margin-bottom: 10px;
+}
+

app/views/admin/blocks/_block_form.html.haml → app/views/blocks/_block_form.html.slim

@@ -4,9 +4,9 @@
   .panel-title
     = block_name.to_s.classify.constantize.model_name.human
     .pull-right
-      %span.glyphicon.glyphicon-minus.collapse-block-form-button
-      %span.glyphicon.glyphicon-trash.remove-block-form-button
-      %span.glyphicon.glyphicon-resize-vertical.handler
+      span.glyphicon.glyphicon-minus.collapse-block-form-button
+      span.glyphicon.glyphicon-trash.remove-block-form-button
+      span.glyphicon.glyphicon-resize-vertical.handler
 .panel-body.collapse.in
   = form.fields_for block_name, block, child_index: index do |t|
     = t.hidden_field :id, value: block.id

app/views/blocks/_blocks_form.html.slim

@@ -0,0 +1,10 @@
+h3= form.object.class.human_attribute_name(:blocks)
+
+.ouvrages-blocks
+  - buttons = render partial: "blocks/buttons", locals: { id: "___ID___", form: form }
+  .block-forms(data={ buttons: { html: buttons }.to_json })
+    - form.object.blocks.each do |block|
+      .block-form
+        = render partial: "blocks/buttons", locals: { id: "#{block.class.name.parameterize}-#{block.id}", form: form }
+        .panel.panel-primary.block-panel= form.block_form block
+  = render partial: "blocks/buttons", locals: { id: "all", form: form }

app/views/blocks/_buttons.html.slim

@@ -0,0 +1,9 @@
+.block-buttons.text-center(data={ target: id })
+  button.blocks-toggle.btn.btn-default.btn-circle(type="button" data={ toggle: "collapse", target: "#buttons-#{id}" } title="Ajouter un block")
+    i.glyphicon.glyphicon-plus
+  .collapse(id="buttons-#{id}")
+    - form.object.block_buttons.each do |block_name|
+      - new_block = form.block_form block_name.to_s.singularize.classify.constantize.new, template: true
+      - new_block = new_block.html_safe
+      button.btn.btn-default(data={ form: { html: new_block }.to_json, id: id } type="button" class="block-button")
+        = block_name.to_s.classify.constantize.model_name.human

lib/generators/block/block_generator.rb

@@ -31,8 +31,8 @@ def create_locale_files
   end
 
   def create_view_files
-    template "views/admin.html.haml", File.join("app", "views", "admin", standard_block_name_plural, "_block_form.html.haml")
-    template "views/show.html.haml", File.join("app", "views", standard_block_name_plural, "_#{standard_block_name_singular}.html.haml")
+    template "views/admin.html.slim", File.join("app", "views", "admin", standard_block_name_plural, "_block_form.html.slim")
+    template "views/show.html.slim", File.join("app", "views", standard_block_name_plural, "_#{standard_block_name_singular}.html.slim")
   end
 
   private
@@ -52,4 +52,28 @@ def standard_block_name_singular
   def standard_block_name_plural
     standard_block_name_singular.pluralize
   end
+
+  def standard_block_class_name
+    standard_block_name_singular.camelize
+  end
+
+  def standard_block_migration_name
+    standard_block_name_plural.camelize
+  end
+
+  def migration_class_name
+    if Rails::VERSION::MAJOR >= 5
+      "ActiveRecord::Migration[#{Rails::VERSION::MAJOR}.#{Rails::VERSION::MINOR}]"
+    else
+      'ActiveRecord::Migration'
+    end
+  end
+
+  def model_class_name
+    if Rails::VERSION::MAJOR >= 5
+      "ApplicationRecord"
+    else
+      "ActiveRecord::Base"
+    end
+  end
 end

lib/generators/block/templates/migrations/migration.rb

@@ -1,4 +1,4 @@
-class Create<%= standard_block_name_plural.capitalize %> < ActiveRecord::Migration[<%= ActiveRecord::Migration.current_version %>]
+class Create<%= standard_block_migration_name %> < <%= migration_class_name %>
   def up
     create_table :<%= standard_block_name_plural %> do |t|
       t.references :parent, polymorphic: true

lib/generators/block/templates/models/model.rb.erb

@@ -1,4 +1,4 @@
-class <%= standard_block_name_singular.capitalize %> < ApplicationRecord
+class <%= standard_block_class_name %> < <%= model_class_name %>
   belongs_to :parent, polymorphic: true
 
   def self.permitted_attributes

lib/generators/standard_block_rich_text/standard_block_rich_text_generator.rb

@@ -30,8 +30,8 @@ def create_locale_files
   end
 
   def create_view_files
-    template "views/admin.html.haml", File.join("app", "views", "admin", standard_block_name_plural, "_block_form.html.haml")
-    template "views/show.html.haml", File.join("app", "views", standard_block_name_plural, "_#{standard_block_name_singular}.html.haml")
+    template "views/admin.html.slim", File.join("app", "views", "admin", standard_block_name_plural, "_block_form.html.slim")
+    template "views/show.html.slim", File.join("app", "views", standard_block_name_plural, "_#{standard_block_name_singular}.html.slim")
   end
 
   private
@@ -51,4 +51,28 @@ def standard_block_name_singular
   def standard_block_name_plural
     "rich_texts"
   end
+
+  def standard_block_class_name
+    standard_block_name_singular.camelize
+  end
+
+  def standard_block_migration_name
+    standard_block_name_plural.camelize
+  end
+
+  def migration_class_name
+    if Rails::VERSION::MAJOR >= 5
+      "ActiveRecord::Migration[#{Rails::VERSION::MAJOR}.#{Rails::VERSION::MINOR}]"
+    else
+      'ActiveRecord::Migration'
+    end
+  end
+
+  def model_class_name
+    if Rails::VERSION::MAJOR >= 5
+      "ApplicationRecord"
+    else
+      "ActiveRecord::Base"
+    end
+  end
 end