files: make mod/filestorage.php load via ajax and some design work. work in progress...

include/RedDAV/RedBrowser.php

@@ -238,11 +238,21 @@ class RedBrowser extends DAV\Browser\Plugin {
 		$quota['limit'] = $limit;
 		$quota['desc'] = $quotaDesc;
 
-		$html .= replace_macros(get_markup_template('cloud_directory.tpl'), array(
+		$output = '';
+		if ($this->enablePost) {
+			$this->server->broadcastEvent('onHTMLActionsPanel', array($parent, &$output));
+		}
+
+		$html .= replace_macros(get_markup_template('cloud_header.tpl'), array(
 				'$header' => t('Files') . ": " . $this->escapeHTML($path) . "/",
+				'$quota' => $quota,
+				'$total' => t('Total'),
+				'$actionspanel' => $output
+			));
+
+		$html .= replace_macros(get_markup_template('cloud_directory.tpl'), array(
 				'$parentpath' => $parentpath,
 				'$entries' => $f,
-				'$quota' => $quota,
 				'$name' => t('Name'),
 				'$type' => t('Type'),
 				'$size' => t('Size'),
@@ -250,15 +260,9 @@ class RedBrowser extends DAV\Browser\Plugin {
 				'$parent' => t('parent'),
 				'$edit' => t('Edit'),
 				'$delete' => t('Delete'),
-				'$total' => t('Total')		
+				'$nick' => $this->auth->getCurrentUser()
 			));
 
-		$output = '';
-		if ($this->enablePost) {
-			$this->server->broadcastEvent('onHTMLActionsPanel', array($parent, &$output));
-		}
-		$html .= $output;
-
 		get_app()->page['content'] = $html;
 		load_pdl(get_app());
 		construct_page(get_app());
@@ -371,4 +375,4 @@ class RedBrowser extends DAV\Browser\Plugin {
 		}
 		return $id;
 	}
-}
+}

mod/filestorage.php

@@ -146,7 +146,8 @@ function filestorage_content(&$a) {
 			'$submit' => t('Submit')
 		));
 
-		return $o;
+		echo $o;
+		killme();
 	}
 
 	goaway(z_root() . '/cloud/' . $which);

view/js/main.js

@@ -208,6 +208,7 @@
 	var pageHasMoreContent = true;
 	var updateCountsOnly = false;
 	var divmore_height = 400;
+	var last_filestorage_id = null;
 
 	$(function() {
 		$.ajaxSetup({cache: false});
@@ -842,6 +843,17 @@ function updateConvItems(mode,data) {
 		});
 	}
 
+	function filestorage(event,nick,id) {
+		$('#perms-panel-' + last_filestorage_id).html('');
+		$('#file-edit-' + id).spin('tiny');
+		delete acl;
+		$.get('filestorage/' + nick + '/' + id + '/edit', function(data) {
+			$('#perms-panel-' + id).html(data);
+			$('#file-edit-' + id).spin(false);
+			last_filestorage_id = id;
+		});
+	}
+
 	function post_comment(id) {
 		unpause();
 		commentBusy = true;

view/js/mod_filestorage.js

@@ -13,4 +13,5 @@ $(document).ready(function() {
 		}
 
 	}).trigger('change');
+
 });

view/theme/redbasic/css/style.css

@@ -2076,18 +2076,8 @@ nav .dropdown-menu>li>a:hover,nav .dropdown-menu>li>a:focus{
 	color: $nav_active_icon_colour;
 }
 
-/* Files */
-
-#attach-edit-perms {
-	margin-top: 25px;
-	margin-bottom: 20px;
-	font-weight: bold;
-	font-size: 17px;
-}
-
 /* bootstrap overrides */
 
-
 blockquote {
 	font-size: $font_size;
 	font-style: italic;

view/tpl/attach_edit.tpl

@@ -1,16 +1,16 @@
-<div id="attach-edit-backlink">< <a href="{{$parentpath}}">{{$backlink}}</a></div>
-
-<h1>{{$header}}</h1>
-
 <form action="filestorage/{{$channelnick}}/{{$file.id}}/edit" method="post" >
 
 <div id="attach-edit-perms" >
 <button id="dbtn-acl" class="btn btn-default btn-sm" data-toggle="modal" data-target="#aclModal" title="{{$permset}}" onclick="return false;">
 	<i id="jot-perms-icon" class="icon-{{$lockstate}} jot-icons"></i>
 </button>
-{{$aclselect}} {{$file.filename}}
+<button id="dbtn-submit" class="btn btn-primary btn-sm" type="submit" name="submit">
+	{{$submit}}
+</button>
 </div>
 
+{{$aclselect}}
+
 <input type="hidden" name="channelnick" value="{{$channelnick}}" />
 <input type="hidden" name="filehash" value="{{$file.hash}}" />
 <input type="hidden" name="uid" value="{{$uid}}" />
@@ -28,9 +28,7 @@
 
 <div class="cut-paste-desc">{{$cpldesc}}</div>
 <input type="text" id="linkpasteinput" name="cutpasteextlink" value="{{$cloudpath}}" onclick="this.select();"/><br />
-
 <div class="clear"></div>
-<input id="dbtn-submit" type="submit" name="submit" value="{{$submit}}" />
+
 </form>
 
-

view/tpl/cloud_actionspanel.tpl

@@ -1,27 +1,17 @@
-<div class="generic-content-wrapper-styled">
+<div id="files-mkdir-tools" class="section-content-tools-wrapper form-group">
-
+	<label for="files-mkdir">{{$folder_header}}</label>
-<table>
+	<form method="post" action="">
-	<tr>
+		<input type="hidden" name="sabreAction" value="mkcol">
-		<td><strong>{{$folder_header}}</strong>&nbsp;&nbsp;&nbsp;</td>
+		<input id="files-mkdir" type="text" name="name">
-		<td>
+		<input type="submit" value="{{$folder_submit}}">
-			<form method="post" action="">
+	</form>
-				<input type="hidden" name="sabreAction" value="mkcol">
+</div>
-				<input type="text" name="name">
+<div id="files-upload-tools" class="section-content-tools-wrapper form-group">
-				<input type="submit" value="{{$folder_submit}}">
+	<label for="files-upload">{{$upload_header}}</label>
-			</form>
+	<form method="post" action="" enctype="multipart/form-data">
-		</td>
+		<input type="hidden" name="sabreAction" value="put">
-	</tr>
+		<input id="files-upload" type="file" name="file" style="display: inline;">
-	<tr>
+		<input type="submit" value="{{$upload_submit}}">
-		<td><strong>{{$upload_header}}</strong>&nbsp;&nbsp;&nbsp;</td>
+		<!-- Name (optional): <input type="text" name="name"> we should rather provide a rename action in edit form-->
-		<td>
+	</form>
-			<form method="post" action="" enctype="multipart/form-data">
-				<input type="hidden" name="sabreAction" value="put">
-				<input type="file" name="file" style="display: inline;">
-				<input type="submit" value="{{$upload_submit}}">
-				<!-- Name (optional): <input type="text" name="name"> we should rather provide a rename action in edit form-->
-			</form>
-		</td>
-	</tr>
-</table>
-
 </div>

view/tpl/cloud_directory.tpl

@@ -1,5 +1,5 @@
 <div class="generic-content-wrapper-styled">
-<h1>{{$header}}</h1>
+
 <table id="cloud-index">
 	<tr>
 		<th></th>
@@ -26,8 +26,9 @@
 		<td style="min-width: 15em"><a href="{{$item.fullPath}}">{{$item.displayName}}</a></td>
 {{if $item.is_owner}}
 		<td>{{$item.attachIcon}}</td>
-		<td style="position:relative;"><a href="{{$item.fileStorageUrl}}/{{$item.attachId}}/edit" title="{{$edit}}"><i class="icon-pencil btn btn-default"></i></a></td>
+		<td style="position:relative;"><i id="file-edit-{{$item.attachId}}" class="fakelink icon-pencil" onclick="filestorage(event, '{{$nick}}', {{$item.attachId}});"></i></td>
-		<td><a href="{{$item.fileStorageUrl}}/{{$item.attachId}}/delete" title="{{$delete}}" onclick="return confirmDelete();"><i class="icon-remove btn btn-default drop-icons"></i></a></td>
+		<td><a href="{{$item.fileStorageUrl}}/{{$item.attachId}}/delete" title="{{$delete}}" onclick="return confirmDelete();"><i class="icon-remove drop-icons"></i></a></td>
+
 {{else}}
 		<td></td><td></td><td></td>
 {{/if}}
@@ -35,11 +36,8 @@
 		<td>{{$item.sizeFormatted}}</td>
 		<td>{{$item.lastmodified}}</td>
 	</tr>
+	<tr><td id="perms-panel-{{$item.attachId}}" colspan="8"></td></tr>
 {{/foreach}}
-	<tr><td colspan="8"><hr></td></tr>
-</table>
 
-{{if $quota.limit || $quota.used}}
+</table>
-	<p><strong>{{$total}}</strong> {{$quota.desc}}</p>
-{{/if}}
 </div>