D3Public/daux.io
8
0
Fork 0
Code Pull Requests Releases Activity

Inline editing of markdown files

Browse Source
This commit is contained in:
Jakub Mikulas 2014-01-19 23:24:23 +01:00
parent 1261c88d1c
commit eefdce41bf
8 changed files with 243 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
css/daux-blue.css
View File

@ -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 {

31
css/daux-green.css
View File

@ -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 {

31
css/daux-navy.css
View File

@ -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 {

31
css/daux-red.css
View File

@ -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 {

33
index.php
View File

@ -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>

53
js/editor.js Normal file
View File

@ -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.$);

30
less/import/daux-base.less
View File

@ -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

15
libs/functions.php
View File

@ -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 {
@ -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);
}
}