Skip to content

Commit 706be13

Browse files
stefanbuckjosephfrazier
stefanbuck
authored and
josephfrazier
committed
Add option to toggle debug mode (OctoLinker#213)
This PR adds a checkbox which allows you to toggle the debug mode. The debug mode basically just adds a css class on every OctoLinker link so you easily spot all links. On Firefox and Opera the settings are stored locally. Chrome stores the settings within the users account, if available.
1 parent 85a46b4 commit 706be13

File tree

12 files changed

+113
-6
lines changed

12 files changed

+113
-6
lines changed

‎assets/manifest.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@
3939
}
4040
],
4141
"permissions": [
42+
"storage",
4243
"https://github.com/",
4344
"https://gist.github.com/",
4445
"https://githublinker.herokuapp.com/"

‎assets/options.html‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,24 @@
22
<head>
33
<meta charset="UTF-8">
44
<title></title>
5+
<style type="text/css">
6+
body {
7+
user-select: none;
8+
}
9+
label {
10+
display: block;
11+
margin: 12px 0;
12+
}
13+
14+
#options {
15+
margin-bottom: 36px;
16+
}
17+
</style>
518
</head>
619
<body>
20+
<div id="options"></div>
21+
722
<iframe src="http://ghbtns.com/github-btn.html?user=octolinker&amp;repo=browser-extension&amp;type=watch&amp;count=true&amp;size=small" style="background-color: transparent; border: none; overflow:hidden" width="120" height="20"></iframe>
23+
<script src="options.js"></script>
824
</body>
925
</html>

‎lib/app.js‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
11
import 'babel-polyfill';
22
import OctoLinker from './octo-linker.js';
3+
import * as storage from './options/storage.js';
34

4-
const octoLinker = new OctoLinker();
5-
octoLinker.init();
5+
storage.load(() => {
6+
const octoLinker = new OctoLinker();
7+
octoLinker.init();
8+
});

‎lib/octo-linker.js‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,11 @@ import clickHandler from './click-handler';
66
import Plugins from './plugin-manager.js';
77
import debugMode from './debug-mode.js';
88
import loadPlugins from './load-plugins';
9+
import * as storage from './options/storage.js';
910

1011

1112
function initialize(self) {
12-
debugMode(false);
13+
debugMode(storage.get('debugMode'));
1314
clickHandler(resolvers);
1415
notification();
1516

@@ -38,8 +39,8 @@ function run(self) {
3839
}
3940

4041
export default class OctoLinkerCore {
41-
constructor() {
42-
initialize(this);
42+
constructor(options) {
43+
initialize(this, options);
4344
}
4445

4546
init() {

‎lib/options/components/checkbox.js‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
export default ({ name, label, value, defaultValue }) => {
2+
const val = (value === undefined) ? defaultValue : value;
3+
4+
return `<section>
5+
<label>
6+
<input type="checkbox" name="${name}" ${val ? 'checked' : ''} /> ${label}
7+
</label>
8+
</section>`;
9+
};

‎lib/options/components/index.js‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import checkbox from './checkbox';
2+
3+
export default function ({ type, ...rest }) {
4+
if (type === 'checkbox') {
5+
return checkbox(rest);
6+
}
7+
}

‎lib/options/options.js‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
export const options = [
2+
{
3+
type: 'checkbox',
4+
name: 'debugMode',
5+
label: 'Debug mode',
6+
value: undefined,
7+
defaultValue: false,
8+
},
9+
];

‎lib/options/page.js‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import components from './components';
2+
import * as storage from './storage';
3+
import { options } from './options';
4+
5+
const formEl = document.querySelector('#options');
6+
7+
storage.load(() => {
8+
options.forEach((item) => {
9+
formEl.innerHTML += components({
10+
...item,
11+
value: storage.get(item.name),
12+
});
13+
});
14+
});
15+
16+
formEl.addEventListener('click', ({ target }) => {
17+
const tag = target.tagName.toLowerCase();
18+
19+
if (tag === 'input' && target.type === 'checkbox') {
20+
storage.set(target.name, target.checked);
21+
}
22+
});

‎lib/options/storage.js‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import { options } from './options';
2+
3+
const store = {};
4+
const defaults = {};
5+
6+
options.forEach((item) => {
7+
defaults[item.name] = item.defaultValue;
8+
});
9+
10+
export const load = (cb) => {
11+
(chrome.storage.sync || chrome.storage.local).get(null, (data) => {
12+
Object.assign(store, defaults, data);
13+
14+
cb();
15+
});
16+
};
17+
18+
export const get = key => store[key];
19+
20+
export const set = (key, value) => {
21+
(chrome.storage.sync || chrome.storage.local).set({
22+
[key]: value,
23+
});
24+
};

‎npm-shrinkwrap.json‎

Lines changed: 12 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)