Added toggleable QuickAccess

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Deleted wrongly commited File

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Added quickaccess-state persistence

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Started implementing sorting-algorithm for proper alphabetical display

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Finished Sorting of Quickaccess elements

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Implemented persistence for reverse-list and sorting-strategy

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Implemented initial sorting for reverse-list and sorting-strategy

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Refactored Code

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Refactored Code

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Refactored Code

Signed-off-by: fnuesse <felix.nuesse@t-online.de>
This commit is contained in:
fnuesse 2018-06-16 22:44:18 +02:00 committed by John Molakvoæ (skjnldsv)
parent 72ace9697c
commit fc4baed6e5
No known key found for this signature in database
GPG Key ID: 60C25B8C072916CF
7 changed files with 357 additions and 110 deletions

View File

@ -86,6 +86,26 @@ $application->registerRoutes(
'url' => '/api/v1/hidequickaccess', 'url' => '/api/v1/hidequickaccess',
'verb' => 'GET', 'verb' => 'GET',
], ],
[
'name' => 'API#setSortingStrategy',
'url' => '/api/v1/setsortingstrategy',
'verb' => 'GET',
],
[
'name' => 'API#setReverseQuickaccess',
'url' => '/api/v1/setreversequickaccess',
'verb' => 'GET',
],
[
'name' => 'API#getSortingStrategy',
'url' => '/api/v1/getsortingstrategy',
'verb' => 'GET',
],
[
'name' => 'API#getReverseQuickaccess',
'url' => '/api/v1/getreversequickaccess',
'verb' => 'GET',
]
] ]
] ]
); );

View File

@ -54,18 +54,13 @@
var showHidden = $('#showHiddenFiles').val() === "1"; var showHidden = $('#showHiddenFiles').val() === "1";
this.$showHiddenFiles.prop('checked', showHidden); this.$showHiddenFiles.prop('checked', showHidden);
this.$showQuickAccess = $('input#showfavoritequickaccessToggle');
var showQuickAccess = $('#showFavoriteQuickAccess').val() === "1";
this.$showQuickAccess.prop('checked', showQuickAccess);
if ($('#fileNotFound').val() === "1") { if ($('#fileNotFound').val() === "1") {
OC.Notification.show(t('files', 'File could not be found'), {type: 'error'}); OC.Notification.show(t('files', 'File could not be found'), {type: 'error'});
} }
this._filesConfig = new OC.Backbone.Model({ this._filesConfig = new OC.Backbone.Model({
showhidden: showHidden, showhidden: showHidden
showQuickAccess: showQuickAccess
}); });
var urlParams = OC.Util.History.parseUrlQuery(); var urlParams = OC.Util.History.parseUrlQuery();
@ -138,7 +133,6 @@
}); });
this._debouncedPersistShowHiddenFilesState = _.debounce(this._persistShowHiddenFilesState, 1200); this._debouncedPersistShowHiddenFilesState = _.debounce(this._persistShowHiddenFilesState, 1200);
this._debouncedPersistShowQuickAccessState = _.debounce(this._persistShowQuickAccessState, 1200);
}, },
/** /**
@ -213,7 +207,6 @@
$('#app-navigation').on('itemChanged', _.bind(this._onNavigationChanged, this)); $('#app-navigation').on('itemChanged', _.bind(this._onNavigationChanged, this));
this.$showHiddenFiles.on('change', _.bind(this._onShowHiddenFilesChange, this)); this.$showHiddenFiles.on('change', _.bind(this._onShowHiddenFilesChange, this));
this.$showQuickAccess.on('change', _.bind(this._onShowQuickAccessChange, this));
}, },
/** /**
@ -228,7 +221,7 @@
}, },
/** /**
* Persist show hidden preference on ther server * Persist show hidden preference on the server
* *
* @returns {undefined} * @returns {undefined}
*/ */
@ -239,35 +232,6 @@
}); });
}, },
/**
* Toggle showing hidden files according to the settings checkbox
*
* @returns {undefined}
*/
_onShowQuickAccessChange: function() {
var qa = this.$showQuickAccess.is(':checked');
this._filesConfig.set('show_quick_access', qa);
this._debouncedPersistShowQuickAccessState();
},
/**
* Persist show hidden preference on ther server
*
* @returns {undefined}
*/
_persistShowQuickAccessState: function() {
var qa = this._filesConfig.get('show_quick_access');
var url="/apps/files/api/v1/hidequickaccess";
if(qa){
url="/apps/files/api/v1/showquickaccess";
}
$.get(OC.generateUrl(url),function(data, status){
});
},
/** /**
* Event handler for when the current navigation item has changed * Event handler for when the current navigation item has changed
*/ */

View File

@ -4,6 +4,8 @@
* @author Vincent Petry * @author Vincent Petry
* @copyright 2014 Vincent Petry <pvince81@owncloud.com> * @copyright 2014 Vincent Petry <pvince81@owncloud.com>
* *
* Edited by: Felix Nüsse <felix.nuesse@t-online.de> 2018
*
* This file is licensed under the Affero General Public License version 3 * This file is licensed under the Affero General Public License version 3
* or later. * or later.
* *
@ -38,6 +40,10 @@
*/ */
$currentContent: null, $currentContent: null,
/**
* Strategy by which the quickaccesslist is sorted
*/
$sortingStrategy: 'alphabet',
/** /**
* Initializes the navigation from the given container * Initializes the navigation from the given container
* *
@ -49,13 +55,16 @@
this._activeItem = null; this._activeItem = null;
this.$currentContent = null; this.$currentContent = null;
this._setupEvents(); this._setupEvents();
this.initialSort();
}, },
/** /**
* Setup UI events * Setup UI events
*/ */
_setupEvents: function() { _setupEvents: function() {
this.$el.on('click', 'li a', _.bind(this._onClickItem, this)); this.$el.on('click', 'li a', _.bind(this._onClickItem, this))
this.$el.on('click', 'li button', _.bind(this._onClickMenuButton, this));
this.$el.on('click', 'li input', _.bind(this._onClickMenuItem, this));
}, },
/** /**
@ -127,9 +136,193 @@
this.setActiveItem(itemId); this.setActiveItem(itemId);
} }
ev.preventDefault(); ev.preventDefault();
},
/**
* Event handler for when clicking on an three-dot-menu.
*/
_onClickMenuButton: function(ev) {
var $target = $(ev.target);
var itemId = $target.closest('button').attr('id');
if(itemId==='button-favorites'){
document.getElementById('menu-favorites').classList.toggle('open');
}
ev.preventDefault();
},
/**
* Event handler for when clicking on a menuitem.
*/
_onClickMenuItem: function(ev) {
var qaSelector= '#quickaccess-list';
var qaKey= 'quickaccess-list';
var itemId = $(ev.target).closest('input').attr('id');
var list = document.getElementById(qaKey).getElementsByTagName('li');
if(itemId==='enableQuickAccess'){
$.get(OC.generateUrl("/apps/files/api/v1/showquickaccess"), {show: document.getElementById('enableQuickAccess').checked}, function(data, status){
});
$(qaSelector ).toggle();
document.getElementById('menu-favorites').classList.toggle('open');
}
if(itemId==='sortByAlphabet'){
//Prevents deselecting Group-Item
if(!document.getElementById('sortByAlphabet').checked){
ev.preventDefault();
return;
}
this.sortingStrategy='alphabet';
document.getElementById('sortByDate').checked=false;
$.get(OC.generateUrl("/apps/files/api/v1/setsortingstrategy"), {strategy: this.sortingStrategy}, function(data, status){});
this.QuickSort(list, 0, list.length - 1);
document.getElementById('menu-favorites').classList.toggle('open');
}
if(itemId==='sortByDate'){
//Prevents deselecting Group-Item
if(!document.getElementById('sortByDate').checked){
ev.preventDefault();
return;
}
this.sortingStrategy='date';
document.getElementById('sortByAlphabet').checked=false;
$.get(OC.generateUrl("/apps/files/api/v1/setsortingstrategy"), {strategy: this.sortingStrategy}, function(data, status){});
this.QuickSort(list, 0, list.length - 1);
document.getElementById('menu-favorites').classList.toggle('open');
}
if(itemId==='enableReverse'){
this.reverse(list);
var state = document.getElementById('enableReverse').checked;
$.get(OC.generateUrl("/apps/files/api/v1/setreversequickaccess"), {reverse: state}, function(data, status){});
document.getElementById('menu-favorites').classList.toggle('open');
}
//ev.preventDefault();
},
/**
* Sort initially as setup of sidebar for QuickAccess
*/
initialSort: function() {
var domRevState=document.getElementById('enableReverse').checked;
var domSortAlphabetState=document.getElementById('sortByAlphabet').checked;
var domSortDateState=document.getElementById('sortByDate').checked;
var qaKey= 'quickaccess-list';
var list = document.getElementById(qaKey).getElementsByTagName('li');
if(domSortAlphabetState){
this.sortingStrategy='alphabet';
}
if(domSortDateState){
this.sortingStrategy='date';
}
this.QuickSort(list, 0, list.length - 1);
if(domRevState){
this.reverse(list);
}
/*This creates flashes the UI, which is bad userexperience. It is the cleaner way to do it, that is why i haven't deleted it yet.
var scope=this;
$.get(OC.generateUrl("/apps/files/api/v1/getsortingstrategy"), function(data, status){
scope.sortingStrategy=data;
scope.QuickSort(list, 0, list.length - 1);
});
$.get(OC.generateUrl("/apps/files/api/v1/getreversequickaccess"), function(data, status){
if(data){
scope.reverse(list);
}
});
*/
},
/**
* Sorting-Algorithm for QuickAccess
*/
QuickSort: function(list, start, end) {
var lastmatch;
if(list.length > 1){
lastmatch = this.quicksort_helper(list, start, end);
if(start < lastmatch - 1){
this.QuickSort(list, start, lastmatch - 1);
}
if(lastmatch < end){
this.QuickSort(list, lastmatch, end);
}
}
},
/**
* Sorting-Algorithm-Helper for QuickAccess
*/
quicksort_helper: function(list, start, end) {
var pivot = Math.floor((end + start) / 2);
var pivotelem = this.getCompareValue(list,pivot);
var i = start;
var j = end;
while(i <= j){
while(this.getCompareValue(list,i) < pivotelem){
i++;
}
while(this.getCompareValue(list,j) > pivotelem){
j--;
}
if(i <= j){
this.swap(list, i, j);
i++;
j--;
}
}
return i;
},
/**
* Sorting-Algorithm-Helper for QuickAccess
* This method allows easy access to the element which is sorted by.
*/
getCompareValue: function(nodes, int){
if(this.sortingStrategy==='alphabet'){
; return nodes[int].getElementsByTagName('a')[0].innerHTML.toLowerCase()
}else if(this.sortingStrategy==='date'){
return nodes[int].getAttribute('folderPos').toLowerCase();
}
return nodes[int].getElementsByTagName('a')[0].innerHTML.toLowerCase();
},
/**
* Sorting-Algorithm-Helper for QuickAccess
* This method allows easy swapping of elements.
*/
swap: function(list, j, i){
list[i].before(list[j]);
list[j].before(list[i]);
},
/**
* Reverse QuickAccess-List
*/
reverse: function(list){
var len=list.length-1;
for(var i = 0; i < len/2; i++) {
this.swap(list, i, len-i);
}
} }
}; };
OCA.Files.Navigation = Navigation; OCA.Files.Navigation = Navigation;
})(); })();

View File

@ -45,6 +45,7 @@ use OCP\IPreview;
use OCP\Share\IManager; use OCP\Share\IManager;
use OC\Files\Node\Node; use OC\Files\Node\Node;
use OCP\IUserSession; use OCP\IUserSession;
use Sabre\VObject\Property\Boolean;
/** /**
* Class ApiController * Class ApiController
@ -270,27 +271,64 @@ class ApiController extends Controller {
* *
* @NoAdminRequired * @NoAdminRequired
* *
* @param int $value * @param bool $show
*
* @return Response * @return Response
*/ */
public function showQuickAccess() { public function showQuickAccess($show) {
$this->config->setUserValue($this->userSession->getUser()->getUID(), 'files', 'show_Quick_Access', 1); $this->config->setUserValue($this->userSession->getUser()->getUID(), 'files', 'show_Quick_Access', (int) $show);
return new Response(); return new Response();
} }
/** /**
* Toggle default for showing/hiding QuickAccess folder * quickaccess-sorting-strategy
* *
* @NoAdminRequired * @NoAdminRequired
* *
* @param int $value * @param string $strategy
* @return Response * @return Response
*/ */
public function hideQuickAccess() { public function setSortingStrategy($strategy) {
$this->config->setUserValue($this->userSession->getUser()->getUID(), 'files', 'show_Quick_Access', 0); $this->config->setUserValue($this->userSession->getUser()->getUID(), 'files', 'quickaccess_sorting_strategy', (String) $strategy);
return new Response(); return new Response();
}
/**
* Get reverse-state for quickaccess-list
*
* @NoAdminRequired
*
* @return String
*/
public function getSortingStrategy() {
return $this->config->getUserValue($this->userSession->getUser()->getUID(), 'files', 'quickaccess_sorting_strategy', 'date');
}
/**
* Toggle for reverse quickaccess-list
*
* @NoAdminRequired
*
* @param bool $reverse
* @return Response
*/
public function setReverseQuickaccess($reverse) {
$this->config->setUserValue($this->userSession->getUser()->getUID(), 'files', 'quickaccess_reverse_list', (int) $reverse);
return new Response();
}
/**
* Get reverse-state for quickaccess-list
*
* @NoAdminRequired
*
* @return bool
*/
public function getReverseQuickaccess() {
if($this->config->getUserValue($this->userSession->getUser()->getUID(), 'files', 'quickaccess_reverse_list', false)){
return true;
} }
return false;
}
} }

View File

@ -159,58 +159,73 @@ class ViewController extends Controller {
// FIXME: Make non static // FIXME: Make non static
$storageInfo = $this->getStorageInfo(); $storageInfo = $this->getStorageInfo();
$user = $this->userSession->getUser()->getUID();
$sorting=$this->config->getUserValue($user,$this->appName,'quickaccess_sorting_strategy','date');
$reverseListSetting=$this->config->getUserValue($user,$this->appName,'quickaccess_reverse_list','false');
if($this->config->getUserValue($user,$this->appName,'show_Quick_Access',true)){
$expanded='true';
}else{
$expanded='false';
}
\OCA\Files\App::getNavigationManager()->add( \OCA\Files\App::getNavigationManager()->add(
[ [
'id' => 'favorites', 'id' => 'favorites',
'appname' => 'files', 'appname' => 'files',
'script' => 'simplelist.php', 'script' => 'simplelist.php',
'enableQuickaccess' => $expanded,
'quickaccessSortingStrategy' => $sorting,
'quickaccessSortingReverse' => $reverseListSetting,
'order' => 5, 'order' => 5,
'name' => $this->l10n->t('Favorites') 'name' => $this->l10n->t('Favorites')
] ]
); );
$user = $this->userSession->getUser()->getUID();
$tagger=\OC::$server->getTagManager(); $tagger=\OC::$server->getTagManager();
$helper= new \OCA\Files\Activity\Helper($tagger); $helper= new \OCA\Files\Activity\Helper($tagger);
$favElements = $helper->getFavoriteFilePaths($this->userSession->getUser()->getUID()); $favElements = $helper->getFavoriteFilePaths($this->userSession->getUser()->getUID());
$favItems = $favElements['items'];
$key='show_Quick_Access'; $FavoritesFolderCount=sizeof($favElements['folders']);
if($FavoritesFolderCount>0){
if($this->config->getUserValue($user,$this->appName,$key,true) && sizeof($favElements['folders'])>0){ $NavBarPositionPosition=6;
/*$nav->assign('showQuickAccess', 1); $currentCount=0;
\OCA\Files\App::getNavigationManager()->add( foreach($favElements['folders'] as $elem){
[
'id' => 'Spacer',
'classes' => 'app-navigation-caption',
'order' => 6,
'name' => $this->l10n->t('Quick-Access')
]
);*/
$i=0; $id=substr( $elem, strrpos($elem,'/')+1, strlen($elem));
foreach($favElements['folders'] as $elem){ $link=\OC::$WEBROOT.'/index.php/apps/files/?dir='.$elem;
\OCA\Files\App::getNavigationManager()->add( $SortingValue=++$currentCount;
[ if($currentCount!=$FavoritesFolderCount){
'id' => substr( $elem, strrpos($elem,'/')+1, strlen($elem)), \OCA\Files\App::getNavigationManager()->add(
'href' => \OC::$WEBROOT.'/index.php/apps/files/?dir='.$elem, [
'order' => 7+$i, 'id' => $id,
'classes' => 'app-navigation-subelement', 'href' => $link,
'name' => substr( $elem, strrpos($elem,'/')+1, strlen($elem)), 'order' => $NavBarPositionPosition,
'icon' => 'files' 'folderPosition' => $SortingValue,
] 'name' => $id,
); 'icon' => 'files',
$i++; 'quickaccesselement' => 'true'
]
);
}else{
\OCA\Files\App::getNavigationManager()->add(
[
'id' => $id,
'href' => $link,
'order' => $NavBarPositionPosition,
'folderPosition' => $SortingValue,
'name' => $id,
'icon' => 'files',
'quickaccesselement' => 'last'
]
);
}
$NavBarPositionPosition++;
}
} }
}
$navItems = \OCA\Files\App::getNavigationManager()->getAll(); $navItems = \OCA\Files\App::getNavigationManager()->getAll();
@ -218,10 +233,6 @@ class ViewController extends Controller {
return $item1['order'] - $item2['order']; return $item1['order'] - $item2['order'];
}); });
$nav->assign('navigationItems', $navItems); $nav->assign('navigationItems', $navItems);
$nav->assign('usage', \OC_Helper::humanFileSize($storageInfo['used'])); $nav->assign('usage', \OC_Helper::humanFileSize($storageInfo['used']));

View File

@ -5,12 +5,55 @@
<?php foreach ($_['navigationItems'] as $item) { <?php foreach ($_['navigationItems'] as $item) {
strpos($item['classes'], 'pinned')!==false ? $pinned++ : ''; strpos($item['classes'], 'pinned')!==false ? $pinned++ : '';
?> ?>
<li data-id="<?php p(isset($item['href']) ? $item['href'] : $item['id']) ?>" class="nav-<?php p($item['id']) ?> <?php p($item['classes']) ?> <?php p($pinned===1?'first-pinned':'') ?>">
<li data-id="<?php p(isset($item['href']) ? $item['href'] : $item['id']) ?>"
class="nav-<?php p($item['id']) ?> <?php p($item['classes']) ?> <?php p($pinned===1?'first-pinned':'') ?>"
<?php if(isset($item['folderPosition'])){ ?> folderPos="<?php p($item['folderPosition']);?>"<?php } ?>>
<a href="<?php p(isset($item['href']) ? $item['href'] : '#') ?>" <a href="<?php p(isset($item['href']) ? $item['href'] : '#') ?>"
class="nav-icon-<?php p($item['icon'] !== '' ? $item['icon'] : $item['id']) ?> svg"> class="nav-icon-<?php p($item['icon'] !== '' ? $item['icon'] : $item['id']) ?> svg"><?php p($item['name']);?></a>
<?php p($item['name']);?> <?php if($item['id']=='favorites'){?>
</a>
<div class="app-navigation-entry-utils">
<ul>
<li class="app-navigation-entry-utils-menu-button svg"><button id="button-<?php p($item['id']) ?>"></button></li>
</ul>
</div>
<div class="app-navigation-entry-menu" id="menu-<?php p($item['id']) ?>">
<ul>
<li>
<span class="menuitem">
<input id="enableQuickAccess" type="checkbox" class="checkbox" <?php if($item['enableQuickaccess']=='true'){ ?> checked<?php } ?>/>
<label for="enableQuickAccess"><?php p($l->t('Enable Quickaccess')); ?></label>
</span>
</li>
<li>
<span class="menuitem">
<input id="sortByAlphabet" type="checkbox" class="checkbox" data-group='SortingStrategy'<?php if($item['quickaccessSortingStrategy']=='alphabet'){ ?> checked<?php } ?>/>
<label for="sortByAlphabet"><?php p($l->t('Sort by Alphabet')); ?></label>
</span>
</li>
<li>
<span class="menuitem">
<input id="sortByDate" type="checkbox" class="checkbox" data-group='SortingStrategy'<?php if($item['quickaccessSortingStrategy']=='date'){ ?> checked<?php } ?>/>
<label for="sortByDate"><?php p($l->t('Sort by Date')); ?></label>
</span>
</li>
<li>
<span class="menuitem">
<input id="enableReverse" type="checkbox" class="checkbox" <?php if($item['quickaccessSortingReverse']==true){ ?> checked<?php } ?>/>
<label for="enableReverse"><?php p($l->t('Reverse List')); ?></label>
</span>
</li>
</ul>
</div>
<ul id="quickaccess-list" <?php if($item['enableQuickaccess']=='false'){ ?> style="display: none"<?php } ?>>
<?php } ?>
<?php if($item['quickaccesselement']=='last'){?>
</ul>
<?php } ?>
</li> </li>
<?php } ?> <?php } ?>
<li id="quota" class="pinned <?php p($pinned===0?'first-pinned ':'') ?><?php <li id="quota" class="pinned <?php p($pinned===0?'first-pinned ':'') ?><?php
@ -42,11 +85,6 @@
<input class="checkbox" id="showhiddenfilesToggle" checked="checked" type="checkbox"> <input class="checkbox" id="showhiddenfilesToggle" checked="checked" type="checkbox">
<label for="showhiddenfilesToggle"><?php p($l->t('Show hidden files')); ?></label> <label for="showhiddenfilesToggle"><?php p($l->t('Show hidden files')); ?></label>
</div> </div>
<!--Removed to disable disabling, but kept to allow easy reenabling-->
<!--<div id="files-setting-showFavoriteQuickAccess">
<input class="checkbox" id="showfavoritequickaccessToggle" <?php /*if($_['showQuickAccess']){ */?>checked="checked"<?php /*} */?> type="checkbox">
<label for="showfavoritequickaccessToggle"><?php /*p($l->t('Enable Favorites Quick Access')); */?></label>
</div>-->
<label for="webdavurl"><?php p($l->t('WebDAV'));?></label> <label for="webdavurl"><?php p($l->t('WebDAV'));?></label>
<input id="webdavurl" type="text" readonly="readonly" value="<?php p(\OCP\Util::linkToRemote('webdav')); ?>" /> <input id="webdavurl" type="text" readonly="readonly" value="<?php p(\OCP\Util::linkToRemote('webdav')); ?>" />
<em><?php print_unescaped($l->t('Use this address to <a href="%s" target="_blank" rel="noreferrer noopener">access your Files via WebDAV</a>', array(link_to_docs('user-webdav'))));?></em> <em><?php print_unescaped($l->t('Use this address to <a href="%s" target="_blank" rel="noreferrer noopener">access your Files via WebDAV</a>', array(link_to_docs('user-webdav'))));?></em>

View File

@ -602,23 +602,6 @@ kbd {
user-select: none; user-select: none;
pointer-events:none; pointer-events:none;
} }
.app-navigation-subelement {
line-height: 24px;
white-space: nowrap;
text-overflow: ellipsis;
float: left;
padding-left: 14px;
& a {
//Overrides normal size for smaller subelements
line-height: 24px;
min-height: 24px;
//Removes the double border on the a element
&:visited { box-shadow:none;}
&:hover { box-shadow:none;}
&:active {box-shadow:none; }
}
}
} }
/* APP-CONTENT ---------------------------------------------------------------*/ /* APP-CONTENT ---------------------------------------------------------------*/