Merge pull request #591 from anaqreon/wiki-gui

Wiki UI improvements

Zotlabs/Module/Wiki.php

@@ -128,7 +128,7 @@ class Wiki extends \Zotlabs\Web\Controller {
 				require_once('library/markdown.php');	
 				$content = t('"# Wiki Sandbox\n\nContent you **edit** and **preview** here *will not be saved*."');
 				$renderedContent = Markdown(json_decode($content));
-				$hide_editor = false;
+				$hide_editor = true;
 				$showPageControls = false;
 				$showNewWikiButton = $wiki_owner;
 				$showNewPageButton = false;
@@ -209,8 +209,10 @@ class Wiki extends \Zotlabs\Web\Controller {
 		$o .= replace_macros(get_markup_template('wiki.tpl'),array(
 			'$wikiheaderName' => $wikiheaderName,
 			'$wikiheaderPage' => $wikiheaderPage,
-			'$hideEditor' => $hide_editor,
+			'$hideEditor' => $hide_editor, // True will completely hide the content section and is used for the case of no wiki selected
+			'$chooseWikiMessage' => t('Choose an available wiki from the list on the left.'),
 			'$showPageControls' => $showPageControls,
+			'$editOrSourceLabel' => (($showPageControls) ? t('Edit') : t('Source')),
 			'$tools_label' => 'Wiki Tools',
 			'$showNewWikiButton'=> $showNewWikiButton,
 			'$showNewPageButton'=> $showNewPageButton,

include/widgets.php

@@ -1017,6 +1017,7 @@ function widget_wiki_pages($arr) {
 			'$pages' => $pages,
 			'$canadd' => $can_create,
 			'$addnew' => t('Add new page'),
+			'$pageName' => array('pageName', t('Enter the name of the new page:'), '', ''),
 	));
 }
 

include/wiki.php

@@ -32,13 +32,16 @@ function wiki_page_list($resource_id) {
 		return array('pages' => null, 'wiki' => null);
 	}
 	$pages = array();
+	$pages[] = array('title' => 'Home', 'url' => 'Home');
 	if (is_dir($w['path']) === true) {
 		$files = array_diff(scandir($w['path']), array('.', '..', '.git'));
 		// TODO: Check that the files are all text files
 		
 		foreach($files as $file) {
 			// strip the .md file extension and unwrap URL encoding to leave HTML encoded name
-			$pages[] = array('title' => urldecode(substr($file, 0, -3)), 'url' => urlencode(substr($file, 0, -3)));
+			if( urldecode(substr($file, 0, -3)) !== 'Home') {
+				$pages[] = array('title' => urldecode(substr($file, 0, -3)), 'url' => urlencode(substr($file, 0, -3)));
+			}
 		}
 	}
 

view/tpl/wiki.tpl

@@ -11,7 +11,12 @@
     transition: opacity 0.5s 0.5s ease;
   }
 </style>
-<div class="generic-content-wrapper">
+{{if $hideEditor}}
+<div>
+	<p class="lead text-center">{{$chooseWikiMessage}}</p>
+</div>
+{{/if}}
+<div class="generic-content-wrapper" {{if $hideEditor}}style="display: none;"{{/if}}>
   <div class="section-title-wrapper">
 			
     <div class="pull-right">
@@ -40,21 +45,13 @@
       <button id="fullscreen-btn" type="button" class="btn btn-default btn-xs" onclick="makeFullScreen();"><i class="fa fa-expand"></i></button>
       <button id="inline-btn" type="button" class="btn btn-default btn-xs" onclick="makeFullScreen(false);"><i class="fa fa-compress"></i></button>
     </div>
-    <h2><span id="wiki-header-name">{{$wikiheaderName}}</span>: <span id="wiki-header-page">{{$wikiheaderPage}}</span></h2>
+	  <h2><span id="wiki-header-name"><i class="fa fa-book"></i>&nbsp<b>{{$wikiheaderName}}</b></span>&nbsp:&nbsp
+		  <span id="wiki-header-page">{{$wikiheaderPage}}</span>
+		</h2>
     <div class="clear"></div>
   </div>
   
 		
-	<div id="new-page-form-wrapper" class="section-content-tools-wrapper" style="display:none;">
-      <form id="new-page-form" action="wiki/create/page" method="post" >
-        <div class="clear"></div>
-        {{include file="field_input.tpl" field=$pageName}}
-        <div class="btn-group pull-right">
-            <button id="new-page-submit" class="btn btn-success" type="submit" name="submit" >Create Page</button>
-        </div>
-      </form>        <div class="clear"></div>
-      <hr>
-    </div>
   
     <div id="rename-page-form-wrapper" class="section-content-tools-wrapper" style="display:none;">
       <form id="rename-page-form" action="wiki/rename/page" method="post" >
@@ -68,17 +65,34 @@
     </div>
 
   <div id="wiki-content-container" class="section-content-wrapper" {{if $hideEditor}}style="display: none;"{{/if}}>
+	   	
     <ul class="nav nav-tabs" id="wiki-nav-tabs">
-      <li id="edit-pane-tab"><a data-toggle="tab" href="#edit-pane">Edit</a></li>
+      <li id="edit-pane-tab"><a data-toggle="tab" href="#edit-pane">{{$editOrSourceLabel}}</a></li>
-      <li class="active"><a data-toggle="tab" href="#preview-pane" id="wiki-get-preview">Preview</a></li>
+      <li class="active"><a data-toggle="tab" href="#preview-pane" id="wiki-get-preview">View</a></li>
       <li {{if $hidePageHistory}}style="display: none;"{{/if}}><a data-toggle="tab" href="#page-history-pane" id="wiki-get-history">History</a></li>
-
+	
     </ul>
-					
+				
 			<div class="tab-content" id="wiki-page-tabs">
 
       <div id="edit-pane" class="tab-pane fade">
         <div id="ace-editor"></div>
+		{{if $showCommitMsg}}
+		  {{if $showPageControls}}
+		<div class="section-content-wrapper">
+				  <div id="id_{{$commitMsg.0}}_wrapper" class='form-group field input'>
+			  <label for='id_{{$commitMsg.0}}' id='label_{{$commitMsg.0}}'>{{$commitMsg.1}}{{if $commitMsg.4}}<span class="required"> {{$commitMsg.4}}</span>{{/if}}</label>
+			  <span>
+					  <input class="" style="width: 80%;" name='{{$commitMsg.0}}' id='id_{{$commitMsg.0}}' type="text" value="{{$commitMsg.2}}"{{if $commitMsg.5}} {{$commitMsg.5}}{{/if}}>
+					  <a id="save-page" href="#" class="btn btn-primary btn-md">Save</a>
+			  </span>
+			  <span id='help_{{$commitMsg.0}}' class='help-block'>{{$commitMsg.3}}</span>
+
+			  <div class="clear"></div>
+		  </div>
+		</div>
+		{{/if}}
+		{{/if}}
       </div>      
       <div id="preview-pane" class="tab-pane fade in active">
         <div id="wiki-preview" class="section-content-wrapper">
@@ -88,27 +102,13 @@
       <div id="page-history-pane" class="tab-pane fade" {{if $hidePageHistory}}style="display: none;"{{/if}}>
         <div id="page-history-list" class="section-content-wrapper">
         </div>
-      </div>     
+      </div>    
+	
+      </div>  
 
 
     </div>
   </div>
-  {{if $showCommitMsg}}
-	{{if $showPageControls}}
-  <div class="section-content-wrapper">
-			<div id="id_{{$commitMsg.0}}_wrapper" class='form-group field input'>
-		<label for='id_{{$commitMsg.0}}' id='label_{{$commitMsg.0}}'>{{$commitMsg.1}}{{if $commitMsg.4}}<span class="required"> {{$commitMsg.4}}</span>{{/if}}</label>
-		<span>
-				<input class="" style="width: 80%;" name='{{$commitMsg.0}}' id='id_{{$commitMsg.0}}' type="text" value="{{$commitMsg.2}}"{{if $commitMsg.5}} {{$commitMsg.5}}{{/if}}>
-				<a id="save-page" href="#" class="btn btn-primary btn-md">Save</a>
-		</span>
-		<span id='help_{{$commitMsg.0}}' class='help-block'>{{$commitMsg.3}}</span>
-		
-		<div class="clear"></div>
-	</div>
-  </div>
-  {{/if}}
-  {{/if}}
 </div>
 
 {{$wikiModal}}
@@ -192,7 +192,9 @@
 
 		editor.getSession().setValue(window.wiki_page_content);
 		window.editor = editor; // Store the editor in the window object so the anonymous function can use it.
-
+		{{if !$showPageControls}}
+			editor.setReadOnly(true); // Disable editing if the viewer lacks edit permission
+		{{/if}}
 		$('#edit-pane-tab').click(function (ev) {
 			setTimeout(function() {window.editor.focus();}, 500); // Return the focus to the editor allowing immediate text entry
 		});
@@ -241,23 +243,6 @@
 				window.location = "wiki/{{$channel}}/download/wiki/" + resource_id;
 		}
 
-		$('#new-page-submit').click(function (ev) {
-			if (window.wiki_resource_id === '') {
-			window.console.log('You must have a wiki open in order to create pages.');
-			ev.preventDefault();
-			return false;
-			}
-			$.post("wiki/{{$channel}}/create/page", {name: $('#id_pageName').val(), resource_id: window.wiki_resource_id}, 
-			function (data) {
-				if (data.success) {
-				window.location = data.url;
-				} else {
-				window.console.log('Error creating page.');
-				}
-			}, 'json');
-			ev.preventDefault();
-		});
-
 		function wiki_refresh_page_list() {
 			if (window.wiki_resource_id === '') {
 				return false;
@@ -482,6 +467,7 @@
 		};
 
 		function wiki_show_new_wiki_form() {
+			$('div[id^=\'edit-wiki-form-wrapper\']').hide();
 			$('#new-page-form-wrapper').hide(); 
 			$('#edit-wiki-form-wrapper').hide();
 			$('#new-wiki-form-wrapper').toggle(); 
@@ -489,6 +475,7 @@
 		}
 
 		function wiki_show_new_page_form() {
+			$('div[id^=\'edit-wiki-form-wrapper\']').hide();
 			$('#edit-wiki-form-wrapper').hide();
 			$('#new-wiki-form-wrapper').hide();
 			$('#new-page-form-wrapper').toggle(); 
@@ -498,6 +485,7 @@
 		function wiki_show_edit_wiki_form(wiki_title, wiki_resource_id) {
 			window.wiki_resource_id = wiki_resource_id;
 			window.wiki_title = wiki_title;
+			$('div[id^=\'edit-wiki-form-wrapper\']').hide();
 			$('#new-page-form-wrapper').hide();
 			$('#new-wiki-form-wrapper').hide();
 			$('#edit-wiki-form-wrapper').toggle();  
@@ -514,5 +502,6 @@
 				{{else}}
 						$('#new-wiki-button').hide();
 				{{/if}}
+				
 		});
 </script>

view/tpl/wiki_page_list.tpl

@@ -10,5 +10,38 @@
 		{{/if}}
 		{{if $canadd}}<li><a href="#" onclick="wiki_show_new_page_form(); return false;"><i class="fa fa-plus-circle"></i>&nbsp;{{$addnew}}</a></li>{{/if}}
 	</ul>
+	{{if $canadd}}
+	<div id="new-page-form-wrapper" class="sub-menu" style="display:none;">
+      <form id="new-page-form" action="wiki/{{$channel}}/create/page" method="post" >
+        <div class="clear"></div>
+        {{include file="field_input.tpl" field=$pageName}}
+        <div class="btn-group pull-right">
+            <button id="new-page-submit" class="btn btn-success" type="submit" name="submit" >Create Page</button>
+        </div>
+      </form>
+		<div class="clear"></div>
+      <hr>
+    </div>
+	{{/if}}
 </div>
 {{if $not_refresh}}</div>{{/if}}
+
+<script>
+
+	$('#new-page-submit').click(function (ev) {
+		if (window.wiki_resource_id === '') {
+		window.console.log('You must have a wiki open in order to create pages.');
+		ev.preventDefault();
+		return false;
+		}
+		$.post("wiki/{{$channel}}/create/page", {name: $('#id_pageName').val(), resource_id: window.wiki_resource_id}, 
+		function (data) {
+			if (data.success) {
+			window.location = data.url;
+			} else {
+			window.console.log('Error creating page.');
+			}
+		}, 'json');
+		ev.preventDefault();
+	});
+</script>

view/tpl/wikilist.tpl

@@ -21,7 +21,7 @@
 		{{/foreach}}
 		{{/if}}
 		{{if $owner}}
-		<li><a href="#" class="fakelink" onclick="$('div[id^=\'edit-wiki-form-wrapper\']').hide(); openClose('new-wiki-form-wrapper'); return false;"><i id="new-wiki-button" class="fa fa-plus-circle"></i>&nbsp;{{$addnew}}</a></li>
+		<li><a href="#" class="fakelink" onclick="wiki_show_new_wiki_form(); return false;"><i id="new-wiki-button" class="fa fa-plus-circle"></i>&nbsp;{{$addnew}}</a></li>
 		{{/if}}
 	</ul>
 	{{if $owner}}