migration.rb

class CreateContents < ActiveRecord::Migration
  def self.up
    create_table :contents do |t|
      t.text :data
      # t.integer :layout_order
      t.integer :position
      # :position is idiomatic rails
      t.integer :element_id
      t.integer :webpage_id 
      t.integer :parent_id
     
      t.timestamps
    end
  end
 
  def self.down
    drop_table :contents
  end
end

models.rb

class Webpage < ActiveRecord::Base
  belongs_to :dropdown
  has_many :contents, :order => "parent_id, position"
  has_many :elements, :through => :contents
end
 
class Content < ActiveRecord::Base
  # you need to use something like http://github.com/rails/acts_as_tree/tree/master
  # so you don't have to manage the parent/sibling relationship on your own
  acts_as_tree, :order => 'position'
  
  belongs_to :element
  belongs_to :webpage
end
 
class Element < ActiveRecord::Base
  has_many :contents
  has_many :webpages, :through => :contents
end

rake_task.rb

task :db_initialize => :environment do
  
  webpage = Webpage.new
  
  # 4
  e4 = Element.create!(:markup => "div", :style => "float: left; border: 1px solid red; width: 48%;")
  
  #red div
  left_div = e4.contents.create!(:position => 1)
  webpage.contents << left_div
  
  # the above *should* supplant this:
  # # 4
  #   e = Element.new  
  #   e.markup = "div"
  #   e.style = "float: left; border: 1px solid red; width: 48%;"
  #   e.save!
  
  # and
  
  # #red div
  # c = Content.new
  # c.element_id = 4
  # c.webpage_id = 1
  # c.layout_order = 1
  # c.parent_id = nil
  # c.data = nil
  # c.save!
  # 
  # left_div = c.id
  
# ------------------- 

# 1
  e = Element.new
  e.markup = "p"
  e.style = "color: red;"
  e.save!

# 2  
  e = Element.new
  e.markup = "h2"
  e.style = "text-align: center;"
  e.save!
  
# 3
  e = Element.new
  e.markup = "li"
  e.style = "text-align: right; list-style-type: disc;"
  e.save!
  
# # 4
#   e = Element.new  
#   e.markup = "div"
#   e.style = "float: left; border: 1px solid red; width: 48%;"
#   e.save!
  
# 5  
  e = Element.new  
  e.markup = "div"
  e.style = "float: right; border: 1px solid blue;"
  e.save!
  
# 6
  e = Element.new  
  e.markup = "div"
  e.style = "width: 50%; text-align: center; border: 1px solid teal;"
  e.save!

# 7
  e = Element.new
  e.markup = "ul"
  e.style = "border: 1px solid green;"
  e.save!

#8
  e = Element.new
  e.markup = "div"
  e.style = "background: #9d10ff; margin: 5px; padding: 15%; float: left; border: 1px solid #333;"
  e.save!
  
#  ------------------- 

  
  # #red div
  # c = Content.new
  # c.element_id = 4
  # c.webpage_id = 1
  # c.layout_order = 1
  # c.parent_id = nil
  # c.data = nil
  # c.save!
  # 
  # left_div = c.id
  
  #red div
  c = Content.new
  c.element_id = 4
  c.webpage_id = 1
  c.layout_order = 2
  c.parent_id = nil
  c.data = nil
  c.save!

  left2_div = c.id

  #p
  c = Content.new
  c.element_id = 1
  c.webpage_id = 1
  c.layout_order = 2
  c.parent_id = left_div
  c.data = "I should be a 2nd paragraph in the left div"
  c.save

  #p
  c = Content.new
  c.element_id = 1
  c.webpage_id = 1
  c.layout_order = 1
  c.parent_id = left_div
  c.data = "I am a paragraph, meant to be in the left div"
  c.save


  #purple box
  c = Content.new
  c.element_id = 8
  c.webpage_id = 1
  c.layout_order = 3
  c.parent_id = left2_div
  c.save!

  purple = c.id

  #ul
  c = Content.new
  c.element_id = 7
  c.webpage_id = 1
  c.layout_order = 1
  c.parent_id = purple
  c.save!

  ul_id = c.id

  num = 0
  5.times do
    num += 1
    c = Content.new
    c.element_id = 3
    c.webpage_id = 1
    c.layout_order = num
    c.parent_id = ul_id
    c.data = "inside purple item number#{num}"
    c.save!
  end
  
end

end

webpages_controller.rb

class WebpagesController < ApplicationController
  # GET /webpages
  # GET /webpages.xml
  def index
    @webpage = Webpage.find(params[:page])
    # :find searches on id so :find_by_id is redundant
    # and will raise an exception if no such webpages exists
    
    # @contents = @webpage.contents unless @webpage.nil?
    # you don't need this ivar (instance variable) since you already have @webpage
    
    respond_to do |format|
      format.html # index.html.erb
      format.xml  { render :xml => @webpages }
    end
  end
end

webpages_helper.rb

module WebpagesHelper
  def display_html_content(webpage)
    # I assume you do NOT want to call this method with "contents" outside the
    # context of a webpage
    
  return if webpage.contents.empty?
  
    webpage.contents.map do |c|
      
      # ==================
      # = INCOMPLETE !!! =
      # ==================
  
      unless $completed_elements.include?(c.id)
        get_nested_elements(c, contents) 
      end
 
    end
    
  end
  
  def get_nested_elements(c, contents)
    # you need to use something like http://github.com/rails/acts_as_tree/tree/master
    # so you don't have to manage the parent/sibling relationship on your own
   
    nested_items = contents.find_all_by_parent_id(c.id)
 
    content_tag c.element.markup, :style => c.element.style do
 
      nested = c.data.nil? ? "" : c.data
      
      unless nested_items.blank?
        nested_items.map do |n|
          nested += get_nested_elements(n, contents)
        end
      end
      
      $completed_elements << c.id
      
      nested
 
    end
    
  end
end