Auto-save post and comment entry using localStorage in browser.

Zotlabs/Module/Item.php

@@ -1051,10 +1051,6 @@ class Item extends \Zotlabs\Web\Controller {
 	
 		logger('post_complete');
 
-		// Remove auto-saved post text if the post was successfully posted
-		del_pconfig(local_channel(),'autosavetext_post','body');
-		del_pconfig(local_channel(),'autosavetext_post','title');
-		
 		if($moderated) {
 			info(t('Your comment is awaiting approval.') . EOL);
 		}

include/conversation.php

@@ -1361,16 +1361,8 @@ function status_editor($a, $x, $popup = false) {
 	}
 
 	$sharebutton = (x($x,'button') ? $x['button'] : t('Share'));
-	$content = ((x($x,'body')) ? htmlspecialchars($x['body'], ENT_COMPAT,'UTF-8') : '');
+	$placeholdtext = (x($x,'content_label') ? $x['content_label'] : $sharebutton);
-	if(!$content) {
+
-		$content = get_pconfig(local_channel(),'autosavetext_post','body');
-	}
-	$title = ((x($x, 'title')) ? htmlspecialchars($x['title'], ENT_COMPAT,'UTF-8') : '');
-	if(!$title) {
-		$title = get_pconfig(local_channel(),'autosavetext_post','title');
-	}
-	$placeholdtext = (x($x,'content_label') ? $x['content_label'] : $sharebutton);	
-	
 	$o .= replace_macros($tpl, array(
 		'$return_path' => ((x($x, 'return_path')) ? $x['return_path'] : App::$query_string),
 		'$action' =>  z_root() . '/item',
@@ -1402,14 +1394,14 @@ function status_editor($a, $x, $popup = false) {
 		'$feature_nocomment' => $feature_nocomment,
 		'$nocomment' => ((array_key_exists('item',$x)) ? $x['item']['item_nocomment'] : 0),
 		'$clearloc' => $clearloc,
-		'$title' => $title,
+		'$title' => ((x($x, 'title')) ? htmlspecialchars($x['title'], ENT_COMPAT,'UTF-8') : ''),
 		'$placeholdertitle' => ((x($x, 'placeholdertitle')) ? $x['placeholdertitle'] : t('Title (optional)')),
 		'$catsenabled' => $catsenabled,
 		'$category' => ((x($x, 'category')) ? $x['category'] : ''),
 		'$placeholdercategory' => t('Categories (optional, comma-separated list)'),
 		'$permset' => t('Permission settings'),
 		'$ptyp' => ((x($x, 'ptyp')) ? $x['ptyp'] : ''),
-		'$content' => $content,
+		'$content' => ((x($x,'body')) ? htmlspecialchars($x['body'], ENT_COMPAT,'UTF-8') : ''),
 		'$attachment' => ((x($x, 'attachment')) ? $x['attachment'] : ''),
 		'$post_id' => ((x($x, 'post_id')) ? $x['post_id'] : ''),
 		'$defloc' => $x['default_location'],

view/js/main.js

@@ -166,6 +166,12 @@ function handle_comment_form(e) {
 		$('#' + commentElm).addClass('expanded').removeAttr('placeholder');
 		$('#' + commentElm).attr('tabindex','9');
 		$('#' + submitElm).attr('tabindex','10');
+		
+		var commentBody = localStorage.getItem("comment_body");
+		if(commentBody && $('#' + commentElm).val() === '') {
+			$('#' + commentElm).val(commentBody);
+		}
+		
 		form.find(':not(:visible)').show();
 	}
 
@@ -185,6 +191,28 @@ function handle_comment_form(e) {
 			form.find(':not(.comment-edit-text)').hide();
 		}
 	});
+	
+	var commentSaveTimer = null;
+	var emptyCommentElm = form.find('.comment-edit-text').attr('id');
+	$(document).on('focusout','#' + emptyCommentElm,function(e){
+		if(commentSaveTimer)
+			clearTimeout(commentSaveTimer);
+		commentSaveChanges(true);
+		commentSaveTimer = null;
+	});
+
+	$(document).on('focusin','#' + emptyCommentElm,function(e){
+		commentSaveTimer = setTimeout(function () {
+			commentSaveChanges(false);
+		},10000);
+	});
+
+	function commentSaveChanges(isFinal = false, type) {
+		localStorage.setItem("comment_body", $('#' + emptyCommentElm).val());
+		if( !isFinal) {
+			commentSaveTimer = setTimeout(commentSaveChanges,10000);
+		}
+	}
 }
 
 function commentClose(obj, id) {
@@ -1106,6 +1134,7 @@ function post_comment(id) {
 		$("#comment-edit-form-" + id).serialize(),
 		function(data) {
 			if(data.success) {
+				localStorage.removeItem("comment_body");
 				$("#comment-edit-preview-" + id).hide();
 				$("#comment-edit-wrapper-" + id).hide();
 				$("#comment-edit-text-" + id).val('');

view/tpl/jot-header.tpl

@@ -560,3 +560,58 @@ $( document ).on( "click", ".wall-item-delete-link,.page-delete-link,.layout-del
 	}
 });
 </script>
+
+
+<script>
+
+	var postSaveTimer = null;
+
+	$(document).on('focusout',"#profile-jot-wrapper",function(e){
+		if(postSaveTimer)
+			clearTimeout(postSaveTimer);
+		postSaveChanges(true);
+		postSaveTimer = null;
+	});
+
+	$(document).on('focusin',"#profile-jot-wrapper",function(e){
+		postSaveTimer = setTimeout(function () {
+			postSaveChanges(false);
+		},10000);
+	});
+
+	function postSaveChanges(isFinal = false, type) {
+		localStorage.setItem("post_title", $("#jot-title").val());
+		localStorage.setItem("post_body", $("#profile-jot-text").val());
+		localStorage.setItem("post_category", $("#jot-category").val());
+		if( !isFinal) {
+			postSaveTimer = setTimeout(postSaveChanges,10000);
+		}
+
+	}
+
+	$(document).ready(function() {
+		var postTitle = localStorage.getItem("post_title");
+		var postBody = localStorage.getItem("post_body");
+		var postCategory = localStorage.getItem("post_category");
+		var openEditor = false;
+		if(postTitle) {
+			$('#jot-title').val(postTitle);
+			openEditor = true;
+		}
+		if(postBody) {
+			$('#profile-jot-text').val(postBody);
+			openEditor = true;
+		}
+		if(postCategory) {
+			var categories = postCategory.split(',');
+			categories.forEach(function(cat) {
+				$('#jot-category').tagsinput('add', cat);
+			});
+			openEditor = true;
+		}
+		if(openEditor) {
+			initEditor();
+		}
+	});
+
+</script>

view/tpl/jot.tpl

@@ -40,38 +40,6 @@
 			<input name="category" id="jot-category" type="text" placeholder="{{$placeholdercategory}}" value="{{$category}}" data-role="cat-tagsinput">
 		</div>
 		{{/if}}
-
-		<script>
-
-			var postSaveTimer = null;
-
-			$(document).on('focusout',"#profile-jot-text",function(e){
-				if(postSaveTimer)
-					clearTimeout(postSaveTimer);
-				postSaveChanges(true);
-				postSaveTimer = null;
-			});
-
-			$(document).on('focusin',"#profile-jot-text",function(e){
-				postSaveTimer = setTimeout(function () {
-					postSaveChanges(false);
-				},10000);
-			});
-
-			function postSaveChanges(isFinal = false, type) {
-				$.post('autosavetext', 
-					{ 
-						'type' : 'post', 
-						'body' : $("#profile-jot-text").val(),
-						'title': $("#jot-title").val()
-					}
-				);
-				if( !isFinal) {
-					postSaveTimer = setTimeout(postSaveChanges,10000);
-				}
-				
-			}
-		</script>
 		<div id="jot-text-wrap">
 			<textarea class="profile-jot-text" id="profile-jot-text" name="body" tabindex="2" placeholder="{{$placeholdtext}}" >{{$content}}</textarea>
 		</div>