Working with Bricks

Configuring custom styles for bricks

Implement the available_display_styles on a brick model and return an array of css classnames: ['module-big', 'module-small']. These styles can be applied to a brick instance through the UI. In the frontend, use to_style_class to get the configured styles:

%my-brick{ class: brick.to_style_class }
  = brick.text # ... etc

After setting up display styles in specific model add your translations for the UI dropdown. E.g. you've added display styles to the TextBrick model:

de:
  text_brick:
    display_styles:
      style1: 'My Style 1'
      style2: 'My Style 2'

Adding your own Bricks

• Create your Brick model in app/models, for example CaptionBrick, which inherits from Qbrick::Brick.
• If u use a string field add a max-length validation of 255 characters. To prevent a ActiveRecord::StatementInvalid Error.
• Create a migration which adds the necessary fields to the qbrick_bricks table.
• If your brick should be accessible via UI, add a BrickType into the seeds or add a migration: Qbrick::BrickType.create(:class_name => 'CaptionBrick', :group => 'elements')
• Add the edit and show partials to your views, e.g: app/views/caption_bricks/caption_brick/_edit.html.haml
• Add the childs partial to your views, if you want to render your bricks childs with your own html: app/views/caption_bricks/caption_brick/_childs.html.haml
• Implement the fulltext method on your brick, return anything you want to be searchable.
• Customize the edit form behaviour of your brick by overriding methods like to_style_class?. See the Brick and BrickList files for more methods.

Use the Qbrick ImageBrickImageUploader for your own Brick

Qbrick has a module called ImageUploaderMounting. This module mounts the ImageBrickImageUploader and includes a callback method which handles that the image sizes will be updated after save.

class CustomBrick < Brick
  include Qbrick::ImageUploaderMounting
  ...
end

If you do not include this module, then the images will not be changed when selecting one of your own image.

Configuring Grid settings for Bricks

Include the Qbrick::Gridded Module on every Brick you want to display in a grid. Default grid options are 1 to 12 (representing columns) wich can be configured via the class method available_grid_sizes (should return an array of integers). Each instance of a gridded class will have a method gridded? wich returns true if a column size is set.

If the Gridded Module is added to a Custom Brick, it should provide a col_count integer field with default value 0.

add_column :your_awesome_brick, :col_count, :integer, default: 0

Adding custom components with placeholder bricks

• Save your partial in views/qbrick/placeholder_bricks/partials/_your_partial.html.haml
• Add translations for your partial in config/locales/models/qbrick/placeholder_brick/locale.yml

de:
  your_partial: Your Partial

Invalidating placeholder bricks containing other models on model changes

Include the TouchPlaceholders module if your model is used within a placeholder brick and define which templates it appears in:

class Dummy < ActiveRecord::Base
  include Qbrick::TouchPlaceholders
  placeholder_templates 'some_template', 'some_other_template'
end

Mixing Custom Models/Views/Controllers with qBrick Pages

Use the custom page type:

Custom pages behave almost like redirect pages except that they can have content and meta tags like normal pages.

What can you use this for: To redirect to a custom controller that does whatever you want and still have CMS content along side it. Example usage in a host app:

In Custom Controller that page redirects to:

  def index
    # could also be extracted into before_action
    @page = Qbrick::Page.find(session[:qbrick_referrer]) if session[:qbrick_referrer]
    @somestuff = Somestuff.new
  end

View:

= render file: 'qbrick/pages/show'