Upgrade to Bootstrap 3
This commit is contained in:
parent
9b77eafa83
commit
05d92e0808
77
js/core.js
77
js/core.js
@ -243,8 +243,10 @@ define([
|
||||
$(".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) {
|
||||
|
@ -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;
|
||||
|
@ -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>
|
||||
|
@ -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);
|
||||
});
|
||||
|
@ -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;
|
||||
|
Loading…
Reference in New Issue
Block a user