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

Upgrade to Bootstrap 3

Browse Source
This commit is contained in:
benweet 2013-08-13 01:03:38 +01:00
parent 9b77eafa83
commit 05d92e0808
5 changed files with 110 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

81
js/core.js
View File

@ -172,7 +172,7 @@ define([
documentPanelElt.show();
}
}
// Set the preview button visibility
var previewButtonsElt = undefined;
function setPreviewButtonsVisibility(forceHide) {
@ -242,9 +242,11 @@ define([
$(".ui-layout-toggler-south").addClass("btn btn-info").html('<i class="icon-none"></i>');
$(".ui-layout-toggler-east").addClass("btn btn-info").html('<i class="icon-none"></i>');
var northTogglerElt = $(".ui-layout-toggler-north").addClass("btn btn-info").html('<i class="icon-none"></i>');
// We attach the preview buttons to the UI layout resizer in order to have fixed position
// We also move the north toggler to the east or south resizer as the north resizer is very small
// We attach the preview buttons to the UI layout resizer in order to
// have fixed position
// We also move the north toggler to the east or south resizer as the
// north resizer is very small
previewButtonsElt = $('<div class="extension-preview-buttons">');
if(settings.layoutOrientation == "horizontal") {
$('.ui-layout-resizer-north').append(previewButtonsElt);
@ -449,52 +451,55 @@ define([
e.stopPropagation();
});
menuPanelElt = $('.menu-panel');
menuPanelElt = $('.menu-panel').collapse({
toggle: false
});
var isMenuPanelShown = false;
var menuPanelBackdropElt = undefined;
menuPanelElt.on('shown.bs.collapse', function(e) {
menuPanelElt.on('show.bs.collapse', function(e) {
if(e.target === menuPanelElt[0]) {
isMenuPanelShown = true;
menuPanelBackdropElt = utils.createBackdrop();
menuPanelBackdropElt = utils.createBackdrop('collapse', '.menu-panel');
menuPanelElt.addClass('move-to-front');
// Register a click listener when menu panel is open
var closePanelElt = menuPanelElt.find('.action-close-panel').add(menuPanelBackdropElt);
closePanelElt.on('click.hide-menu-panel', function(e) {
// Unregister the listener
$('body').off('click.hide-menu-panel');
menuPanelElt.collapse('hide');
isMenuPanelShown = false;
});
}
}).on('show.bs.collapse', function(){
// Close all open sub-menus when one submenu opens
menuPanelElt.find('.in').collapse('hide');
}).on('hidden.bs.collapse', function(e) {
// Close all open sub-menus when menu panel is closed
else {
// Close all open sub-menus when one submenu opens
menuPanelElt.find('.in').collapse('hide');
}
}).on('hide.bs.collapse', function(e) {
if(e.target === menuPanelElt[0]) {
isMenuPanelShown = false;
menuPanelBackdropElt.remove();
menuPanelElt.removeClass('move-to-front');
}
}).on('hidden.bs.collapse', function(e) {
if(e.target === menuPanelElt[0]) {
// Close all open sub-menus when menu panel is closed
menuPanelElt.find('.in').collapse('hide');
}
});
documentPanelElt = $('.document-panel');
documentPanelElt = $('.document-panel').collapse({
toggle: false
});
var isDocumentPanelShown = false;
documentPanelElt.on('shown.bs.collapse', function(e) {
var documentPanelBackdropElt = undefined;
documentPanelElt.on('show.bs.collapse', function(e) {
if(e.target === documentPanelElt[0]) {
isDocumentPanelShown = true;
// Register a click listener when document panel is open
$('body').on('click.hide-document-panel', function(e) {
// If click outside the panel, close the panel and unregister
// the listener
if($(e.target).is('.action-close-panel, .action-close-panel *, :not(.document-panel, .document-panel *)')) {
documentPanelElt.collapse('hide');
$('body').off('click.hide-document-panel');
isDocumentPanelShown = false;
}
});
documentPanelBackdropElt = utils.createBackdrop('collapse', '.document-panel');
documentPanelElt.addClass('move-to-front');
}
else {
// Close all open sub-menus when one submenu opens
documentPanelElt.find('.in').collapse('hide');
}
}).on('hide.bs.collapse', function(e) {
if(e.target === documentPanelElt[0]) {
isDocumentPanelShown = false;
documentPanelBackdropElt.remove();
documentPanelElt.removeClass('move-to-front');
}
}).on('show.bs.collapse', function(){
// Close all open sub-menus when one submenu opens
documentPanelElt.find('.in').collapse('hide');
}).on('hidden.bs.collapse', function(e) {
if(e.target === documentPanelElt[0]) {
// Close all open sub-menus when menu panel is closed
@ -503,7 +508,11 @@ define([
});
var isModalShown = false;
$('.modal').on('shown.bs.modal', function() {
$('.modal').on('show.bs.modal', function() {
// Close panel if open
menuPanelElt.collapse('hide');
documentPanelElt.collapse('hide');
}).on('shown.bs.modal', function() {
// Focus on the first input when modal opens
isModalShown = true;
_.defer(function(elt) {

34
js/extensions/documentPanel.js
View File

@ -15,14 +15,28 @@ define([
};
var folderEltTmpl = [
'<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>'
'<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>'
].join('');
var documentEltTmpl = [
'<a href="#" class="list-group-item file action-close-panel<%= fileDesc === selectedFileDesc ? " active" : "" %>" data-file-index="<%= fileDesc.fileIndex %>">',
'<%= fileDesc.composeTitle() %></a>',
'<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>',
].join('');
var panelElt = undefined;
@ -43,7 +57,7 @@ define([
}) + '</li>';
}, '').value();
documentListHtml = documentListHtml && '<ul class="nav">' + documentListHtml + '</ul>';
// Build directories
_.chain(folderList).sortBy(function(folderDesc) {
return folderDesc.name.toLowerCase();
@ -64,7 +78,7 @@ define([
});
documentListElt.innerHTML = documentListHtml;
// Add click listeners
_.each(documentListElt.querySelectorAll('.file'), function(fileElt) {
fileElt = $(fileElt);
@ -112,7 +126,7 @@ define([
documentPanel.onReady = function() {
panelElt = document.querySelector('.document-panel');
documentListElt = panelElt.querySelector('.list-group');
// Open current folder before opening
$(panelElt).on('show.bs.collapse', function(e) {
var folderDesc = selectedFileDesc.folder;
@ -122,7 +136,7 @@ define([
}).on('shown.bs.collapse', function(e) {
// Scroll to the active file
if(e.target === panelElt) {
}
}
});
};

31
js/html/bodyIndex.html
View File

@ -62,12 +62,10 @@
<ul class="nav">
<li><a data-toggle="modal"
data-target=".modal-import-harddrive-markdown"
class="action-reset-input action-close-panel" href="#">Import
from hard drive</a></li>
class="action-reset-input" href="#">Import from hard drive</a></li>
<li><a data-toggle="modal"
data-target=".modal-import-harddrive-html"
class="action-reset-input action-close-panel" href="#">Convert
HTML to Markdown</a></li>
class="action-reset-input" href="#">Convert HTML to Markdown</a></li>
</ul>
</div>
@ -90,8 +88,9 @@
class="icon-provider-gdrive"></i> Google Drive</a>
<div class="sub-menu collapse collapse-sync-gdrive clearfix">
<ul class="nav">
<li><a href="#" class="action-sync-import-gdrive">Import
from Google Drive</a></li>
<li><a href="#" class="action-sync-import-gdrive"
data-toggle="collapse" data-target=".menu-panel">Import from
Google Drive</a></li>
<li><a href="#" class="action-sync-export-dialog-gdrive">Export
to Google Drive</a></li>
</ul>
@ -101,14 +100,15 @@
class="icon-provider-dropbox"></i> Dropbox</a>
<div class="sub-menu collapse collapse-sync-dropbox clearfix">
<ul class="nav">
<li><a class="action-sync-import-dropbox" href="#">Import
from Dropbox</a></li>
<li><a class="action-sync-import-dropbox" href="#"
data-toggle="collapse" data-target=".menu-panel">Import from
Dropbox</a></li>
<li><a href="#" class="action-sync-export-dialog-dropbox">Export
to Dropbox</a></li>
</ul>
</div>
<a href="#" data-toggle="modal" data-target=".modal-manage-sync"
class="action-reset-input list-group-item action-close-panel"><i
class="action-reset-input list-group-item"><i
class="icon-refresh"></i> Manage synchronization</a>
</div>
<div class=dropdown-header>PUBLISH</div>
@ -120,17 +120,16 @@
</ul>
</div>
<a href="#" data-toggle="modal" data-target=".modal-manage-publish"
class="action-reset-input list-group-item action-close-panel"><i
class="icon-share"></i> Manage publication</a>
class="action-reset-input list-group-item"><i class="icon-share"></i>
Manage publication</a>
</div>
<ul class="nav">
<li><a href="#" data-toggle="modal"
data-target=".modal-settings"
class="action-load-settings list-group-item action-close-panel"><i
class="icon-cog"></i> Settings</a></li>
class="action-load-settings list-group-item"><i class="icon-cog"></i>
Settings</a></li>
<li><a href="#" data-toggle="modal" data-target=".modal-about"
class="list-group-item action-close-panel"><i
class="icon-help-circled"></i> About</a></li>
class="list-group-item"><i class="icon-help-circled"></i> About</a></li>
</ul>
</div>
@ -148,7 +147,7 @@
type="text" class="form-control"></input>
<div class="input-group-btn">
<a data-toggle="modal" data-target=".modal-document-manager"
class="btn btn-default action-close-panel" title="Manage documents"><i
class="btn btn-default" title="Manage documents"><i
class="icon-layers"></i></a>
</div>
</div>

30
js/publisher.js
View File

@ -99,7 +99,7 @@ define([
// Dequeue a synchronized location
var publishAttributes = publishAttributesList.pop();
// Format the content
var content = getPublishContent(publishFileDesc, publishAttributes, publishHTML);
@ -119,7 +119,7 @@ define([
publishLocation(callback, errorFlag || error);
});
}
// Get the html from the onPreviewFinished callback
var previewHtml = undefined;
eventMgr.addListener("onPreviewFinished", function(html) {
@ -222,15 +222,29 @@ define([
localStorage[provider.providerId + ".publishPreferences"] = JSON.stringify(publishPreferences);
}
var initPublishButtonTmpl = [
'<li>',
' <a href="#"',
' class="action-init-publish-<%= provider.providerId %>">',
' <i class="icon-provider-<%= provider.providerId %>"></i> <%= provider.providerName %>',
' </a>',
'</li>'
].join('');
eventMgr.addListener("onReady", function() {
// Add every provider
var publishMenu = $('.collapse-publish-on .nav');
// Add every provider in the panel menu
var publishMenuElt = document.querySelector('.menu-panel .collapse-publish-on .nav');
var publishMenuHtml = _.reduce(providerMap, function(result, provider) {
return result + _.template(initPublishButtonTmpl, {
provider: provider
});
}, '');
publishMenuElt.innerHTML = publishMenuHtml;
_.each(providerMap, function(provider) {
// Provider's publish button
publishMenu.append($("<li>").append($('<a href="#" class="action-close-panel"><i class="icon-provider-' + provider.providerId + '"></i> ' + provider.providerName + '</a>').click(function() {
// Click on open publish dialog
$(publishMenuElt.querySelector('.action-init-publish-' + provider.providerId)).click(function() {
initNewLocation(provider);
})));
// Action links (if any)
});
// Click on perform new publication
$(".action-publish-" + provider.providerId).click(function() {
initNewLocation(provider);
});

6
js/utils.js
View File

@ -179,9 +179,11 @@ define([
};
// Create a backdrop and add to the body
utils.createBackdrop = function() {
utils.createBackdrop = function(toggle, target) {
var result = crel('div', {
class: 'modal-backdrop'
'class': 'modal-backdrop',
'data-toggle': toggle,
'data-target': target,
});
document.body.appendChild(result);
return result;