Merge branch 'ikisler-preview-changes'

build/index.php

@@ -288,6 +288,8 @@ textarea { min-height: 10em; line-height: 1.3em; font-size: 1.25rem; }
 textarea, textarea[name=content] + pre, textarea ~ input[type=submit], #search-box { width: calc(100% - 0.3rem); box-sizing: border-box; }
 textarea ~ input[type=submit] { margin: 0.5rem 0; padding: 0.5rem; font-weight: bolder; }
 .editform input[type=text] { width: calc(100% - 0.3rem); box-sizing: border-box; }
+input.edit-page-button[type='submit'] { width: 49.5%; box-sizing: border-box; }
+.preview-message { text-align: center; }
 .jump-to-comments { position: relative; top: -2.5em; display: block; text-align: right; pointer-events: none; }
 .jump-to-comments > a { pointer-events: all; }
 
@@ -5112,6 +5114,47 @@ register_module([
 	"code" => function() {
 		global $settings, $env;
 		
+		/**
+		 * @api {post} ?action=preview-edit&page={pageName}[&newpage=yes]	Get a preview of the page
+		 * @apiDescription	Gets a preview of the current edit state of a given page
+		 * @apiName 		PreviewPage
+		 * @apiPermission	Anonymous
+		 * 
+		 * @apiUse	PageParameter
+		 * @apiParam	{string}	newpage 	Set to 'yes' if a new page is being created.
+		 * @apiParam	{string}	preview-edit 	Set to a value to preview an edit of a page.
+		 */
+
+		/*
+		 *
+		 * ██████  ██████  ███████ ██    ██ ██ ███████ ██     ██
+		 * ██   ██ ██   ██ ██      ██    ██ ██ ██      ██     ██
+		 * ██████  ██████  █████   ██    ██ ██ █████   ██  █  ██
+		 * ██      ██   ██ ██       ██  ██  ██ ██      ██ ███ ██
+		 * ██      ██   ██ ███████   ████   ██ ███████  ███ ███
+		 *
+		 * ███████ ██████  ██ ████████ 
+		 * ██      ██   ██ ██    ██    
+		 * █████   ██   ██ ██    ██    
+		 * ██      ██   ██ ██    ██    
+		 * ███████ ██████  ██    ██    
+		 *
+		 */
+		add_action("preview-edit", function() {
+			global $pageindex, $settings, $env, $actions;
+
+			if(isset($_POST['preview-edit']) && isset($_POST['content'])) {
+				// preview changes
+				get_object_vars($actions)['edit']();
+			}
+			else {
+				// save page
+				get_object_vars($actions)['save']();
+			}
+
+			
+		});
+
 		/**
 		 * @api {get} ?action=edit&page={pageName}[&newpage=yes]	Get an editing page
 		 * @apiDescription	Gets an editing page for a given page. If you don't have permission to edit the page in question, a view source pagee is returned instead.
@@ -5141,6 +5184,10 @@ register_module([
 			{
 				$title = "Creating $env->page";
 			}
+			else if(isset($_POST['preview-edit']) && isset($_POST['content']))
+			{
+				$title = "Preview Edits for $env->page";
+			}
 			else
 			{
 				$title = "Editing $env->page";
@@ -5191,7 +5238,7 @@ register_module([
 					exit(page_renderer::render_main("Viewing source for $env->page", $sourceViewContent));
 				}
 				else
-				{
+				{
 					$errorMessage = "<p>The page <code>$env->page</code> does not exist, but you do not have permission to create it.</p><p>If you haven't already, perhaps you should try <a href='index.php?action=login&returnto=" . rawurlencode($_SERVER["REQUEST_URI"]) . "'>logging in</a>.</p>\n";
 					
 					if($isOtherUsersPage) {
@@ -5211,14 +5258,33 @@ register_module([
 			{
 				$content .= "<p><strong>Warning: You are not logged in! Your IP address <em>may</em> be recorded.</strong></p>";
 			}
-			$content .= "<form method='post' action='index.php?action=save&page=" . rawurlencode($page) . "&action=save' class='editform'>
+			
-			<input type='hidden' name='prev-content-hash' value='" . sha1($pagetext) . "' />
+			// Include preview, if set
-			<textarea name='content' autofocus tabindex='1'>$pagetext</textarea>
+			if(isset($_POST['preview-edit']) && isset($_POST['content'])) {
-			<pre class='fit-text-mirror'></pre>
+				// Need this for the prev-content-hash to prevent the conflict page from appearing
-			<input type='text' name='tags' value='$page_tags' placeholder='Enter some tags for the page here. Separate them with commas.' title='Enter some tags for the page here. Separate them with commas.' tabindex='2' />
+				$old_pagetext = $pagetext;
-			<p class='editing-message'>$settings->editing_message</p>
+
-			<input name='submit-edit' type='submit' value='Save Page' tabindex='3' />
+				// set the page content to the newly edited content
-		</form>";
+				$pagetext = $_POST['content'];
+
+				// Set the tags to the new tags, if needed
+				if(isset($_POST['tags']))
+					$page_tags = $_POST['tags'];
+
+				// Insert the "view" part of the page we're editing
+				$content .=  "<p class='preview-message'><strong>This is only a preview, so your edits haven't been saved! Scroll down to continue editing.</strong></p>" . parse_page_source($pagetext);
+
+			}
+
+			$content .= "<form method='post' name='edit-form' action='index.php?action=preview-edit&page=' class='editform'>
+					<input type='hidden' name='prev-content-hash' value='" . ((isset($old_pagetext)) ? sha1($old_pagetext) : sha1($pagetext)) . "' />
+					<textarea name='content' autofocus tabindex='1'>$pagetext</textarea>
+					<pre class='fit-text-mirror'></pre>
+					<input type='text' name='tags' value='$page_tags' placeholder='Enter some tags for the page here. Separate them with commas.' title='Enter some tags for the page here. Separate them with commas.' tabindex='2' />
+					<p class='editing-message'>$settings->editing_message</p>
+					<input name='preview-edit' class='edit-page-button' type='submit' value='Preview Changes' tabindex='4' />
+					<input name='submit-edit' class='edit-page-button' type='submit' value='Save Page' tabindex='3' />
+					</form>";
 			// Allow tab characters in the page editor
 			page_renderer::AddJSSnippet("window.addEventListener('load', function(event) {
 	// Adapted from https://jsfiddle.net/2wAzx/13/

module_index.json

@@ -104,7 +104,7 @@
         "author": "Starbeamrainbowlabs",
         "description": "Adds proper search functionality to Pepperminty Wiki using an inverted index to provide a full text search engine. If pages don't show up, then you might have hit a stop word. If not, try requesting the `invindex-rebuild` action to rebuild the inverted index from scratch.",
         "id": "feature-search",
-        "lastupdate": 1498646440,
+        "lastupdate": 1499101922,
         "optional": false
     },
     {
@@ -131,7 +131,7 @@
         "author": "Starbeamrainbowlabs",
         "description": "Adds the credits page. You *must* have this module :D",
         "id": "page-credits",
-        "lastupdate": 1496781899,
+        "lastupdate": 1499101922,
         "optional": false
     },
     {
@@ -158,7 +158,7 @@
         "author": "Starbeamrainbowlabs",
         "description": "Allows you to edit pages by adding the edit and save actions. You should probably include this one.",
         "id": "page-edit",
-        "lastupdate": 1488730217,
+        "lastupdate": 1499101922,
         "optional": false
     },
     {
@@ -185,7 +185,7 @@
         "author": "Starbeamrainbowlabs",
         "description": "Adds a page that lists all the pages in the index along with their metadata.",
         "id": "page-list",
-        "lastupdate": 1489074718,
+        "lastupdate": 1499101922,
         "optional": false
     },
     {

modules/page-edit.php

@@ -9,6 +9,47 @@ register_module([
 	"code" => function() {
 		global $settings, $env;
 		
+		/**
+		 * @api {post} ?action=preview-edit&page={pageName}[&newpage=yes]	Get a preview of the page
+		 * @apiDescription	Gets a preview of the current edit state of a given page
+		 * @apiName 		PreviewPage
+		 * @apiPermission	Anonymous
+		 * 
+		 * @apiUse	PageParameter
+		 * @apiParam	{string}	newpage 	Set to 'yes' if a new page is being created.
+		 * @apiParam	{string}	preview-edit 	Set to a value to preview an edit of a page.
+		 */
+
+		/*
+		 *
+		 * ██████  ██████  ███████ ██    ██ ██ ███████ ██     ██
+		 * ██   ██ ██   ██ ██      ██    ██ ██ ██      ██     ██
+		 * ██████  ██████  █████   ██    ██ ██ █████   ██  █  ██
+		 * ██      ██   ██ ██       ██  ██  ██ ██      ██ ███ ██
+		 * ██      ██   ██ ███████   ████   ██ ███████  ███ ███
+		 *
+		 * ███████ ██████  ██ ████████ 
+		 * ██      ██   ██ ██    ██    
+		 * █████   ██   ██ ██    ██    
+		 * ██      ██   ██ ██    ██    
+		 * ███████ ██████  ██    ██    
+		 *
+		 */
+		add_action("preview-edit", function() {
+			global $pageindex, $settings, $env, $actions;
+
+			if(isset($_POST['preview-edit']) && isset($_POST['content'])) {
+				// preview changes
+				get_object_vars($actions)['edit']();
+			}
+			else {
+				// save page
+				get_object_vars($actions)['save']();
+			}
+
+			
+		});
+
 		/**
 		 * @api {get} ?action=edit&page={pageName}[&newpage=yes]	Get an editing page
 		 * @apiDescription	Gets an editing page for a given page. If you don't have permission to edit the page in question, a view source pagee is returned instead.
@@ -38,6 +79,10 @@ register_module([
 			{
 				$title = "Creating $env->page";
 			}
+			else if(isset($_POST['preview-edit']) && isset($_POST['content']))
+			{
+				$title = "Preview Edits for $env->page";
+			}
 			else
 			{
 				$title = "Editing $env->page";
@@ -88,7 +133,7 @@ register_module([
 					exit(page_renderer::render_main("Viewing source for $env->page", $sourceViewContent));
 				}
 				else
-				{
+				{
 					$errorMessage = "<p>The page <code>$env->page</code> does not exist, but you do not have permission to create it.</p><p>If you haven't already, perhaps you should try <a href='index.php?action=login&returnto=" . rawurlencode($_SERVER["REQUEST_URI"]) . "'>logging in</a>.</p>\n";
 					
 					if($isOtherUsersPage) {
@@ -108,14 +153,33 @@ register_module([
 			{
 				$content .= "<p><strong>Warning: You are not logged in! Your IP address <em>may</em> be recorded.</strong></p>";
 			}
-			$content .= "<form method='post' action='index.php?action=save&page=" . rawurlencode($page) . "&action=save' class='editform'>
+			
-			<input type='hidden' name='prev-content-hash' value='" . sha1($pagetext) . "' />
+			// Include preview, if set
-			<textarea name='content' autofocus tabindex='1'>$pagetext</textarea>
+			if(isset($_POST['preview-edit']) && isset($_POST['content'])) {
-			<pre class='fit-text-mirror'></pre>
+				// Need this for the prev-content-hash to prevent the conflict page from appearing
-			<input type='text' name='tags' value='$page_tags' placeholder='Enter some tags for the page here. Separate them with commas.' title='Enter some tags for the page here. Separate them with commas.' tabindex='2' />
+				$old_pagetext = $pagetext;
-			<p class='editing-message'>$settings->editing_message</p>
+
-			<input name='submit-edit' type='submit' value='Save Page' tabindex='3' />
+				// set the page content to the newly edited content
-		</form>";
+				$pagetext = $_POST['content'];
+
+				// Set the tags to the new tags, if needed
+				if(isset($_POST['tags']))
+					$page_tags = $_POST['tags'];
+
+				// Insert the "view" part of the page we're editing
+				$content .=  "<p class='preview-message'><strong>This is only a preview, so your edits haven't been saved! Scroll down to continue editing.</strong></p>" . parse_page_source($pagetext);
+
+			}
+
+			$content .= "<form method='post' name='edit-form' action='index.php?action=preview-edit&page=' class='editform'>
+					<input type='hidden' name='prev-content-hash' value='" . ((isset($old_pagetext)) ? sha1($old_pagetext) : sha1($pagetext)) . "' />
+					<textarea name='content' autofocus tabindex='1'>$pagetext</textarea>
+					<pre class='fit-text-mirror'></pre>
+					<input type='text' name='tags' value='$page_tags' placeholder='Enter some tags for the page here. Separate them with commas.' title='Enter some tags for the page here. Separate them with commas.' tabindex='2' />
+					<p class='editing-message'>$settings->editing_message</p>
+					<input name='preview-edit' class='edit-page-button' type='submit' value='Preview Changes' tabindex='4' />
+					<input name='submit-edit' class='edit-page-button' type='submit' value='Save Page' tabindex='3' />
+					</form>";
 			// Allow tab characters in the page editor
 			page_renderer::AddJSSnippet("window.addEventListener('load', function(event) {
 	// Adapted from https://jsfiddle.net/2wAzx/13/

theme_default.css

@@ -73,6 +73,8 @@ textarea { min-height: 10em; line-height: 1.3em; font-size: 1.25rem; }
 textarea, textarea[name=content] + pre, textarea ~ input[type=submit], #search-box { width: calc(100% - 0.3rem); box-sizing: border-box; }
 textarea ~ input[type=submit] { margin: 0.5rem 0; padding: 0.5rem; font-weight: bolder; }
 .editform input[type=text] { width: calc(100% - 0.3rem); box-sizing: border-box; }
+input.edit-page-button[type='submit'] { width: 49.5%; box-sizing: border-box; }
+.preview-message { text-align: center; }
 .jump-to-comments { position: relative; top: -2.5em; display: block; text-align: right; pointer-events: none; }
 .jump-to-comments > a { pointer-events: all; }