milk 0.0.9 → 0.1.0

data/{lib/milk → site_template/lib}/fields/page_chooser.rb

@@ -1,7 +1,7 @@
 module Milk::Fields
   class PageChooser < Milk::Field
     @@pages = []
-    Dir.glob(Milk::PAGES_DIR + "/*.yaml").each do |page|
+    Dir.glob(Milk::DATA_DIR + "/pages/*.yaml").each do |page|
       pagename = File.basename(page, '.yaml').rpartition('/').last.gsub('.','/')
       @@pages << {
         file: page,

data/{lib/milk → site_template/lib}/fields/sprite_chooser.rb

@@ -4,7 +4,7 @@ module Milk::Fields
     def initialize(*args)
       super(*args)
       @sprites = []
-      open(Milk::COMPONENTS_DIR+"/sprites.sass") do |sass|
+      open(Milk::TEMPLATE_DIR+"/view.sass") do |sass|
         sass.each do |line|
           if match = @icon_classes.match(line)
             @sprites << {

data/site_template/public/js/edit.js

@@ -0,0 +1,121 @@
+function on_click_sprite(e)
+{
+  // Look up some useful variables
+  var current = e.currentTarget;
+  var sprite_select = $(current.parentNode);
+  var peers = $(".sprite-option", sprite_select);
+  var hidden_input = $('input', sprite_select)[0];
+  var inner_span = $('span', current)[0];
+
+  // Set the value on the hidden input
+  hidden_input.value = inner_span.title;
+
+  // Move the highlight        
+  peers.removeClass('ui-state-highlight');
+  $(current).addClass('ui-state-highlight');
+  update_preview(50);
+}
+
+function jsonify(form)
+{
+  var data = {}
+  $("input, textarea, select", form).each(function (i, field){
+    var parts = field.name.split(':');
+    var root = data;
+    var part = parts[0];
+    var numeric_regexp = /[0-9]+/;
+    for(i=0;i<parts.length-1;i++)
+    {
+      if (!root[part])
+      {
+        if (numeric_regexp.test(part))
+          root[part]={};
+        else
+          root[part]=[];
+      }
+      root = root[part];
+      part = parts[i + 1];
+    }
+    value = field.value
+    if (field.type == 'checkbox')
+    {
+      value = field.checked;
+    }
+    root[part] = value;
+  });
+  console.log(data);
+  return $.toJSON(data);
+}
+
+function do_update_preview()
+{
+  var preview = $("#preview");
+  $("body").addClass("busy")
+  $.ajax({
+    type: "POST",
+    url: $("form")[0].action,
+    contentType: "application/json",
+    data: jsonify($("form")[0]),
+    success: function(msg){
+      preview.html(msg);
+      $("body").removeClass("busy")
+    }
+  });
+}
+
+function update_preview(timeout)
+{
+  clearTimeout(window.preview_timeout);
+  window.preview_timeout = setTimeout(do_update_preview, timeout);
+}
+
+
+$(function() {
+  $("#left").resizable({handles: "e", resize: function(event, ui) {
+    $("#divider").css("left", ui.size.width);
+    $("#preview").css("left", ui.size.width+5);
+  }});
+  $(".sub-fields").accordion({
+    collapsible: true,
+    autoHeight: false,
+    active: false
+  });
+  var sections = $("#fields").accordion({
+    autoHeight: false
+  });
+  
+  $(".sprite-option").click(on_click_sprite);
+ $(".toolitem, .sprite-option")
+  .addClass("ui-state-default ui-corner-all")
+  .hover(
+    function() { $(this).addClass('ui-state-hover'); },
+    function() { $(this).removeClass('ui-state-hover'); }
+  );
+  $("#fields select, #fields input, #fields textarea").change(function(){
+    update_preview(100);
+  });
+  $("#fields select, #fields input, #fields textarea").keyup(function(){
+    update_preview(1000);
+  });
+  $("#save_button").click(function(){
+    $.ajax({
+      type: "PUT",
+      url: $("form")[0].action,
+      contentType: "application/json",
+      data: jsonify($("form")[0]),
+      success: function(msg){
+        window.location = $("form")[0].action.replace('https://', 'http://');
+      }
+    });
+  });
+  
+  $("#cancel_button").click(function(){
+    window.location = $("form")[0].action.replace('https://', 'http://');
+  });
+  $("#logout_button").click(function(){
+    window.location = "/logout?dest="+$("form")[0].action.replace('https://', 'http://');
+  });
+  
+});
+
+

data/site_template/public/js/form_validate.js

@@ -0,0 +1,51 @@
+function form_validate(form)
+{
+  var good = true;
+  $(".form_field", form).each(function(i,tr){
+    var field = $("input,textarea,select", tr);
+    console.log(field);
+    var required = $(tr).hasClass('required');
+    var message = "";
+    var value = field[0].value;
+    if (value)
+    {
+      if (field.hasClass("email_field"))
+      {
+        console.log("Validating email");
+        var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
+        if (!filter.test(value))
+        {
+          message = "Please enter a valid email address";
+        }
+      }
+      else if (field.hasClass("phone_field"))
+      {
+        console.log("Validating phone");
+        var stripped = value.replace(/[\s()+\-]|ext\.?/gi, "");
+        // 10 is the minimum number of numbers required
+        if (!(/\d{10,}/i).test(stripped))
+        {
+          message = "Please enter a valid phone number with area code";
+        }
+      }
+    }
+    else if (required)
+    {
+      message = "This is a required field";
+    }
+    var message_area = $(".error_message", tr);
+    message_area.html(message);
+    if (message === "")
+    {
+      message_area.hide();
+    }
+    else
+    {
+      good = false;
+      message_area.show();
+    }
+  });
+  console.log(good);
+  return false;
+
+}

data/site_template/public/js/login.js

@@ -0,0 +1,9 @@
+$(function() {
+ $("button")
+  .addClass("ui-state-default ui-corner-all")
+  .hover(
+    function() { $(this).addClass('ui-state-hover'); },
+    function() { $(this).removeClass('ui-state-hover'); }
+  );
+});
+

data/site_template/public/style/960.css

@@ -0,0 +1,96 @@
+.container_12 { margin-left: auto; margin-right: auto; width: 960px; }
+.container_12 .grid_3 { width: 220px; }
+.container_12 .grid_6 { width: 460px; }
+.container_12 .grid_9 { width: 700px; }
+.container_12 .grid_12 { width: 940px; }
+.container_12 .grid_1 { width: 60px; }
+.container_12 .grid_2 { width: 140px; }
+.container_12 .grid_4 { width: 300px; }
+.container_12 .grid_5 { width: 380px; }
+.container_12 .grid_7 { width: 540px; }
+.container_12 .grid_8 { width: 620px; }
+.container_12 .grid_10 { width: 780px; }
+.container_12 .grid_11 { width: 860px; }
+.container_12 .prefix_3 { padding-left: 240px; }
+.container_12 .prefix_6 { padding-left: 480px; }
+.container_12 .prefix_9 { padding-left: 720px; }
+.container_12 .prefix_1 { padding-left: 80px; }
+.container_12 .prefix_2 { padding-left: 160px; }
+.container_12 .prefix_4 { padding-left: 320px; }
+.container_12 .prefix_5 { padding-left: 400px; }
+.container_12 .prefix_7 { padding-left: 560px; }
+.container_12 .prefix_8 { padding-left: 640px; }
+.container_12 .prefix_10 { padding-left: 800px; }
+.container_12 .prefix_11 { padding-left: 880px; }
+.container_12 .suffix_3 { padding-right: 240px; }
+.container_12 .suffix_6 { padding-right: 480px; }
+.container_12 .suffix_9 { padding-right: 720px; }
+.container_12 .suffix_1 { padding-right: 80px; }
+.container_12 .suffix_2 { padding-right: 160px; }
+.container_12 .suffix_4 { padding-right: 320px; }
+.container_12 .suffix_5 { padding-right: 400px; }
+.container_12 .suffix_7 { padding-right: 560px; }
+.container_12 .suffix_8 { padding-right: 640px; }
+.container_12 .suffix_10 { padding-right: 800px; }
+.container_12 .suffix_11 { padding-right: 880px; }
+
+.container_16 { margin-left: auto; margin-right: auto; width: 960px; }
+.container_16 .grid_4 { width: 220px; }
+.container_16 .grid_8 { width: 460px; }
+.container_16 .grid_12 { width: 700px; }
+.container_16 .grid_16 { width: 940px; }
+.container_16 .grid_1 { width: 40px; }
+.container_16 .grid_2 { width: 100px; }
+.container_16 .grid_3 { width: 160px; }
+.container_16 .grid_5 { width: 280px; }
+.container_16 .grid_6 { width: 340px; }
+.container_16 .grid_7 { width: 400px; }
+.container_16 .grid_9 { width: 520px; }
+.container_16 .grid_10 { width: 580px; }
+.container_16 .grid_11 { width: 640px; }
+.container_16 .grid_13 { width: 760px; }
+.container_16 .grid_14 { width: 820px; }
+.container_16 .grid_15 { width: 880px; }
+.container_16 .prefix_4 { padding-left: 240px; }
+.container_16 .prefix_8 { padding-left: 480px; }
+.container_16 .prefix_12 { padding-left: 720px; }
+.container_16 .prefix_1 { padding-left: 60px; }
+.container_16 .prefix_2 { padding-left: 120px; }
+.container_16 .prefix_3 { padding-left: 180px; }
+.container_16 .prefix_5 { padding-left: 300px; }
+.container_16 .prefix_6 { padding-left: 360px; }
+.container_16 .prefix_7 { padding-left: 420px; }
+.container_16 .prefix_9 { padding-left: 540px; }
+.container_16 .prefix_10 { padding-left: 600px; }
+.container_16 .prefix_11 { padding-left: 660px; }
+.container_16 .prefix_13 { padding-left: 780px; }
+.container_16 .prefix_14 { padding-left: 840px; }
+.container_16 .prefix_15 { padding-left: 900px; }
+.container_16 .suffix_4 { padding-right: 240px; }
+.container_16 .suffix_8 { padding-right: 480px; }
+.container_16 .suffix_12 { padding-right: 720px; }
+.container_16 .suffix_1 { padding-right: 60px; }
+.container_16 .suffix_2 { padding-right: 120px; }
+.container_16 .suffix_3 { padding-right: 180px; }
+.container_16 .suffix_5 { padding-right: 300px; }
+.container_16 .suffix_6 { padding-right: 360px; }
+.container_16 .suffix_7 { padding-right: 420px; }
+.container_16 .suffix_9 { padding-right: 540px; }
+.container_16 .suffix_10 { padding-right: 600px; }
+.container_16 .suffix_11 { padding-right: 660px; }
+.container_16 .suffix_13 { padding-right: 780px; }
+.container_16 .suffix_14 { padding-right: 840px; }
+.container_16 .suffix_15 { padding-right: 900px; }
+
+.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12, .grid_13, .grid_14, .grid_15, .grid_16 { display: inline; float: left; margin-left: 10px; margin-right: 10px; }
+
+.alpha { margin-left: 0; }
+
+.omega { margin-right: 0; }
+
+.clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; }
+
+.clearfix { display: inline-block; display: block; }
+.clearfix:after { clear: both; content: ' '; display: block; font-size: 0; line-height: 0; visibility: hidden; width: 0; height: 0; }
+
+* html .clearfix { height: 1%; }

data/site_template/public/style/edit.css

@@ -0,0 +1,29 @@
+body, html { border: 0; margin: 0; padding: 0; }
+
+body.busy { cursor: busy; }
+
+div.component:hover { border: 10px solid #08f; }
+
+#admin-title { position: absolute; margin: 0; top: 5px; left: 10px; line-height: 1em; font-size: 20px; font-family: monaco,monospace; }
+
+#toolbar { position: absolute; left: 0; bottom: 0; right: 0; padding: 3px; }
+#toolbar .toolitem { font-size: 12px; cursor: pointer; line-height: 1em; padding: 2px 5px 2px 2px; }
+#toolbar .toolitem .ui-icon { float: left; line-height: 1em; }
+
+#frame { position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; }
+
+#left { font-size: 11px; position: absolute; top: 0px; left: 0px; width: 250px; bottom: 0px; }
+#left h4 { font-size: 14px; }
+#left h3 { font-size: 13px; }
+
+#divider { position: absolute; top: 0px; left: 250px; width: 5px; bottom: 0px; }
+
+#fields { position: absolute; top: 0px; bottom: 35px; overflow: auto; left: 0px; right: 0; }
+#fields .ui-accordion-content { padding: 10px; }
+#fields .ui-accordion-content h4 { margin: 0; }
+#fields .ui-accordion-content .field-content { margin-bottom: 10px; }
+#fields .ui-accordion-content .field-content input { width: 95%; padding: 2px; }
+#fields .ui-accordion-content .field-content textarea { width: 100%; min-height: 330px; }
+#fields .ui-accordion-content .field-content .sprite-select .sprite-option { padding: 4px; margin: 2px; float: left; cursor: pointer; }
+
+#preview { position: absolute; top: 0px; left: 255px; right: 0; width: auto; bottom: 0px; overflow: auto; }

data/site_template/public/style/login.css

@@ -0,0 +1,12 @@
+table, #shadow, .ui-widget-shadow { width: 400px; height: 160px; }
+
+table#login, #shadow { font-size: 15px; position: absolute; top: 50%; left: 50%; margin-top: -80px; margin-left: -200px; }
+
+table#login td, table#login th { vertical-align: middle; }
+
+#login tr.ui-state-error { font-size: 12px; }
+#login tr.ui-state-error td { padding: 5px 10px; }
+#login tr.ui-state-error span { float: left; margin-right: 0.3em; }
+#login .ui-widget-header { line-height: 2em; height: 2em; }
+#login button { font-size: 12px; cursor: pointer; line-height: 1em; padding: 2px 5px 2px 2px; }
+#login button .ui-icon { float: left; line-height: 1em; }

data/site_template/public/style/reset.css

@@ -0,0 +1,33 @@
+html { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
+
+body { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; line-height: 1; }
+
+div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
+
+blockquote { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; quotes: none; }
+blockquote:before, blockquote:after { content: ''; content: none; }
+
+pre, a, abbr, acronym, address, big, cite, code { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
+
+del { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; text-decoration: line-through; }
+
+dfn, em, font, img { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
+
+ins { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; text-decoration: none; }
+
+kbd { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
+
+q { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; quotes: none; }
+q:before, q:after { content: ''; content: none; }
+
+s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
+
+ol, ul { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; list-style: none; }
+
+li, fieldset, form, label, legend { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
+
+table { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; border-collapse: collapse; border-spacing: 0; }
+
+caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
+
+html :focus { outline: 0; }

data/site_template/public/style/text.css

@@ -0,0 +1,25 @@
+body { font: 13px/1.5 Helvetica,Arial,'Liberation Sans',FreeSans,sans-serif; }
+
+a:focus { outline: 1px dotted invert; }
+
+hr { border: 0 #ccc solid; border-top-width: 1px; clear: both; height: 0; margin-bottom: 20px; }
+
+h1 { font-size: 25px; margin-bottom: 20px; }
+
+h2 { font-size: 23px; margin-bottom: 20px; }
+
+h3 { font-size: 21px; margin-bottom: 20px; }
+
+h4 { font-size: 19px; margin-bottom: 20px; }
+
+h5 { font-size: 17px; margin-bottom: 20px; }
+
+h6 { font-size: 15px; margin-bottom: 20px; }
+
+ol { list-style: decimal; margin-bottom: 20px; }
+
+ul { list-style: disc; margin-bottom: 20px; }
+
+li { margin-left: 30px; }
+
+p, dl, pre, table, address, fieldset { margin-bottom: 20px; }

data/site_template/public/style/view.css

@@ -0,0 +1,10 @@
+#admin { color: #999; text-align: right; }
+#admin a, #admin a:visited, #admin a:active, #admin a:link { color: #08f; }
+
+#head { margin-top: 20px; margin-bottom: 20px; }
+#head li { list-style-type: none; margin: 0; }
+#head li a { color: #08f; text-decoration: none; border: 1px solid #999; text-align: center; font-weight: bold; background-color: #222; float: left; margin: 0 13px 0 0; padding: 8px 15px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; }
+#head li a:hover { background-color: #8af; color: #000; }
+#head li a.active { background-color: #8fa; color: #000; }
+
+#foot { font-size: 90%; color: #888; }

data/site_template/templates/dependencies.haml

@@ -0,0 +1,8 @@
+- list.each do |resource|
+  - case resource.rpartition('.').last.to_sym
+    - when :js
+      %script{:src=>resource, :type=>"text/javascript"}
+    - when :css
+      %link{:href=>resource, :media=>"screen", :rel=>"stylesheet", :type=>"text/css"}/
+    - when :ico
+      %link{:href=>resource, :rel=>'shortcut icon', :type=>'image/x-icon'}

data/site_template/templates/edit.haml

@@ -0,0 +1,38 @@
+!!! xml
+!!! 1.1
+%html{:xmlns =>"http://www.w3.org/1999/xhtml"}
+  %head
+    %title&= "Editing \"#{@pagename}\""
+    = render_dependencies
+  %body
+    #frame
+      #left
+        .ui-widget-overlay
+        %form#fields{:method => "post", :action => "/"+@pagename}
+          %h3
+            %a{:href => "#"} Page Settings
+          %div
+            %input{:type=>"hidden", :name=>"class", :value=>self.class.to_s}
+            -to_yaml_properties.each do |name|
+              - next if name == :@components
+              - fieldname = name.to_s.sub('@','')
+              .field
+                %h4= fieldname.capitalize + ":"
+                .field-content
+                  %input{:type=>"text", :name=>fieldname, :value=>instance_variable_get(name)}
+          -@components.each_with_index do |component, i|
+            = component.edit("components:#{i}")
+        #toolbar{:class=>'ui-widget ui-widget-header'}
+          %button#save_button.toolitem{:title=>'Save changes and go to live page.'}
+            %span{:class=>'ui-icon ui-icon-disk'}
+            Save
+          %button#cancel_button.toolitem{:title=>'Cancel changes and go to live page.'}
+            %span{:class=>'ui-icon ui-icon-cancel'}
+            Cancel
+          %button#logout_button.toolitem{:title=>'Cancel changes and logout and go to live page.'}
+            %span{:class=>'ui-icon ui-icon-locked'}
+            Logout
+      #preview
+        = preview
+      #divider.ui-widget-header
+