new page tree ui + snippets crud + layout crud (in progress) + page parts (in progress)

2010-05-03 01:33:17 +02:00 · 2010-05-03 01:33:17 +02:00 · 3b847b2732
commit 3b847b2732
parent ae20b51636
77 changed files with 6032 additions and 148 deletions
--- a/app/controllers/admin/layouts_controller.rb
+++ b/app/controllers/admin/layouts_controller.rb
@ -0,0 +1,54 @@
+class Admin::LayoutsController < Admin::BaseController
+  
+  sections 'settings'
+  
+  def index
+    @layouts = current_site.layouts
+  end
+  
+  def new
+    @layout = current_site.layouts.build
+  end
+  
+  def edit
+    @layout = current_site.layouts.find(params[:id])
+  end
+  
+  def create
+    @layout = current_site.layouts.build(params[:layout])
+
+    if @layout.save
+      flash_success!
+      redirect_to edit_admin_layout_url(@layout)
+    else
+      flash_error!
+      render :action => 'new'
+    end
+  end
+  
+  def update
+    @layout = current_site.layouts.find(params[:id])
+      
+    if @layout.update_attributes(params[:layout])
+      flash_success!
+      redirect_to edit_admin_layout_url(@layout)
+    else
+      flash_error!
+      render :action => "edit"
+    end
+  end
+  
+  def destroy
+    @layout = current_site.layouts.find(params[:id])
+
+    begin
+      @layout.destroy
+      flash_success!
+    rescue Exception => e
+      flash[:error] = e.to_s
+    end
+
+    redirect_to admin_layouts_url
+  end
+  
+end
--- a/app/controllers/admin/pages_controller.rb
+++ b/app/controllers/admin/pages_controller.rb
@ -3,7 +3,7 @@ class Admin::PagesController < Admin::BaseController
  sections 'contents'
  
  def index
-    @pages = Page.all
+    @pages = current_site.pages.roots
  end
  
  def new
@ -38,6 +38,19 @@ class Admin::PagesController < Admin::BaseController
    end
  end
  
+  def sort
+    @page = current_site.pages.find(params[:id])
+    @page.sort_children!(params[:children])
+    
+    render :json => { :message => translate_flash_msg(:successful) }
+  end
+  
+  def get_path
+    page = current_site.pages.build(:parent => current_site.pages.find(params[:parent_id]), :slug => params[:slug].slugify)
+    
+    render :json => { :url => page.url, :slug => page.slug }
+  end
+  
  def destroy
    @page = current_site.pages.find(params[:id])

--- a/app/controllers/admin/snippets_controller.rb
+++ b/app/controllers/admin/snippets_controller.rb
@ -0,0 +1,54 @@
+class Admin::SnippetsController < Admin::BaseController
+  
+  sections 'settings'
+  
+  def index
+    @snippets = current_site.snippets
+  end
+  
+  def new
+    @snippet = current_site.snippets.build
+  end
+  
+  def edit
+    @snippet = current_site.snippets.find(params[:id])
+  end
+  
+  def create
+    @snippet = current_site.snippets.build(params[:snippet])
+
+    if @snippet.save
+      flash_success!
+      redirect_to edit_admin_snippet_url(@snippet)
+    else
+      flash_error!
+      render :action => 'new'
+    end
+  end
+  
+  def update
+    @snippet = current_site.snippets.find(params[:id])
+      
+    if @snippet.update_attributes(params[:snippet])
+      flash_success!
+      redirect_to edit_admin_snippet_url(@snippet)
+    else
+      flash_error!
+      render :action => "edit"
+    end
+  end
+  
+  def destroy
+    @snippet = current_site.snippets.find(params[:id])
+
+    begin
+      @snippet.destroy
+      flash_success!
+    rescue Exception => e
+      flash[:error] = e.to_s
+    end
+
+    redirect_to admin_snippets_url
+  end
+  
+end
--- a/app/helpers/admin/base_helper.rb
+++ b/app/helpers/admin/base_helper.rb
@ -6,10 +6,28 @@ module Admin::BaseHelper
  end
  
  def admin_button_tag(text, url, options = {})
-    text = text.is_a?(Symbol) ? t(".#{text}") : text    
+    text = text.is_a?(Symbol) ? t(".#{text}") : text
    link_to(url, options) do
      content_tag(:span, text)
    end
  end
  
+  def admin_submenu_item(name, url, options = {}, &block)
+    default_options = { :i18n => true, :css => '' }
+    default_options.merge!(options)
+        
+    css = "#{name.dasherize.downcase} #{'on' if name == sections(:sub)} #{'links' if block_given?} #{options[:css]}"
+    
+    label_link = default_options[:i18n] ? t("admin.shared.menu.#{name}") : name
+    # if block_given?
+    #   popup = content_tag(:div, capture(&block), :class => 'popup', :style => 'display: none')
+    #   link = link_to(content_tag(:span, label_link + content_tag(:em)), url)
+    #   concat(content_tag(:li, link + popup, :class => css))
+    # else
+    #   html = content_tag(:li, link_to(content_tag(:span, label_link), url), :class => css)
+    # end
+    
+    content_tag(:li, link_to(content_tag(:span, label_link), url), :class => css)
+  end
+  
 end
--- a/app/helpers/admin/pages_helper.rb
+++ b/app/helpers/admin/pages_helper.rb
@ -0,0 +1,24 @@
+module Admin::PagesHelper
+  
+  def parent_pages_options
+    roots = current_site.pages.roots.where(:slug.ne => '404').and(:_id.ne => @page.id)
+    
+    puts roots.to_a.inspect
+    returning [] do |list|
+      roots.each do |page|
+        list = add_children_to_options(page, list)
+      end
+    end
+  end
+  
+  def add_children_to_options(page, list)
+    return list if page.path.include?(@page.id) || page == @page
+    
+    offset = '- ' * (page.depth || 0) * 2
+        
+    list << ["#{offset}#{page.title}", page.id]
+    page.children.each { |child| add_children_to_options(child, list) }
+    list
+  end
+  
+end
--- a/app/models/layout.rb
+++ b/app/models/layout.rb
@ -0,0 +1,37 @@
+class Layout < LiquidTemplate
+
+  ## associations ##
+  embeds_many :parts, :class_name => 'PagePart'
+  
+  ## callbacks ##
+  before_save :build_parts_from_value
+  
+  ## validations ##
+  validates_format_of :value, :with => Locomotive::Regexps::CONTENT_FOR_LAYOUT, :message => :missing_content_for_layout
+  
+  ## methods ##
+  
+  protected
+  
+  def build_parts_from_value
+    if self.value_changed? || self.new_record?
+      self.parts = []
+
+      (groups = self.value.scan(Locomotive::Regexps::CONTENT_FOR)).each do |part|
+        part[1].strip!
+        part[1] = nil if part[1].empty?
+        
+        slug = part[0].strip.downcase
+        
+        name = (if slug == 'layout'
+          I18n.t('admin.shared.attributes.body')
+        else
+          (part[1] || slug).gsub("\"", '')
+        end)
+        
+        self.parts.build :slug => slug, :name => name
+      end
+    end
+  end
+  
+end
--- a/app/models/liquid_template.rb
+++ b/app/models/liquid_template.rb
@ -0,0 +1,27 @@
+class LiquidTemplate  
+  include Mongoid::Document
+  include Mongoid::Timestamps
+  
+  ## fields ##
+  field :name
+  field :slug
+  field :value
+  
+  ## associations ##
+  belongs_to_related :site
+  
+  ## callbacks ##
+  before_validate :normalize_slug
+  
+  ## validations ##
+  validates_presence_of   :site, :name, :slug, :value
+  validates_uniqueness_of :slug, :scope => [:site_id, :_type]
+  
+  protected
+  
+  def normalize_slug
+    self.slug = self.name.clone if self.slug.blank? && self.name.present?
+    self.slug.slugify!(:without_extension => true, :downcase => true) if self.slug.present?
+  end
+    
+end
--- a/app/models/page.rb
+++ b/app/models/page.rb
@ -14,43 +14,101 @@ class Page
  ## associations ##
  belongs_to_related :site
  embeds_many :parts, :class_name => 'PagePart'
+    
+  ## callbacks ##
+  before_validate :reset_parent
+  before_validate :normalize_slug
+  before_save { |p| p.parent_id = nil if p.parent_id.blank? }
+  before_save :change_parent
+  before_create { |p| p.fix_position(false) }
+  before_create :add_to_list_bottom
+  before_create :add_body_part
+  before_destroy :remove_from_list  
  
  ## validations ##
  validates_presence_of     :site, :title, :slug
  validates_uniqueness_of   :slug, :scope => :site_id
  validates_exclusion_of    :slug, :in => Locomotive.config.reserved_slugs, :if => Proc.new { |p| p.depth == 0 }
  
-  ## callbacks ##
-  before_create :add_to_list_bottom
-  before_create :add_body_part
-  before_destroy :remove_from_list
-  before_validate :normalize_slug
-  
  ## named scopes ##
  
  ## behaviours ##
-  acts_as_tree
+  acts_as_tree :order => ['position', 'asc']
  
  ## methods ##
  
+  def index?
+    self.slug == 'index' && self.depth.to_i == 0
+  end
+  
+  def not_found?
+    self.slug == '404' && self.depth.to_i == 0
+  end
+  
  def add_body_part
    self.parts.build :name => 'body', :value => '---body here---'
  end
    
  def parent=(owner) # missing in acts_as_tree
-    self[self.parent_id_field] = owner._id
-    self[self.path_field] = owner[owner.path_field] + [owner._id]
-    self[self.depth_field] = owner[owner.depth_field] + 1
+    @_parent = owner
+    self.fix_position(false)
    self.instance_variable_set :@_will_move, true
  end
  
+  def sort_children!(ids)
+    ids.each_with_index do |id, position|
+      child = self.children.detect { |p| p._id == id }
+      child.position = position
+      child.save
+    end
+  end
+  
  def route
-    File.join self.self_and_ancestors.map(&:slug)
+    return self.slug if self.index? || self.not_found?    
+    slugs = self.self_and_ancestors.map(&:slug)
+    slugs.shift
+    File.join slugs
+  end
+  
+  def url
+    "http://#{self.site.domains.first}/#{self.route}.html"
+  end
+  
+  def ancestors
+    return [] if root?
+    self.class.find(self.path.clone << nil) # bug in mongoid (it does not handle array with on element) 
  end
  
  protected
  
-  def add_to_list_bottom      
+  def change_parent
+    if self.parent_id_changed?
+      self.fix_position(false)
+      self.add_to_list_bottom
+      self.instance_variable_set :@_will_move, true
+    end
+  end
+  
+  def fix_position(perform_save = true)
+    if parent.nil?
+      self[parent_id_field] = nil
+      self[path_field] = []
+      self[depth_field] = 0
+    else
+      self[parent_id_field] = parent._id
+      self[path_field] = parent[path_field] + [parent._id]
+      self[depth_field] = parent[depth_field] + 1
+      self.save if perform_save
+    end
+  end
+  
+  def reset_parent
+    if self.parent_id_changed?
+      @_parent = nil
+    end
+  end
+  
+  def add_to_list_bottom  
    self.position = (Page.where(:_id.ne => self._id).and(:parent_id => self.parent_id).max(:position) || 0) + 1
  end
  
@ -60,8 +118,9 @@ class Page
      p.save
    end
  end
-  
-  def normalize_slug
+    
+  def normalize_slug  
+    self.slug = self.title.clone if self.slug.blank? && self.title.present?    
    self.slug.slugify!(:without_extension => true) if self.slug.present?
  end
 end
--- a/app/models/page_part.rb
+++ b/app/models/page_part.rb
@ -11,10 +11,10 @@ class PagePart
  ## associations ##
  embedded_in :page, :inverse_of => :parts
  
+  ## callbacks ##
+  before_validate  { |p| p.slug ||= p.name.slugify if p.name.present? }  
+  
  ## validations ##
  validates_presence_of :name, :slug
  
-  ## callbacks ##
-  before_validate  { |p| p.slug ||= p.name.slugify if p.name.present? }
-  
 end
--- a/app/models/site.rb
+++ b/app/models/site.rb
@ -10,6 +10,8 @@ class Site
  
  ## associations ##
  has_many_related :pages
+  has_many_related :layouts
+  has_many_related :snippets
  
  ## validations ##
  validates_presence_of     :name, :subdomain
--- a/app/models/snippet.rb
+++ b/app/models/snippet.rb
@ -0,0 +1,3 @@
+class Snippet < LiquidTemplate
+
+end
--- a/app/views/admin/layouts/_form.html.haml
+++ b/app/views/admin/layouts/_form.html.haml
@ -0,0 +1,10 @@
+= f.inputs :name => :information do
+  = f.input :name
+  
+= f.inputs :name => :code do
+  = f.custom_input :value, :css => 'full', :with_label => false do
+    %code{ :class => 'html' }
+      = f.text_area :value
+      
+
+      
--- a/app/views/admin/layouts/_layout.html.haml
+++ b/app/views/admin/layouts/_layout.html.haml
@ -0,0 +1,7 @@
+%li
+  %strong= link_to layout.name, edit_admin_layout_path(layout)
+  .more
+    %span= t('.updated_at')
+    = l layout.updated_at, :format => :short
+    
+    = link_to image_tag('admin/list/icons/trash.png'), admin_layout_path(layout), :class => 'remove', :confirm => t('admin.messages.confirm'), :method => :delete
--- a/app/views/admin/layouts/edit.html.haml
+++ b/app/views/admin/layouts/edit.html.haml
@ -0,0 +1,18 @@
+- title t('.title')
+
+- content_for :head do
+  = javascript_include_tag 'admin/plugins/codemirror/codemirror'
+
+- content_for :submenu do
+  = render 'admin/shared/menu/settings'
+
+- content_for :buttons do
+  = admin_button_tag :new, new_admin_layout_url, :class => 'add'
+
+%p= t('.help')
+
+= semantic_form_for @layout, :url => admin_layout_url(@layout) do |form|
+
+  = render 'form', :f => form
+
+  = render 'admin/shared/form_actions', :back_url => admin_layouts_url, :button_label => :update  
--- a/app/views/admin/layouts/index.html.haml
+++ b/app/views/admin/layouts/index.html.haml
@ -0,0 +1,15 @@
+- title t('.title')
+
+- content_for :submenu do
+  = render 'admin/shared/menu/settings'
+
+- content_for :buttons do
+  = admin_button_tag :new, new_admin_layout_url, :class => 'add'
+
+%p= t('.help')
+
+- if @layouts.empty?
+  %p.no-items= t('.no_items', :url => new_admin_layout_url)
+- else
+  %ul#layouts-list.list
+    = render @layouts
--- a/app/views/admin/layouts/new.html.haml
+++ b/app/views/admin/layouts/new.html.haml
@ -0,0 +1,15 @@
+- title t('.title')
+
+- content_for :head do
+  = javascript_include_tag 'admin/plugins/codemirror/codemirror'
+
+- content_for :submenu do
+  = render 'admin/shared/menu/settings'
+
+%p= t('.help')
+
+= semantic_form_for @layout, :url => admin_layouts_url do |form|
+
+  = render 'form', :f => form
+  
+  = render 'admin/shared/form_actions', :back_url => admin_layouts_url, :button_label => :create
--- a/app/views/admin/pages/_form.html.haml
+++ b/app/views/admin/pages/_form.html.haml
@ -2,8 +2,10 @@
  
  = f.input :title
  
-  = f.custom_input :path, :css => 'path' do
-    & /#{f.text_field :path}.html
+  - if not @page.index? and not @page.not_found?
+    = f.input :parent_id, :as => :select, :collection => parent_pages_options, :include_blank => false
+      
+  = f.input :slug, :required => false, :hint => @page.slug.blank? ? '&nbsp;' : @page.url, :input_html => { :data_url => get_path_admin_pages_url, :disabled => @page.index? || @page.not_found? }
  
  = f.custom_input :published, :css => 'toggle' do
    = f.check_box :published
--- a/app/views/admin/pages/_page.html.haml
+++ b/app/views/admin/pages/_page.html.haml
@ -0,0 +1,16 @@
+%li{ :id => "item-#{page.id}", :class => "#{'not-found' if page.not_found? }"}
+  - if not page.index? and not page.children.empty?
+    = image_tag 'admin/list/icons/node_closed.png', :class => 'toggler'
+  %em
+  %strong= link_to truncate(page.title, :length => 80), edit_admin_page_url(page)
+  
+  .more    
+    %span= t('.updated_at')
+    = l page.updated_at, :format => :short
+		
+    - if not page.index? and not page.not_found?
+      = link_to image_tag('admin/list/icons/trash.png'), admin_page_url(page), :class => 'remove', :confirm => t('admin.messages.confirm'), :method => :delete
+    
+  - if not page.children.empty?
+    %ul{ :id => "folder-#{page._id}", :class => "folder depth-#{(page.depth || 0) + 1}", :data_url => sort_admin_page_url(page), :style => "display: #{cookies["folder-#{page._id}"] || 'block'}" }
+      = render page.children
--- a/app/views/admin/pages/edit.html.haml
+++ b/app/views/admin/pages/edit.html.haml
@ -1,52 +1,18 @@
 - title link_to(@page.title.blank? ? @page.title_was : @page.title, '#', :rel => 'page_title', :title => t('.ask_for_title'), :class => 'editable')

+- content_for :head do
+  = javascript_include_tag 'admin/pages'
+
 - content_for :submenu do
-  = render 'admin/shared/contents_menu'
+  = render 'admin/shared/menu/contents'

 - content_for :buttons do
  = admin_button_tag :show, '#', :class => 'show'

 %p= t('.help')

-= semantic_form_for @page, :url => admin_page_url(@page), :html => { :class => 'shortcut-enabled' } do |form|
+= semantic_form_for @page, :url => admin_page_url(@page) do |form|

  = render 'form', :f => form
  
-  = render 'admin/shared/form_actions', :back_url => admin_pages_url, :button_label => :update
-
-
-/ <% content_for :title do %>
-/   <%= link_to @page.title.blank? ? @page.title_was : @page.title, '#', :class => 'editable' %>
-/ <% end %>
-/ 
-/ <% content_for :buttons do %>
-/   <% show_page_button(@page) %>
-/ <% end %>
-/ 
-/ <p><%= t('admin.pages.edit.help') %></p>
-/ 
-/ <% semantic_form_for @page, :url => admin_page_url(@page), :html => { :class => 'save-shortcut' } do |form| %>
-/ 
-/   <%= render :partial => 'form', :locals => { :f => form } %>
-/ 
-/   <div class="actions">
-/     <div class="span-12">
-/       <p>
-/         <%= link_to '&larr;&nbsp;' + t('admin.common.buttons.back'), admin_pages_url %>
-/       </p>
-/     </div>
-/     
-/     <div class="span-12 last">
-/       <p>
-/         <button class="button light" type="submit">
-/           <span><%= t('admin.common.buttons.update') %></span>
-/         </button>
-/       </p>
-/     </div>
-/     <div class="clear"></div>
-/   </div>
-/ <% end %>
-/ 
-/ <% content_for :submenu do %>
-/   <%= render :partial => '/shared/admin/contents_menu' %>
-/ <% end %>
+  = render 'admin/shared/form_actions', :back_url => admin_pages_url, :button_label => :update
--- a/app/views/admin/pages/index.html.haml
+++ b/app/views/admin/pages/index.html.haml
@ -1,7 +1,10 @@
 - title t('.title')

+- content_for :head do
+  = javascript_include_tag 'admin/pages'
+
 - content_for :submenu do
-  = render 'admin/shared/contents_menu'
+  = render 'admin/shared/menu/contents'

 - content_for :buttons do
  = admin_button_tag :new, new_admin_page_url, :class => 'add'
@ -12,6 +15,4 @@
  %p.no-items= t('.no_items', :url => new_admin_page_url)
 - else
  %ul#pages-list
-    - @pages.each do |page|
-      %li
-        = link_to page.title, edit_admin_page_url(page)
+    = render @pages
--- a/app/views/admin/pages/new.html.haml
+++ b/app/views/admin/pages/new.html.haml
@ -1,7 +1,10 @@
 - title t('.title')

+- content_for :head do
+  = javascript_include_tag 'admin/pages'
+
 - content_for :submenu do
-  = render 'admin/shared/contents_menu'
+  = render 'admin/shared/menu/contents'

 %p= t('.help')

--- a/app/views/admin/shared/_contents_menu.html.haml
+++ b/app/views/admin/shared/_contents_menu.html.haml
@ -1,3 +0,0 @@
-%ul
-  %li.pages
-    = link_to find_and_preserve('<span>Pages <em>&nbsp;</em></span>'), '#'
--- a/app/views/admin/shared/_head.html.haml
+++ b/app/views/admin/shared/_head.html.haml
@ -10,7 +10,7 @@
  
 = stylesheet_link_tag 'admin/layout', 'admin/plugins/toggle', 'admin/menu', 'admin/buttons', 'admin/formtastic', 'admin/formtastic_changes', 'admin/application', :media => 'screen', :cache => Rails.env.production?

-= javascript_include_tag 'jquery', 'jquery.ui', 'rails', 'admin/plugins/toggle', 'admin/plugins/growl', 'admin/application', :cache => Rails.env.production?
+= javascript_include_tag 'jquery', 'jquery.ui', 'rails', 'admin/plugins/toggle', 'admin/plugins/growl', 'admin/plugins/cookie', 'admin/application', :cache => Rails.env.production?

 %script{ :type => 'text/javascript' }
  = find_and_preserve(growl_message)
--- a/app/views/admin/shared/_menu.html.haml
+++ b/app/views/admin/shared/_menu.html.haml
@ -1,5 +1,5 @@
 %ul#menu
  = admin_menu_item('contents', admin_pages_url)
  = admin_menu_item('assets', '#')
-  = admin_menu_item('settings', '#')
+  = admin_menu_item('settings', admin_layouts_url)
  %li.clear
--- a/app/views/admin/shared/menu/_contents.html.haml
+++ b/app/views/admin/shared/menu/_contents.html.haml
@ -0,0 +1,2 @@
+%ul
+  = admin_submenu_item 'pages', admin_pages_url
--- a/app/views/admin/shared/menu/_settings.html.haml
+++ b/app/views/admin/shared/menu/_settings.html.haml
@ -0,0 +1,3 @@
+%ul
+  = admin_submenu_item 'layouts', admin_layouts_url
+  = admin_submenu_item 'snippets', admin_snippets_url
--- a/app/views/admin/snippets/_form.html.haml
+++ b/app/views/admin/snippets/_form.html.haml
@ -0,0 +1,11 @@
+- content_for :head do
+  = javascript_include_tag 'admin/plugins/codemirror/codemirror', 'admin/snippets.js'
+
+= f.inputs :name => :information do
+  = f.input :name
+  = f.input :slug, :required => false
+  
+= f.inputs :name => :code do
+  = f.custom_input :value, :css => 'full', :with_label => false do
+    %code{ :class => 'html' }
+      = f.text_area :value
--- a/app/views/admin/snippets/_snippet.html.haml
+++ b/app/views/admin/snippets/_snippet.html.haml
@ -0,0 +1,7 @@
+%li
+  %strong= link_to snippet.name, edit_admin_snippet_path(snippet)
+  .more
+    %span= t('.updated_at')
+    = l snippet.updated_at, :format => :short
+    
+    = link_to image_tag('admin/list/icons/trash.png'), admin_snippet_path(snippet), :class => 'remove', :confirm => t('admin.messages.confirm'), :method => :delete
--- a/app/views/admin/snippets/edit.html.haml
+++ b/app/views/admin/snippets/edit.html.haml
@ -0,0 +1,15 @@
+- title t('.title')
+
+- content_for :submenu do
+  = render 'admin/shared/menu/settings'
+
+- content_for :buttons do
+  = admin_button_tag t('admin.snippets.index.new'), new_admin_snippet_url, :class => 'add'
+
+%p= t('.help')
+
+= semantic_form_for @snippet, :url => admin_snippet_url(@snippet) do |form|
+
+  = render 'form', :f => form
+
+  = render 'admin/shared/form_actions', :back_url => admin_snippets_url, :button_label => :update  
--- a/app/views/admin/snippets/index.html.haml
+++ b/app/views/admin/snippets/index.html.haml
@ -0,0 +1,15 @@
+- title t('.title')
+
+- content_for :submenu do
+  = render 'admin/shared/menu/settings'
+
+- content_for :buttons do
+  = admin_button_tag :new, new_admin_snippet_url, :class => 'add'
+
+%p= t('.help')
+
+- if @snippets.empty?
+  %p.no-items= t('.no_items', :url => new_admin_snippet_url)
+- else
+  %ul#snippets-list.list
+    = render @snippets
--- a/app/views/admin/snippets/new.html.haml
+++ b/app/views/admin/snippets/new.html.haml
@ -0,0 +1,12 @@
+- title t('.title')
+
+- content_for :submenu do
+  = render 'admin/shared/menu/settings'
+
+%p= t('.help')
+
+= semantic_form_for @snippet, :url => admin_snippets_url do |form|
+
+  = render 'form', :f => form
+  
+  = render 'admin/shared/form_actions', :back_url => admin_snippets_url, :button_label => :create
--- a/config/locales/admin_ui_en.yml
+++ b/config/locales/admin_ui_en.yml
@ -30,6 +30,9 @@ en:
        contents: Contents
        assets: Assets
        settings: Settings
+        pages: Pages
+        layouts: Layouts
+        snippets: Snippets
      footer:
        developed_by: Developed by
        powered_by: and Powered by
@ -37,6 +40,8 @@ en:
        back: Back without saving
        create: Create
        update: Update
+      attributes:
+        body: Body
        
    pages:
      index:
@ -44,14 +49,29 @@ en:
        no_items: "There are no pages for now. Just click <a href=\"{{url}}\">here</a> to create the first one."
        new: new page
        
+    layouts:
+      index:
+        title: Listing layouts
+        no_items: "There are no layouts for now. Just click <a href=\"{{url}}\">here</a> to create the first one."
+        new: new layout
+
+    snippets:
+      index:
+        title: Listing snippets
+        no_items: "There are no snippets for now. Just click <a href=\"{{url}}\">here</a> to create the first one."
+        new: new snippet
+        
  formtastic:
    titles:
      information: General information
      meta: Meta
+      code: Code
    hints:
      page:
        keywords: "Meta keywords used within the head tag of the page. They are separeted by an empty space. Required for SEO." 
        description: "Meta description used within the head tag of the page. Required for SEO." 
+      snippet:
+        slug: "You need to know it in order to insert the snippet inside a page or a layout"
      
  buttons:
    login: Log in
--- a/config/locales/default_en.yml
+++ b/config/locales/default_en.yml
@ -2,4 +2,5 @@ en:
  errors:
      messages:
        domain_taken: "{{value}} is already taken"
-        invalid_domain: "{{value}} is invalid"
+        invalid_domain: "{{value}} is invalid"
+        missing_content_for_layout: "should contain 'content_for_layout' liquid tag"
--- a/config/locales/default_fr.yml
+++ b/config/locales/default_fr.yml
@ -27,3 +27,4 @@ fr:
      even: "doit être pair"
      
      domain_taken: "{{value}} a été déjà pris"
+      missing_content_for_layout: "doit contenir le tag liquid 'content_for_layout'"
--- a/config/routes.rb
+++ b/config/routes.rb
@ -17,7 +17,13 @@ Locomotive::Application.routes.draw do |map|
  namespace 'admin' do
    root :to => 'pages#index'
    
-    resources :pages
+    resources :pages do  
+      put :sort, :on => :member
+      get :get_path, :on => :collection 
+    end 
+    
+    resources :layouts
+    resources :snippets
    
    # get 'login' => 'sessions#new', :as => :new_account_session
    # post 'login' => 'sessions#create', :as => :account_session
--- a/doc/TODO
+++ b/doc/TODO
@ -5,8 +5,24 @@ x admin layout
 x logout button
 x slugify page
 x validation page slug
- sitemap
+x update position when assigning a new parent
+x remove all descendants
+x slug from title
+! update "path" when changing slug (new page too) ?
+x mettre a jour le chemin dans _form si slug et/ou parent change
+x slug for 404 and Index pages can not be modified
+x store node closed or open in cookies
+x snippets section
+x menu items have to be translated
+x layout needs at least content_for_layout
+- validates_uniqueness_of :slug, :scope => :id
+- page parts
+- can not delete index + 404 pages
+- slug unique within a folder
 - pages section (CRUD)
+- refactoring page.rb => create module pagetree
 - my account section (part of settings)
- snippets section
 - layouts section
+- create 404 + index pages once a site is created
+- refactoring admin crud (pages + layouts + snippets)
+- remove all pages, snippets, ...etc when destroying a website
--- a/lib/core_ext.rb
+++ b/lib/core_ext.rb
@ -5,7 +5,7 @@ class String
  # end
  
  def slugify(options = {})
-    options = { :sep => '_', :without_extension => false }.merge(options)
+    options = { :sep => '_', :without_extension => false, :downcase => false }.merge(options)
    # replace accented chars with ther ascii equivalents
    s = ActiveSupport::Inflector.transliterate(self).to_s
    # No more than one slash in a row
@ -16,6 +16,8 @@ class String
    s.gsub! /(^[\/]+)|([\/]+$)/, ''
    # Remove extensions
    s.gsub! /(\.[a-zA-Z]{2,})/, '' if options[:without_extension]
+    # Downcase
+    s.downcase! if options[:downcase]
    # Turn unwanted chars into the seperator
    s.gsub!(/[^a-zA-Z0-9\-_\+\/]+/i, options[:sep])
    s
--- a/lib/locomotive/regexps.rb
+++ b/lib/locomotive/regexps.rb
@ -1,6 +1,13 @@
 module Locomotive
  module Regexps
-    SUBDOMAIN  = /^[a-z][a-z0-9_]*[a-z0-9]{1}$/
-    DOMAIN     = /^[a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5}(:[0-9]{1,5})?(\/.*)?$/ix
+    
+    SUBDOMAIN           = /^[a-z][a-z0-9_]*[a-z0-9]{1}$/
+    
+    DOMAIN              = /^[a-z0-9]+([\-\.]{1}[a-z0-9]+)*\.[a-z]{2,5}(:[0-9]{1,5})?(\/.*)?$/ix
+    
+    CONTENT_FOR         = /\{\{\s*content_for_([a-zA-Z]{1}[a-zA-Z_0-9]*)(\s+.*)?\s*\}\}/
+    
+    CONTENT_FOR_LAYOUT  = /\{\{\s*content_for_layout\s*\}\}/
+    
  end
 end
--- a/lib/locomotive/sitemap.rb
+++ b/lib/locomotive/sitemap.rb
@ -1,29 +1,82 @@
 module Locomotive
  
-  module SiteMap
-   
-    def self.build(pages)
-      return Folder.new if pages.empty?      
+  class Sitemap
+    
+    attr_accessor :index, :children, :not_found
+    
+    def initialize(site)
+      self.children = site.pages.roots.to_a
      
-      pages = pages.to_a.clone # make a secure copy                  
+      self.index = self.children.detect { |p| p.index? }
+      self.not_found = self.children.detect { |p| p.not_found? }
      
-      root = Folder.new :root => pages.delete_if { |p| p.path == 'index' }
-     
-      pages.each do |page|
-        
-      end
-    end
-   
-    class Folder
-      attr_accessor :root, :name, :children
-     
-      def initialize(attributes = {})
-        self.root = attributes[:root]
-        self.name = attributes[:name]
-      end
-     
+      self.children.delete(self.index)
+      self.children.delete(self.not_found)     
    end
    
+    def empty?
+      self.index.nil? && self.not_found.nil? && self.children.empty?
+    end
+        
+    def self.build(site); self.new(site); end
+        
  end
  
+  # module Sitemap
+  # 
+  #   def self.build(pages)
+  #     return [] if pages.empty?
+  #     
+  #     # pages = pages.to_a.clone # make a secure copy
+  #     dictionary = build_dictionary(pages)
+  #     
+  #     returning [] do |map|
+  #       map << (index = pages.detect { |p| p.index? })
+  #       pages.delete(index)
+  #       
+  #       not_found = pages.detect { |p| p.not_found? }
+  #       pages.delete(not_found)
+  #       
+  #       add_children()
+  #       
+  #       map << not_found
+  #     end
+  #   end
+  #   
+  #   protected
+  #   
+  #   def self.add_children(map, children, dictionary)
+  #     
+  #   end
+  #   
+  #   def self.build_dictionary(pages)
+  #     returning({}) do |hash|
+  #       hash[pages.id] = pages
+  #     end
+  #   end
+  #  
+  #   # def self.build(pages)
+  #   #   return Folder.new if pages.empty?      
+  #   #   
+  #   #   pages = pages.to_a.clone # make a secure copy                  
+  #   #   
+  #   #   root = Folder.new :root => pages.delete_if { |p| p.path == 'index' }
+  #   #  
+  #   #   pages.each do |page|
+  #   #     
+  #   #   end
+  #   # end
+  #   #    
+  #   # class Folder
+  #   #   attr_accessor :root, :depth, :children
+  #   #  
+  #   #   def initialize(attributes = {})
+  #   #     self.root = attributes[:root]
+  #   #     self.depth = self.root.depth
+  #   #   end
+  #   #  
+  #   # end
+  #   
+  # end
+  
 end
--- a/lib/misc_form_builder.rb
+++ b/lib/misc_form_builder.rb
@ -20,7 +20,7 @@ class MiscFormBuilder < Formtastic::SemanticFormBuilder
    html += template.capture(&block) || ''
    html += self.errors_on(name) || ''

-    template.content_tag(:li, html, :class => "#{options[:css]} #{'error' unless @object.errors[name].empty?}")
+    template.content_tag(:li, template.find_and_preserve(html), :class => "#{options[:css]} #{'error' unless @object.errors[name].empty?}")
  end
  
 end
--- a/public/images/admin/list/icons/node_closed.png
+++ b/public/images/admin/list/icons/node_closed.png
--- a/public/images/admin/list/icons/node_open.png
+++ b/public/images/admin/list/icons/node_open.png
--- a/public/images/admin/list/icons/trash.png
+++ b/public/images/admin/list/icons/trash.png
--- a/public/javascripts/admin/application.js
+++ b/public/javascripts/admin/application.js
@ -1,4 +1,5 @@
 var I18nLocale = null;
+var CodeMirrorEditors = [];

 /* ___ growl ___ */

@ -15,6 +16,29 @@ $.growl.settings.dockCss = {
 	zIndex: 50000
 };

+/* ___ codemirror ___ */
+
+var addCodeMirrorEditor = function(type, el, parser) {
+	var parserfile = "parse" + type + ".js";
+	if (parser != undefined) parserfile = parser;
+	if (type == 'liquid') type = 'xml';
+	
+	var editor = CodeMirror.fromTextArea(el.attr('id'), {
+		height: "330px",
+		parserfile: parserfile,
+		stylesheet: ["/stylesheets/admin/plugins/codemirror/" + type + "colors.css", "/stylesheets/admin/plugins/codemirror/liquidcolors.css"],
+		path: "/javascripts/admin/plugins/codemirror/",
+		continuousScanning: 500,
+		reindentOnLoad: true,
+		initCallback: function(editor) {
+			jQuery(editor.frame.contentDocument).keypress(function(event) {
+				jQuery(document).trigger(event);
+			});
+		}
+	});
+	CodeMirrorEditors.push({ 'el': el, 'editor': editor });
+}
+
 /* ___ global ___ */

 $(document).ready(function() {
@ -53,11 +77,14 @@ $(document).ready(function() {
 		var parent = $(this).parent(), content = $(this).next();
 		if (parent.hasClass('folded')) {
 			parent.removeClass('folded');
-			content.slideDown(400, function() {  });
+			content.slideDown('fast', function() {  });
 		} else
-			content.slideUp(400, function() { parent.addClass('folded'); });
+			content.slideUp('fast', function() { parent.addClass('folded'); });
 	});
 	
 	// nifty checkboxes	
 	$('.formtastic li.toggle input[type=checkbox]').checkToggle();
+	
+	// nifty code editor
+	$('code.html textarea').each(function() { addCodeMirrorEditor('liquid', $(this)); });
 });
--- a/public/javascripts/admin/pages.js
+++ b/public/javascripts/admin/pages.js
@ -0,0 +1,67 @@
+$(document).ready(function() {
+	
+	// open / close folder
+	$('#pages-list ul.folder img.toggler').click(function(e) {
+		var toggler = $(this);
+		var children = toggler.parent().find('> ul.folder');
+		if (children.is(':visible')) {
+			children.slideUp('fast', function() {
+				toggler.attr('src', toggler.attr('src').replace('open', 'closed'));
+				$.cookie(children.attr('id'), 'none');
+			});
+		} else {
+			children.slideDown('fast', function() {
+				toggler.attr('src', toggler.attr('src').replace('closed', 'open'));
+				$.cookie(children.attr('id'), 'block');
+			});
+		} 
+	});
+	
+	// sortable folder items
+	$('#pages-list ul.folder').sortable({ 
+		'handle': 'em', 
+		'axis': 'y',
+		'update': function(event, ui) {
+			var params = $(this).sortable('serialize', { 'key': 'children[]' });
+			params += '&_method=put';
+			
+			$.post($(this).attr('data_url'), params, function(data) {
+				$.growl('success', data.message);
+			}, 'json');
+		} 
+	});
+	
+	// automatic slug from page title
+	$('#page_title').keypress(function() {
+		var input = $(this);
+		var slug = $('#page_slug');
+		
+		if (!slug.hasClass('filled')) {
+			setTimeout(function() {
+				slug.val(input.val().replace(' ', '_')).addClass('touched');
+			}, 50);
+		}
+	});
+	
+	$('#page_slug').keypress(function() {
+		$(this).addClass('filled').addClass('touched');
+	});
+	
+	var lookForSlugAndUrl = function() {
+		params = 'parent_id=' + $('#page_parent_id').val() + "&slug=" + $('#page_slug').val();
+		$.get($('#page_slug').attr('data_url'), params, function(data) {
+			$('#page_slug_input .inline-hints').html(data.url).effect('highlight');
+		}, 'json');
+	};	
+	
+	$('#page_parent_id').change(lookForSlugAndUrl);
+	
+	setInterval(function() {
+		var slug = $('#page_slug');
+		if (slug.hasClass('touched')) {
+			slug.removeClass('touched');
+			lookForSlugAndUrl();
+		}
+	}, 2000);
+	
+});
--- a/public/javascripts/admin/plugins/codemirror/codemirror.js
+++ b/public/javascripts/admin/plugins/codemirror/codemirror.js
@ -0,0 +1,310 @@
+/* CodeMirror main module
+ *
+ * Implements the CodeMirror constructor and prototype, which take care
+ * of initializing the editor frame, and providing the outside interface.
+ */
+
+// The CodeMirrorConfig object is used to specify a default
+// configuration. If you specify such an object before loading this
+// file, the values you put into it will override the defaults given
+// below. You can also assign to it after loading.
+var CodeMirrorConfig = window.CodeMirrorConfig || {};
+
+var CodeMirror = (function(){
+  function setDefaults(object, defaults) {
+    for (var option in defaults) {
+      if (!object.hasOwnProperty(option))
+        object[option] = defaults[option];
+    }
+  }
+  function forEach(array, action) {
+    for (var i = 0; i < array.length; i++)
+      action(array[i]);
+  }
+
+  // These default options can be overridden by passing a set of
+  // options to a specific CodeMirror constructor. See manual.html for
+  // their meaning.
+  setDefaults(CodeMirrorConfig, {
+    stylesheet: "",
+    path: "",
+    parserfile: [],
+    basefiles: ["util.js", "stringstream.js", "select.js", "undo.js", "editor.js", "tokenize.js"],
+    iframeClass: null,
+    passDelay: 200,
+    passTime: 50,
+    continuousScanning: false,
+    saveFunction: null,
+    onChange: null,
+    undoDepth: 50,
+    undoDelay: 800,
+    disableSpellcheck: true,
+    textWrapping: true,
+    readOnly: false,
+    width: "100%",
+    height: "300px",
+    autoMatchParens: false,
+    parserConfig: null,
+    tabMode: "indent", // or "spaces", "default", "shift"
+    reindentOnLoad: false,
+    activeTokens: null,
+    cursorActivity: null,
+    lineNumbers: false,
+    indentUnit: 2
+  });
+
+  function wrapLineNumberDiv(place) {
+    return function(node) {
+      var container = document.createElement("DIV"),
+          nums = document.createElement("DIV"),
+          scroller = document.createElement("DIV");
+      container.style.position = "relative";
+      nums.style.position = "absolute";
+      nums.style.height = "100%";
+      if (nums.style.setExpression) {
+        try {nums.style.setExpression("height", "this.previousSibling.offsetHeight + 'px'");}
+        catch(e) {} // Seems to throw 'Not Implemented' on some IE8 versions
+      }
+      nums.style.top = "0px";
+      nums.style.overflow = "hidden";
+      place(container);
+      container.appendChild(node);
+      container.appendChild(nums);
+      scroller.className = "CodeMirror-line-numbers";
+      nums.appendChild(scroller);
+    }
+  }
+
+  function applyLineNumbers(frame) {
+    var win = frame.contentWindow, doc = win.document,
+        nums = frame.nextSibling, scroller = nums.firstChild;
+
+    var nextNum = 1, barWidth = null;
+    function sizeBar() {
+      if (!frame.offsetWidth || !win.Editor) {
+        for (var cur = frame; cur.parentNode; cur = cur.parentNode) {
+          if (cur != document) {
+            clearInterval(sizeInterval);
+            return;
+          }
+        }
+      }
+
+      if (nums.offsetWidth != barWidth) {
+        barWidth = nums.offsetWidth;
+        nums.style.left = "-" + (frame.parentNode.style.marginLeft = barWidth + "px");
+      }
+    }
+    function update() {
+      var diff = 20 + Math.max(doc.body.offsetHeight, frame.offsetHeight) - scroller.offsetHeight;
+      for (var n = Math.ceil(diff / 10); n > 0; n--) {
+        var div = document.createElement("DIV");
+        div.appendChild(document.createTextNode(nextNum++));
+        scroller.appendChild(div);
+      }
+      nums.scrollTop = doc.body.scrollTop || doc.documentElement.scrollTop || 0;
+    }
+    sizeBar();
+    update();
+    win.addEventHandler(win, "scroll", update);
+    win.addEventHandler(win, "resize", update);
+    var sizeInterval = setInterval(sizeBar, 500);
+  }
+
+  function CodeMirror(place, options) {
+    // Backward compatibility for deprecated options.
+    if (options.dumbTabs) options.tabMode = "spaces";
+    else if (options.normalTab) options.tabMode = "default";
+
+    // Use passed options, if any, to override defaults.
+    this.options = options = options || {};
+    setDefaults(options, CodeMirrorConfig);
+
+    var frame = this.frame = document.createElement("IFRAME");
+    if (options.iframeClass) frame.className = options.iframeClass;
+    frame.frameBorder = 0;
+    frame.src = "javascript:false;";
+    frame.style.border = "0";
+    frame.style.width = options.width;
+    frame.style.height = options.height;
+    // display: block occasionally suppresses some Firefox bugs, so we
+    // always add it, redundant as it sounds.
+    frame.style.display = "block";
+
+    if (place.appendChild) {
+      var node = place;
+      place = function(n){node.appendChild(n);};
+    }
+    if (options.lineNumbers) place = wrapLineNumberDiv(place);
+    place(frame);
+
+    // Link back to this object, so that the editor can fetch options
+    // and add a reference to itself.
+    frame.CodeMirror = this;
+    this.win = frame.contentWindow;
+
+    if (typeof options.parserfile == "string")
+      options.parserfile = [options.parserfile];
+    if (typeof options.stylesheet == "string")
+      options.stylesheet = [options.stylesheet];
+
+    var html = ["<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.0 Transitional//EN\" \"http://www.w3.org/TR/html4/loose.dtd\"><html><head>"];
+    // Hack to work around a bunch of IE8-specific problems.
+    html.push("<meta http-equiv=\"X-UA-Compatible\" content=\"IE=EmulateIE7\"/>");
+    forEach(options.stylesheet, function(file) {
+      html.push("<link rel=\"stylesheet\" type=\"text/css\" href=\"" + file + "\"/>");
+    });
+    forEach(options.basefiles.concat(options.parserfile), function(file) {
+      html.push("<script type=\"text/javascript\" src=\"" + options.path + file + "\"></script>");
+    });
+    html.push("</head><body style=\"border-width: 0;\" class=\"editbox\" spellcheck=\"" +
+              (options.disableSpellcheck ? "false" : "true") + "\"></body></html>");
+
+    var doc = this.win.document;
+    doc.open();
+    doc.write(html.join(""));
+    doc.close();
+  }
+
+  CodeMirror.prototype = {
+    init: function() {
+      if (this.options.initCallback) this.options.initCallback(this);
+      if (this.options.lineNumbers) applyLineNumbers(this.frame);
+      if (this.options.reindentOnLoad) this.reindent();
+    },
+
+    getCode: function() {return this.editor.getCode();},
+    setCode: function(code) {this.editor.importCode(code);},
+    selection: function() {return this.editor.selectedText();},
+    reindent: function() {this.editor.reindent();},
+    reindentSelection: function() {this.editor.reindentSelection(null);},
+
+    focus: function() {
+      this.win.focus();
+      if (this.editor.selectionSnapshot) // IE hack
+        this.win.select.selectCoords(this.win, this.editor.selectionSnapshot);
+    },
+    replaceSelection: function(text) {
+      this.focus();
+      this.editor.replaceSelection(text);
+      return true;
+    },
+    replaceChars: function(text, start, end) {
+      this.editor.replaceChars(text, start, end);
+    },
+    getSearchCursor: function(string, fromCursor) {
+      return this.editor.getSearchCursor(string, fromCursor);
+    },
+
+    undo: function() {this.editor.history.undo();},
+    redo: function() {this.editor.history.redo();},
+    historySize: function() {return this.editor.history.historySize();},
+    clearHistory: function() {this.editor.history.clear();},
+
+    grabKeys: function(callback, filter) {this.editor.grabKeys(callback, filter);},
+    ungrabKeys: function() {this.editor.ungrabKeys();},
+
+    setParser: function(name) {this.editor.setParser(name);},
+
+    cursorPosition: function(start) {
+      if (this.win.select.ie_selection) this.focus();
+      return this.editor.cursorPosition(start);
+    },
+    firstLine: function() {return this.editor.firstLine();},
+    lastLine: function() {return this.editor.lastLine();},
+    nextLine: function(line) {return this.editor.nextLine(line);},
+    prevLine: function(line) {return this.editor.prevLine(line);},
+    lineContent: function(line) {return this.editor.lineContent(line);},
+    setLineContent: function(line, content) {this.editor.setLineContent(line, content);},
+    insertIntoLine: function(line, position, content) {this.editor.insertIntoLine(line, position, content);},
+    selectLines: function(startLine, startOffset, endLine, endOffset) {
+      this.win.focus();
+      this.editor.selectLines(startLine, startOffset, endLine, endOffset);
+    },
+    nthLine: function(n) {
+      var line = this.firstLine();
+      for (; n > 1 && line !== false; n--)
+        line = this.nextLine(line);
+      return line;
+    },
+    lineNumber: function(line) {
+      var num = 0;
+      while (line !== false) {
+        num++;
+        line = this.prevLine(line);
+      }
+      return num;
+    },
+
+    // Old number-based line interface
+    jumpToLine: function(n) {
+      this.selectLines(this.nthLine(n), 0);
+      this.win.focus();
+    },
+    currentLine: function() {
+      return this.lineNumber(this.cursorPosition().line);
+    }
+  };
+
+  CodeMirror.InvalidLineHandle = {toString: function(){return "CodeMirror.InvalidLineHandle";}};
+
+  CodeMirror.replace = function(element) {
+    if (typeof element == "string")
+      element = document.getElementById(element);
+    return function(newElement) {
+      element.parentNode.replaceChild(newElement, element);
+    };
+  };
+
+  CodeMirror.fromTextArea = function(area, options) {
+    if (typeof area == "string")
+      area = document.getElementById(area);
+
+    options = options || {};
+    if (area.style.width && options.width == null)
+      options.width = area.style.width;
+    if (area.style.height && options.height == null)
+      options.height = area.style.height;
+    if (options.content == null) options.content = area.value;
+
+    if (area.form) {
+      function updateField() {
+        area.value = mirror.getCode();
+      }
+      if (typeof area.form.addEventListener == "function")
+        area.form.addEventListener("submit", updateField, false);
+      else
+        area.form.attachEvent("onsubmit", updateField);
+    }
+
+    function insert(frame) {
+      if (area.nextSibling)
+        area.parentNode.insertBefore(frame, area.nextSibling);
+      else
+        area.parentNode.appendChild(frame);
+    }
+
+    area.style.display = "none";
+    var mirror = new CodeMirror(insert, options);
+    return mirror;
+  };
+
+  CodeMirror.isProbablySupported = function() {
+    // This is rather awful, but can be useful.
+    var match;
+    if (window.opera)
+      return Number(window.opera.version()) >= 9.52;
+    else if (/Apple Computers, Inc/.test(navigator.vendor) && (match = navigator.userAgent.match(/Version\/(\d+(?:\.\d+)?)\./)))
+      return Number(match[1]) >= 3;
+    else if (document.selection && window.ActiveXObject && (match = navigator.userAgent.match(/MSIE (\d+(?:\.\d*)?)\b/)))
+      return Number(match[1]) >= 6;
+    else if (match = navigator.userAgent.match(/gecko\/(\d{8})/i))
+      return Number(match[1]) >= 20050901;
+    else if (match = navigator.userAgent.match(/AppleWebKit\/(\d+)/))
+      return Number(match[1]) >= 525;
+    else
+      return null;
+  };
+
+  return CodeMirror;
+})();
--- a/public/javascripts/admin/plugins/codemirror/editor.js
+++ b/public/javascripts/admin/plugins/codemirror/editor.js
--- a/public/javascripts/admin/plugins/codemirror/highlight.js
+++ b/public/javascripts/admin/plugins/codemirror/highlight.js
@ -0,0 +1,68 @@
+// Minimal framing needed to use CodeMirror-style parsers to highlight
+// code. Load this along with tokenize.js, stringstream.js, and your
+// parser. Then call highlightText, passing a string as the first
+// argument, and as the second argument either a callback function
+// that will be called with an array of SPAN nodes for every line in
+// the code, or a DOM node to which to append these spans, and
+// optionally (not needed if you only loaded one parser) a parser
+// object.
+
+// Stuff from util.js that the parsers are using.
+var StopIteration = {toString: function() {return "StopIteration"}};
+
+var Editor = {};
+var indentUnit = 2;
+
+(function(){
+  function normaliseString(string) {
+    var tab = "";
+    for (var i = 0; i < indentUnit; i++) tab += " ";
+
+    string = string.replace(/\t/g, tab).replace(/\u00a0/g, " ").replace(/\r\n?/g, "\n");
+    var pos = 0, parts = [], lines = string.split("\n");
+    for (var line = 0; line < lines.length; line++) {
+      if (line != 0) parts.push("\n");
+      parts.push(lines[line]);
+    }
+
+    return {
+      next: function() {
+        if (pos < parts.length) return parts[pos++];
+        else throw StopIteration;
+      }
+    };
+  }
+
+  window.highlightText = function(string, callback, parser) {
+    var parser = (parser || Editor.Parser).make(stringStream(normaliseString(string)));
+    var line = [];
+    if (callback.nodeType == 1) {
+      var node = callback;
+      callback = function(line) {
+        for (var i = 0; i < line.length; i++)
+          node.appendChild(line[i]);
+        node.appendChild(document.createElement("BR"));
+      };
+    }
+
+    try {
+      while (true) {
+        var token = parser.next();
+        if (token.value == "\n") {
+          callback(line);
+          line = [];
+        }
+        else {
+          var span = document.createElement("SPAN");
+          span.className = token.style;
+          span.appendChild(document.createTextNode(token.value));
+          line.push(span);
+        }
+      }
+    }
+    catch (e) {
+      if (e != StopIteration) throw e;
+    }
+    if (line.length) callback(line);
+  }
+})();
--- a/public/javascripts/admin/plugins/codemirror/mirrorframe.js
+++ b/public/javascripts/admin/plugins/codemirror/mirrorframe.js
@ -0,0 +1,81 @@
+/* Demonstration of embedding CodeMirror in a bigger application. The
+ * interface defined here is a mess of prompts and confirms, and
+ * should probably not be used in a real project.
+ */
+
+function MirrorFrame(place, options) {
+  this.home = document.createElement("DIV");
+  if (place.appendChild)
+    place.appendChild(this.home);
+  else
+    place(this.home);
+
+  var self = this;
+  function makeButton(name, action) {
+    var button = document.createElement("INPUT");
+    button.type = "button";
+    button.value = name;
+    self.home.appendChild(button);
+    button.onclick = function(){self[action].call(self);};
+  }
+
+  makeButton("Search", "search");
+  makeButton("Replace", "replace");
+  makeButton("Current line", "line");
+  makeButton("Jump to line", "jump");
+  makeButton("Insert constructor", "macro");
+  makeButton("Indent all", "reindent");
+
+  this.mirror = new CodeMirror(this.home, options);
+}
+
+MirrorFrame.prototype = {
+  search: function() {
+    var text = prompt("Enter search term:", "");
+    if (!text) return;
+
+    var first = true;
+    do {
+      var cursor = this.mirror.getSearchCursor(text, first);
+      first = false;
+      while (cursor.findNext()) {
+        cursor.select();
+        if (!confirm("Search again?"))
+          return;
+      }
+    } while (confirm("End of document reached. Start over?"));
+  },
+
+  replace: function() {
+    // This is a replace-all, but it is possible to implement a
+    // prompting replace.
+    var from = prompt("Enter search string:", ""), to;
+    if (from) to = prompt("What should it be replaced with?", "");
+    if (to == null) return;
+
+    var cursor = this.mirror.getSearchCursor(from, false);
+    while (cursor.findNext())
+      cursor.replace(to);
+  },
+
+  jump: function() {
+    var line = prompt("Jump to line:", "");
+    if (line && !isNaN(Number(line)))
+      this.mirror.jumpToLine(Number(line));
+  },
+
+  line: function() {
+    alert("The cursor is currently at line " + this.mirror.currentLine());
+    this.mirror.focus();
+  },
+
+  macro: function() {
+    var name = prompt("Name your constructor:", "");
+    if (name)
+      this.mirror.replaceSelection("function " + name + "() {\n  \n}\n\n" + name + ".prototype = {\n  \n};\n");
+  },
+
+  reindent: function() {
+    this.mirror.reindent();
+  }
+};
--- a/public/javascripts/admin/plugins/codemirror/parsecss.js
+++ b/public/javascripts/admin/plugins/codemirror/parsecss.js
@ -0,0 +1,155 @@
+/* Simple parser for CSS */
+
+var CSSParser = Editor.Parser = (function() {
+  var tokenizeCSS = (function() {
+    function normal(source, setState) {
+      var ch = source.next();
+      if (ch == "@") {
+        source.nextWhileMatches(/\w/);
+        return "css-at";
+      }
+      else if (ch == "/" && source.equals("*")) {
+        setState(inCComment);
+        return null;
+      }
+      else if (ch == "<" && source.equals("!")) {
+        setState(inSGMLComment);
+        return null;
+      }
+      else if (ch == "=") {
+        return "css-compare";
+      }
+      else if (source.equals("=") && (ch == "~" || ch == "|")) {
+        source.next();
+        return "css-compare";
+      }
+      else if (ch == "\"" || ch == "'") {
+        setState(inString(ch));
+        return null;
+      }
+      else if (ch == "#") {
+        source.nextWhileMatches(/\w/);
+        return "css-hash";
+      }
+      else if (ch == "!") {
+        source.nextWhileMatches(/[ \t]/);
+        source.nextWhileMatches(/\w/);
+        return "css-important";
+      }
+      else if (/\d/.test(ch)) {
+        source.nextWhileMatches(/[\w.%]/);
+        return "css-unit";
+      }
+      else if (/[,.+>*\/]/.test(ch)) {
+        return "css-select-op";
+      }
+      else if (/[;{}:\[\]]/.test(ch)) {
+        return "css-punctuation";
+      }
+      else {
+        source.nextWhileMatches(/[\w\\\-_]/);
+        return "css-identifier";
+      }
+    }
+
+    function inCComment(source, setState) {
+      var maybeEnd = false;
+      while (!source.endOfLine()) {
+        var ch = source.next();
+        if (maybeEnd && ch == "/") {
+          setState(normal);
+          break;
+        }
+        maybeEnd = (ch == "*");
+      }
+      return "css-comment";
+    }
+
+    function inSGMLComment(source, setState) {
+      var dashes = 0;
+      while (!source.endOfLine()) {
+        var ch = source.next();
+        if (dashes >= 2 && ch == ">") {
+          setState(normal);
+          break;
+        }
+        dashes = (ch == "-") ? dashes + 1 : 0;
+      }
+      return "css-comment";
+    }
+
+    function inString(quote) {
+      return function(source, setState) {
+        var escaped = false;
+        while (!source.endOfLine()) {
+          var ch = source.next();
+          if (ch == quote && !escaped)
+            break;
+          escaped = !escaped && ch == "\\";
+        }
+        if (!escaped)
+          setState(normal);
+        return "css-string";
+      };
+    }
+
+    return function(source, startState) {
+      return tokenizer(source, startState || normal);
+    };
+  })();
+
+  function indentCSS(inBraces, inRule, base) {
+    return function(nextChars) {
+      if (!inBraces || /^\}/.test(nextChars)) return base;
+      else if (inRule) return base + indentUnit * 2;
+      else return base + indentUnit;
+    };
+  }
+
+  // This is a very simplistic parser -- since CSS does not really
+  // nest, it works acceptably well, but some nicer colouroing could
+  // be provided with a more complicated parser.
+  function parseCSS(source, basecolumn) {
+    basecolumn = basecolumn || 0;
+    var tokens = tokenizeCSS(source);
+    var inBraces = false, inRule = false;
+
+    var iter = {
+      next: function() {
+        var token = tokens.next(), style = token.style, content = token.content;
+
+        if (style == "css-identifier" && inRule)
+          token.style = "css-value";
+        if (style == "css-hash")
+          token.style =  inRule ? "css-colorcode" : "css-identifier";
+
+        if (content == "\n")
+          token.indentation = indentCSS(inBraces, inRule, basecolumn);
+
+        if (content == "{")
+          inBraces = true;
+        else if (content == "}")
+          inBraces = inRule = false;
+        else if (inBraces && content == ";")
+          inRule = false;
+        else if (inBraces && style != "css-comment" && style != "whitespace")
+          inRule = true;
+
+        return token;
+      },
+
+      copy: function() {
+        var _inBraces = inBraces, _inRule = inRule, _tokenState = tokens.state;
+        return function(source) {
+          tokens = tokenizeCSS(source, _tokenState);
+          inBraces = _inBraces;
+          inRule = _inRule;
+          return iter;
+        };
+      }
+    };
+    return iter;
+  }
+
+  return {make: parseCSS, electricChars: "}"};
+})();
--- a/public/javascripts/admin/plugins/codemirror/parsedummy.js
+++ b/public/javascripts/admin/plugins/codemirror/parsedummy.js
@ -0,0 +1,32 @@
+var DummyParser = Editor.Parser = (function() {
+  function tokenizeDummy(source) {
+    while (!source.endOfLine()) source.next();
+    return "text";
+  }
+  function parseDummy(source) {
+    function indentTo(n) {return function() {return n;}}
+    source = tokenizer(source, tokenizeDummy);
+    var space = 0;
+
+    var iter = {
+      next: function() {
+        var tok = source.next();
+        if (tok.type == "whitespace") {
+          if (tok.value == "\n") tok.indentation = indentTo(space);
+          else space = tok.value.length;
+        }
+        return tok;
+      },
+      copy: function() {
+        var _space = space;
+        return function(_source) {
+          space = _space;
+          source = tokenizer(_source, tokenizeDummy);
+          return iter;
+        };
+      }
+    };
+    return iter;
+  }
+  return {make: parseDummy};
+})();
--- a/public/javascripts/admin/plugins/codemirror/parsehtmlmixed.js
+++ b/public/javascripts/admin/plugins/codemirror/parsehtmlmixed.js
@ -0,0 +1,74 @@
+var HTMLMixedParser = Editor.Parser = (function() {
+  if (!(CSSParser && JSParser && XMLParser))
+    throw new Error("CSS, JS, and XML parsers must be loaded for HTML mixed mode to work.");
+  XMLParser.configure({useHTMLKludges: true});
+
+  function parseMixed(stream) {
+    var htmlParser = XMLParser.make(stream), localParser = null, inTag = false;
+    var iter = {next: top, copy: copy};
+
+    function top() {
+      var token = htmlParser.next();
+      if (token.content == "<")
+        inTag = true;
+      else if (token.style == "xml-tagname" && inTag === true)
+        inTag = token.content.toLowerCase();
+      else if (token.content == ">") {
+        if (inTag == "script")
+          iter.next = local(JSParser, "</script");
+        else if (inTag == "style")
+          iter.next = local(CSSParser, "</style");
+        inTag = false;
+      }
+      return token;
+    }
+    function local(parser, tag) {
+      var baseIndent = htmlParser.indentation();
+      localParser = parser.make(stream, baseIndent + indentUnit);
+      return function() {
+        if (stream.lookAhead(tag, false, false, true)) {
+          localParser = null;
+          iter.next = top;
+          return top();
+        }
+
+        var token = localParser.next();
+        var lt = token.value.lastIndexOf("<"), sz = Math.min(token.value.length - lt, tag.length);
+        if (lt != -1 && token.value.slice(lt, lt + sz).toLowerCase() == tag.slice(0, sz) &&
+            stream.lookAhead(tag.slice(sz), false, false, true)) {
+          stream.push(token.value.slice(lt));
+          token.value = token.value.slice(0, lt);
+        }
+
+        if (token.indentation) {
+          var oldIndent = token.indentation;
+          token.indentation = function(chars) {
+            if (chars == "</")
+              return baseIndent;
+            else
+              return oldIndent(chars);
+          }
+        }
+
+        return token;
+      };
+    }
+
+    function copy() {
+      var _html = htmlParser.copy(), _local = localParser && localParser.copy(),
+          _next = iter.next, _inTag = inTag;
+      return function(_stream) {
+        stream = _stream;
+        htmlParser = _html(_stream);
+        localParser = _local && _local(_stream);
+        iter.next = _next;
+        inTag = _inTag;
+        return iter;
+      };
+    }
+    return iter;
+  }
+
+  return {make: parseMixed, electricChars: "{}/:"};
+
+})();
--- a/public/javascripts/admin/plugins/codemirror/parsejavascript.js
+++ b/public/javascripts/admin/plugins/codemirror/parsejavascript.js
@ -0,0 +1,341 @@
+/* Parse function for JavaScript. Makes use of the tokenizer from
+ * tokenizejavascript.js. Note that your parsers do not have to be
+ * this complicated -- if you don't want to recognize local variables,
+ * in many languages it is enough to just look for braces, semicolons,
+ * parentheses, etc, and know when you are inside a string or comment.
+ *
+ * See manual.html for more info about the parser interface.
+ */
+
+var JSParser = Editor.Parser = (function() {
+  // Token types that can be considered to be atoms.
+  var atomicTypes = {"atom": true, "number": true, "variable": true, "string": true, "regexp": true};
+  // Constructor for the lexical context objects.
+  function JSLexical(indented, column, type, align, prev, info) {
+    // indentation at start of this line
+    this.indented = indented;
+    // column at which this scope was opened
+    this.column = column;
+    // type of scope ('vardef', 'stat' (statement), 'form' (special form), '[', '{', or '(')
+    this.type = type;
+    // '[', '{', or '(' blocks that have any text after their opening
+    // character are said to be 'aligned' -- any lines below are
+    // indented all the way to the opening character.
+    if (align != null)
+      this.align = align;
+    // Parent scope, if any.
+    this.prev = prev;
+    this.info = info;
+  }
+
+  // My favourite JavaScript indentation rules.
+  function indentJS(lexical) {
+    return function(firstChars) {
+      var firstChar = firstChars && firstChars.charAt(0), type = lexical.type;
+      var closing = firstChar == type;
+      if (type == "vardef")
+        return lexical.indented + 4;
+      else if (type == "form" && firstChar == "{")
+        return lexical.indented;
+      else if (type == "stat" || type == "form")
+        return lexical.indented + indentUnit;
+      else if (lexical.info == "switch" && !closing)
+        return lexical.indented + (/^(?:case|default)\b/.test(firstChars) ? indentUnit : 2 * indentUnit);
+      else if (lexical.align)
+        return lexical.column - (closing ? 1 : 0);
+      else
+        return lexical.indented + (closing ? 0 : indentUnit);
+    };
+  }
+
+  // The parser-iterator-producing function itself.
+  function parseJS(input, basecolumn) {
+    // Wrap the input in a token stream
+    var tokens = tokenizeJavaScript(input);
+    // The parser state. cc is a stack of actions that have to be
+    // performed to finish the current statement. For example we might
+    // know that we still need to find a closing parenthesis and a
+    // semicolon. Actions at the end of the stack go first. It is
+    // initialized with an infinitely looping action that consumes
+    // whole statements.
+    var cc = [statements];
+    // Context contains information about the current local scope, the
+    // variables defined in that, and the scopes above it.
+    var context = null;
+    // The lexical scope, used mostly for indentation.
+    var lexical = new JSLexical((basecolumn || 0) - indentUnit, 0, "block", false);
+    // Current column, and the indentation at the start of the current
+    // line. Used to create lexical scope objects.
+    var column = 0;
+    var indented = 0;
+    // Variables which are used by the mark, cont, and pass functions
+    // below to communicate with the driver loop in the 'next'
+    // function.
+    var consume, marked;
+  
+    // The iterator object.
+    var parser = {next: next, copy: copy};
+
+    function next(){
+      // Start by performing any 'lexical' actions (adjusting the
+      // lexical variable), or the operations below will be working
+      // with the wrong lexical state.
+      while(cc[cc.length - 1].lex)
+        cc.pop()();
+
+      // Fetch a token.
+      var token = tokens.next();
+
+      // Adjust column and indented.
+      if (token.type == "whitespace" && column == 0)
+        indented = token.value.length;
+      column += token.value.length;
+      if (token.content == "\n"){
+        indented = column = 0;
+        // If the lexical scope's align property is still undefined at
+        // the end of the line, it is an un-aligned scope.
+        if (!("align" in lexical))
+          lexical.align = false;
+        // Newline tokens get an indentation function associated with
+        // them.
+        token.indentation = indentJS(lexical);
+      }
+      // No more processing for meaningless tokens.
+      if (token.type == "whitespace" || token.type == "comment")
+        return token;
+      // When a meaningful token is found and the lexical scope's
+      // align is undefined, it is an aligned scope.
+      if (!("align" in lexical))
+        lexical.align = true;
+
+      // Execute actions until one 'consumes' the token and we can
+      // return it.
+      while(true) {
+        consume = marked = false;
+        // Take and execute the topmost action.
+        cc.pop()(token.type, token.content);
+        if (consume){
+          // Marked is used to change the style of the current token.
+          if (marked)
+            token.style = marked;
+          // Here we differentiate between local and global variables.
+          else if (token.type == "variable" && inScope(token.content))
+            token.style = "js-localvariable";
+          return token;
+        }
+      }
+    }
+
+    // This makes a copy of the parser state. It stores all the
+    // stateful variables in a closure, and returns a function that
+    // will restore them when called with a new input stream. Note
+    // that the cc array has to be copied, because it is contantly
+    // being modified. Lexical objects are not mutated, and context
+    // objects are not mutated in a harmful way, so they can be shared
+    // between runs of the parser.
+    function copy(){
+      var _context = context, _lexical = lexical, _cc = cc.concat([]), _tokenState = tokens.state;
+  
+      return function copyParser(input){
+        context = _context;
+        lexical = _lexical;
+        cc = _cc.concat([]); // copies the array
+        column = indented = 0;
+        tokens = tokenizeJavaScript(input, _tokenState);
+        return parser;
+      };
+    }
+
+    // Helper function for pushing a number of actions onto the cc
+    // stack in reverse order.
+    function push(fs){
+      for (var i = fs.length - 1; i >= 0; i--)
+        cc.push(fs[i]);
+    }
+    // cont and pass are used by the action functions to add other
+    // actions to the stack. cont will cause the current token to be
+    // consumed, pass will leave it for the next action.
+    function cont(){
+      push(arguments);
+      consume = true;
+    }
+    function pass(){
+      push(arguments);
+      consume = false;
+    }
+    // Used to change the style of the current token.
+    function mark(style){
+      marked = style;
+    }
+
+    // Push a new scope. Will automatically link the current scope.
+    function pushcontext(){
+      context = {prev: context, vars: {"this": true, "arguments": true}};
+    }
+    // Pop off the current scope.
+    function popcontext(){
+      context = context.prev;
+    }
+    // Register a variable in the current scope.
+    function register(varname){
+      if (context){
+        mark("js-variabledef");
+        context.vars[varname] = true;
+      }
+    }
+    // Check whether a variable is defined in the current scope.
+    function inScope(varname){
+      var cursor = context;
+      while (cursor) {
+        if (cursor.vars[varname])
+          return true;
+        cursor = cursor.prev;
+      }
+      return false;
+    }
+  
+    // Push a new lexical context of the given type.
+    function pushlex(type, info) {
+      var result = function(){
+        lexical = new JSLexical(indented, column, type, null, lexical, info)
+      };
+      result.lex = true;
+      return result;
+    }
+    // Pop off the current lexical context.
+    function poplex(){
+      lexical = lexical.prev;
+    }
+    poplex.lex = true;
+    // The 'lex' flag on these actions is used by the 'next' function
+    // to know they can (and have to) be ran before moving on to the
+    // next token.
+  
+    // Creates an action that discards tokens until it finds one of
+    // the given type.
+    function expect(wanted){
+      return function expecting(type){
+        if (type == wanted) cont();
+        else cont(arguments.callee);
+      };
+    }
+
+    // Looks for a statement, and then calls itself.
+    function statements(type){
+      return pass(statement, statements);
+    }
+    // Dispatches various types of statements based on the type of the
+    // current token.
+    function statement(type){
+      if (type == "var") cont(pushlex("vardef"), vardef1, expect(";"), poplex);
+      else if (type == "keyword a") cont(pushlex("form"), expression, statement, poplex);
+      else if (type == "keyword b") cont(pushlex("form"), statement, poplex);
+      else if (type == "{") cont(pushlex("}"), block, poplex);
+      else if (type == "function") cont(functiondef);
+      else if (type == "for") cont(pushlex("form"), expect("("), pushlex(")"), forspec1, expect(")"), poplex, statement, poplex);
+      else if (type == "variable") cont(pushlex("stat"), maybelabel);
+      else if (type == "switch") cont(pushlex("form"), expression, pushlex("}", "switch"), expect("{"), block, poplex, poplex);
+      else if (type == "case") cont(expression, expect(":"));
+      else if (type == "default") cont(expect(":"));
+      else if (type == "catch") cont(pushlex("form"), pushcontext, expect("("), funarg, expect(")"), statement, poplex, popcontext);
+      else pass(pushlex("stat"), expression, expect(";"), poplex);
+    }
+    // Dispatch expression types.
+    function expression(type){
+      if (atomicTypes.hasOwnProperty(type)) cont(maybeoperator);
+      else if (type == "function") cont(functiondef);
+      else if (type == "keyword c") cont(expression);
+      else if (type == "(") cont(pushlex(")"), expression, expect(")"), poplex, maybeoperator);
+      else if (type == "operator") cont(expression);
+      else if (type == "[") cont(pushlex("]"), commasep(expression, "]"), poplex, maybeoperator);
+      else if (type == "{") cont(pushlex("}"), commasep(objprop, "}"), poplex, maybeoperator);
+    }
+    // Called for places where operators, function calls, or
+    // subscripts are valid. Will skip on to the next action if none
+    // is found.
+    function maybeoperator(type){
+      if (type == "operator") cont(expression);
+      else if (type == "(") cont(pushlex(")"), expression, commasep(expression, ")"), poplex, maybeoperator);
+      else if (type == ".") cont(property, maybeoperator);
+      else if (type == "[") cont(pushlex("]"), expression, expect("]"), poplex, maybeoperator);
+    }
+    // When a statement starts with a variable name, it might be a
+    // label. If no colon follows, it's a regular statement.
+    function maybelabel(type){
+      if (type == ":") cont(poplex, statement);
+      else pass(maybeoperator, expect(";"), poplex);
+    }
+    // Property names need to have their style adjusted -- the
+    // tokenizer thinks they are variables.
+    function property(type){
+      if (type == "variable") {mark("js-property"); cont();}
+    }
+    // This parses a property and its value in an object literal.
+    function objprop(type){
+      if (type == "variable") mark("js-property");
+      if (atomicTypes.hasOwnProperty(type)) cont(expect(":"), expression);
+    }
+    // Parses a comma-separated list of the things that are recognized
+    // by the 'what' argument.
+    function commasep(what, end){
+      function proceed(type) {
+        if (type == ",") cont(what, proceed);
+        else if (type == end) cont();
+        else cont(expect(end));
+      };
+      return function commaSeparated(type) {
+        if (type == end) cont();
+        else pass(what, proceed);
+      };
+    }
+    // Look for statements until a closing brace is found.
+    function block(type){
+      if (type == "}") cont();
+      else pass(statement, block);
+    }
+    // Variable definitions are split into two actions -- 1 looks for
+    // a name or the end of the definition, 2 looks for an '=' sign or
+    // a comma.
+    function vardef1(type, value){
+      if (type == "variable"){register(value); cont(vardef2);}
+      else cont();
+    }
+    function vardef2(type, value){
+      if (value == "=") cont(expression, vardef2);
+      else if (type == ",") cont(vardef1);
+    }
+    // For loops.
+    function forspec1(type){
+      if (type == "var") cont(vardef1, forspec2);
+      else if (type == ";") pass(forspec2);
+      else if (type == "variable") cont(formaybein);
+      else pass(forspec2);
+    }
+    function formaybein(type, value){
+      if (value == "in") cont(expression);
+      else cont(maybeoperator, forspec2);
+    }
+    function forspec2(type, value){
+      if (type == ";") cont(forspec3);
+      else if (value == "in") cont(expression);
+      else cont(expression, expect(";"), forspec3);
+    }
+    function forspec3(type) {
+      if (type == ")") pass();
+      else cont(expression);
+    }
+    // A function definition creates a new context, and the variables
+    // in its argument list have to be added to this context.
+    function functiondef(type, value){
+      if (type == "variable"){register(value); cont(functiondef);}
+      else if (type == "(") cont(pushcontext, commasep(funarg, ")"), statement, popcontext);
+    }
+    function funarg(type, value){
+      if (type == "variable"){register(value); cont();}
+    }
+  
+    return parser;
+  }
+
+  return {make: parseJS, electricChars: "{}:"};
+})();
--- a/public/javascripts/admin/plugins/codemirror/parseliquid.js
+++ b/public/javascripts/admin/plugins/codemirror/parseliquid.js
@ -0,0 +1,409 @@
+/* This file defines an XML parser, with a few kludges to make it
+ * useable for HTML. autoSelfClosers defines a set of tag names that
+ * are expected to not have a closing tag, and doNotIndent specifies
+ * the tags inside of which no indentation should happen (see Config
+ * object). These can be disabled by passing the editor an object like
+ * {useHTMLKludges: false} as parserConfig option.
+ */
+
+var LiquidParser = Editor.Parser = (function() {
+  var Kludges = {
+    autoSelfClosers: {"br": true, "img": true, "hr": true, "link": true, "input": true,
+                      "meta": true, "col": true, "frame": true, "base": true, "area": true},
+    doNotIndent: {"pre": true, "!cdata": true}
+  };
+  var NoKludges = {autoSelfClosers: {}, doNotIndent: {"!cdata": true}};
+  var UseKludges = Kludges;
+  var alignCDATA = false;
+    
+  var isQuote = /[\'\"]/;
+  var isWordChar = /[\w\_]/
+  var isPunctuation = /[\.\|\=\:]/;
+  
+  var keywords = {};
+  
+  ['in'].forEach(function(element, index, array) {
+    keywords[element] = true;
+  });
+
+  // Simple stateful tokenizer for XML documents. Returns a
+  // MochiKit-style iterator, with a state property that contains a
+  // function encapsulating the current state. See tokenize.js.
+  var tokenizeXML = (function() {
+    function inText(source, setState) {
+      var ch = source.next();
+      if (ch == "<") {
+        if (source.equals("!")) {
+          source.next();
+          if (source.equals("[")) {
+            if (source.lookAhead("[CDATA[", true)) {
+              setState(inBlock("xml-cdata", "]]>"));
+              return null;
+            }
+            else {
+              return "xml-text";
+            }
+          }
+          else if (source.lookAhead("--", true)) {
+            setState(inBlock("xml-comment", "-->"));
+            return null;
+          }
+          else {
+            return "xml-text";
+          }
+        }
+        else if (source.equals("?")) {
+          source.next();
+          source.nextWhileMatches(/[\w\._\-]/);
+          setState(inBlock("xml-processing", "?>"));
+          return "xml-processing";
+        }
+        else {
+          if (source.equals("/")) source.next();
+          setState(inTag);
+          return "xml-punctuation";
+        }
+      } 
+      else if (ch == "{") {        
+        if (source.equals("{")) {
+          source.next();
+          setState(inLiquidOutput);
+          return 'liquid-punctuation';
+        }
+        if (source.equals("%")) {
+          source.next();
+          setState(inLiquidTagName);
+          return 'liquid-punctuation';
+        }
+        else {
+          return "xml-text";
+        }
+      }
+      else if (ch == "&") {
+        while (!source.endOfLine()) {
+          if (source.next() == ";")
+            break;
+        }
+        return "xml-entity";
+      }
+      else {
+        source.nextWhileMatches(/[^{&<\n]/);
+        return "xml-text";
+      }
+    }
+
+    function inTag(source, setState) {
+      var ch = source.next();
+      if (ch == ">") {
+        setState(inText);
+        return "xml-punctuation";
+      }
+      else if (/[?\/]/.test(ch) && source.equals(">")) {
+        source.next();
+        setState(inText);
+        return "xml-punctuation";
+      }
+      else if (ch == "=") {
+        return "xml-punctuation";
+      }
+      else if (/[\'\"]/.test(ch)) {
+        setState(inAttribute(ch));
+        return null;
+      }
+      else {
+        source.nextWhileMatches(/[^\s\u00a0=<>\"\'\/?]/);
+        return "xml-name";
+      }
+    }
+
+    function inLiquidOutput(source, setState) {
+      var ch = source.next();
+      if (ch == "}") {
+        if(source.equals("}")) {
+          source.next();
+          setState(inText);
+          return "liquid-punctuation";
+        }         
+        else {
+          setState(inText);
+          return "liquid-bad-punctuation";
+        }
+      }
+      else if (isQuote.test(ch)) {
+        setState(inLiquidString(ch, inLiquidOutput));
+        return null;        
+      }
+      else if (isPunctuation.test(ch)) {
+        return "liquid-punctuation";
+      }
+
+      return "liquid-text";
+    }
+    
+    function inLiquidTagName(source, setState) {
+      source.nextWhileMatches(isWordChar);
+      setState(inLiquidTag);
+      return "liquid-tag-name";      
+    }
+
+    function inLiquidTag(source, setState) {
+      var ch = source.next();
+      if (ch == "%") {
+        if(source.equals("}")) {
+          source.next();
+          setState(inText);
+          return "liquid-punctuation";
+        }
+        else {
+          setState(inText);
+          return "liquid-bad-punctuation";
+        }
+      }
+      else if (isQuote.test(ch)) {
+        setState(inLiquidString(ch, inLiquidTag));
+        return null;        
+      }
+      else if (isPunctuation.test(ch)) {
+        return "liquid-punctuation";
+      }
+      else {        
+        return readWord(source, keywords)
+      }
+    }
+    
+    function readWord(source, keywords) {
+      source.nextWhileMatches(isWordChar);      
+      var word = source.get();
+            
+      if (keywords && keywords.propertyIsEnumerable(word)) {
+        return {type: "string", style: "liquid-keyword", content: word};
+      }
+      else {
+        return {type: "string", style: "liquid-text", content: word};
+      }
+    }
+    
+    function inLiquidString(quote, outer) {
+      return function(source, setState) {
+        while (!source.endOfLine()) {
+          if (source.next() == quote) {
+            setState(outer);
+            break;
+          }
+        }
+        return "liquid-string";
+      };
+    }
+  
+
+    function inAttribute(quote) {
+      return function(source, setState) {
+        while (!source.endOfLine()) {
+          if (source.next() == quote) {
+            setState(inTag);
+            break;
+          }
+        }
+        return "xml-attribute";
+      };
+    }
+
+    function inBlock(style, terminator) {
+      return function(source, setState) {
+        while (!source.endOfLine()) {
+          if (source.lookAhead(terminator, true)) {
+            setState(inText);
+            break;
+          }
+          source.next();
+        }
+        return style;
+      };
+    }
+
+    return function(source, startState) {
+      return tokenizer(source, startState || inText);
+    };
+  })();
+
+  // The parser. The structure of this function largely follows that of
+  // parseJavaScript in parsejavascript.js (there is actually a bit more
+  // shared code than I'd like), but it is quite a bit simpler.
+  function parseXML(source) {
+    var tokens = tokenizeXML(source);
+    var cc = [base];
+    var tokenNr = 0, indented = 0;
+    var currentTag = null, context = null;
+    var consume, marked;
+    
+    function push(fs) {
+      for (var i = fs.length - 1; i >= 0; i--)
+        cc.push(fs[i]);
+    }
+    function cont() {
+      push(arguments);
+      consume = true;
+    }
+    function pass() {
+      push(arguments);
+      consume = false;
+    }
+
+    function mark(style) {
+      marked = style;
+    }
+    function expect(text) {
+      return function(style, content) {
+        if (content == text) cont();
+        else mark("xml-error") || cont(arguments.callee);
+      };
+    }
+
+    function pushContext(tagname, startOfLine) {
+      var noIndent = UseKludges.doNotIndent.hasOwnProperty(tagname) || (context && context.noIndent);
+      context = {prev: context, name: tagname, indent: indented, startOfLine: startOfLine, noIndent: noIndent};
+    }
+    function popContext() {
+      context = context.prev;
+    }
+    function computeIndentation(baseContext) {
+      return function(nextChars, current) {
+        var context = baseContext;
+        if (context && context.noIndent)
+          return current;
+        if (alignCDATA && /<!\[CDATA\[/.test(nextChars))
+          return 0;
+        if (context && /^<\//.test(nextChars))
+          context = context.prev;
+        while (context && !context.startOfLine)
+          context = context.prev;
+        if (context)
+          return context.indent + indentUnit;
+        else
+          return 0;
+      };
+    }
+
+    function base() {
+      return pass(element, base);
+    }
+    var harmlessTokens = {"xml-text": true, "xml-entity": true, "xml-comment": true, "xml-processing": true};
+    var liquidTokens = {"liquid-punctuation": true, "liquid-bad-punctuation": true, "liquid-keyword": true, "liquid-tag-name": true, "liquid-variable": true, "liquid-text": true, "liquid-string": true};
+    function element(style, content) {
+      if (content == "<") cont(tagname, attributes, endtag(tokenNr == 1));
+      else if (content == "</") cont(closetagname, expect(">"));
+      else if (style == "xml-cdata") {
+        if (!context || context.name != "!cdata") pushContext("!cdata");
+        if (/\]\]>$/.test(content)) popContext();
+        cont();
+      }
+      else if (harmlessTokens.hasOwnProperty(style)) cont();
+      else if (liquidTokens.hasOwnProperty(style)) cont();
+      else mark("xml-error") || cont();
+    }
+    function tagname(style, content) {
+      if (style == "xml-name") {
+        currentTag = content.toLowerCase();
+        mark("xml-tagname");
+        cont();
+      }
+      else {
+        currentTag = null;
+        pass();
+      }
+    }
+    function closetagname(style, content) {
+      if (style == "xml-name" && context && content.toLowerCase() == context.name) {
+        popContext();
+        mark("xml-tagname");
+      }
+      else {
+        mark("xml-error");
+      }
+      cont();
+    }
+    function closeliquidtagname(style, content) {
+      if (style == "liquid-tag-name" && context && content.toLowerCase() == context.name) {
+        popContext();
+        mark("xml-tagname");
+      }
+      else {
+        mark("xml-error");
+      }
+      cont();
+    }
+    function endtag(startOfLine) {
+      return function(style, content) {
+        if (content == "/>" || (content == ">" && UseKludges.autoSelfClosers.hasOwnProperty(currentTag))) cont();
+        else if (content == ">") pushContext(currentTag, startOfLine) || cont();
+        else mark("xml-error") || cont(arguments.callee);
+      };
+    }
+    function attributes(style) {
+      if (style == "xml-name") mark("xml-attname") || cont(attribute, attributes);
+      else pass();
+    }
+    function attribute(style, content) {
+      if (content == "=") cont(value);
+      else if (content == ">" || content == "/>") pass(endtag);
+      else pass();
+    }
+    function value(style) {
+      if (style == "xml-attribute") cont(value);
+      else pass();
+    }
+
+    return {
+      indentation: function() {return indented;},
+
+      next: function(){
+        var token = tokens.next();
+        if (token.style == "whitespace" && tokenNr == 0)
+          indented = token.value.length;
+        else
+          tokenNr++;
+        if (token.content == "\n") {
+          indented = tokenNr = 0;
+          token.indentation = computeIndentation(context);
+        }
+
+        if (token.style == "whitespace" || token.type == "xml-comment")
+          return token;
+
+        while(true){
+          consume = marked = false;
+          cc.pop()(token.style, token.content);
+          if (consume){
+            if (marked)
+              token.style = marked;
+            return token;
+          }
+        }
+      },
+
+      copy: function(){
+        var _cc = cc.concat([]), _tokenState = tokens.state, _context = context;
+        var parser = this;
+        
+        return function(input){
+          cc = _cc.concat([]);
+          tokenNr = indented = 0;
+          context = _context;
+          tokens = tokenizeXML(input, _tokenState);
+          return parser;
+        };
+      }
+    };
+  }
+
+  return {
+    make: parseXML,
+    electricChars: "/",
+    configure: function(config) {
+      if (config.useHTMLKludges != null)
+        UseKludges = config.useHTMLKludges ? Kludges : NoKludges;
+      if (config.alignCDATA)
+        alignCDATA = config.alignCDATA;
+    }
+  };
+})();
--- a/public/javascripts/admin/plugins/codemirror/parsesparql.js
+++ b/public/javascripts/admin/plugins/codemirror/parsesparql.js
@ -0,0 +1,162 @@
+var SparqlParser = Editor.Parser = (function() {
+  function wordRegexp(words) {
+    return new RegExp("^(?:" + words.join("|") + ")$", "i");
+  }
+  var ops = wordRegexp(["str", "lang", "langmatches", "datatype", "bound", "sameterm", "isiri", "isuri",
+                        "isblank", "isliteral", "union", "a"]);
+  var keywords = wordRegexp(["base", "prefix", "select", "distinct", "reduced", "construct", "describe",
+                             "ask", "from", "named", "where", "order", "limit", "offset", "filter", "optional",
+                             "graph", "by", "asc", "desc", ]);
+  var operatorChars = /[*+\-<>=&|]/;
+
+  var tokenizeSparql = (function() {
+    function normal(source, setState) {
+      var ch = source.next();
+      if (ch == "$" || ch == "?") {
+        source.nextWhileMatches(/[\w\d]/);
+        return "sp-var";
+      }
+      else if (ch == "<" && !source.matches(/[\s\u00a0=]/)) {
+        source.nextWhileMatches(/[^\s\u00a0>]/);
+        if (source.equals(">")) source.next();
+        return "sp-uri";
+      }
+      else if (ch == "\"" || ch == "'") {
+        setState(inLiteral(ch));
+        return null;
+      }
+      else if (/[{}\(\),\.;\[\]]/.test(ch)) {
+        return "sp-punc";
+      }
+      else if (ch == "#") {
+        while (!source.endOfLine()) source.next();
+        return "sp-comment";
+      }
+      else if (operatorChars.test(ch)) {
+        source.nextWhileMatches(operatorChars);
+        return "sp-operator";
+      }
+      else if (ch == ":") {
+        source.nextWhileMatches(/[\w\d\._\-]/);
+        return "sp-prefixed";
+      }
+      else {
+        source.nextWhileMatches(/[_\w\d]/);
+        if (source.equals(":")) {
+          source.next();
+          source.nextWhileMatches(/[\w\d_\-]/);
+          return "sp-prefixed";
+        }
+        var word = source.get(), type;
+        if (ops.test(word))
+          type = "sp-operator";
+        else if (keywords.test(word))
+          type = "sp-keyword";
+        else
+          type = "sp-word";
+        return {style: type, content: word};
+      }
+    }
+
+    function inLiteral(quote) {
+      return function(source, setState) {
+        var escaped = false;
+        while (!source.endOfLine()) {
+          var ch = source.next();
+          if (ch == quote && !escaped) {
+            setState(normal);
+            break;
+          }
+          escaped = !escaped && ch == "\\";
+        }
+        return "sp-literal";
+      };
+    }
+
+    return function(source, startState) {
+      return tokenizer(source, startState || normal);
+    };
+  })();
+
+  function indentSparql(context) {
+    return function(nextChars) {
+      var firstChar = nextChars && nextChars.charAt(0);
+      if (/[\]\}]/.test(firstChar))
+        while (context && context.type == "pattern") context = context.prev;
+
+      var closing = context && firstChar == matching[context.type];
+      if (!context)
+        return 0;
+      else if (context.type == "pattern")
+        return context.col;
+      else if (context.align)
+        return context.col - (closing ? context.width : 0);
+      else
+        return context.indent + (closing ? 0 : indentUnit);
+    }
+  }
+
+  function parseSparql(source) {
+    var tokens = tokenizeSparql(source);
+    var context = null, indent = 0, col = 0;
+    function pushContext(type, width) {
+      context = {prev: context, indent: indent, col: col, type: type, width: width};
+    }
+    function popContext() {
+      context = context.prev;
+    }
+
+    var iter = {
+      next: function() {
+        var token = tokens.next(), type = token.style, content = token.content, width = token.value.length;
+
+        if (content == "\n") {
+          token.indentation = indentSparql(context);
+          indent = col = 0;
+          if (context && context.align == null) context.align = false;
+        }
+        else if (type == "whitespace" && col == 0) {
+          indent = width;
+        }
+        else if (type != "sp-comment" && context && context.align == null) {
+          context.align = true;
+        }
+
+        if (content != "\n") col += width;
+
+        if (/[\[\{\(]/.test(content)) {
+          pushContext(content, width);
+        }
+        else if (/[\]\}\)]/.test(content)) {
+          while (context && context.type == "pattern")
+            popContext();
+          if (context && content == matching[context.type])
+            popContext();
+        }
+        else if (content == "." && context && context.type == "pattern") {
+          popContext();
+        }
+        else if ((type == "sp-word" || type == "sp-prefixed" || type == "sp-uri" || type == "sp-var" || type == "sp-literal") &&
+                 context && /[\{\[]/.test(context.type)) {
+          pushContext("pattern", width);
+        }
+
+        return token;
+      },
+
+      copy: function() {
+        var _context = context, _indent = indent, _col = col, _tokenState = tokens.state;
+        return function(source) {
+          tokens = tokenizeSparql(source, _tokenState);
+          context = _context;
+          indent = _indent;
+          col = _col;
+          return iter;
+        };
+      }
+    };
+    return iter;
+  }
+
+  return {make: parseSparql, electricChars: "}]"};
+})();
--- a/public/javascripts/admin/plugins/codemirror/parsexml.js
+++ b/public/javascripts/admin/plugins/codemirror/parsexml.js
@ -0,0 +1,292 @@
+/* This file defines an XML parser, with a few kludges to make it
+ * useable for HTML. autoSelfClosers defines a set of tag names that
+ * are expected to not have a closing tag, and doNotIndent specifies
+ * the tags inside of which no indentation should happen (see Config
+ * object). These can be disabled by passing the editor an object like
+ * {useHTMLKludges: false} as parserConfig option.
+ */
+
+var XMLParser = Editor.Parser = (function() {
+  var Kludges = {
+    autoSelfClosers: {"br": true, "img": true, "hr": true, "link": true, "input": true,
+                      "meta": true, "col": true, "frame": true, "base": true, "area": true},
+    doNotIndent: {"pre": true, "!cdata": true}
+  };
+  var NoKludges = {autoSelfClosers: {}, doNotIndent: {"!cdata": true}};
+  var UseKludges = Kludges;
+  var alignCDATA = false;
+
+  // Simple stateful tokenizer for XML documents. Returns a
+  // MochiKit-style iterator, with a state property that contains a
+  // function encapsulating the current state. See tokenize.js.
+  var tokenizeXML = (function() {
+    function inText(source, setState) {
+      var ch = source.next();
+      if (ch == "<") {
+        if (source.equals("!")) {
+          source.next();
+          if (source.equals("[")) {
+            if (source.lookAhead("[CDATA[", true)) {
+              setState(inBlock("xml-cdata", "]]>"));
+              return null;
+            }
+            else {
+              return "xml-text";
+            }
+          }
+          else if (source.lookAhead("--", true)) {
+            setState(inBlock("xml-comment", "-->"));
+            return null;
+          }
+          else {
+            return "xml-text";
+          }
+        }
+        else if (source.equals("?")) {
+          source.next();
+          source.nextWhileMatches(/[\w\._\-]/);
+          setState(inBlock("xml-processing", "?>"));
+          return "xml-processing";
+        }
+        else {
+          if (source.equals("/")) source.next();
+          setState(inTag);
+          return "xml-punctuation";
+        }
+      }
+      else if (ch == "&") {
+        while (!source.endOfLine()) {
+          if (source.next() == ";")
+            break;
+        }
+        return "xml-entity";
+      }
+      else {
+        source.nextWhileMatches(/[^&<\n]/);
+        return "xml-text";
+      }
+    }
+
+    function inTag(source, setState) {
+      var ch = source.next();
+      if (ch == ">") {
+        setState(inText);
+        return "xml-punctuation";
+      }
+      else if (/[?\/]/.test(ch) && source.equals(">")) {
+        source.next();
+        setState(inText);
+        return "xml-punctuation";
+      }
+      else if (ch == "=") {
+        return "xml-punctuation";
+      }
+      else if (/[\'\"]/.test(ch)) {
+        setState(inAttribute(ch));
+        return null;
+      }
+      else {
+        source.nextWhileMatches(/[^\s\u00a0=<>\"\'\/?]/);
+        return "xml-name";
+      }
+    }
+
+    function inAttribute(quote) {
+      return function(source, setState) {
+        while (!source.endOfLine()) {
+          if (source.next() == quote) {
+            setState(inTag);
+            break;
+          }
+        }
+        return "xml-attribute";
+      };
+    }
+
+    function inBlock(style, terminator) {
+      return function(source, setState) {
+        while (!source.endOfLine()) {
+          if (source.lookAhead(terminator, true)) {
+            setState(inText);
+            break;
+          }
+          source.next();
+        }
+        return style;
+      };
+    }
+
+    return function(source, startState) {
+      return tokenizer(source, startState || inText);
+    };
+  })();
+
+  // The parser. The structure of this function largely follows that of
+  // parseJavaScript in parsejavascript.js (there is actually a bit more
+  // shared code than I'd like), but it is quite a bit simpler.
+  function parseXML(source) {
+    var tokens = tokenizeXML(source);
+    var cc = [base];
+    var tokenNr = 0, indented = 0;
+    var currentTag = null, context = null;
+    var consume, marked;
+    
+    function push(fs) {
+      for (var i = fs.length - 1; i >= 0; i--)
+        cc.push(fs[i]);
+    }
+    function cont() {
+      push(arguments);
+      consume = true;
+    }
+    function pass() {
+      push(arguments);
+      consume = false;
+    }
+
+    function mark(style) {
+      marked = style;
+    }
+    function expect(text) {
+      return function(style, content) {
+        if (content == text) cont();
+        else mark("xml-error") || cont(arguments.callee);
+      };
+    }
+
+    function pushContext(tagname, startOfLine) {
+      var noIndent = UseKludges.doNotIndent.hasOwnProperty(tagname) || (context && context.noIndent);
+      context = {prev: context, name: tagname, indent: indented, startOfLine: startOfLine, noIndent: noIndent};
+    }
+    function popContext() {
+      context = context.prev;
+    }
+    function computeIndentation(baseContext) {
+      return function(nextChars, current) {
+        var context = baseContext;
+        if (context && context.noIndent)
+          return current;
+        if (alignCDATA && /<!\[CDATA\[/.test(nextChars))
+          return 0;
+        if (context && /^<\//.test(nextChars))
+          context = context.prev;
+        while (context && !context.startOfLine)
+          context = context.prev;
+        if (context)
+          return context.indent + indentUnit;
+        else
+          return 0;
+      };
+    }
+
+    function base() {
+      return pass(element, base);
+    }
+    var harmlessTokens = {"xml-text": true, "xml-entity": true, "xml-comment": true, "xml-processing": true};
+    function element(style, content) {
+      if (content == "<") cont(tagname, attributes, endtag(tokenNr == 1));
+      else if (content == "</") cont(closetagname, expect(">"));
+      else if (style == "xml-cdata") {
+        if (!context || context.name != "!cdata") pushContext("!cdata");
+        if (/\]\]>$/.test(content)) popContext();
+        cont();
+      }
+      else if (harmlessTokens.hasOwnProperty(style)) cont();
+      else mark("xml-error") || cont();
+    }
+    function tagname(style, content) {
+      if (style == "xml-name") {
+        currentTag = content.toLowerCase();
+        mark("xml-tagname");
+        cont();
+      }
+      else {
+        currentTag = null;
+        pass();
+      }
+    }
+    function closetagname(style, content) {
+      if (style == "xml-name" && context && content.toLowerCase() == context.name) {
+        popContext();
+        mark("xml-tagname");
+      }
+      else {
+        mark("xml-error");
+      }
+      cont();
+    }
+    function endtag(startOfLine) {
+      return function(style, content) {
+        if (content == "/>" || (content == ">" && UseKludges.autoSelfClosers.hasOwnProperty(currentTag))) cont();
+        else if (content == ">") pushContext(currentTag, startOfLine) || cont();
+        else mark("xml-error") || cont(arguments.callee);
+      };
+    }
+    function attributes(style) {
+      if (style == "xml-name") mark("xml-attname") || cont(attribute, attributes);
+      else pass();
+    }
+    function attribute(style, content) {
+      if (content == "=") cont(value);
+      else if (content == ">" || content == "/>") pass(endtag);
+      else pass();
+    }
+    function value(style) {
+      if (style == "xml-attribute") cont(value);
+      else pass();
+    }
+
+    return {
+      indentation: function() {return indented;},
+
+      next: function(){
+        var token = tokens.next();
+        if (token.style == "whitespace" && tokenNr == 0)
+          indented = token.value.length;
+        else
+          tokenNr++;
+        if (token.content == "\n") {
+          indented = tokenNr = 0;
+          token.indentation = computeIndentation(context);
+        }
+
+        if (token.style == "whitespace" || token.type == "xml-comment")
+          return token;
+
+        while(true){
+          consume = marked = false;
+          cc.pop()(token.style, token.content);
+          if (consume){
+            if (marked)
+              token.style = marked;
+            return token;
+          }
+        }
+      },
+
+      copy: function(){
+        var _cc = cc.concat([]), _tokenState = tokens.state, _context = context;
+        var parser = this;
+        
+        return function(input){
+          cc = _cc.concat([]);
+          tokenNr = indented = 0;
+          context = _context;
+          tokens = tokenizeXML(input, _tokenState);
+          return parser;
+        };
+      }
+    };
+  }
+
+  return {
+    make: parseXML,
+    electricChars: "/",
+    configure: function(config) {
+      if (config.useHTMLKludges != null)
+        UseKludges = config.useHTMLKludges ? Kludges : NoKludges;
+      if (config.alignCDATA)
+        alignCDATA = config.alignCDATA;
+    }
+  };
+})();
--- a/public/javascripts/admin/plugins/codemirror/select.js
+++ b/public/javascripts/admin/plugins/codemirror/select.js
@ -0,0 +1,619 @@
+/* Functionality for finding, storing, and restoring selections
+ *
+ * This does not provide a generic API, just the minimal functionality
+ * required by the CodeMirror system.
+ */
+
+// Namespace object.
+var select = {};
+
+(function() {
+  select.ie_selection = document.selection && document.selection.createRangeCollection;
+
+  // Find the 'top-level' (defined as 'a direct child of the node
+  // passed as the top argument') node that the given node is
+  // contained in. Return null if the given node is not inside the top
+  // node.
+  function topLevelNodeAt(node, top) {
+    while (node && node.parentNode != top)
+      node = node.parentNode;
+    return node;
+  }
+
+  // Find the top-level node that contains the node before this one.
+  function topLevelNodeBefore(node, top) {
+    while (!node.previousSibling && node.parentNode != top)
+      node = node.parentNode;
+    return topLevelNodeAt(node.previousSibling, top);
+  }
+
+  var fourSpaces = "\u00a0\u00a0\u00a0\u00a0";
+
+  select.scrollToNode = function(element) {
+    if (!element) return;
+    var doc = element.ownerDocument, body = doc.body,
+        win = (doc.defaultView || doc.parentWindow),
+        html = doc.documentElement,
+        atEnd = !element.nextSibling || !element.nextSibling.nextSibling
+                || !element.nextSibling.nextSibling.nextSibling;
+    // In Opera (and recent Webkit versions), BR elements *always*
+    // have a scrollTop property of zero.
+    var compensateHack = 0;
+    while (element && !element.offsetTop) {
+      compensateHack++;
+      element = element.previousSibling;
+    }
+    // atEnd is another kludge for these browsers -- if the cursor is
+    // at the end of the document, and the node doesn't have an
+    // offset, just scroll to the end.
+    if (compensateHack == 0) atEnd = false;
+
+    var y = compensateHack * (element ? element.offsetHeight : 0), x = 0, pos = element;
+    while (pos && pos.offsetParent) {
+      y += pos.offsetTop;
+      // Don't count X offset for <br> nodes
+      if (pos.nodeName != "BR")
+        x += pos.offsetLeft;
+      pos = pos.offsetParent;
+    }
+
+    var scroll_x = body.scrollLeft || html.scrollLeft || 0,
+        scroll_y = body.scrollTop || html.scrollTop || 0,
+        screen_x = x - scroll_x, screen_y = y - scroll_y, scroll = false;
+
+    if (screen_x < 0 || screen_x > (win.innerWidth || html.clientWidth || 0)) {
+      scroll_x = x;
+      scroll = true;
+    }
+    if (screen_y < 0 || atEnd || screen_y > (win.innerHeight || html.clientHeight || 0) - 50) {
+      scroll_y = atEnd ? 1e10 : y;
+      scroll = true;
+    }
+    if (scroll) win.scrollTo(scroll_x, scroll_y);
+  };
+
+  select.scrollToCursor = function(container) {
+    select.scrollToNode(select.selectionTopNode(container, true) || container.firstChild);
+  };
+
+  // Used to prevent restoring a selection when we do not need to.
+  var currentSelection = null;
+
+  select.snapshotChanged = function() {
+    if (currentSelection) currentSelection.changed = true;
+  };
+
+  // This is called by the code in editor.js whenever it is replacing
+  // a text node. The function sees whether the given oldNode is part
+  // of the current selection, and updates this selection if it is.
+  // Because nodes are often only partially replaced, the length of
+  // the part that gets replaced has to be taken into account -- the
+  // selection might stay in the oldNode if the newNode is smaller
+  // than the selection's offset. The offset argument is needed in
+  // case the selection does move to the new object, and the given
+  // length is not the whole length of the new node (part of it might
+  // have been used to replace another node).
+  select.snapshotReplaceNode = function(from, to, length, offset) {
+    if (!currentSelection) return;
+
+    function replace(point) {
+      if (from == point.node) {
+        currentSelection.changed = true;
+        if (length && point.offset > length) {
+          point.offset -= length;
+        }
+        else {
+          point.node = to;
+          point.offset += (offset || 0);
+        }
+      }
+    }
+    replace(currentSelection.start);
+    replace(currentSelection.end);
+  };
+
+  select.snapshotMove = function(from, to, distance, relative, ifAtStart) {
+    if (!currentSelection) return;
+
+    function move(point) {
+      if (from == point.node && (!ifAtStart || point.offset == 0)) {
+        currentSelection.changed = true;
+        point.node = to;
+        if (relative) point.offset = Math.max(0, point.offset + distance);
+        else point.offset = distance;
+      }
+    }
+    move(currentSelection.start);
+    move(currentSelection.end);
+  };
+
+  // Most functions are defined in two ways, one for the IE selection
+  // model, one for the W3C one.
+  if (select.ie_selection) {
+    function selectionNode(win, start) {
+      var range = win.document.selection.createRange();
+      range.collapse(start);
+
+      function nodeAfter(node) {
+        var found = null;
+        while (!found && node) {
+          found = node.nextSibling;
+          node = node.parentNode;
+        }
+        return nodeAtStartOf(found);
+      }
+
+      function nodeAtStartOf(node) {
+        while (node && node.firstChild) node = node.firstChild;
+        return {node: node, offset: 0};
+      }
+
+      var containing = range.parentElement();
+      if (!isAncestor(win.document.body, containing)) return null;
+      if (!containing.firstChild) return nodeAtStartOf(containing);
+
+      var working = range.duplicate();
+      working.moveToElementText(containing);
+      working.collapse(true);
+      for (var cur = containing.firstChild; cur; cur = cur.nextSibling) {
+        if (cur.nodeType == 3) {
+          var size = cur.nodeValue.length;
+          working.move("character", size);
+        }
+        else {
+          working.moveToElementText(cur);
+          working.collapse(false);
+        }
+
+        var dir = range.compareEndPoints("StartToStart", working);
+        if (dir == 0) return nodeAfter(cur);
+        if (dir == 1) continue;
+        if (cur.nodeType != 3) return nodeAtStartOf(cur);
+
+        working.setEndPoint("StartToEnd", range);
+        return {node: cur, offset: size - working.text.length};
+      }
+      return nodeAfter(containing);
+    }
+
+    select.markSelection = function(win) {
+      currentSelection = null;
+      var sel = win.document.selection;
+      if (!sel) return;
+      var start = selectionNode(win, true),
+          end = selectionNode(win, false);
+      if (!start || !end) return;
+      currentSelection = {start: start, end: end, window: win, changed: false};
+    };
+
+    select.selectMarked = function() {
+      if (!currentSelection || !currentSelection.changed) return;
+      var win = currentSelection.window, doc = win.document;
+
+      function makeRange(point) {
+        var range = doc.body.createTextRange(),
+            node = point.node;
+        if (!node) {
+          range.moveToElementText(currentSelection.window.document.body);
+          range.collapse(false);
+        }
+        else if (node.nodeType == 3) {
+          range.moveToElementText(node.parentNode);
+          var offset = point.offset;
+          while (node.previousSibling) {
+            node = node.previousSibling;
+            offset += (node.innerText || "").length;
+          }
+          range.move("character", offset);
+        }
+        else {
+          range.moveToElementText(node);
+          range.collapse(true);
+        }
+        return range;
+      }
+
+      var start = makeRange(currentSelection.start), end = makeRange(currentSelection.end);
+      start.setEndPoint("StartToEnd", end);
+      start.select();
+    };
+
+    // Get the top-level node that one end of the cursor is inside or
+    // after. Note that this returns false for 'no cursor', and null
+    // for 'start of document'.
+    select.selectionTopNode = function(container, start) {
+      var selection = container.ownerDocument.selection;
+      if (!selection) return false;
+
+      var range = selection.createRange(), range2 = range.duplicate();
+      range.collapse(start);
+      var around = range.parentElement();
+      if (around && isAncestor(container, around)) {
+        // Only use this node if the selection is not at its start.
+        range2.moveToElementText(around);
+        if (range.compareEndPoints("StartToStart", range2) == 1)
+          return topLevelNodeAt(around, container);
+      }
+
+      // Move the start of a range to the start of a node,
+      // compensating for the fact that you can't call
+      // moveToElementText with text nodes.
+      function moveToNodeStart(range, node) {
+        if (node.nodeType == 3) {
+          var count = 0, cur = node.previousSibling;
+          while (cur && cur.nodeType == 3) {
+            count += cur.nodeValue.length;
+            cur = cur.previousSibling;
+          }
+          if (cur) {
+            try{range.moveToElementText(cur);}
+            catch(e){}
+            range.collapse(false);
+          }
+          else range.moveToElementText(node.parentNode);
+          if (count) range.move("character", count);
+        }
+        else range.moveToElementText(node);
+      }
+
+      // Do a binary search through the container object, comparing
+      // the start of each node to the selection
+      var start = 0, end = container.childNodes.length - 1;
+      while (start < end) {
+        var middle = Math.ceil((end + start) / 2), node = container.childNodes[middle];
+        if (!node) return false; // Don't ask. IE6 manages this sometimes.
+        moveToNodeStart(range2, node);
+        if (range.compareEndPoints("StartToStart", range2) == 1)
+          start = middle;
+        else
+          end = middle - 1;
+      }
+      return container.childNodes[start] || null;
+    };
+
+    // Place the cursor after this.start. This is only useful when
+    // manually moving the cursor instead of restoring it to its old
+    // position.
+    select.focusAfterNode = function(node, container) {
+      var range = container.ownerDocument.body.createTextRange();
+      range.moveToElementText(node || container);
+      range.collapse(!node);
+      range.select();
+    };
+
+    select.somethingSelected = function(win) {
+      var sel = win.document.selection;
+      return sel && (sel.createRange().text != "");
+    };
+
+    function insertAtCursor(window, html) {
+      var selection = window.document.selection;
+      if (selection) {
+        var range = selection.createRange();
+        range.pasteHTML(html);
+        range.collapse(false);
+        range.select();
+      }
+    }
+
+    // Used to normalize the effect of the enter key, since browsers
+    // do widely different things when pressing enter in designMode.
+    select.insertNewlineAtCursor = function(window) {
+      insertAtCursor(window, "<br>");
+    };
+
+    select.insertTabAtCursor = function(window) {
+      insertAtCursor(window, fourSpaces);
+    };
+
+    // Get the BR node at the start of the line on which the cursor
+    // currently is, and the offset into the line. Returns null as
+    // node if cursor is on first line.
+    select.cursorPos = function(container, start) {
+      var selection = container.ownerDocument.selection;
+      if (!selection) return null;
+
+      var topNode = select.selectionTopNode(container, start);
+      while (topNode && topNode.nodeName != "BR")
+        topNode = topNode.previousSibling;
+
+      var range = selection.createRange(), range2 = range.duplicate();
+      range.collapse(start);
+      if (topNode) {
+        range2.moveToElementText(topNode);
+        range2.collapse(false);
+      }
+      else {
+        // When nothing is selected, we can get all kinds of funky errors here.
+        try { range2.moveToElementText(container); }
+        catch (e) { return null; }
+        range2.collapse(true);
+      }
+      range.setEndPoint("StartToStart", range2);
+
+      return {node: topNode, offset: range.text.length};
+    };
+
+    select.setCursorPos = function(container, from, to) {
+      function rangeAt(pos) {
+        var range = container.ownerDocument.body.createTextRange();
+        if (!pos.node) {
+          range.moveToElementText(container);
+          range.collapse(true);
+        }
+        else {
+          range.moveToElementText(pos.node);
+          range.collapse(false);
+        }
+        range.move("character", pos.offset);
+        return range;
+      }
+
+      var range = rangeAt(from);
+      if (to && to != from)
+        range.setEndPoint("EndToEnd", rangeAt(to));
+      range.select();
+    }
+
+    // Some hacks for storing and re-storing the selection when the editor loses and regains focus.
+    select.selectionCoords = function (win) {
+      var selection = win.document.selection;
+      if (!selection) return null;
+      var start = selection.createRange(), end = start.duplicate();
+      start.collapse(true);
+      end.collapse(false);
+
+      var body = win.document.body;
+      return {start: {x: start.boundingLeft + body.scrollLeft - 1,
+                      y: start.boundingTop + body.scrollTop},
+              end: {x: end.boundingLeft + body.scrollLeft - 1,
+                    y: end.boundingTop + body.scrollTop}};
+    };
+
+    // Restore a stored selection.
+    select.selectCoords = function(win, coords) {
+      if (!coords) return;
+
+      var range1 = win.document.body.createTextRange(), range2 = range1.duplicate();
+      // This can fail for various hard-to-handle reasons.
+      try {
+        range1.moveToPoint(coords.start.x, coords.start.y);
+        range2.moveToPoint(coords.end.x, coords.end.y);
+        range1.setEndPoint("EndToStart", range2);
+        range1.select();
+      } catch(e) {}
+    };
+  }
+  // W3C model
+  else {
+    // Store start and end nodes, and offsets within these, and refer
+    // back to the selection object from those nodes, so that this
+    // object can be updated when the nodes are replaced before the
+    // selection is restored.
+    select.markSelection = function (win) {
+      var selection = win.getSelection();
+      if (!selection || selection.rangeCount == 0)
+        return (currentSelection = null);
+      var range = selection.getRangeAt(0);
+
+      currentSelection = {
+        start: {node: range.startContainer, offset: range.startOffset},
+        end: {node: range.endContainer, offset: range.endOffset},
+        window: win,
+        changed: false
+      };
+
+      // We want the nodes right at the cursor, not one of their
+      // ancestors with a suitable offset. This goes down the DOM tree
+      // until a 'leaf' is reached (or is it *up* the DOM tree?).
+      function normalize(point){
+        while (point.node.nodeType != 3 && point.node.nodeName != "BR") {
+          var newNode = point.node.childNodes[point.offset] || point.node.nextSibling;
+          point.offset = 0;
+          while (!newNode && point.node.parentNode) {
+            point.node = point.node.parentNode;
+            newNode = point.node.nextSibling;
+          }
+          point.node = newNode;
+          if (!newNode)
+            break;
+        }
+      }
+
+      normalize(currentSelection.start);
+      normalize(currentSelection.end);
+    };
+
+    select.selectMarked = function () {
+      if (!currentSelection || !currentSelection.changed) return;
+      var win = currentSelection.window, range = win.document.createRange();
+
+      function setPoint(point, which) {
+        if (point.node) {
+          // Some magic to generalize the setting of the start and end
+          // of a range.
+          if (point.offset == 0)
+            range["set" + which + "Before"](point.node);
+          else
+            range["set" + which](point.node, point.offset);
+        }
+        else {
+          range.setStartAfter(win.document.body.lastChild || win.document.body);
+        }
+      }
+
+      setPoint(currentSelection.end, "End");
+      setPoint(currentSelection.start, "Start");
+      selectRange(range, win);
+    };
+
+    // Helper for selecting a range object.
+    function selectRange(range, window) {
+      var selection = window.getSelection();
+      selection.removeAllRanges();
+      selection.addRange(range);
+    };
+    function selectionRange(window) {
+      var selection = window.getSelection();
+      if (!selection || selection.rangeCount == 0)
+        return false;
+      else
+        return selection.getRangeAt(0);
+    }
+
+    // Finding the top-level node at the cursor in the W3C is, as you
+    // can see, quite an involved process.
+    select.selectionTopNode = function(container, start) {
+      var range = selectionRange(container.ownerDocument.defaultView);
+      if (!range) return false;
+
+      var node = start ? range.startContainer : range.endContainer;
+      var offset = start ? range.startOffset : range.endOffset;
+      // Work around (yet another) bug in Opera's selection model.
+      if (window.opera && !start && range.endContainer == container && range.endOffset == range.startOffset + 1 &&
+          container.childNodes[range.startOffset] && container.childNodes[range.startOffset].nodeName == "BR")
+        offset--;
+
+      // For text nodes, we look at the node itself if the cursor is
+      // inside, or at the node before it if the cursor is at the
+      // start.
+      if (node.nodeType == 3){
+        if (offset > 0)
+          return topLevelNodeAt(node, container);
+        else
+          return topLevelNodeBefore(node, container);
+      }
+      // Occasionally, browsers will return the HTML node as
+      // selection. If the offset is 0, we take the start of the frame
+      // ('after null'), otherwise, we take the last node.
+      else if (node.nodeName == "HTML") {
+        return (offset == 1 ? null : container.lastChild);
+      }
+      // If the given node is our 'container', we just look up the
+      // correct node by using the offset.
+      else if (node == container) {
+        return (offset == 0) ? null : node.childNodes[offset - 1];
+      }
+      // In any other case, we have a regular node. If the cursor is
+      // at the end of the node, we use the node itself, if it is at
+      // the start, we use the node before it, and in any other
+      // case, we look up the child before the cursor and use that.
+      else {
+        if (offset == node.childNodes.length)
+          return topLevelNodeAt(node, container);
+        else if (offset == 0)
+          return topLevelNodeBefore(node, container);
+        else
+          return topLevelNodeAt(node.childNodes[offset - 1], container);
+      }
+    };
+
+    select.focusAfterNode = function(node, container) {
+      var win = container.ownerDocument.defaultView,
+          range = win.document.createRange();
+      range.setStartBefore(container.firstChild || container);
+      // In Opera, setting the end of a range at the end of a line
+      // (before a BR) will cause the cursor to appear on the next
+      // line, so we set the end inside of the start node when
+      // possible.
+      if (node && !node.firstChild)
+        range.setEndAfter(node);
+      else if (node)
+        range.setEnd(node, node.childNodes.length);
+      else
+        range.setEndBefore(container.firstChild || container);
+      range.collapse(false);
+      selectRange(range, win);
+    };
+
+    select.somethingSelected = function(win) {
+      var range = selectionRange(win);
+      return range && !range.collapsed;
+    };
+
+    function insertNodeAtCursor(window, node) {
+      var range = selectionRange(window);
+      if (!range) return;
+
+      range.deleteContents();
+      range.insertNode(node);
+      webkitLastLineHack(window.document.body);
+      range = window.document.createRange();
+      range.selectNode(node);
+      range.collapse(false);
+      selectRange(range, window);
+    }
+
+    select.insertNewlineAtCursor = function(window) {
+      insertNodeAtCursor(window, window.document.createElement("BR"));
+    };
+
+    select.insertTabAtCursor = function(window) {
+      insertNodeAtCursor(window, window.document.createTextNode(fourSpaces));
+    };
+
+    select.cursorPos = function(container, start) {
+      var range = selectionRange(window);
+      if (!range) return;
+
+      var topNode = select.selectionTopNode(container, start);
+      while (topNode && topNode.nodeName != "BR")
+        topNode = topNode.previousSibling;
+
+      range = range.cloneRange();
+      range.collapse(start);
+      if (topNode)
+        range.setStartAfter(topNode);
+      else
+        range.setStartBefore(container);
+      return {node: topNode, offset: range.toString().length};
+    };
+
+    select.setCursorPos = function(container, from, to) {
+      var win = container.ownerDocument.defaultView,
+          range = win.document.createRange();
+
+      function setPoint(node, offset, side) {
+        if (!node)
+          node = container.firstChild;
+        else
+          node = node.nextSibling;
+
+        if (!node)
+          return;
+
+        if (offset == 0) {
+          range["set" + side + "Before"](node);
+          return true;
+        }
+
+        var backlog = []
+        function decompose(node) {
+          if (node.nodeType == 3)
+            backlog.push(node);
+          else
+            forEach(node.childNodes, decompose);
+        }
+        while (true) {
+          while (node && !backlog.length) {
+            decompose(node);
+            node = node.nextSibling;
+          }
+          var cur = backlog.shift();
+          if (!cur) return false;
+
+          var length = cur.nodeValue.length;
+          if (length >= offset) {
+            range["set" + side](cur, offset);
+            return true;
+          }
+          offset -= length;
+        }
+      }
+
+      to = to || from;
+      if (setPoint(to.node, to.offset, "End") && setPoint(from.node, from.offset, "Start"))
+        selectRange(range, win);
+    };
+  }
+})();
--- a/public/javascripts/admin/plugins/codemirror/stringstream.js
+++ b/public/javascripts/admin/plugins/codemirror/stringstream.js
@ -0,0 +1,140 @@
+/* String streams are the things fed to parsers (which can feed them
+ * to a tokenizer if they want). They provide peek and next methods
+ * for looking at the current character (next 'consumes' this
+ * character, peek does not), and a get method for retrieving all the
+ * text that was consumed since the last time get was called.
+ *
+ * An easy mistake to make is to let a StopIteration exception finish
+ * the token stream while there are still characters pending in the
+ * string stream (hitting the end of the buffer while parsing a
+ * token). To make it easier to detect such errors, the stringstreams
+ * throw an exception when this happens.
+ */
+
+// Make a stringstream stream out of an iterator that returns strings.
+// This is applied to the result of traverseDOM (see codemirror.js),
+// and the resulting stream is fed to the parser.
+window.stringStream = function(source){
+  // String that's currently being iterated over.
+  var current = "";
+  // Position in that string.
+  var pos = 0;
+  // Accumulator for strings that have been iterated over but not
+  // get()-ed yet.
+  var accum = "";
+  // Make sure there are more characters ready, or throw
+  // StopIteration.
+  function ensureChars() {
+    while (pos == current.length) {
+      accum += current;
+      current = ""; // In case source.next() throws
+      pos = 0;
+      try {current = source.next();}
+      catch (e) {
+        if (e != StopIteration) throw e;
+        else return false;
+      }
+    }
+    return true;
+  }
+
+  return {
+    // Return the next character in the stream.
+    peek: function() {
+      if (!ensureChars()) return null;
+      return current.charAt(pos);
+    },
+    // Get the next character, throw StopIteration if at end, check
+    // for unused content.
+    next: function() {
+      if (!ensureChars()) {
+        if (accum.length > 0)
+          throw "End of stringstream reached without emptying buffer ('" + accum + "').";
+        else
+          throw StopIteration;
+      }
+      return current.charAt(pos++);
+    },
+    // Return the characters iterated over since the last call to
+    // .get().
+    get: function() {
+      var temp = accum;
+      accum = "";
+      if (pos > 0){
+        temp += current.slice(0, pos);
+        current = current.slice(pos);
+        pos = 0;
+      }
+      return temp;
+    },
+    // Push a string back into the stream.
+    push: function(str) {
+      current = current.slice(0, pos) + str + current.slice(pos);
+    },
+    lookAhead: function(str, consume, skipSpaces, caseInsensitive) {
+      function cased(str) {return caseInsensitive ? str.toLowerCase() : str;}
+      str = cased(str);
+      var found = false;
+
+      var _accum = accum, _pos = pos;
+      if (skipSpaces) this.nextWhileMatches(/[\s\u00a0]/);
+
+      while (true) {
+        var end = pos + str.length, left = current.length - pos;
+        if (end <= current.length) {
+          found = str == cased(current.slice(pos, end));
+          pos = end;
+          break;
+        }
+        else if (str.slice(0, left) == cased(current.slice(pos))) {
+          accum += current; current = "";
+          try {current = source.next();}
+          catch (e) {break;}
+          pos = 0;
+          str = str.slice(left);
+        }
+        else {
+          break;
+        }
+      }
+
+      if (!(found && consume)) {
+        current = accum.slice(_accum.length) + current;
+        pos = _pos;
+        accum = _accum;
+      }
+
+      return found;
+    },
+
+    // Utils built on top of the above
+    more: function() {
+      return this.peek() !== null;
+    },
+    applies: function(test) {
+      var next = this.peek();
+      return (next !== null && test(next));
+    },
+    nextWhile: function(test) {
+      var next;
+      while ((next = this.peek()) !== null && test(next))
+        this.next();
+    },
+    matches: function(re) {
+      var next = this.peek();
+      return (next !== null && re.test(next));
+    },
+    nextWhileMatches: function(re) {
+      var next;
+      while ((next = this.peek()) !== null && re.test(next))
+        this.next();
+    },
+    equals: function(ch) {
+      return ch === this.peek();
+    },
+    endOfLine: function() {
+      var next = this.peek();
+      return next == null || next == "\n";
+    }
+  };
+};
--- a/public/javascripts/admin/plugins/codemirror/tokenize.js
+++ b/public/javascripts/admin/plugins/codemirror/tokenize.js
@ -0,0 +1,57 @@
+// A framework for simple tokenizers. Takes care of newlines and
+// white-space, and of getting the text from the source stream into
+// the token object. A state is a function of two arguments -- a
+// string stream and a setState function. The second can be used to
+// change the tokenizer's state, and can be ignored for stateless
+// tokenizers. This function should advance the stream over a token
+// and return a string or object containing information about the next
+// token, or null to pass and have the (new) state be called to finish
+// the token. When a string is given, it is wrapped in a {style, type}
+// object. In the resulting object, the characters consumed are stored
+// under the content property. Any whitespace following them is also
+// automatically consumed, and added to the value property. (Thus,
+// content is the actual meaningful part of the token, while value
+// contains all the text it spans.)
+
+function tokenizer(source, state) {
+  // Newlines are always a separate token.
+  function isWhiteSpace(ch) {
+    // The messy regexp is because IE's regexp matcher is of the
+    // opinion that non-breaking spaces are no whitespace.
+    return ch != "\n" && /^[\s\u00a0]*$/.test(ch);
+  }
+
+  var tokenizer = {
+    state: state,
+
+    take: function(type) {
+      if (typeof(type) == "string")
+        type = {style: type, type: type};
+
+      type.content = (type.content || "") + source.get();
+      if (!/\n$/.test(type.content))
+        source.nextWhile(isWhiteSpace);
+      type.value = type.content + source.get();
+      return type;
+    },
+
+    next: function () {
+      if (!source.more()) throw StopIteration;
+
+      var type;
+      if (source.equals("\n")) {
+        source.next();
+        return this.take("whitespace");
+      }
+      
+      if (source.applies(isWhiteSpace))
+        type = "whitespace";
+      else
+        while (!type)
+          type = this.state(source, function(s) {tokenizer.state = s;});
+
+      return this.take(type);
+    }
+  };
+  return tokenizer;
+}
--- a/public/javascripts/admin/plugins/codemirror/tokenizejavascript.js
+++ b/public/javascripts/admin/plugins/codemirror/tokenizejavascript.js
@ -0,0 +1,175 @@
+/* Tokenizer for JavaScript code */
+
+var tokenizeJavaScript = (function() {
+  // Advance the stream until the given character (not preceded by a
+  // backslash) is encountered, or the end of the line is reached.
+  function nextUntilUnescaped(source, end) {
+    var escaped = false;
+    var next;
+    while (!source.endOfLine()) {
+      var next = source.next();
+      if (next == end && !escaped)
+        return false;
+      escaped = !escaped && next == "\\";
+    }
+    return escaped;
+  }
+
+  // A map of JavaScript's keywords. The a/b/c keyword distinction is
+  // very rough, but it gives the parser enough information to parse
+  // correct code correctly (we don't care that much how we parse
+  // incorrect code). The style information included in these objects
+  // is used by the highlighter to pick the correct CSS style for a
+  // token.
+  var keywords = function(){
+    function result(type, style){
+      return {type: type, style: "js-" + style};
+    }
+    // keywords that take a parenthised expression, and then a
+    // statement (if)
+    var keywordA = result("keyword a", "keyword");
+    // keywords that take just a statement (else)
+    var keywordB = result("keyword b", "keyword");
+    // keywords that optionally take an expression, and form a
+    // statement (return)
+    var keywordC = result("keyword c", "keyword");
+    var operator = result("operator", "keyword");
+    var atom = result("atom", "atom");
+    return {
+      "if": keywordA, "while": keywordA, "with": keywordA,
+      "else": keywordB, "do": keywordB, "try": keywordB, "finally": keywordB,
+      "return": keywordC, "break": keywordC, "continue": keywordC, "new": keywordC, "delete": keywordC, "throw": keywordC,
+      "in": operator, "typeof": operator, "instanceof": operator,
+      "var": result("var", "keyword"), "function": result("function", "keyword"), "catch": result("catch", "keyword"),
+      "for": result("for", "keyword"), "switch": result("switch", "keyword"),
+      "case": result("case", "keyword"), "default": result("default", "keyword"),
+      "true": atom, "false": atom, "null": atom, "undefined": atom, "NaN": atom, "Infinity": atom
+    };
+  }();
+
+  // Some helper regexps
+  var isOperatorChar = /[+\-*&%\/=<>!?|]/;
+  var isHexDigit = /[0-9A-Fa-f]/;
+  var isWordChar = /[\w\$_]/;
+
+  // Wrapper around jsToken that helps maintain parser state (whether
+  // we are inside of a multi-line comment and whether the next token
+  // could be a regular expression).
+  function jsTokenState(inside, regexp) {
+    return function(source, setState) {
+      var newInside = inside;
+      var type = jsToken(inside, regexp, source, function(c) {newInside = c;});
+      var newRegexp = type.type == "operator" || type.type == "keyword c" || type.type.match(/^[\[{}\(,;:]$/);
+      if (newRegexp != regexp || newInside != inside)
+        setState(jsTokenState(newInside, newRegexp));
+      return type;
+    };
+  }
+
+  // The token reader, inteded to be used by the tokenizer from
+  // tokenize.js (through jsTokenState). Advances the source stream
+  // over a token, and returns an object containing the type and style
+  // of that token.
+  function jsToken(inside, regexp, source, setInside) {
+    function readHexNumber(){
+      source.next(); // skip the 'x'
+      source.nextWhileMatches(isHexDigit);
+      return {type: "number", style: "js-atom"};
+    }
+
+    function readNumber() {
+      source.nextWhileMatches(/[0-9]/);
+      if (source.equals(".")){
+        source.next();
+        source.nextWhileMatches(/[0-9]/);
+      }
+      if (source.equals("e") || source.equals("E")){
+        source.next();
+        if (source.equals("-"))
+          source.next();
+        source.nextWhileMatches(/[0-9]/);
+      }
+      return {type: "number", style: "js-atom"};
+    }
+    // Read a word, look it up in keywords. If not found, it is a
+    // variable, otherwise it is a keyword of the type found.
+    function readWord() {
+      source.nextWhileMatches(isWordChar);
+      var word = source.get();
+      var known = keywords.hasOwnProperty(word) && keywords.propertyIsEnumerable(word) && keywords[word];
+      return known ? {type: known.type, style: known.style, content: word} :
+      {type: "variable", style: "js-variable", content: word};
+    }
+    function readRegexp() {
+      nextUntilUnescaped(source, "/");
+      source.nextWhileMatches(/[gi]/);
+      return {type: "regexp", style: "js-string"};
+    }
+    // Mutli-line comments are tricky. We want to return the newlines
+    // embedded in them as regular newline tokens, and then continue
+    // returning a comment token for every line of the comment. So
+    // some state has to be saved (inside) to indicate whether we are
+    // inside a /* */ sequence.
+    function readMultilineComment(start){
+      var newInside = "/*";
+      var maybeEnd = (start == "*");
+      while (true) {
+        if (source.endOfLine())
+          break;
+        var next = source.next();
+        if (next == "/" && maybeEnd){
+          newInside = null;
+          break;
+        }
+        maybeEnd = (next == "*");
+      }
+      setInside(newInside);
+      return {type: "comment", style: "js-comment"};
+    }
+    function readOperator() {
+      source.nextWhileMatches(isOperatorChar);
+      return {type: "operator", style: "js-operator"};
+    }
+    function readString(quote) {
+      var endBackSlash = nextUntilUnescaped(source, quote);
+      setInside(endBackSlash ? quote : null);
+      return {type: "string", style: "js-string"};
+    }
+
+    // Fetch the next token. Dispatches on first character in the
+    // stream, or first two characters when the first is a slash.
+    if (inside == "\"" || inside == "'")
+      return readString(inside);
+    var ch = source.next();
+    if (inside == "/*")
+      return readMultilineComment(ch);
+    else if (ch == "\"" || ch == "'")
+      return readString(ch);
+    // with punctuation, the type of the token is the symbol itself
+    else if (/[\[\]{}\(\),;\:\.]/.test(ch))
+      return {type: ch, style: "js-punctuation"};
+    else if (ch == "0" && (source.equals("x") || source.equals("X")))
+      return readHexNumber();
+    else if (/[0-9]/.test(ch))
+      return readNumber();
+    else if (ch == "/"){
+      if (source.equals("*"))
+      { source.next(); return readMultilineComment(ch); }
+      else if (source.equals("/"))
+      { nextUntilUnescaped(source, null); return {type: "comment", style: "js-comment"};}
+      else if (regexp)
+        return readRegexp();
+      else
+        return readOperator();
+    }
+    else if (isOperatorChar.test(ch))
+      return readOperator();
+    else
+      return readWord();
+  }
+
+  // The external interface to the tokenizer.
+  return function(source, startState) {
+    return tokenizer(source, startState || jsTokenState(false, true));
+  };
+})();
--- a/public/javascripts/admin/plugins/codemirror/undo.js
+++ b/public/javascripts/admin/plugins/codemirror/undo.js
@ -0,0 +1,403 @@
+/**
+ * Storage and control for undo information within a CodeMirror
+ * editor. 'Why on earth is such a complicated mess required for
+ * that?', I hear you ask. The goal, in implementing this, was to make
+ * the complexity of storing and reverting undo information depend
+ * only on the size of the edited or restored content, not on the size
+ * of the whole document. This makes it necessary to use a kind of
+ * 'diff' system, which, when applied to a DOM tree, causes some
+ * complexity and hackery.
+ *
+ * In short, the editor 'touches' BR elements as it parses them, and
+ * the History stores these. When nothing is touched in commitDelay
+ * milliseconds, the changes are committed: It goes over all touched
+ * nodes, throws out the ones that did not change since last commit or
+ * are no longer in the document, and assembles the rest into zero or
+ * more 'chains' -- arrays of adjacent lines. Links back to these
+ * chains are added to the BR nodes, while the chain that previously
+ * spanned these nodes is added to the undo history. Undoing a change
+ * means taking such a chain off the undo history, restoring its
+ * content (text is saved per line) and linking it back into the
+ * document.
+ */
+
+// A history object needs to know about the DOM container holding the
+// document, the maximum amount of undo levels it should store, the
+// delay (of no input) after which it commits a set of changes, and,
+// unfortunately, the 'parent' window -- a window that is not in
+// designMode, and on which setTimeout works in every browser.
+function History(container, maxDepth, commitDelay, editor, onChange) {
+  this.container = container;
+  this.maxDepth = maxDepth; this.commitDelay = commitDelay;
+  this.editor = editor; this.parent = editor.parent;
+  this.onChange = onChange;
+  // This line object represents the initial, empty editor.
+  var initial = {text: "", from: null, to: null};
+  // As the borders between lines are represented by BR elements, the
+  // start of the first line and the end of the last one are
+  // represented by null. Since you can not store any properties
+  // (links to line objects) in null, these properties are used in
+  // those cases.
+  this.first = initial; this.last = initial;
+  // Similarly, a 'historyTouched' property is added to the BR in
+  // front of lines that have already been touched, and 'firstTouched'
+  // is used for the first line.
+  this.firstTouched = false;
+  // History is the set of committed changes, touched is the set of
+  // nodes touched since the last commit.
+  this.history = []; this.redoHistory = []; this.touched = [];
+}
+
+History.prototype = {
+  // Schedule a commit (if no other touches come in for commitDelay
+  // milliseconds).
+  scheduleCommit: function() {
+    var self = this;
+    this.parent.clearTimeout(this.commitTimeout);
+    this.commitTimeout = this.parent.setTimeout(function(){self.tryCommit();}, this.commitDelay);
+  },
+
+  // Mark a node as touched. Null is a valid argument.
+  touch: function(node) {
+    this.setTouched(node);
+    this.scheduleCommit();
+  },
+
+  // Undo the last change.
+  undo: function() {
+    // Make sure pending changes have been committed.
+    this.commit();
+
+    if (this.history.length) {
+      // Take the top diff from the history, apply it, and store its
+      // shadow in the redo history.
+      var item = this.history.pop();
+      this.redoHistory.push(this.updateTo(item, "applyChain"));
+      if (this.onChange) this.onChange();
+      return this.chainNode(item);
+    }
+  },
+
+  // Redo the last undone change.
+  redo: function() {
+    this.commit();
+    if (this.redoHistory.length) {
+      // The inverse of undo, basically.
+      var item = this.redoHistory.pop();
+      this.addUndoLevel(this.updateTo(item, "applyChain"));
+      if (this.onChange) this.onChange();
+      return this.chainNode(item);
+    }
+  },
+
+  clear: function() {
+    this.history = [];
+    this.redoHistory = [];
+  },
+
+  // Ask for the size of the un/redo histories.
+  historySize: function() {
+    return {undo: this.history.length, redo: this.redoHistory.length};
+  },
+
+  // Push a changeset into the document.
+  push: function(from, to, lines) {
+    var chain = [];
+    for (var i = 0; i < lines.length; i++) {
+      var end = (i == lines.length - 1) ? to : this.container.ownerDocument.createElement("BR");
+      chain.push({from: from, to: end, text: cleanText(lines[i])});
+      from = end;
+    }
+    this.pushChains([chain], from == null && to == null);
+  },
+
+  pushChains: function(chains, doNotHighlight) {
+    this.commit(doNotHighlight);
+    this.addUndoLevel(this.updateTo(chains, "applyChain"));
+    this.redoHistory = [];
+  },
+
+  // Retrieve a DOM node from a chain (for scrolling to it after undo/redo).
+  chainNode: function(chains) {
+    for (var i = 0; i < chains.length; i++) {
+      var start = chains[i][0], node = start && (start.from || start.to);
+      if (node) return node;
+    }
+  },
+
+  // Clear the undo history, make the current document the start
+  // position.
+  reset: function() {
+    this.history = []; this.redoHistory = [];
+  },
+
+  textAfter: function(br) {
+    return this.after(br).text;
+  },
+
+  nodeAfter: function(br) {
+    return this.after(br).to;
+  },
+
+  nodeBefore: function(br) {
+    return this.before(br).from;
+  },
+
+  // Commit unless there are pending dirty nodes.
+  tryCommit: function() {
+    if (!window.History) return; // Stop when frame has been unloaded
+    if (this.editor.highlightDirty()) this.commit(true);
+    else this.scheduleCommit();
+  },
+
+  // Check whether the touched nodes hold any changes, if so, commit
+  // them.
+  commit: function(doNotHighlight) {
+    this.parent.clearTimeout(this.commitTimeout);
+    // Make sure there are no pending dirty nodes.
+    if (!doNotHighlight) this.editor.highlightDirty(true);
+    // Build set of chains.
+    var chains = this.touchedChains(), self = this;
+
+    if (chains.length) {
+      this.addUndoLevel(this.updateTo(chains, "linkChain"));
+      this.redoHistory = [];
+      if (this.onChange) this.onChange();
+    }
+  },
+
+  // [ end of public interface ]
+
+  // Update the document with a given set of chains, return its
+  // shadow. updateFunc should be "applyChain" or "linkChain". In the
+  // second case, the chains are taken to correspond the the current
+  // document, and only the state of the line data is updated. In the
+  // first case, the content of the chains is also pushed iinto the
+  // document.
+  updateTo: function(chains, updateFunc) {
+    var shadows = [], dirty = [];
+    for (var i = 0; i < chains.length; i++) {
+      shadows.push(this.shadowChain(chains[i]));
+      dirty.push(this[updateFunc](chains[i]));
+    }
+    if (updateFunc == "applyChain")
+      this.notifyDirty(dirty);
+    return shadows;
+  },
+
+  // Notify the editor that some nodes have changed.
+  notifyDirty: function(nodes) {
+    forEach(nodes, method(this.editor, "addDirtyNode"))
+    this.editor.scheduleHighlight();
+  },
+
+  // Link a chain into the DOM nodes (or the first/last links for null
+  // nodes).
+  linkChain: function(chain) {
+    for (var i = 0; i < chain.length; i++) {
+      var line = chain[i];
+      if (line.from) line.from.historyAfter = line;
+      else this.first = line;
+      if (line.to) line.to.historyBefore = line;
+      else this.last = line;
+    }
+  },
+
+  // Get the line object after/before a given node.
+  after: function(node) {
+    return node ? node.historyAfter : this.first;
+  },
+  before: function(node) {
+    return node ? node.historyBefore : this.last;
+  },
+
+  // Mark a node as touched if it has not already been marked.
+  setTouched: function(node) {
+    if (node) {
+      if (!node.historyTouched) {
+        this.touched.push(node);
+        node.historyTouched = true;
+      }
+    }
+    else {
+      this.firstTouched = true;
+    }
+  },
+
+  // Store a new set of undo info, throw away info if there is more of
+  // it than allowed.
+  addUndoLevel: function(diffs) {
+    this.history.push(diffs);
+    if (this.history.length > this.maxDepth)
+      this.history.shift();
+  },
+
+  // Build chains from a set of touched nodes.
+  touchedChains: function() {
+    var self = this;
+
+    // The temp system is a crummy hack to speed up determining
+    // whether a (currently touched) node has a line object associated
+    // with it. nullTemp is used to store the object for the first
+    // line, other nodes get it stored in their historyTemp property.
+    var nullTemp = null;
+    function temp(node) {return node ? node.historyTemp : nullTemp;}
+    function setTemp(node, line) {
+      if (node) node.historyTemp = line;
+      else nullTemp = line;
+    }
+
+    function buildLine(node) {
+      var text = [];
+      for (var cur = node ? node.nextSibling : self.container.firstChild;
+           cur && cur.nodeName != "BR"; cur = cur.nextSibling)
+        if (cur.currentText) text.push(cur.currentText);
+      return {from: node, to: cur, text: cleanText(text.join(""))};
+    }
+
+    // Filter out unchanged lines and nodes that are no longer in the
+    // document. Build up line objects for remaining nodes.
+    var lines = [];
+    if (self.firstTouched) self.touched.push(null);
+    forEach(self.touched, function(node) {
+      if (node && node.parentNode != self.container) return;
+
+      if (node) node.historyTouched = false;
+      else self.firstTouched = false;
+
+      var line = buildLine(node), shadow = self.after(node);
+      if (!shadow || shadow.text != line.text || shadow.to != line.to) {
+        lines.push(line);
+        setTemp(node, line);
+      }
+    });
+
+    // Get the BR element after/before the given node.
+    function nextBR(node, dir) {
+      var link = dir + "Sibling", search = node[link];
+      while (search && search.nodeName != "BR")
+        search = search[link];
+      return search;
+    }
+
+    // Assemble line objects into chains by scanning the DOM tree
+    // around them.
+    var chains = []; self.touched = [];
+    forEach(lines, function(line) {
+      // Note that this makes the loop skip line objects that have
+      // been pulled into chains by lines before them.
+      if (!temp(line.from)) return;
+
+      var chain = [], curNode = line.from, safe = true;
+      // Put any line objects (referred to by temp info) before this
+      // one on the front of the array.
+      while (true) {
+        var curLine = temp(curNode);
+        if (!curLine) {
+          if (safe) break;
+          else curLine = buildLine(curNode);
+        }
+        chain.unshift(curLine);
+        setTemp(curNode, null);
+        if (!curNode) break;
+        safe = self.after(curNode);
+        curNode = nextBR(curNode, "previous");
+      }
+      curNode = line.to; safe = self.before(line.from);
+      // Add lines after this one at end of array.
+      while (true) {
+        if (!curNode) break;
+        var curLine = temp(curNode);
+        if (!curLine) {
+          if (safe) break;
+          else curLine = buildLine(curNode);
+        }
+        chain.push(curLine);
+        setTemp(curNode, null);
+        safe = self.before(curNode);
+        curNode = nextBR(curNode, "next");
+      }
+      chains.push(chain);
+    });
+
+    return chains;
+  },
+
+  // Find the 'shadow' of a given chain by following the links in the
+  // DOM nodes at its start and end.
+  shadowChain: function(chain) {
+    var shadows = [], next = this.after(chain[0].from), end = chain[chain.length - 1].to;
+    while (true) {
+      shadows.push(next);
+      var nextNode = next.to;
+      if (!nextNode || nextNode == end)
+        break;
+      else
+        next = nextNode.historyAfter || this.before(end);
+      // (The this.before(end) is a hack -- FF sometimes removes
+      // properties from BR nodes, in which case the best we can hope
+      // for is to not break.)
+    }
+    return shadows;
+  },
+
+  // Update the DOM tree to contain the lines specified in a given
+  // chain, link this chain into the DOM nodes.
+  applyChain: function(chain) {
+    // Some attempt is made to prevent the cursor from jumping
+    // randomly when an undo or redo happens. It still behaves a bit
+    // strange sometimes.
+    var cursor = select.cursorPos(this.container, false), self = this;
+
+    // Remove all nodes in the DOM tree between from and to (null for
+    // start/end of container).
+    function removeRange(from, to) {
+      var pos = from ? from.nextSibling : self.container.firstChild;
+      while (pos != to) {
+        var temp = pos.nextSibling;
+        removeElement(pos);
+        pos = temp;
+      }
+    }
+
+    var start = chain[0].from, end = chain[chain.length - 1].to;
+    // Clear the space where this change has to be made.
+    removeRange(start, end);
+
+    // Insert the content specified by the chain into the DOM tree.
+    for (var i = 0; i < chain.length; i++) {
+      var line = chain[i];
+      // The start and end of the space are already correct, but BR
+      // tags inside it have to be put back.
+      if (i > 0)
+        self.container.insertBefore(line.from, end);
+
+      // Add the text.
+      var node = makePartSpan(fixSpaces(line.text), this.container.ownerDocument);
+      self.container.insertBefore(node, end);
+      // See if the cursor was on this line. Put it back, adjusting
+      // for changed line length, if it was.
+      if (cursor && cursor.node == line.from) {
+        var cursordiff = 0;
+        var prev = this.after(line.from);
+        if (prev && i == chain.length - 1) {
+          // Only adjust if the cursor is after the unchanged part of
+          // the line.
+          for (var match = 0; match < cursor.offset &&
+               line.text.charAt(match) == prev.text.charAt(match); match++);
+          if (cursor.offset > match)
+            cursordiff = line.text.length - prev.text.length;
+        }
+        select.setCursorPos(this.container, {node: line.from, offset: Math.max(0, cursor.offset + cursordiff)});
+      }
+      // Cursor was in removed line, this is last new line.
+      else if (cursor && (i == chain.length - 1) && cursor.node && cursor.node.parentNode != this.container) {
+        select.setCursorPos(this.container, {node: line.from, offset: line.text.length});
+      }
+    }
+
+    // Anchor the chain in the DOM tree.
+    this.linkChain(chain);
+    return start;
+  }
+};
--- a/public/javascripts/admin/plugins/codemirror/util.js
+++ b/public/javascripts/admin/plugins/codemirror/util.js
@ -0,0 +1,125 @@
+/* A few useful utility functions. */
+
+var internetExplorer = document.selection && window.ActiveXObject && /MSIE/.test(navigator.userAgent);
+var webkit = /AppleWebKit/.test(navigator.userAgent);
+var safari = /Apple Computers, Inc/.test(navigator.vendor);
+
+// Capture a method on an object.
+function method(obj, name) {
+  return function() {obj[name].apply(obj, arguments);};
+}
+
+// The value used to signal the end of a sequence in iterators.
+var StopIteration = {toString: function() {return "StopIteration"}};
+
+// Apply a function to each element in a sequence.
+function forEach(iter, f) {
+  if (iter.next) {
+    try {while (true) f(iter.next());}
+    catch (e) {if (e != StopIteration) throw e;}
+  }
+  else {
+    for (var i = 0; i < iter.length; i++)
+      f(iter[i]);
+  }
+}
+
+// Map a function over a sequence, producing an array of results.
+function map(iter, f) {
+  var accum = [];
+  forEach(iter, function(val) {accum.push(f(val));});
+  return accum;
+}
+
+// Create a predicate function that tests a string againsts a given
+// regular expression. No longer used but might be used by 3rd party
+// parsers.
+function matcher(regexp){
+  return function(value){return regexp.test(value);};
+}
+
+// Test whether a DOM node has a certain CSS class. Much faster than
+// the MochiKit equivalent, for some reason.
+function hasClass(element, className){
+  var classes = element.className;
+  return classes && new RegExp("(^| )" + className + "($| )").test(classes);
+}
+
+// Insert a DOM node after another node.
+function insertAfter(newNode, oldNode) {
+  var parent = oldNode.parentNode;
+  parent.insertBefore(newNode, oldNode.nextSibling);
+  return newNode;
+}
+
+function removeElement(node) {
+  if (node.parentNode)
+    node.parentNode.removeChild(node);
+}
+
+function clearElement(node) {
+  while (node.firstChild)
+    node.removeChild(node.firstChild);
+}
+
+// Check whether a node is contained in another one.
+function isAncestor(node, child) {
+  while (child = child.parentNode) {
+    if (node == child)
+      return true;
+  }
+  return false;
+}
+
+// The non-breaking space character.
+var nbsp = "\u00a0";
+var matching = {"{": "}", "[": "]", "(": ")",
+                "}": "{", "]": "[", ")": "("};
+
+// Standardize a few unportable event properties.
+function normalizeEvent(event) {
+  if (!event.stopPropagation) {
+    event.stopPropagation = function() {this.cancelBubble = true;};
+    event.preventDefault = function() {this.returnValue = false;};
+  }
+  if (!event.stop) {
+    event.stop = function() {
+      this.stopPropagation();
+      this.preventDefault();
+    };
+  }
+
+  if (event.type == "keypress") {
+    event.code = (event.charCode == null) ? event.keyCode : event.charCode;
+    event.character = String.fromCharCode(event.code);
+  }
+  return event;
+}
+
+// Portably register event handlers.
+function addEventHandler(node, type, handler, removeFunc) {
+  function wrapHandler(event) {
+    handler(normalizeEvent(event || window.event));
+  }
+  if (typeof node.addEventListener == "function") {
+    node.addEventListener(type, wrapHandler, false);
+    if (removeFunc) return function() {node.removeEventListener(type, wrapHandler, false);};
+  }
+  else {
+    node.attachEvent("on" + type, wrapHandler);
+    if (removeFunc) return function() {node.detachEvent("on" + type, wrapHandler);};
+  }
+}
+
+function nodeText(node) {
+  return node.innerText || node.textContent || node.nodeValue || "";
+}
+
+function nodeTop(node) {
+  var top = 0;
+  while (node.offsetParent) {
+    top += node.offsetTop;
+    node = node.offsetParent;
+  }
+  return top;
+}
--- a/public/javascripts/admin/plugins/cookie.js
+++ b/public/javascripts/admin/plugins/cookie.js
@ -0,0 +1,96 @@
+/**
+ * Cookie plugin
+ *
+ * Copyright (c) 2006 Klaus Hartl (stilbuero.de)
+ * Dual licensed under the MIT and GPL licenses:
+ * http://www.opensource.org/licenses/mit-license.php
+ * http://www.gnu.org/licenses/gpl.html
+ *
+ */
+
+/**
+ * Create a cookie with the given name and value and other optional parameters.
+ *
+ * @example $.cookie('the_cookie', 'the_value');
+ * @desc Set the value of a cookie.
+ * @example $.cookie('the_cookie', 'the_value', { expires: 7, path: '/', domain: 'jquery.com', secure: true });
+ * @desc Create a cookie with all available options.
+ * @example $.cookie('the_cookie', 'the_value');
+ * @desc Create a session cookie.
+ * @example $.cookie('the_cookie', null);
+ * @desc Delete a cookie by passing null as value. Keep in mind that you have to use the same path and domain
+ *       used when the cookie was set.
+ *
+ * @param String name The name of the cookie.
+ * @param String value The value of the cookie.
+ * @param Object options An object literal containing key/value pairs to provide optional cookie attributes.
+ * @option Number|Date expires Either an integer specifying the expiration date from now on in days or a Date object.
+ *                             If a negative value is specified (e.g. a date in the past), the cookie will be deleted.
+ *                             If set to null or omitted, the cookie will be a session cookie and will not be retained
+ *                             when the the browser exits.
+ * @option String path The value of the path atribute of the cookie (default: path of page that created the cookie).
+ * @option String domain The value of the domain attribute of the cookie (default: domain of page that created the cookie).
+ * @option Boolean secure If true, the secure attribute of the cookie will be set and the cookie transmission will
+ *                        require a secure protocol (like HTTPS).
+ * @type undefined
+ *
+ * @name $.cookie
+ * @cat Plugins/Cookie
+ * @author Klaus Hartl/klaus.hartl@stilbuero.de
+ */
+
+/**
+ * Get the value of a cookie with the given name.
+ *
+ * @example $.cookie('the_cookie');
+ * @desc Get the value of a cookie.
+ *
+ * @param String name The name of the cookie.
+ * @return The value of the cookie.
+ * @type String
+ *
+ * @name $.cookie
+ * @cat Plugins/Cookie
+ * @author Klaus Hartl/klaus.hartl@stilbuero.de
+ */
+jQuery.cookie = function(name, value, options) {
+    if (typeof value != 'undefined') { // name and value given, set cookie
+        options = options || {};
+        if (value === null) {
+            value = '';
+            options.expires = -1;
+        }
+        var expires = '';
+        if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString)) {
+            var date;
+            if (typeof options.expires == 'number') {
+                date = new Date();
+                date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000));
+            } else {
+                date = options.expires;
+            }
+            expires = '; expires=' + date.toUTCString(); // use expires attribute, max-age is not supported by IE
+        }
+        // CAUTION: Needed to parenthesize options.path and options.domain
+        // in the following expressions, otherwise they evaluate to undefined
+        // in the packed version for some reason...
+        var path = options.path ? '; path=' + (options.path) : '';
+        var domain = options.domain ? '; domain=' + (options.domain) : '';
+        var secure = options.secure ? '; secure' : '';
+        document.cookie = [name, '=', encodeURIComponent(value), expires, path, domain, secure].join('');
+    } else { // only name given, get cookie
+        var cookieValue = null;
+        if (document.cookie && document.cookie != '') {
+            var cookies = document.cookie.split(';');
+            for (var i = 0; i < cookies.length; i++) {
+                var cookie = jQuery.trim(cookies[i]);
+                // Does this cookie string begin with the name we want?
+                if (cookie.substring(0, name.length + 1) == (name + '=')) {
+                    cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
+                    break;
+                }
+            }
+        }
+        return cookieValue;
+    }
+};
--- a/public/javascripts/admin/snippets.js
+++ b/public/javascripts/admin/snippets.js
@ -0,0 +1,16 @@
+$(document).ready(function() {
+	
+	// automatic slug from snippet name
+	$('#snippet_name').keypress(function() {
+		var input = $(this);
+		var slug = $('#snippet_slug');
+	
+		if (!slug.hasClass('filled')) {
+			setTimeout(function() {
+				slug.val(input.val().replace(' ', '_').toLowerCase());
+			}, 50);
+		}
+	});
+	
+	$('#snippet_slug').keypress(function() { $(this).addClass('filled'); });
+});
--- a/public/stylesheets/admin/application.css
+++ b/public/stylesheets/admin/application.css
@ -160,8 +160,9 @@ div#uploadAssetsInputQueue { display: none; }
 	background: white;
 }

+#pages-list ul { list-style: none; margin: 10px 0 10px 40px; padding: 0; }
+
 #pages-list li {
-	height: 31px;
 	margin-bottom: 10px;	
 	position: relative;
 	clear: both;
@ -175,6 +176,11 @@ div#uploadAssetsInputQueue { display: none; }
 	width: 18px;
 }

+#pages-list ul.folder li em {
+	background-position: left -31px;
+	cursor: move;
+}
+
 #pages-list li .toggler { 
 	position: absolute;
 	top: 9px;
@ -217,24 +223,8 @@ div#uploadAssetsInputQueue { display: none; }
 	outline: none;
 }

-#pages-list li.error .more { top: 16px; }
-
-
-#pages-list li.depth-1 { margin-left: 40px; }
-#pages-list li.depth-1.index { margin-left: 0px; }
-#pages-list li.depth-1.error { border-top: 1px dotted #bbbbbd; padding-top: 10px; margin-left: 0px; }
-
-#pages-list li.depth-2 { margin-left: 80px; }
-#pages-list li.depth-2.index { margin-left: 40px; }
-
-#pages-list li.depth-3 { margin-left: 120px; }
-#pages-list li.depth-3.index { margin-left: 80px; }
-
-#pages-list li.depth-4 { margin-left: 160px; }
-#pages-list li.depth-4.index { margin-left: 120px; }
-
-#pages-list li.depth-5 { margin-left: 200px; }
-#pages-list li.depth-5.index { margin-left: 160px; }
+#pages-list li.not-found { border-top: 1px dotted #bbbbbd; padding-top: 10px; margin-left: 0px; }
+#pages-list li.not-found .more { top: 16px; }

 /* ___ Progress bar ___ */

--- a/public/stylesheets/admin/plugins/codemirror/csscolors.css
+++ b/public/stylesheets/admin/plugins/codemirror/csscolors.css
@ -0,0 +1,48 @@
+.editbox {
+  margin: .4em;
+  padding: 0;
+  font-family: monospace;
+  font-size: 10pt;
+  color: black;
+	background: white url(../../images/admin/form/field.png) repeat-x 0 0 !important;
+}
+
+pre.code, .editbox {
+  color: #666666;
+}
+
+.editbox p {
+  margin: 0;
+}
+
+span.css-at {
+  color: #770088;
+}
+
+span.css-unit {
+  color: #228811;
+}
+
+span.css-value {
+  color: #770088;
+}
+
+span.css-identifier {
+  color: black;
+}
+
+span.css-important {
+  color: #0000FF;
+}
+
+span.css-colorcode {
+  color: #004499;
+}
+
+span.css-comment {
+  color: #AA7700;
+}
+
+span.css-string {
+  color: #AA2222;
+}
--- a/public/stylesheets/admin/plugins/codemirror/docs.css
+++ b/public/stylesheets/admin/plugins/codemirror/docs.css
@ -0,0 +1,46 @@
+body {
+  margin: 0;
+  padding: 3em 6em;
+  color: black;
+  max-width: 50em;
+}
+
+h1 {
+  font-size: 22pt;
+}
+
+.underline {
+  border-bottom: 3px solid #C44;
+}
+
+h2 {
+  font-size: 14pt;
+}
+
+p.rel {
+  padding-left: 2em;
+  text-indent: -2em;
+}
+
+div.border {
+  border: 1px solid black;
+  padding: 3px;
+}
+
+code {
+  font-family: courier, monospace;
+  font-size: 90%;
+  color: #144;
+}
+
+pre.code {
+  margin: 1.1em 12px;
+  border: 1px solid #CCCCCC;
+  color: black;
+  padding: .4em;
+  font-family: courier, monospace;
+}
+
+.warn {
+  color: #C00;
+}
--- a/public/stylesheets/admin/plugins/codemirror/javascriptcolors.css
+++ b/public/stylesheets/admin/plugins/codemirror/javascriptcolors.css
@ -0,0 +1,56 @@
+.editbox {
+  margin: .4em;
+  padding: 0;
+  font-family: monospace;
+  font-size: 10pt;
+  color: black;
+	background: white url(../../images/admin/form/field.png) repeat-x 0 0 !important;
+}
+
+pre.code, .editbox {
+  color: #666666;
+}
+
+.editbox p {
+  margin: 0;
+}
+
+span.js-punctuation {
+  color: #666666;
+}
+
+span.js-operator {
+  color: #666666;
+}
+
+span.js-keyword {
+  color: #770088;
+}
+
+span.js-atom {
+  color: #228811;
+}
+
+span.js-variable {
+  color: black;
+}
+
+span.js-variabledef {
+  color: #0000FF;
+}
+
+span.js-localvariable {
+  color: #004499;
+}
+
+span.js-property {
+  color: black;
+}
+
+span.js-comment {
+  color: #AA7700;
+}
+
+span.js-string {
+  color: #AA2222;
+}
--- a/public/stylesheets/admin/plugins/codemirror/liquidcolors.css
+++ b/public/stylesheets/admin/plugins/codemirror/liquidcolors.css
@ -0,0 +1,35 @@
+span.liquid-punctuation {
+  color: silver;
+}
+
+span.liquid-bad-punctuation {
+  color: red;
+  text-decoration: underline;
+}
+
+span.liquid-text {
+  color: black;
+}
+
+span.liquid-variable {
+  color: magenta;
+}
+
+span.liquid-string {
+  color: green;
+}
+
+span.liquid-tag-name {
+  color: green;
+  font-weight: bold;
+}
+
+span.liquid-keyword {
+  color: black;
+  font-weight: bold;
+}
+
+span.liquid-tag-name {
+  color: black;
+  font-weight: bold;
+}
--- a/public/stylesheets/admin/plugins/codemirror/people.jpg
+++ b/public/stylesheets/admin/plugins/codemirror/people.jpg
--- a/public/stylesheets/admin/plugins/codemirror/sparqlcolors.css
+++ b/public/stylesheets/admin/plugins/codemirror/sparqlcolors.css
@ -0,0 +1,39 @@
+.editbox {
+  margin: .4em;
+  padding: 0;
+  font-family: monospace;
+  font-size: 10pt;
+  color: black;
+}
+
+.editbox p {
+  margin: 0;
+}
+
+span.sp-keyword {
+  color: #708;
+}
+
+span.sp-prefixed {
+  color: #5d1;
+}
+
+span.sp-var {
+  color: #00c;
+}
+
+span.sp-comment {
+  color: #a70;
+}
+
+span.sp-literal {
+  color: #a22;
+}
+
+span.sp-uri {
+  color: #292;
+}
+
+span.sp-operator {
+  color: #088;
+}
--- a/public/stylesheets/admin/plugins/codemirror/xmlcolors.css
+++ b/public/stylesheets/admin/plugins/codemirror/xmlcolors.css
@ -0,0 +1,52 @@
+.editbox {
+  margin: .4em;
+  padding: 0;
+  font-family: monospace;
+  font-size: 10pt;
+  color: black;
+	background: white url(../../images/admin/form/field.png) repeat-x 0 0 !important;
+}
+
+.editbox p {
+  margin: 0;
+}
+
+span.xml-tagname {
+  color: #A0B;
+}
+
+span.xml-attribute {
+  color: #281;
+}
+
+span.xml-punctuation {
+  color: black;
+}
+
+span.xml-attname {
+  color: #00F;
+}
+
+span.xml-comment {
+  color: #A70;
+}
+
+span.xml-cdata {
+  color: #48A;
+}
+
+span.xml-processing {
+  color: #999;
+}
+
+span.xml-entity {
+  color: #A22;
+}
+
+span.xml-error {
+  color: #F00;
+}
+
+span.xml-text {
+  color: black;
+}
--- a/spec/factories.rb
+++ b/spec/factories.rb
@ -19,4 +19,35 @@ Factory.define :page do |p|
  p.association :site, :factory => :site
  p.title 'Home page'
  p.slug 'index'
+end
+
+## Liquid templates ##
+Factory.define :liquid_template do |t|
+  t.association :site, :factory => :site
+  t.name 'Simple one'
+  t.slug 'simple_one'
+  t.value %{simple liquid template}
+end
+
+## Layouts ##
+Factory.define :layout do |l|
+  l.association :site, :factory => :site
+  l.name '1 main column + sidebar'
+  l.value %{<html>
+    <head>
+      <title>Hello world !</title>
+    </head>
+    <body>
+      <div id="main">\{\{ content_for_layout \}\}</div>
+      <div id="sidebar">\{\{ content_for_sidebar "Left Sidebar"\}\}</div>
+    </body>
+  </html>}
+end
+
+## Snippets ##
+Factory.define :snippet do |s|
+  s.association :site, :factory => :site
+  s.name 'My website title'
+  s.slug 'header'
+  s.value %{<title>Acme</title}
 end
--- a/spec/models/layout_spec.rb
+++ b/spec/models/layout_spec.rb
@ -0,0 +1,35 @@
+require 'spec_helper'
+ 
+describe Layout do
+  
+  it 'should have a valid factory' do
+    Factory.build(:layout).should be_valid
+  end
+  
+  ## validations ##
+  
+  it 'should validate presence of content_for_layout in value' do
+    layout = Factory.build(:layout, :value => 'without content_for_layout')
+    layout.should_not be_valid
+    layout.errors[:value].should == ["should contain 'content_for_layout' liquid tag"]
+  end
+  
+  describe 'once created' do
+    
+    before(:each) do
+      @layout = Factory(:layout)
+    end
+    
+    it 'should have 2 parts' do
+      @layout.parts.count.should == 2
+      
+      @layout.parts.first.name.should == 'Body'
+      @layout.parts.first.slug.should == 'layout'
+      
+      @layout.parts.last.name.should == 'Left Sidebar'
+      @layout.parts.last.slug.should == 'sidebar'
+    end
+    
+  end
+  
+end
--- a/spec/models/liquid_template_spec.rb
+++ b/spec/models/liquid_template_spec.rb
@ -0,0 +1,19 @@
+require 'spec_helper'
+ 
+describe LiquidTemplate do
+  
+  it 'should have a valid factory' do
+    Factory.build(:liquid_template).should be_valid
+  end
+  
+  # Validations ##
+  
+  %w{site name slug value}.each do |field|
+    it "should validate presence of #{field}" do
+      template = Factory.build(:liquid_template, field.to_sym => nil)
+      template.should_not be_valid
+      template.errors[field.to_sym].should == ["can't be blank"]
+    end
+  end
+
+end
--- a/spec/models/page_spec.rb
+++ b/spec/models/page_spec.rb
@ -6,9 +6,9 @@ describe Page do
    Factory.build(:page).should be_valid
  end
  
-  ## Validations ##
+  # Validations ##
  
-  %w{site title slug}.each do |field|
+  %w{site title}.each do |field|
    it "should validate presence of #{field}" do
      page = Factory.build(:page, field.to_sym => nil)
      page.should_not be_valid
@ -16,6 +16,12 @@ describe Page do
    end
  end
  
+  it 'should validate presence of slug' do
+    page = Factory.build(:page, :title => nil, :slug => nil)
+    page.should_not be_valid
+    page.errors[:slug].should == ["can't be blank"]
+  end
+  
  it 'should validate uniqueness of slug' do
    page = Factory(:page)
    (page = Factory.build(:page, :site => page.site)).should_not be_valid
@ -30,14 +36,19 @@ describe Page do
    end
  end
  
-  ## Named scopes ##
+  # Named scopes ##
  
-  ## Associations ##
+  # Associations ##
    
-  ## Methods ##
+  # Methods ##
  
  describe 'once created' do
  
+    it 'should tell if the page is the index one' do
+      Factory.build(:page, :slug => 'index', :site => nil).index?.should be_true
+      Factory.build(:page, :slug => 'index', :depth => 1, :site => nil).index?.should be_false
+    end
+      
    it 'should add the body part' do
      page = Factory(:page)
      page.parts.should_not be_empty
@ -48,6 +59,10 @@ describe Page do
      page = Factory.build(:page, :slug => ' Valid  ité.html ')
      page.valid?
      page.slug.should == 'Valid_ite'
+      
+      page = Factory.build(:page, :title => ' Valid  ité.html ', :slug => nil, :site => page.site)
+      page.should be_valid
+      page.slug.should == 'Valid_ite'
    end
    
  end
@ -56,7 +71,7 @@ describe Page do
    
    before(:each) do
      @home = Factory(:page)      
-      @child_1 = Factory(:page, :title => 'Subpage 1', :slug => 'foo', :parent => @home, :site => @home.site)
+      @child_1 = Factory(:page, :title => 'Subpage 1', :slug => 'foo', :parent_id => @home._id, :site => @home.site)
    end
    
    it 'should add root elements' do
@ -71,32 +86,61 @@ describe Page do
      Page.first.children.should == [@child_1, child_2]
    end
    
-    it 'should generate a route from parents' do
+    it 'should move its children accordingly' do
+      sub_child_1 = Factory(:page, :title => 'Sub Subpage 1', :slug => 'bar', :parent => @child_1, :site => @home.site)
+      archives = Factory(:page, :title => 'archives', :slug => 'archives', :parent => @home, :site => @home.site)
+      posts = Factory(:page, :title => 'posts', :slug => 'posts', :parent => archives, :site => @home.site)
+      
+      @child_1.parent_id = archives._id
+      @child_1.save
+      
+      @child_1.position.should == 2
+      @home.reload.children.count.should == 1
+      
+      archives.reload.children.count.should == 2
+      archives.children.last.depth.should == 2
+      archives.children.last.position.should == 2
+      archives.children.last.children.first.depth.should == 3
+    end
+    
+    it 'should generate a route / url from parents' do
+      @home.route.should == 'index'
+      @home.url.should == 'http://acme.example.com/index.html'
+      
+      @child_1.route.should == 'foo'
+      @child_1.url.should == 'http://acme.example.com/foo.html'
+      
      nested_page = Factory(:page, :title => 'Sub sub page 1', :slug => 'bar', :parent => @child_1, :site => @home.site)
-      nested_page.route.should == 'index/foo/bar'
+      nested_page.route.should == 'foo/bar'
+      nested_page.url.should == 'http://acme.example.com/foo/bar.html'
+    end
+    
+    it 'should destroy descendants as well' do
+      Factory(:page, :title => 'Sub Subpage 1', :slug => 'bar', :parent_id => @child_1._id, :site => @home.site)
+      @child_1.destroy
+      Page.where(:slug => 'bar').first.should be_nil
    end
    
  end
    
  describe 'acts as list' do
-    
-    before(:each) do
-      @home = Factory(:page)
-      @child_1 = Factory(:page, :title => 'Subpage 1', :slug => 'foo', :parent => @home, :site => @home.site)
-      @child_2 = Factory(:page, :title => 'Subpage 2', :slug => 'bar', :parent => @home, :site => @home.site)  
-      @child_3 = Factory(:page, :title => 'Subpage 3', :slug => 'acme', :parent => @home, :site => @home.site)
-    end
-    
-    it 'should be at the bottom of the folder once created' do
-      [@child_1, @child_2, @child_3].each_with_index { |c, i| c.position.should == i + 1 }
-    end
-    
-    it 'should have its position updated if a sibling is removed' do
-      @child_2.destroy
-      [@child_1, @child_3.reload].each_with_index { |c, i| c.position.should == i + 1 }
-    end
-    
-  end
-    
-    
+     
+     before(:each) do
+       @home = Factory(:page)
+       @child_1 = Factory(:page, :title => 'Subpage 1', :slug => 'foo', :parent => @home, :site => @home.site)
+       @child_2 = Factory(:page, :title => 'Subpage 2', :slug => 'bar', :parent => @home, :site => @home.site)  
+       @child_3 = Factory(:page, :title => 'Subpage 3', :slug => 'acme', :parent => @home, :site => @home.site)
+     end
+     
+     it 'should be at the bottom of the folder once created' do
+       [@child_1, @child_2, @child_3].each_with_index { |c, i| c.position.should == i + 1 }
+     end
+     
+     it 'should have its position updated if a sibling is removed' do
+       @child_2.destroy
+       [@child_1, @child_3.reload].each_with_index { |c, i| c.position.should == i + 1 }
+     end
+     
+   end
+      
 end
--- a/spec/models/snippet_spec.rb
+++ b/spec/models/snippet_spec.rb
@ -0,0 +1,9 @@
+require 'spec_helper'
+ 
+describe Snippet do
+  
+  it 'should have a valid factory' do
+    Factory.build(:snippet).should be_valid
+  end
+  
+end