caojiezi2003/Stackedit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added filter in file selector

Browse Source
This commit is contained in:
benweet 2013-05-20 00:26:05 +01:00
parent deabd4f754
commit 926edc6ea2
4 changed files with 69 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
css/main.css
View File

@ -123,10 +123,10 @@ input[type="color"]:focus,
.navbar-inner .btn.disabled,
.navbar-inner .btn[disabled] {
color: #333333;
background-color: #ddd;
color: #333333;
background-color: #ddd;
opacity: 0.3;
filter: alpha(opacity=30);
filter: alpha(opacity=30);
}
.dropdown-menu > li > a:hover,
@ -136,7 +136,13 @@ input[type="color"]:focus,
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
background-color: #888;
background-color: #888;
}
.dropdown-menu > .disabled > a,
.dropdown-menu > .disabled > a:hover,
.dropdown-menu > .disabled > a:focus {
color: #bbb;
}
.btn-primary {
@ -195,7 +201,12 @@ hr {
#file-selector {
max-height: 500px;
overflow-y: auto;
overflow-y: auto;
overflow-x: hidden;
}
#file-selector .stick {
padding: 10px 20px 0;
}
#file-title {

24
index.html
View File

@ -33,10 +33,12 @@
</ul>
<ul class="nav pull-right hide" id="menu-bar">
<li class="btn-group">
<button class="btn action-force-sync" title="Synchronize">
<button class="btn action-force-sync"
title="Synchronize all documents">
<i class="icon-refresh"></i>
</button>
<button class="btn action-force-publish" title="Publish">
<button class="btn action-force-publish"
title="Publish this document">
<i class="icon-share"></i>
</button>
<button class="btn dropdown-toggle" data-toggle="dropdown"
@ -64,18 +66,24 @@
data-toggle="modal" data-target="#modal-remove-file-confirm">
<i class="icon-trash"></i>
</button>
<button class="btn dropdown-toggle" data-toggle="dropdown"
title="Open local document">
<button class="btn dropdown-toggle action-open-file"
data-toggle="dropdown" title="Open local document">
<i class="icon-folder-open"></i>
</button>
<ul id="file-selector" class="dropdown-menu">
<li class="stick">
<div class="input-prepend">
<span class="add-on"><i class="icon-search"></i></span><input
type="text" id="file-search" class="span3">
</div>
</li>
</ul></li>
<li class="btn-group"><button class="btn dropdown-toggle"
data-toggle="dropdown" title="Menu">
<i class="icon-stackedit"></i>&nbsp;&nbsp;<b class="caret"></b>
</button>
<ul class="dropdown-menu">
<li><a href="viewer.html" title="Viewer"><i
<li><a href="viewer.html" title="StackEdit Viewer"><i
class="icon-fullscreen"></i> Open viewer</a></li>
<li><a class="action-download-md" href="#"><i
class="icon-download-alt"></i> Save as Markdown</a></li>
@ -181,13 +189,13 @@
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"
aria-hidden="true">&times;</button>
<h3>Remove</h3>
<h3>Delete</h3>
</div>
<div class="modal-body">
<p>Are you sure you want to remove "<span class="file-title"></span>"?
<p>Are you sure you want to delete "<span class="file-title"></span>"?
</p>
<blockquote class="muted">
<b>NOTE:</b> This will not remove the file on synchronized
<b>NOTE:</b> This will not delete the file on synchronized
locations.
</blockquote>
</div>

31
js/file-manager.js
View File

@ -133,7 +133,6 @@ define(["jquery", "core", "synchronizer", "publisher", "sharing", "text!../WELCO
};
fileManager.updateFileTitles = function() {
$("#file-selector").empty();
fileDescList = _.chain(localStorage["file.list"].split(";")).compact()
.reduce(function(fileDescList, fileIndex) {
var title = localStorage[fileIndex + ".title"];
@ -178,7 +177,7 @@ define(["jquery", "core", "synchronizer", "publisher", "sharing", "text!../WELCO
$("#file-title-input").val(title);
// Update the file selector
$("#file-selector").empty();
$("#file-selector li:not(.stick)").empty();
_.each(fileDescList, function(fileDesc) {
var a = $("<a>").html(composeTitle(fileDesc.index));
var li = $("<li>").append(a);
@ -243,6 +242,23 @@ define(["jquery", "core", "synchronizer", "publisher", "sharing", "text!../WELCO
}).value();
};
// Filter for search input in file selector
function filterFileSelector(filter) {
var liList = $("#file-selector li:not(.stick)");
liList.show();
if(filter) {
var words = filter.toLowerCase().split(/\s+/);
liList.each(function() {
var fileTitle = $(this).text().toLowerCase();
if(_.some(words, function(word) {
return fileTitle.indexOf(word) === -1;
})) {
$(this).hide();
}
});
}
}
core.onReady(function() {
fileManager.selectFile();
@ -287,6 +303,17 @@ define(["jquery", "core", "synchronizer", "publisher", "sharing", "text!../WELCO
applyTitle($(this));
}
});
$(".action-open-file").click(function() {
filterFileSelector();
_.defer(function() {
$("#file-search").val("").focus();
});
});
$("#file-search").keyup(function() {
filterFileSelector($(this).val());
}).click(function(event) {
event.stopPropagation();
});
$(".action-open-stackedit").click(function() {
window.location.href = ".";
});

10
viewer.html
View File

@ -49,11 +49,17 @@
class="icon-download-alt"></i> Save using template</a></li>
</ul></li>
<li class="btn-group">
<button class="btn dropdown-toggle" data-toggle="dropdown"
title="Open local document">
<button class="btn dropdown-toggle action-open-file"
data-toggle="dropdown" title="Open local document">
<i class="icon-folder-open"></i>
</button>
<ul id="file-selector" class="dropdown-menu">
<li class="stick">
<div class="input-prepend">
<span class="add-on"><i class="icon-search"></i></span><input
type="text" id="file-search" class="span3">
</div>
</li>
</ul></li>
<li class="btn-group"><button class="btn action-open-stackedit"
title="Open StackEdit"><i