Inline editing of markdown files

css/daux-blue.css

@@ -6576,6 +6576,34 @@ body {
   }
 }
 /* ===========================================================================================
+Markdown editor
+============================================================================================== */
+.editor {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  background: white;
+  padding: 20px;
+  padding-bottom: 100px;
+  min-height: 100%;
+  height: auto;
+  display: none;
+}
+.editor h3 {
+  width: 100%!important;
+}
+#markdown_editor {
+  width: 85%;
+  margin: 0 auto;
+  padding: 10px;
+  height: auto;
+  font-size: 16px;
+  min-height: 100px;
+  font-family: "Ubuntu Mono", "Consolas", monospace;
+  display: block;
+}
+/* ===========================================================================================
 Componenets
 ============================================================================================== */
 a {
@@ -6732,8 +6760,7 @@ code {
 .page-header h1 {
   margin-top: 0px;
 }
-/* To be applied to the  same element as page-header for sites that have sub-heading content such as Last modified time */
+.page-header sub-heading {
-.page-header .sub-heading {
   padding: 0px, 0px, 20px;
 }
 pre {

css/daux-green.css

@@ -6576,6 +6576,34 @@ body {
   }
 }
 /* ===========================================================================================
+Markdown editor
+============================================================================================== */
+.editor {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  background: white;
+  padding: 20px;
+  padding-bottom: 100px;
+  min-height: 100%;
+  height: auto;
+  display: none;
+}
+.editor h3 {
+  width: 100%!important;
+}
+#markdown_editor {
+  width: 85%;
+  margin: 0 auto;
+  padding: 10px;
+  height: auto;
+  font-size: 16px;
+  min-height: 100px;
+  font-family: "Ubuntu Mono", "Consolas", monospace;
+  display: block;
+}
+/* ===========================================================================================
 Componenets
 ============================================================================================== */
 a {
@@ -6732,8 +6760,7 @@ code {
 .page-header h1 {
   margin-top: 0px;
 }
-/* To be applied to the  same element as page-header for sites that have sub-heading content such as Last modified time */
+.page-header sub-heading {
-.page-header .sub-heading {
   padding: 0px, 0px, 20px;
 }
 pre {

css/daux-navy.css

@@ -6576,6 +6576,34 @@ body {
   }
 }
 /* ===========================================================================================
+Markdown editor
+============================================================================================== */
+.editor {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  background: white;
+  padding: 20px;
+  padding-bottom: 100px;
+  min-height: 100%;
+  height: auto;
+  display: none;
+}
+.editor h3 {
+  width: 100%!important;
+}
+#markdown_editor {
+  width: 85%;
+  margin: 0 auto;
+  padding: 10px;
+  height: auto;
+  font-size: 16px;
+  min-height: 100px;
+  font-family: "Ubuntu Mono", "Consolas", monospace;
+  display: block;
+}
+/* ===========================================================================================
 Componenets
 ============================================================================================== */
 a {
@@ -6732,8 +6760,7 @@ code {
 .page-header h1 {
   margin-top: 0px;
 }
-/* To be applied to the  same element as page-header for sites that have sub-heading content such as Last modified time */
+.page-header sub-heading {
-.page-header .sub-heading {
   padding: 0px, 0px, 20px;
 }
 pre {

css/daux-red.css

@@ -6576,6 +6576,34 @@ body {
   }
 }
 /* ===========================================================================================
+Markdown editor
+============================================================================================== */
+.editor {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  background: white;
+  padding: 20px;
+  padding-bottom: 100px;
+  min-height: 100%;
+  height: auto;
+  display: none;
+}
+.editor h3 {
+  width: 100%!important;
+}
+#markdown_editor {
+  width: 85%;
+  margin: 0 auto;
+  padding: 10px;
+  height: auto;
+  font-size: 16px;
+  min-height: 100px;
+  font-family: "Ubuntu Mono", "Consolas", monospace;
+  display: block;
+}
+/* ===========================================================================================
 Componenets
 ============================================================================================== */
 a {
@@ -6732,8 +6760,7 @@ code {
 .page-header h1 {
   margin-top: 0px;
 }
-/* To be applied to the  same element as page-header for sites that have sub-heading content such as Last modified time */
+.page-header sub-heading {
-.page-header .sub-heading {
   padding: 0px, 0px, 20px;
 }
 pre {

index.php

@@ -89,10 +89,14 @@ if (count($options['languages']) > 0 && count($url_params) > 0 && strlen($url_pa
 
 $tree = get_tree($base_path, $base_url, '', true, $language);
 
-
-
 $page = load_page($tree, $url_params);
 
+// Handle AJAX requests
+if(isset($_POST["markdown"]) && $options["file_editor"] === true) {
+    handle_editor_post($_POST, $page);
+    die;
+}
+
 // If a timezone has been set in the config file, override the default PHP timezone for this application.
 if(isset($options['timezone']))
 {
@@ -147,6 +151,11 @@ if ($homepage && $homepage_url !== '/') {
 
     <!-- Navigation -->
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
+
+    <?php if($options["file_editor"]) { ?>
+    <!-- Front end file editor -->
+    <script src="<?php echo $base_url ?>/js/editor.js"></script>
+    <?php } ?>
     <script>
     if (typeof jQuery == 'undefined') {
         document.write(unescape("%3Cscript src='<?php echo $base_url ?>/js/jquery-1.10.2.min.js' type='text/javascript'%3E%3C/script%3E"));
@@ -252,7 +261,6 @@ if ($homepage && $homepage_url !== '/') {
                 </div>
             </div>
         </div>
-
     <?php } else { ?>
         <!-- Docs -->
         <?php if ($options['repo']) { ?>
@@ -304,7 +312,11 @@ if ($homepage && $homepage_url !== '/') {
                         <article>
                             <?php if($options['date_modified'] && isset($page['modified'])) { ?>
                                 <div class="page-header sub-header clearfix">
-                                    <h1><?php echo $page['title'];?></h1>
+                                    <h1><?php echo $page['title'];?>
+                                    <?php if($options["file_editor"]) { ?>
+                                        <a href="javascript:;" id="editThis" class="btn">Edit this page</a>
+                                    <?php } ?>
+                                    </h1>
                                         <span style="float: left; font-size: 10px; color: gray;">
                                             <?php echo date("l, F j, Y", $page['modified']);?>
                                         </span>
@@ -316,9 +328,20 @@ if ($homepage && $homepage_url !== '/') {
                                 <div class="page-header">
                                     <h1><?php echo $page['title'];?></h1>
                                 </div>
-
                             <?php } ?>
                             <?php echo $page['html'];?>
+                            <?php if($options["file_editor"]) { ?>
+                                <div class="editor">
+                                    <h3>You are editing <?php echo $page['path']; ?>&nbsp;<a href="javascript:;" class="closeEditor btn btn-warning">Close</a></h3>
+                                    <div class="navbar navbar-inverse navbar-default navbar-fixed-bottom" role="navigation">
+                                        <div class="navbar-inner">
+                                            <a href="javascript:;" class="save_editor btn btn-primary navbar-btn pull-right">Save file</a>
+                                        </div>
+                                    </div>
+                                    <textarea id="markdown_editor"><?php echo $page['markdown'];?></textarea>
+                                    <div class="clearfix"></div>
+                                </div>
+                            <?php } ?>
                         </article>
                     </div>
                 </div>

js/editor.js

@@ -0,0 +1,53 @@
+$(document).ready(function() {
+    var markdown_editor = $("#markdown_editor"),
+        save_editor = $(".save_editor"),
+        editor = $(".editor");
+
+    $("#editThis").click(function() {
+        editor.css({"display":"block"});
+        markdown_editor.autosize().val();
+    });
+
+    $(".closeEditor").click(function() {
+        editor.css({"display":"none"});
+    });
+
+    save_editor.click(function() {
+        var original_text = save_editor.text();
+        save_editor.text("Saving...").addClass("disabled");
+
+        $.post(window.location.href, {markdown: markdown_editor.val() }, function() {
+            save_editor.text("Done! Reloading page in 5 seconds. You can cancel it with ESC key");
+
+            var timeout = setTimeout(function() {
+                location.reload()
+            }, 5000); // lie
+
+            $(document).keyup(function(e) {
+                if (e.keyCode == 27) { // esc key
+                    clearTimeout(timeout);
+                    save_editor.text("Page reload cancelled");
+                    setTimeout(function() {
+                        save_editor.text(original_text).removeClass('disabled');
+                    }, 2000);
+                }
+            });
+        }).fail(function() {
+            save_editor.removeClass('disabled').addClass("btn-danger").text("Failed :( - try checking your read/write permissions");
+            setTimeout(function() {
+                save_editor.text(original_text).removeClass('btn-danger');
+            },5000);
+        });
+    });
+});
+
+
+
+
+/*!
+    Autosize v1.18.4 - 2014-01-11
+    Automatically adjust textarea height based on user input.
+    (c) 2014 Jack Moore - http://www.jacklmoore.com/autosize
+    license: http://www.opensource.org/licenses/mit-license.php
+*/
+!function(a){var b,c={className:"autosizejs",append:"",callback:!1,resizeDelay:10,placeholder:!0},d='<textarea tabindex="-1" style="position:absolute; top:-999px; left:0; right:auto; bottom:auto; border:0; padding: 0; -moz-box-sizing:content-box; -webkit-box-sizing:content-box; box-sizing:content-box; word-wrap:break-word; height:0 !important; min-height:0 !important; overflow:hidden; transition:none; -webkit-transition:none; -moz-transition:none;"/>',e=["fontFamily","fontSize","fontWeight","fontStyle","letterSpacing","textTransform","wordSpacing","textIndent"],f=a(d).data("autosize",!0)[0];f.style.lineHeight="99px","99px"===a(f).css("lineHeight")&&e.push("lineHeight"),f.style.lineHeight="",a.fn.autosize=function(d){return this.length?(d=a.extend({},c,d||{}),f.parentNode!==document.body&&a(document.body).append(f),this.each(function(){function c(){var b,c=window.getComputedStyle?window.getComputedStyle(m,null):!1;c?(b=m.getBoundingClientRect().width,0===b&&(b=parseInt(c.width,10)),a.each(["paddingLeft","paddingRight","borderLeftWidth","borderRightWidth"],function(a,d){b-=parseInt(c[d],10)})):b=Math.max(n.width(),0),f.style.width=b+"px"}function g(){var g={};if(b=m,f.className=d.className,j=parseInt(n.css("maxHeight"),10),a.each(e,function(a,b){g[b]=n.css(b)}),a(f).css(g),c(),window.chrome){var h=m.style.width;m.style.width="0px";{m.offsetWidth}m.style.width=h}}function h(){var e,h;b!==m?g():c(),f.value=!m.value&&d.placeholder?(a(m).attr("placeholder")||"")+d.append:m.value+d.append,f.style.overflowY=m.style.overflowY,h=parseInt(m.style.height,10),f.scrollTop=0,f.scrollTop=9e4,e=f.scrollTop,j&&e>j?(m.style.overflowY="scroll",e=j):(m.style.overflowY="hidden",k>e&&(e=k)),e+=o,h!==e&&(m.style.height=e+"px",p&&d.callback.call(m,m))}function i(){clearTimeout(l),l=setTimeout(function(){var a=n.width();a!==r&&(r=a,h())},parseInt(d.resizeDelay,10))}var j,k,l,m=this,n=a(m),o=0,p=a.isFunction(d.callback),q={height:m.style.height,overflow:m.style.overflow,overflowY:m.style.overflowY,wordWrap:m.style.wordWrap,resize:m.style.resize},r=n.width();n.data("autosize")||(n.data("autosize",!0),("border-box"===n.css("box-sizing")||"border-box"===n.css("-moz-box-sizing")||"border-box"===n.css("-webkit-box-sizing"))&&(o=n.outerHeight()-n.height()),k=Math.max(parseInt(n.css("minHeight"),10)-o||0,n.height()),n.css({overflow:"hidden",overflowY:"hidden",wordWrap:"break-word",resize:"none"===n.css("resize")||"vertical"===n.css("resize")?"none":"horizontal"}),"onpropertychange"in m?"oninput"in m?n.on("input.autosize keyup.autosize",h):n.on("propertychange.autosize",function(){"value"===event.propertyName&&h()}):n.on("input.autosize",h),d.resizeDelay!==!1&&a(window).on("resize.autosize",i),n.on("autosize.resize",h),n.on("autosize.resizeIncludeStyle",function(){b=null,h()}),n.on("autosize.destroy",function(){b=null,clearTimeout(l),a(window).off("resize",i),n.off("autosize").off(".autosize").css(q).removeData("autosize")}),h())})):this}}(window.jQuery||window.$);

less/import/daux-base.less

@@ -332,6 +332,36 @@ html, body {
 	td:before { content: attr(data-title); }
 }
 
+/* ===========================================================================================
+Markdown editor
+============================================================================================== */
+
+.editor {
+	position: absolute;
+	top: 0;
+	left: 0;
+	right: 0;
+	background: white;
+	padding: 20px;
+	padding-bottom: 100px;
+	min-height: 100%;
+	height: auto;
+	display: none;
+	h3 {
+		width: 100%!important;
+	}
+}
+
+#markdown_editor {
+	width: 85%;
+	margin: 0 auto;
+	padding: 10px;
+	height: auto;
+	font-size: 16px;
+	min-height: 100px;
+	font-family: "Ubuntu Mono", "Consolas", monospace;
+	display: block;
+}
 
 /* ===========================================================================================
 Componenets

libs/functions.php

@@ -46,7 +46,8 @@ function get_options() {
 		'piwik_analytics' => false,
         'piwik_analytics_id' => 1,
         'ignore' => array(),
-        'languages' => array()
+        'languages' => array(),
+        'file_editor' => true
 	);
 
 	// Load User Config
@@ -122,6 +123,10 @@ function load_page($tree, $url_params) {
 		}
 		$html .= MarkdownExtended(file_get_contents($branch['path']));
 
+		// Markdown editor related
+		$page['markdown'] = file_get_contents($branch['path']);
+		$page['path'] = $branch['path'];
+
 		$page['html'] = $html;
 
 	} else {
@@ -130,7 +135,7 @@ function load_page($tree, $url_params) {
 		$page['html'] = "<h3>Oh No. That page doesn't exist</h3>";
 
 	}
-	
+
 
 	return $page;
 }
@@ -275,7 +280,7 @@ function get_tree($path = '.', $clean_path = '', $title = '', $first = true, $la
 
 	// Sort paths
 	sort($paths);
-    
+
     if ($first && $language !== null) {
         $language_path = $language . "/";
     } else {
@@ -412,3 +417,11 @@ function get_uri($prefix_slash = true)
     // Do some final cleaning of the URI and return it
     return ($prefix_slash ? '/' : '').str_replace(array('//', '../'), '/', trim($uri, '/'));
 }
+
+function handle_editor_post($post, $page) {
+    if(file_exists($page["path"])) {
+        file_put_contents($page["path"], $post["markdown"]);
+    } else {
+        throw new Exception("File doesn't exists", 1);
+    }
+}