Stackedit/public/res/extensions/documentPanel.js

194 lines
7.3 KiB
JavaScript
Raw Normal View History

2013-08-12 00:10:37 +00:00
define([
"jquery",
"underscore",
"utils",
"classes/Extension",
"folderList",
"fileSystem",
], function($, _, utils, Extension, folderList, fileSystem) {
var documentPanel = new Extension("documentPanel", 'Document Panel');
var fileMgr = undefined;
documentPanel.onFileMgrCreated = function(fileMgrParameter) {
fileMgr = fileMgrParameter;
};
var folderEltTmpl = [
2013-08-13 00:03:38 +00:00
'<a href="#"',
' class="list-group-item folder clearfix"',
' data-folder-index="<%= folderDesc.folderIndex %>"',
' data-toggle="collapse"',
' data-target=".document-panel .file-list.<%= id %>">',
' <div class="pull-right file-count">',
' <%= _.size(folderDesc.fileList) %>',
' </div>',
' <i class="icon-folder"></i> <%= folderDesc.name %>',
'</a>',
'<div class="file-list collapse <%= id %> clearfix">',
' <%= fileListHtml %>',
'</div>'
2013-08-12 00:10:37 +00:00
].join('');
var documentEltTmpl = [
2013-08-13 00:03:38 +00:00
'<a href="#"',
' class="list-group-item file<%= fileDesc === selectedFileDesc ? " active" : "" %>"',
' data-file-index="<%= fileDesc.fileIndex %>"',
' data-toggle="collapse"',
' data-target=".document-panel">',
' <%= fileDesc.composeTitle() %>',
'</a>',
2013-08-12 00:10:37 +00:00
].join('');
var panelElt = undefined;
var documentListElt = undefined;
2013-08-13 23:30:50 +00:00
var $documentListElt = undefined;
var documentListFilteredElt = undefined;
var $documentListFilteredElt = undefined;
2013-08-26 11:47:31 +00:00
var selectedFileDesc = undefined;
2013-08-12 00:10:37 +00:00
var refreshPanel = function() {
// List orphan documents
var orphanDocumentList = _.filter(fileSystem, function(fileDesc) {
return fileDesc.folder === undefined;
});
// Add orphan documents
var documentListHtml = _.chain(orphanDocumentList).sortBy(function(fileDesc) {
return fileDesc.title.toLowerCase();
}).reduce(function(result, fileDesc) {
return result + '<li>' + _.template(documentEltTmpl, {
fileDesc: fileDesc,
2013-08-26 11:47:31 +00:00
selectedFileDesc: selectedFileDesc
2013-08-12 00:10:37 +00:00
}) + '</li>';
}, '').value();
2013-08-12 22:08:22 +00:00
documentListHtml = documentListHtml && '<ul class="nav">' + documentListHtml + '</ul>';
2013-08-13 00:03:38 +00:00
2013-08-12 00:10:37 +00:00
// Build directories
_.chain(folderList).sortBy(function(folderDesc) {
return folderDesc.name.toLowerCase();
}).each(function(folderDesc) {
var fileListHtml = _.chain(folderDesc.fileList).sortBy(function(fileDesc) {
return fileDesc.title.toLowerCase();
}).reduce(function(result, fileDesc) {
2013-08-12 22:08:22 +00:00
return result + '<li>' + _.template(documentEltTmpl, {
2013-08-12 00:10:37 +00:00
fileDesc: fileDesc,
2013-08-26 11:47:31 +00:00
selectedFileDesc: selectedFileDesc
2013-08-12 22:08:22 +00:00
}) + '</li>';
2013-08-12 00:10:37 +00:00
}, '').value();
2013-08-12 22:08:22 +00:00
fileListHtml = fileListHtml && '<ul class="nav">' + fileListHtml + '</ul>';
2013-08-12 00:10:37 +00:00
documentListHtml += _.template(folderEltTmpl, {
folderDesc: folderDesc,
fileListHtml: fileListHtml,
id: folderDesc.folderIndex.replace('.', '')
});
});
documentListElt.innerHTML = documentListHtml;
2013-08-13 23:30:50 +00:00
// Create filtered list
var documentListFilteredHtml = _.chain(fileSystem).sortBy(function(fileDesc) {
return fileDesc.title.toLowerCase();
}).reduce(function(result, fileDesc) {
return result + '<li>' + _.template(documentEltTmpl, {
fileDesc: fileDesc,
2013-08-26 11:47:31 +00:00
selectedFileDesc: selectedFileDesc
2013-08-13 23:30:50 +00:00
}) + '</li>';
}, '').value();
documentListFilteredHtml = '<ul class="nav">' + documentListFilteredHtml + '</ul>';
2013-08-13 00:03:38 +00:00
2013-08-13 23:30:50 +00:00
documentListFilteredElt.innerHTML = documentListFilteredHtml;
2013-08-12 00:10:37 +00:00
// Add click listeners
_.each(panelElt.querySelectorAll('.file'), function(fileElt) {
2013-08-22 00:19:59 +00:00
var $fileElt = $(fileElt);
$fileElt.click(function(e) {
var fileDesc = fileSystem[$fileElt.data('fileIndex')];
2013-08-12 00:10:37 +00:00
if(fileDesc && fileDesc !== selectedFileDesc) {
fileMgr.selectFile(fileDesc);
}
});
});
};
documentPanel.onFileSelected = function(fileDesc) {
selectedFileDesc = fileDesc;
refreshPanel();
};
documentPanel.onFileCreated = refreshPanel;
documentPanel.onFileDeleted = refreshPanel;
documentPanel.onTitleChanged = refreshPanel;
documentPanel.onSyncExportSuccess = refreshPanel;
documentPanel.onSyncRemoved = refreshPanel;
documentPanel.onNewPublishSuccess = refreshPanel;
documentPanel.onPublishRemoved = refreshPanel;
documentPanel.onFoldersChanged = refreshPanel;
// Filter for search input in file selector
2013-08-13 23:30:50 +00:00
var panelContentElt = undefined;
var previousFilterValue = '';
function filterFiles(filterValue) {
if(filterValue == previousFilterValue) {
return;
2013-08-12 00:10:37 +00:00
}
2013-08-13 23:30:50 +00:00
previousFilterValue = filterValue;
// Scroll to top
panelContentElt.scrollTop = 0;
if(!filterValue) {
$documentListFilteredElt.addClass('hide');
$documentListElt.removeClass('hide');
return;
}
var wordList = filterValue.toLowerCase().split(/\s+/);
_.each(documentListFilteredElt.querySelectorAll('.file'), function(fileElt) {
var $fileElt = $(fileElt);
var fileTitle = $fileElt.text().toLowerCase();
$fileElt.toggle(!_.some(wordList, function(word) {
return fileTitle.indexOf(word) === -1;
}));
});
$documentListFilteredElt.removeClass('hide');
$documentListElt.addClass('hide');
2013-08-12 00:10:37 +00:00
}
documentPanel.onReady = function() {
panelElt = document.querySelector('.document-panel');
2013-08-13 23:30:50 +00:00
panelContentElt = panelElt.querySelector('.panel-content');
documentListElt = panelElt.querySelector('.document-list');
$documentListElt = $(documentListElt);
documentListFilteredElt = panelElt.querySelector('.document-list-filtered');
$documentListFilteredElt = $(documentListFilteredElt);
2013-08-12 22:08:22 +00:00
// Open current folder before opening
$(panelElt).on('show.bs.collapse', function(e) {
2013-08-13 23:30:50 +00:00
if(e.target === panelElt) {
var folderDesc = selectedFileDesc.folder;
if(folderDesc !== undefined) {
$(panelElt.querySelector('.file-list.' + folderDesc.folderIndex.replace('.', ''))).collapse('show');
}
2013-08-12 22:08:22 +00:00
}
}).on('shown.bs.collapse', function(e) {
if(e.target === panelElt) {
2013-08-13 23:30:50 +00:00
// Unset the filter
$filterInputElt.val('');
filterFiles('');
// Scroll to the active file
var activeElt = documentListElt.querySelector('.file.active');
activeElt && (panelContentElt.scrollTop += activeElt.getBoundingClientRect().top - 120);
2013-08-13 00:03:38 +00:00
}
2013-08-12 22:08:22 +00:00
});
2013-08-13 23:30:50 +00:00
// Search bar input change
var $filterInputElt = $(panelElt.querySelector('.search-bar .form-control'));
$filterInputElt.bind("propertychange keyup input paste", function() {
filterFiles($filterInputElt.val());
});
2013-08-12 00:10:37 +00:00
};
return documentPanel;
});