Add option for smart indentation in editor
This commit is contained in:
parent
e9c34da152
commit
d879b5e0c4
|
@ -153,6 +153,10 @@
|
||||||
"message": "Show number of styles active for the current site on the toolbar button",
|
"message": "Show number of styles active for the current site on the toolbar button",
|
||||||
"description": "Label for the checkbox controlling toolbar badge text."
|
"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": {
|
"sectionAdd": {
|
||||||
"message": "Add another section",
|
"message": "Add another section",
|
||||||
"description": "Label for the button to add a section"
|
"description": "Label for the button to add a section"
|
||||||
|
|
2
apply.js
2
apply.js
|
@ -1,7 +1,7 @@
|
||||||
chrome.extension.sendMessage({method: "getStyles", matchUrl: location.href, enabled: true, asHash: true}, applyStyles);
|
chrome.extension.sendMessage({method: "getStyles", matchUrl: location.href, enabled: true, asHash: true}, applyStyles);
|
||||||
|
|
||||||
chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
|
chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
|
||||||
switch(request.name) {
|
switch (request.method) {
|
||||||
case "styleDeleted":
|
case "styleDeleted":
|
||||||
removeStyle(request.id);
|
removeStyle(request.id);
|
||||||
break;
|
break;
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
// why the content script also asks for this stuff.
|
// why the content script also asks for this stuff.
|
||||||
chrome.webNavigation.onCommitted.addListener(function(data) {
|
chrome.webNavigation.onCommitted.addListener(function(data) {
|
||||||
getStyles({matchUrl: data.url, enabled: true, asHash: true}, function(styleHash) {
|
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
|
// Don't show the badge for frames
|
||||||
if (data.frameId == 0) {
|
if (data.frameId == 0) {
|
||||||
chrome.browserAction.setBadgeText({text: getBadgeText(Object.keys(styleHash)), tabId: data.tabId});
|
chrome.browserAction.setBadgeText({text: getBadgeText(Object.keys(styleHash)), tabId: data.tabId});
|
||||||
|
@ -291,7 +291,7 @@ function saveFromJSONComplete(id, callback) {
|
||||||
}
|
}
|
||||||
|
|
||||||
function saveFromJSONStyleReloaded(updateType, style, callback) {
|
function saveFromJSONStyleReloaded(updateType, style, callback) {
|
||||||
notifyAllTabs({name:updateType, style: style});
|
notifyAllTabs({method: updateType, style: style});
|
||||||
if (callback) {
|
if (callback) {
|
||||||
callback(style);
|
callback(style);
|
||||||
}
|
}
|
||||||
|
|
10
edit.html
10
edit.html
|
@ -22,7 +22,7 @@
|
||||||
#sections {
|
#sections {
|
||||||
padding-left: 290px;
|
padding-left: 290px;
|
||||||
}
|
}
|
||||||
h2 {
|
#sections h2 {
|
||||||
margin-top: 8px;
|
margin-top: 8px;
|
||||||
}
|
}
|
||||||
#basic-info {
|
#basic-info {
|
||||||
|
@ -38,7 +38,7 @@
|
||||||
#sections > div:not(:first-child) {
|
#sections > div:not(:first-child) {
|
||||||
border-top: 2px solid black;
|
border-top: 2px solid black;
|
||||||
}
|
}
|
||||||
label {
|
#basic-info label {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 10em;
|
width: 10em;
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
|
@ -86,6 +86,8 @@
|
||||||
vertical-align: bottom;
|
vertical-align: bottom;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
<script src="storage.js"></script>
|
||||||
|
<script src="messaging.js"></script>
|
||||||
<script src="localization.js"></script>
|
<script src="localization.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body id="stylish-edit">
|
<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="to-mozilla"></button><img id="to-mozilla-help" src="help.png"><br><br>
|
||||||
<button id="save-button"></button>
|
<button id="save-button"></button>
|
||||||
<a href="manage.html"><button id="cancel-button"></button></a>
|
<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>
|
</div>
|
||||||
<section id="sections">
|
<section id="sections">
|
||||||
<h2><span id="sections-heading"></span> <img id="sections-help" src="help.png"></h2>
|
<h2><span id="sections-heading"></span> <img id="sections-help" src="help.png"></h2>
|
||||||
|
|
17
edit.js
17
edit.js
|
@ -18,12 +18,12 @@ function setupCodeMirror(textarea) {
|
||||||
var cm = CodeMirror.fromTextArea(textarea, {
|
var cm = CodeMirror.fromTextArea(textarea, {
|
||||||
mode: 'css',
|
mode: 'css',
|
||||||
lineNumbers: true,
|
lineNumbers: true,
|
||||||
lineWrapping: true
|
lineWrapping: true,
|
||||||
|
smartIndent: localStorage["smart-indent"] == null || localStorage["smart-indent"] == "true"
|
||||||
});
|
});
|
||||||
editors.push(cm);
|
editors.push(cm);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
function makeDirty() {
|
function makeDirty() {
|
||||||
dirty = true;
|
dirty = true;
|
||||||
}
|
}
|
||||||
|
@ -125,6 +125,7 @@ window.addEventListener("load", init, false);
|
||||||
|
|
||||||
function init() {
|
function init() {
|
||||||
tE("sections-help", "helpAlt", "alt");
|
tE("sections-help", "helpAlt", "alt");
|
||||||
|
loadPrefs(["smart-indent"]);
|
||||||
var params = getParams();
|
var params = getParams();
|
||||||
if (!params.id) { // match should be 2 - one for the whole thing, one for the parentheses
|
if (!params.id) { // match should be 2 - one for the whole thing, one for the parentheses
|
||||||
// This is an add
|
// This is an add
|
||||||
|
@ -324,7 +325,7 @@ function getParams() {
|
||||||
|
|
||||||
chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
|
chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
|
||||||
var installed = document.getElementById("installed");
|
var installed = document.getElementById("installed");
|
||||||
switch(request.name) {
|
switch (request.method) {
|
||||||
case "styleUpdated":
|
case "styleUpdated":
|
||||||
if (styleId == request.id) {
|
if (styleId == request.id) {
|
||||||
initWithStyle(request.style);
|
initWithStyle(request.style);
|
||||||
|
@ -336,6 +337,13 @@ chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
|
||||||
window.close();
|
window.close();
|
||||||
break;
|
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("save-button", "styleSaveLabel");
|
||||||
tE("cancel-button", "styleCancelEditLabel");
|
tE("cancel-button", "styleCancelEditLabel");
|
||||||
tE("sections-heading", "styleSectionsTitle");
|
tE("sections-heading", "styleSectionsTitle");
|
||||||
|
tE("options-heading", "optionsHeading");
|
||||||
|
tE("smart-indent-label", "prefSmartIndent");
|
||||||
|
|
||||||
document.getElementById("name").addEventListener("change", makeDirty, false);
|
document.getElementById("name").addEventListener("change", makeDirty, false);
|
||||||
document.getElementById("enabled").addEventListener("change", makeDirty, false);
|
document.getElementById("enabled").addEventListener("change", makeDirty, false);
|
||||||
document.getElementById("to-mozilla").addEventListener("click", showMozillaFormat, false);
|
document.getElementById("to-mozilla").addEventListener("click", showMozillaFormat, false);
|
||||||
|
|
40
manage.js
40
manage.js
|
@ -15,8 +15,7 @@ function showStyles(styles) {
|
||||||
styles.map(createStyleElement).forEach(function(e) {
|
styles.map(createStyleElement).forEach(function(e) {
|
||||||
installed.appendChild(e);
|
installed.appendChild(e);
|
||||||
});
|
});
|
||||||
// prefs may be defaulted in storage.js - at this point they'll have been loaded
|
loadPrefs(["show-badge"]);
|
||||||
loadPrefs();
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function createStyleElement(style) {
|
function createStyleElement(style) {
|
||||||
|
@ -127,7 +126,7 @@ function getStyleElement(event) {
|
||||||
}
|
}
|
||||||
|
|
||||||
chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
|
chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
|
||||||
switch(request.name) {
|
switch (request.method) {
|
||||||
case "styleUpdated":
|
case "styleUpdated":
|
||||||
handleUpdate(request.style);
|
handleUpdate(request.style);
|
||||||
break;
|
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");
|
document.title = t("manageTitle");
|
||||||
tE("manage-heading", "manageHeading");
|
tE("manage-heading", "manageHeading");
|
||||||
tE("manage-text", "manageText", null, false);
|
tE("manage-text", "manageText", null, false);
|
||||||
|
|
55
storage.js
55
storage.js
|
@ -21,10 +21,20 @@ function getDatabase(ready, error) {
|
||||||
} else if (stylishDb.version == "1.4") {
|
} else if (stylishDb.version == "1.4") {
|
||||||
dbV15(stylishDb, error, ready);
|
dbV15(stylishDb, error, ready);
|
||||||
} else {
|
} else {
|
||||||
|
defaultPrefs();
|
||||||
ready(stylishDb);
|
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) {
|
function dbV11(d, error, done) {
|
||||||
d.changeVersion(d.version, '1.1', function (t) {
|
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);');
|
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) {
|
function dbV15(d, error, done) {
|
||||||
if (!("show-badge" in localStorage)) {
|
|
||||||
localStorage["show-badge"] = true;
|
|
||||||
}
|
|
||||||
d.changeVersion(d.version, '1.5', function (t) {
|
d.changeVersion(d.version, '1.5', function (t) {
|
||||||
t.executeSql('ALTER TABLE styles ADD COLUMN originalMd5 TEXT NULL;');
|
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) {
|
function enableStyle(id, enabled) {
|
||||||
|
@ -83,7 +90,7 @@ function enableStyle(id, enabled) {
|
||||||
chrome.extension.sendMessage({method: "styleChanged"});
|
chrome.extension.sendMessage({method: "styleChanged"});
|
||||||
chrome.extension.sendMessage({method: "getStyles", id: id}, function(styles) {
|
chrome.extension.sendMessage({method: "getStyles", id: id}, function(styles) {
|
||||||
handleUpdate(styles[0]);
|
handleUpdate(styles[0]);
|
||||||
notifyAllTabs({name:"styleUpdated", style: styles[0]});
|
notifyAllTabs({method:"styleUpdated", style: styles[0]});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
@ -98,7 +105,7 @@ function deleteStyle(id) {
|
||||||
}, reportError, function() {
|
}, reportError, function() {
|
||||||
chrome.extension.sendMessage({method: "styleChanged"});
|
chrome.extension.sendMessage({method: "styleChanged"});
|
||||||
handleDelete(id);
|
handleDelete(id);
|
||||||
notifyAllTabs({name:"styleDeleted", id: id});
|
notifyAllTabs({method: "styleDeleted", id: id});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -124,3 +131,39 @@ function getDomains(url) {
|
||||||
}
|
}
|
||||||
return domains;
|
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);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user