Simplified settings dialog

This commit is contained in:
benweet 2014-01-21 23:48:42 +00:00
parent d60e32dd01
commit b9cc5a9026
5 changed files with 123 additions and 74 deletions

View File

@ -2,11 +2,11 @@
<html manifest="cache.manifest">
<head>
<title>StackEdit *smart* markdown editor</title>
<title>StackEdit markdown editor</title>
<link rel="canonical" href="https://stackedit.io/">
<link rel="icon" href="res-min/img/stackedit-32.ico" type="image/x-icon">
<link rel="shortcut icon" href="res-min/img/stackedit-32.ico" type="image/x-icon">
<meta name="description" content="StackEdit is a full-featured, open-source Markdown editor based on PageDown, the Markdown library used by Stack Overflow and the other Stack Exchange sites.">
<meta name="description" content="Full-featured, open-source Markdown editor based on PageDown, the Markdown library used by Stack Overflow and the other Stack Exchange sites.">
<meta name="author" content="Benoit Schweblin">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="msvalidate.01" content="5E47EE6F67B069C17E3CDD418351A612"

View File

@ -681,6 +681,11 @@ define([
// Populate shortcuts in settings
shortcutMgr.addSettingEntries();
// Hide shortcuts settings if light mode
if(window.lightMode) {
$('.tab-settings-shortcuts').hide();
}
// listen to online/offline events
$(window).on('offline', core.setOffline);

View File

@ -121,7 +121,14 @@ define([
logger.log("onLoadSettings");
_.each(extensionList, function(extension) {
var isChecked = !extension.isOptional || extension.config.enabled === undefined || extension.config.enabled === true;
utils.setInputChecked($("#input-enable-extension-" + extension.extensionId), isChecked);
utils.setInputChecked("#input-enable-extension-" + extension.extensionId, isChecked);
// Special case for Markdown Extra and MathJax
if(extension.extensionId == 'markdownExtra') {
utils.setInputChecked("#input-settings-markdown-extra", isChecked);
}
else if(extension.extensionId == 'mathJax') {
utils.setInputChecked("#input-settings-mathjax", isChecked);
}
var onLoadSettingsListener = extension.onLoadSettings;
onLoadSettingsListener && onLoadSettingsListener();
});
@ -131,6 +138,20 @@ define([
_.each(extensionList, function(extension) {
var newExtensionConfig = _.extend({}, extension.defaultConfig);
newExtensionConfig.enabled = utils.getInputChecked("#input-enable-extension-" + extension.extensionId);
var isChecked;
// Special case for Markdown Extra and MathJax
if(extension.extensionId == 'markdownExtra') {
isChecked = utils.getInputChecked("#input-settings-markdown-extra");
if(isChecked != extension.enabled) {
newExtensionConfig.enabled = isChecked;
}
}
else if(extension.extensionId == 'mathJax') {
isChecked = utils.getInputChecked("#input-settings-mathjax");
if(isChecked != extension.enabled) {
newExtensionConfig.enabled = isChecked;
}
}
var onSaveSettingsListener = extension.onSaveSettings;
onSaveSettingsListener && onSaveSettingsListener(newExtensionConfig, event);
newExtensionSettings[extension.extensionId] = newExtensionConfig;
@ -204,6 +225,7 @@ define([
html += elt.innerHTML;
});
html = html.replace(/^<div class="se-section-delimiter"><\/div>\n\n/gm, '');
html = html.replace(/ <span class="comment label label-danger">.*<\/span> /g, '');
onPreviewFinished(utils.trim(html));
});
};
@ -242,7 +264,7 @@ define([
var accordionHtml = _.chain(extensionList).sortBy(function(extension) {
return extension.extensionName.toLowerCase();
}).reduce(function(html, extension) {
return html + (extension.settingsBlock ? _.template(settingsExtensionsAccordionHTML, {
return html + (extension.settingsBlock && !(window.lightMode === true && extension.disableInLight === true) ? _.template(settingsExtensionsAccordionHTML, {
extensionId: extension.extensionId,
extensionName: extension.extensionName,
isOptional: extension.isOptional,
@ -250,7 +272,7 @@ define([
}) : "");
}, "").value();
document.querySelector('.accordion-extensions').innerHTML = accordionHtml;
// Create extension buttons
logger.log("onCreateButton");
var onCreateButtonListenerList = getExtensionListenerList("onCreateButton");

View File

@ -906,10 +906,10 @@
<h3 class="modal-title">Settings</h3>
<ul class="nav nav-tabs">
<li class="active"><a class="action-load-settings"
href="#tabpane-settings-editor" data-toggle="tab">Editor</a></li>
<li><a class="action-load-settings"
href="#tabpane-settings-services" data-toggle="tab">Services</a></li>
href="#tabpane-settings-basic" data-toggle="tab">Basic</a></li>
<li><a class="action-load-settings"
href="#tabpane-settings-advanced" data-toggle="tab">Advanced</a></li>
<li><a class="action-load-settings tab-settings-shortcuts"
href="#tabpane-settings-shortcuts" data-toggle="tab">Shortcuts</a></li>
<li><a class="action-load-settings"
href="#tabpane-settings-extensions" data-toggle="tab">Extensions</a></li>
@ -920,7 +920,7 @@
<div class="modal-body">
<div class="tab-content clearfix">
<div class="tab-pane active" id="tabpane-settings-editor">
<div class="tab-pane active" id="tabpane-settings-basic">
<div class="form-horizontal">
<div class="form-group">
<label class="col-lg-4 control-label">Layout orientation</label>
@ -946,6 +946,68 @@
</select>
</div>
</div>
<div class="form-group">
<div class="col-lg-4"></div>
<div class="col-lg-7">
<div class="checkbox">
<label>
<input type="checkbox" id="input-settings-markdown-extra" />
Use <b>Markdown Extra/GitHub Flavored Markdown</b> syntax
</label>
</div>
</div>
</div>
<div class="form-group">
<div class="col-lg-4"></div>
<div class="col-lg-7">
<div class="checkbox">
<label>
<input type="checkbox" id="input-settings-mathjax" />
<b>LaTeX mathematical expressions</b> using <code>$</code> and <code>$$</code> delimiters
</label>
</div>
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label"
for="input-settings-gdrive-multiaccount">Google Drive multi-accounts</a>
</label>
<div class="col-lg-7">
<select id="input-settings-gdrive-multiaccount" class="form-control">
<option value="1">1 account</option>
<option value="2">2 accounts</option>
<option value="3">3 accounts</option>
</select>
<span class="help-block"><b>Please sign in first with Google.</b> Once linked with your Google accounts, changing account is not possible unless you reset the application.</span>
</div>
</div>
</div>
</div>
<div class="tab-pane" id="tabpane-settings-advanced">
<div class="form-horizontal">
<div class="form-group">
<label class="col-lg-4 control-label">Mode</label>
<div class="col-lg-7">
<div class="radio">
<label> <input type="radio"
name="radio-settings-mode" value="_ace_">
Normal (ACE)
</label>
</div>
<div class="radio">
<label> <input type="radio"
name="radio-settings-mode" value="_light_">
Light (textarea)
</label>
</div>
<div class="radio">
<label> <input type="radio"
name="radio-settings-mode" value="_light_rtl_">
Light + Right-to-left
</label>
</div>
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label"
for="input-settings-lazy-rendering">Lazy rendering <a
@ -987,44 +1049,35 @@
class="form-control"></textarea>
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label">Mode</label>
<div class="col-lg-7">
<div class="radio">
<label> <input type="radio"
name="radio-settings-mode" value="_ace_">
Normal (ACE)
</label>
</div>
<div class="radio">
<label> <input type="radio"
name="radio-settings-mode" value="_light_">
Light (textarea)
</label>
</div>
<div class="radio">
<label> <input type="radio"
name="radio-settings-mode" value="_light_rtl_">
Light + Right-to-left
</label>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane" id="tabpane-settings-services">
<div class="form-horizontal">
<div class="form-group">
<label class="col-lg-4 control-label"
for="input-settings-gdrive-multiaccount">Google Drive multi-accounts</a>
for="textarea-settings-publish-template">Default
template <a href="#" class="tooltip-template">(?)</a>
</label>
<div class="col-lg-7">
<select id="input-settings-gdrive-multiaccount" class="form-control">
<option value="1">1 account</option>
<option value="2">2 accounts</option>
<option value="3">3 accounts</option>
<textarea id="textarea-settings-publish-template"
class="form-control"></textarea>
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label"
for="textarea-settings-pdf-template">PDF
template <a href="#" class="tooltip-template">(?)</a>
</label>
<div class="col-lg-7">
<textarea id="textarea-settings-pdf-template"
class="form-control"></textarea>
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label" for="input-settings-pdf-page-size">PDF page size</label>
<div class="col-lg-7">
<select id="input-settings-pdf-page-size" class="form-control">
<option value="A3">A3</option>
<option value="A4">A4</option>
<option value="Legal">Legal</option>
<option value="Letter">Letter</option>
</select>
<span class="help-block"><b>Please sign in first with Google.</b> Once linked with your Google accounts, changing account is not possible unless you reset the application.</span>
</div>
</div>
<div class="form-group">
@ -1081,37 +1134,6 @@
class="form-control">
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label"
for="textarea-settings-publish-template">Default
template <a href="#" class="tooltip-template">(?)</a>
</label>
<div class="col-lg-7">
<textarea id="textarea-settings-publish-template"
class="form-control"></textarea>
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label"
for="textarea-settings-pdf-template">PDF
template <a href="#" class="tooltip-template">(?)</a>
</label>
<div class="col-lg-7">
<textarea id="textarea-settings-pdf-template"
class="form-control"></textarea>
</div>
</div>
<div class="form-group">
<label class="col-lg-4 control-label" for="input-settings-pdf-page-size">PDF page size</label>
<div class="col-lg-7">
<select id="input-settings-pdf-page-size" class="form-control">
<option value="A3">A3</option>
<option value="A4">A4</option>
<option value="Legal">Legal</option>
<option value="Letter">Letter</option>
</select>
</div>
</div>
</div>
</div>
<div class="tab-pane" id="tabpane-settings-shortcuts">

View File

@ -6,7 +6,7 @@
<link rel="canonical" href="https://stackedit.io/viewer">
<link rel="icon" href="res-min/img/stackedit-32.ico" type="image/x-icon">
<link rel="shortcut icon" href="res-min/img/stackedit-32.ico" type="image/x-icon">
<meta name="description" content="StackEdit is a full-featured, open-source Markdown editor based on PageDown, the Markdown library used by Stack Overflow and the other Stack Exchange sites.">
<meta name="description" content="Full-featured, open-source Markdown editor based on PageDown, the Markdown library used by Stack Overflow and the other Stack Exchange sites.">
<meta name="author" content="Benoit Schweblin">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="msvalidate.01" content="5E47EE6F67B069C17E3CDD418351A612"