Show YAML Content

alagu · Jun 6, 2013 · 2b5a2bf · 2b5a2bf
1 parent d919964
commit 2b5a2bf
Show file tree

Hide file tree

Showing 6 changed files with 132 additions and 3 deletions.
diff --git a/lib/pagoda/app.rb b/lib/pagoda/app.rb
@@ -102,6 +102,13 @@ def update_post(params)
       @title   = post.data['title']
       @content = post.content
       @name    = post.name
+
+      @data_array = []
+
+      post.data.each do |key, value|
+        @data_array << {'key' => key, 'value' => value}
+      end
+
       if post.data['published'] == false
         @draft = true
       end

diff --git a/lib/pagoda/public/css/pagoda.css b/lib/pagoda/public/css/pagoda.css
@@ -211,6 +211,55 @@ code {
 #publish-bar .sub-menu li {
   margin: 0 0 15px 0;
 }
+#publish-bar .yaml-block {
+  display: inline-block;
+}
+#publish-bar .yaml-block .yaml-table {
+  position: absolute;
+  border: 1px solid #444;
+  background-color: #fff;
+  top: -110px;
+  left: 40px;
+  -webkit-border-radius: 2px;
+  -moz-border-radius: 2px;
+  -ms-border-radius: 2px;
+  -o-border-radius: 2px;
+  border-radius: 2px;
+  -webkit-box-shadow: rgba(68, 68, 68, 0.9) 0 0 5px;
+  -moz-box-shadow: rgba(68, 68, 68, 0.9) 0 0 5px;
+  box-shadow: rgba(68, 68, 68, 0.9) 0 0 5px;
+  padding: 0px;
+}
+#publish-bar .yaml-block .yaml-table ul {
+  margin: 0;
+  padding: 0;
+}
+#publish-bar .yaml-block .yaml-table ul li .key input, #publish-bar .yaml-block .yaml-table ul li .value input {
+  width: 100px;
+  border: 0 none;
+  margin: 0;
+  padding: 0;
+  color: #333;
+  font-family: 'Titillium Web', sans-serif;
+  font-size: 14px;
+  padding-left: 4px;
+}
+#publish-bar .yaml-block .yaml-table ul li .key, #publish-bar .yaml-block .yaml-table ul li .value {
+  border-bottom: 1px solid #777;
+  margin: 0;
+  padding: 0;
+  padding-bottom: 2px;
+  display: inline-block;
+}
+#publish-bar .yaml-block .yaml-table ul li .key {
+  border-right: 1px solid #777;
+}
+#publish-bar .yaml-block .yaml-table ul li .value {
+  margin-left: -3px;
+}
+#publish-bar .yaml-block .yaml-table ul li:last-child .key, #publish-bar .yaml-block .yaml-table ul li:last-child .value {
+  border-bottom: 0 none;
+}
 
 #publish-bar input[type=submit],
 #publish-bar a,

diff --git a/lib/pagoda/public/css/pagoda.scss b/lib/pagoda/public/css/pagoda.scss
@@ -208,6 +208,63 @@ code {
     .sub-menu li {
       margin: 0 0 15px 0;
     }
+
+  .yaml-block {
+    display: inline-block;
+
+    .yaml-table {
+      position: absolute;
+      border: 1px solid #444;
+      background-color: #fff;
+      top: -110px;
+      left: 40px;
+      @include border-radius(2px);
+      @include box-shadow(rgba(#444, 0.9) 0 0 5px);
+      padding: 0px;
+
+      ul {
+        margin: 0;
+        padding: 0;
+
+        li {
+
+
+          .key input, .value input {
+            width: 100px;
+            border: 0 none;
+            margin: 0;
+            padding: 0;
+            color: #333;
+            font-family: 'Titillium Web', sans-serif;
+            font-size: 14px;
+            padding-left: 4px;
+          }
+
+          .key, .value {
+            border-bottom: 1px solid #777;
+            margin: 0;
+            padding: 0;
+            padding-bottom: 2px;
+            display: inline-block;
+          }
+
+          .key {
+            border-right: 1px solid #777;
+          }
+
+          .value {
+            margin-left: -3px;
+          }
+
+          &:last-child {
+            .key, .value {
+              border-bottom: 0 none;
+            } 
+          }
+        }
+      }
+    }
+  }
 }
 
 #publish-bar input[type=submit],

diff --git a/lib/pagoda/templates/edit.mustache b/lib/pagoda/templates/edit.mustache
@@ -2,15 +2,30 @@
 <body class="admin posts edit">
   <div id="admin">
     <div id="save"></div>
-
     <form accept-charset="UTF-8" action="{{base_url}}/save-post" class="edit_post" method="post">
       {{>editor_area}}
       <div id="publish-bar-hover">
         <div id="publish-bar">
           <div class="contain">
             <div class="left">
               <a href="{{base_url}}/">&laquo; ADMIN</a>
-              <a href="{{base_url}}/delete/{{ name }}" class="delete-bar delete-button" >DELETE</a>
+              {{alagu}}
+              <div class="yaml-block">
+                <div class="yaml-table">
+                  <div class="yaml-table-inner">
+                  <ul>
+                  {{#data_array}}
+                    <li>
+                      <div class="key"><input type="text" value="{{key}}" /></div>
+                      <div class="value"><input type="text" value="{{value}}"/></div>
+                  {{/data_array}}
+                  </ul>
+                  </div>
+                  <div class="yaml-arrow">
+                  </div>
+                </div>
+                <a id="#" class="button">DATA</a>
+              </div>
             </div>
             <div class="right">
 

diff --git a/lib/pagoda/templates/layout.mustache b/lib/pagoda/templates/layout.mustache
@@ -6,7 +6,7 @@
 
   <link rel="stylesheet" type="text/css" href="{{base_url}}/css/pagoda.css" media="screen, projection">
   <link rel="stylesheet" type="text/css" href="{{base_url}}/css/tiptip.css" media="screen, projection">
-  <link href='http://fonts.googleapis.com/css?family=Lato:300,900|Asap' rel='stylesheet' type='text/css' />
+  <link href='http://fonts.googleapis.com/css?family=Lato:300,900|Asap|Titillium+Web' rel='stylesheet' type='text/css' />
   <link rel="apple-touch-icon" href="{{base_url}}/images/apple-touch-icon.png" />
 
 

diff --git a/lib/pagoda/views/edit.rb b/lib/pagoda/views/edit.rb
@@ -5,6 +5,7 @@ class Edit < Layout
       attr_accessor :content
       attr_accessor :name
       attr_accessor :draft
+      attr_accessor :data_array
 
     end
   end