Skip to content

Commit

Permalink
Adjust behaviours and polish up styles
Browse files Browse the repository at this point in the history 
Signed-off-by: Kaustav Das Modak <[email protected]>
  • Loading branch information
Kaustav Das Modak committed Oct 3, 2014
1 parent 3e1dfa3 commit 2d8a072
Show file tree
Hide file tree
Showing 3 changed files with 107 additions and 56 deletions.
24 changes: 22 additions & 2 deletions css/app.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,14 @@ x-flipbox {
padding: 20px;
top: 45px;
left: 0;
overflow: auto;
overflow-x: hidden;
overflow-y: auto;
}

x-appbar .button {
padding-left: 10px;
padding-right: 10px;
font-size: 0.8em;
}

#searchform-inner {
Expand Down Expand Up @@ -61,6 +68,10 @@ x-flipbox {
text-indent: 10px;
}

#searchbox:disabled {
color: #999;
}

#searchsubmit {
display: block;
width: 100%;
Expand All @@ -69,12 +80,16 @@ x-flipbox {
text-align: center;
text-decoration: none;
background-color: #04B309;
color: #fff;
color: #d6d6d6;
outline: 0;
border: 1px solid #038207;
border-radius: 0;
}

#searchsubmit.active {
color: #fff;
}

#resultsbox {
list-style-type: none;
margin: 0;
Expand All @@ -93,6 +108,11 @@ x-flipbox {
border-color: #0095DD;
}

li > p:not(.resultitem) {
padding: 0.5em;
margin: 0.5em;
}

.resultitem h4 {
padding: 0;
margin: 0;
Expand Down
10 changes: 5 additions & 5 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<title>Finder</title>
<meta name="description" content="Search and pick files from device">

<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

<link rel="stylesheet" type="text/css" href="css/normalize.css">
<link rel="stylesheet" type="text/css" href="css/brick.css">
Expand All @@ -16,19 +16,19 @@
<body>

<x-appbar>
<button id="menu-btn">≡</button>
<button id="menu-btn" class="button">≡</button>
<h1>Finder</h1>
<button id="reset-btn">Reset</button>
<button id="reset-btn" class="button">Reset</button>
</x-appbar>
<x-flipbox>
<div class="main-content">
<form id="searchform">
<div id="searchform-inner">
<div id="searchbox-wrapper">
<input id="searchbox" type="text" placeholder="Search..." maxlength="20" required>
<input id="searchbox" type="text" placeholder="Search..." maxlength="20">
</div>
<div id="searchsubmit-wrapper">
<a id="searchsubmit" class="button" href="#">Go</a>
<a id="searchsubmit" class="button active" href="#">Go</a>
</div>
</div>
</form>
Expand Down
129 changes: 80 additions & 49 deletions js/app.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,34 @@ window.addEventListener('DOMContentLoaded', function() {
}
});

/**
* Clean up artefacts to clear up memory
*/
var cleanupsearch = function () {
results = [];
resultsbox.html("");
searchcompletecount = 0;
totalfilematchcount = 0;
};

/**
* Interactions when search has started
*/
var startprogress = function () {
searchbox.attr('disabled', 'disabled');
searchsubmit.removeClass('active');
wobblebar.removeClass("hide");
};

/**
* Interactions when search has ended
*/
var stopprogress = function () {
searchbox.removeAttr('disabled');
searchsubmit.addClass('active');
wobblebar.addClass("hide");
};

/**
* Trigger search
*/
Expand All @@ -47,8 +75,17 @@ window.addEventListener('DOMContentLoaded', function() {
};


finder.events.addListener("empty", function (needle) {
finder.events.addListener("searchCancelled", function () {
cleanupsearch();
stopprogress();
searchbox.focus();
wobblebar.addClass("hide");
});

finder.events.addListener("empty", function (needle) {
cleanupsearch();
stopprogress();
searchbox.focus();
resultsbox.append($("<li><p><em>No results found.</em></p></li>"));
});

Expand All @@ -57,57 +94,55 @@ window.addEventListener('DOMContentLoaded', function() {
});

finder.events.on("searchBegin", function (needle) {
results = [];
resultsbox.html("");
searchcompletecount = 0;
totalfilematchcount = 0;
});

finder.events.on("storageSearchBegin", function (storageName, needle) {
wobblebar.removeClass("hide");
cleanupsearch();
startprogress();
});

finder.events.on("searchComplete", function (storageName, needle, filematchcount) {
results.length && results.forEach(function (result, i) {
var resultitem = $("<li></li>").attr({
"data-file" : result.file.name,
"data-type" : result.file.type,
"data-storage": result.storageName,
"data-result-index": i,
"class" : "resultitem panel"

searchcompletecount++;
totalfilematchcount += filematchcount;

if (searchcompletecount >= finder.storages.length) {

results.length && results.forEach(function (result, i) {
var resultitem = $("<li></li>").attr({
"data-file" : result.file.name,
"data-type" : result.file.type,
"data-storage": result.storageName,
"data-result-index": i,
"class" : "resultitem panel"
});
resultitem.append($("<h4>" + result.fileinfo.name + "</h4><small>" + result.fileinfo.path + "</small>"));
resultsbox.append(resultitem);
});
resultitem.append($("<h4>" + result.fileinfo.name + "</h4><small>" + result.fileinfo.path + "</small>"));
resultsbox.append(resultitem);
});

$(".resultitem").bind("click", function (event) {
if (isactivity) {
$(document).trigger("finderFilePicked", [results[$(this).attr("data-result-index")].file]);
} else {
var activityname = "open";

if ($.inArray($(this).attr("data-type"), ["application/pdf"]) > -1) {
activityname = "view";
}

var activity = new MozActivity({
name: activityname,
data: {
type: $(this).attr("data-type"),
blob: results[$(this).attr("data-result-index")].file
$(".resultitem").bind("click", function (event) {
if (isactivity) {
$(document).trigger("finderFilePicked", [results[$(this).attr("data-result-index")].file]);
} else {
var activityname = "open";

if ($.inArray($(this).attr("data-type"), ["application/pdf"]) > -1) {
activityname = "view";
}
});
}
});

var activity = new MozActivity({
name: activityname,
data: {
type: $(this).attr("data-type"),
blob: results[$(this).attr("data-result-index")].file
}
});
}
});

stopprogress();

searchcompletecount++;
totalfilematchcount += filematchcount;
if (searchcompletecount >= finder.storages.length) {
wobblebar.addClass("hide");
if(!totalfilematchcount) {
resultsbox.append($("<li><p><em>No results found.</em></p></li>"));
}

searchcompletecount = 0;
totalfilematchcount = 0;
}
Expand All @@ -117,7 +152,7 @@ window.addEventListener('DOMContentLoaded', function() {
* Bind search trigger to search form submit
*/
searchform.bind("submit", searchtrigger);
searchsubmit.bind("click", searchtrigger);
$(searchsubmit.selector + ".active").bind("click", searchtrigger);

/**
* UI sweetness
Expand All @@ -131,12 +166,8 @@ window.addEventListener('DOMContentLoaded', function() {

$("#reset-btn").bind("click", function (event) {
event.preventDefault();
searchbox.val("");
results = [];
resultsbox.html("");
searchbox.focus();
searchcompletecount = 0;
totalfilematchcount = 0;
wobblebar.addClass("hide");
cleanupsearch();
stopprogress();
searchbox.val("");;
});
});

0 comments on commit 2d8a072

Please sign in to comment.