Add option for smart indentation in editor

This commit is contained in:
Jason Barnabe 2015-02-08 22:02:08 -06:00
parent e9c34da152
commit d879b5e0c4
7 changed files with 92 additions and 64 deletions

View File

@ -153,6 +153,10 @@
"message": "Show number of styles active for the current site on the toolbar button",
"description": "Label for the checkbox controlling toolbar badge text."
},
"prefSmartIndent": {
"message": "Use smart indentation",
"description": "Label for the checkbox controlling smart indentation option for the style editor."
},
"sectionAdd": {
"message": "Add another section",
"description": "Label for the button to add a section"

View File

@ -1,7 +1,7 @@
chrome.extension.sendMessage({method: "getStyles", matchUrl: location.href, enabled: true, asHash: true}, applyStyles);
chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
switch(request.name) {
switch (request.method) {
case "styleDeleted":
removeStyle(request.id);
break;

View File

@ -2,7 +2,7 @@
// why the content script also asks for this stuff.
chrome.webNavigation.onCommitted.addListener(function(data) {
getStyles({matchUrl: data.url, enabled: true, asHash: true}, function(styleHash) {
chrome.tabs.sendMessage(data.tabId, {name: "styleApply", styles: styleHash});
chrome.tabs.sendMessage(data.tabId, {method: "styleApply", styles: styleHash});
// Don't show the badge for frames
if (data.frameId == 0) {
chrome.browserAction.setBadgeText({text: getBadgeText(Object.keys(styleHash)), tabId: data.tabId});
@ -291,7 +291,7 @@ function saveFromJSONComplete(id, callback) {
}
function saveFromJSONStyleReloaded(updateType, style, callback) {
notifyAllTabs({name:updateType, style: style});
notifyAllTabs({method: updateType, style: style});
if (callback) {
callback(style);
}

View File

@ -22,7 +22,7 @@
#sections {
padding-left: 290px;
}
h2 {
#sections h2 {
margin-top: 8px;
}
#basic-info {
@ -38,7 +38,7 @@
#sections > div:not(:first-child) {
border-top: 2px solid black;
}
label {
#basic-info label {
display: inline-block;
width: 10em;
vertical-align: top;
@ -86,6 +86,8 @@
vertical-align: bottom;
}
</style>
<script src="storage.js"></script>
<script src="messaging.js"></script>
<script src="localization.js"></script>
</head>
<body id="stylish-edit">
@ -98,6 +100,10 @@
<button id="to-mozilla"></button><img id="to-mozilla-help" src="help.png"><br><br>
<button id="save-button"></button>
<a href="manage.html"><button id="cancel-button"></button></a>
<div id="options">
<h2 id="options-heading"></h2>
<input id="smart-indent" type="checkbox"><label id="smart-indent-label" for="smart-indent"></label>
</div>
</div>
<section id="sections">
<h2><span id="sections-heading"></span> <img id="sections-help" src="help.png"></h2>

17
edit.js
View File

@ -18,12 +18,12 @@ function setupCodeMirror(textarea) {
var cm = CodeMirror.fromTextArea(textarea, {
mode: 'css',
lineNumbers: true,
lineWrapping: true
lineWrapping: true,
smartIndent: localStorage["smart-indent"] == null || localStorage["smart-indent"] == "true"
});
editors.push(cm);
}
function makeDirty() {
dirty = true;
}
@ -125,6 +125,7 @@ window.addEventListener("load", init, false);
function init() {
tE("sections-help", "helpAlt", "alt");
loadPrefs(["smart-indent"]);
var params = getParams();
if (!params.id) { // match should be 2 - one for the whole thing, one for the parentheses
// This is an add
@ -324,7 +325,7 @@ function getParams() {
chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
var installed = document.getElementById("installed");
switch(request.name) {
switch (request.method) {
case "styleUpdated":
if (styleId == request.id) {
initWithStyle(request.style);
@ -336,6 +337,13 @@ chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
window.close();
break;
}
break;
case "prefChanged":
if (request.prefName == "smart-indent") {
editors.forEach(function(editor) {
editor.setOption("smartIndent", request.value);
});
}
}
});
@ -345,6 +353,9 @@ tE("to-mozilla", "styleToMozillaFormat");
tE("save-button", "styleSaveLabel");
tE("cancel-button", "styleCancelEditLabel");
tE("sections-heading", "styleSectionsTitle");
tE("options-heading", "optionsHeading");
tE("smart-indent-label", "prefSmartIndent");
document.getElementById("name").addEventListener("change", makeDirty, false);
document.getElementById("enabled").addEventListener("change", makeDirty, false);
document.getElementById("to-mozilla").addEventListener("click", showMozillaFormat, false);

View File

@ -15,8 +15,7 @@ function showStyles(styles) {
styles.map(createStyleElement).forEach(function(e) {
installed.appendChild(e);
});
// prefs may be defaulted in storage.js - at this point they'll have been loaded
loadPrefs();
loadPrefs(["show-badge"]);
}
function createStyleElement(style) {
@ -127,7 +126,7 @@ function getStyleElement(event) {
}
chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
switch(request.name) {
switch (request.method) {
case "styleUpdated":
handleUpdate(request.style);
break;
@ -335,41 +334,6 @@ function jsonEquals(a, b, property) {
}
}
function getType(o) {
if (typeof o == "undefined" || typeof o == "string") {
return typeof o;
}
if (o instanceof Array) {
return "array";
}
throw "Not supported - " + o;
}
function isCheckbox(el) {
return el.nodeName.toLowerCase() == "input" && "checkbox" == el.type.toLowerCase();
}
function changePref(event) {
var el = event.target;
localStorage[el.id] = isCheckbox(el) ? el.checked : el.value;
notifyAllTabs({method: "prefChanged"});
}
function loadPrefs() {
["show-badge"].forEach(function(id) {
var value = localStorage[id];
var el = document.getElementById(id);
if (isCheckbox(el)) {
if (value == "true") {
el.checked = true;
}
} else {
el.value = value;
}
el.addEventListener("change", changePref);
});
}
document.title = t("manageTitle");
tE("manage-heading", "manageHeading");
tE("manage-text", "manageText", null, false);

View File

@ -21,10 +21,20 @@ function getDatabase(ready, error) {
} else if (stylishDb.version == "1.4") {
dbV15(stylishDb, error, ready);
} else {
defaultPrefs();
ready(stylishDb);
}
}
function defaultPrefs() {
if (!("show-badge" in localStorage)) {
localStorage["show-badge"] = true;
}
if (!("smart-indent" in localStorage)) {
localStorage["smart-indent"] = true;
}
}
function dbV11(d, error, done) {
d.changeVersion(d.version, '1.1', function (t) {
t.executeSql('CREATE TABLE styles (id INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT, url TEXT, updateUrl TEXT, md5Url TEXT, name TEXT NOT NULL, code TEXT NOT NULL, enabled INTEGER NOT NULL, originalCode TEXT NULL);');
@ -67,12 +77,9 @@ function dbV14(d, error, done) {
}
function dbV15(d, error, done) {
if (!("show-badge" in localStorage)) {
localStorage["show-badge"] = true;
}
d.changeVersion(d.version, '1.5', function (t) {
t.executeSql('ALTER TABLE styles ADD COLUMN originalMd5 TEXT NULL;');
}, error, function() { done(d, error, done)});
}, error, function() { dbV15(d, error, done)});
}
function enableStyle(id, enabled) {
@ -83,7 +90,7 @@ function enableStyle(id, enabled) {
chrome.extension.sendMessage({method: "styleChanged"});
chrome.extension.sendMessage({method: "getStyles", id: id}, function(styles) {
handleUpdate(styles[0]);
notifyAllTabs({name:"styleUpdated", style: styles[0]});
notifyAllTabs({method:"styleUpdated", style: styles[0]});
});
});
});
@ -98,7 +105,7 @@ function deleteStyle(id) {
}, reportError, function() {
chrome.extension.sendMessage({method: "styleChanged"});
handleDelete(id);
notifyAllTabs({name:"styleDeleted", id: id});
notifyAllTabs({method: "styleDeleted", id: id});
});
});
}
@ -124,3 +131,39 @@ function getDomains(url) {
}
return domains;
}
function getType(o) {
if (typeof o == "undefined" || typeof o == "string") {
return typeof o;
}
if (o instanceof Array) {
return "array";
}
throw "Not supported - " + o;
}
function isCheckbox(el) {
return el.nodeName.toLowerCase() == "input" && "checkbox" == el.type.toLowerCase();
}
function changePref(event) {
var el = event.target;
var value = isCheckbox(el) ? el.checked : el.value;
localStorage[el.id] = value
notifyAllTabs({method: "prefChanged", prefName: el.id, value: value});
}
function loadPrefs(prefNames) {
prefNames.forEach(function(id) {
var value = localStorage[id];
var el = document.getElementById(id);
if (isCheckbox(el)) {
if (value == "true") {
el.checked = true;
}
} else {
el.value = value;
}
el.addEventListener("change", changePref);
});
}