open.source/stylus
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add option for smart indentation in editor

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
_locales/en/messages.json
View File

@ -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
View File

@ -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;

4
background.js
View File

@ -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);
} }

22
edit.html
View File

@ -1,8 +1,8 @@
<html> <html>
<head> <head>
<script src="codemirror/lib/codemirror.js"></script> <script src="codemirror/lib/codemirror.js"></script>
<link rel="stylesheet" href="codemirror/lib/codemirror.css"> <link rel="stylesheet" href="codemirror/lib/codemirror.css">
<script src="codemirror/mode/css/css.js"></script> <script src="codemirror/mode/css/css.js"></script>
<style type="text/css"> <style type="text/css">
body { body {
margin: 0px; margin: 0px;
@ -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;
@ -50,9 +50,9 @@
height: 10em; height: 10em;
width: 40em; width: 40em;
} }
.CodeMirror { .CodeMirror {
border: solid #CCC 1px; border: solid #CCC 1px;
} }
.applies-to ul { .applies-to ul {
display: inline-block; display: inline-block;
margin: 0; margin: 0;
@ -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>

27
edit.js
View File

@ -15,15 +15,15 @@ sectionTemplate.innerHTML = '<label>' + t('sectionCode') + '</label><textarea cl
var editors = [] // array of all CodeMirror instances var editors = [] // array of all CodeMirror instances
// replace given textarea with the CodeMirror editor // replace given textarea with the CodeMirror editor
function setupCodeMirror(textarea) { 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
View File

@ -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);

57
storage.js
View File

@ -21,7 +21,17 @@ 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 {
ready(stylishDb); defaultPrefs();
ready(stylishDb);
}
}
function defaultPrefs() {
if (!("show-badge" in localStorage)) {
localStorage["show-badge"] = true;
}
if (!("smart-indent" in localStorage)) {
localStorage["smart-indent"] = true;
} }
} }
@ -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);
});
}