diff --git a/background_scripts/bootstrap.js b/background_scripts/background.js
similarity index 100%
rename from background_scripts/bootstrap.js
rename to background_scripts/background.js
diff --git a/config/css/config.css b/config/css/config.css
index d8a6ced..382a3d0 100644
--- a/config/css/config.css
+++ b/config/css/config.css
@@ -1,3 +1,7 @@
body {
- width: 800px;
+ min-width: 800px;
+}
+
+.list-group-item .badge a {
+ color: white;
}
\ No newline at end of file
diff --git a/config/index.html b/config/index.html
index fbb10ff..2ceffb5 100644
--- a/config/index.html
+++ b/config/index.html
@@ -10,16 +10,26 @@
<link href="css/bootstrap-theme.min.css" rel="stylesheet">
</head>
<body>
- <header>
- </header>
<section class="container">
+ <div class="row">
+ <div class="col-xs-12 col-md-12">
+ <p>
+ Enter regular expressions on the right, to create a new
+ blocking rule. On the right, select which functionality
+ should be blocked for hosts matching each regular expression.
+ </p>
+ </div>
+ </div>
<div class="row">
<div class="col-xs-4 col-md-4 well">
<domain-rules :domain-names="domainNames" :selected-domain="selectedDomain"></domain-rules>
</div>
- <div class="col-xs-7 col-md-7 col-md-offset-1 col-xs-offset-1">
- <web-api-standards :standards="standards" :selected-standards="selectedStandards"></web-api-standards>
+ <div class="col-xs-8 col-md-8">
+ <web-api-standards :standards="standards"
+ :selected-standards="selectedStandards"
+ :selected-domain="selectedDomain">
+ </web-api-standards>
</div>
</div>
</section>
diff --git a/config/js/components/web-api-standards.vue.js b/config/js/components/web-api-standards.vue.js
index 1a55a7d..acc78d9 100644
--- a/config/js/components/web-api-standards.vue.js
+++ b/config/js/components/web-api-standards.vue.js
@@ -5,11 +5,17 @@
const standardsDefaults = window.WEB_API_MANAGER.defaults;
Vue.component("web-api-standards", {
- props: ["standards", "selectedStandards"],
+ props: ["standards", "selectedStandards", "selectedDomain"],
template: `
<div class="web-api-standards-container">
- <div class="form-horizontal">
- <div class="form-group">
+ <h3>Pattern: <code>{{ selectedDomain }}</code></h3>
+
+ <div class="panel panel-default form-horizontal">
+ <div class="panel-heading">
+ Default configurations
+ </div>
+
+ <div class="panel-body">
<button @click="onConservativeClicked">
Use Conservative Settings
</button>
@@ -18,15 +24,23 @@
</button>
</div>
</div>
- <div class="checkbox" v-for="standard in standards">
- <label>
- <input type="checkbox"
- :value="standard.info.idenitifer"
- v-model="selectedStandards"
- @change="onStandardChecked">
- {{ standard.info.idenitifer }}
- <a href="{{ standard.info.url }}" v-if="standard.info.url">[info]</a>
- </label>
+
+ <div class="panel panel-default">
+ <div class="panel-heading">Blocked standards</div>
+
+ <ul class="list-group">
+ <li class="list-group-item" v-for="standard in standards">
+ <span v-if="standard.info.url" class="badge">
+ <a href="{{ standard.info.url }}">info</a>
+ </span>
+
+ <input type="checkbox"
+ :value="standard.info.idenitifer"
+ v-model="selectedStandards"
+ @change="onStandardChecked">
+ {{ standard.info.idenitifer }}
+ </li>
+ </ul>
</div>
</div>
`,
diff --git a/manifest.json b/manifest.json
index b92f9f7..84ee897 100644
--- a/manifest.json
+++ b/manifest.json
@@ -1,7 +1,7 @@
{
"manifest_version": 2,
"name": "WebAPI Manager",
- "version": "0.4",
+ "version": "0.5",
"description": "Improves browser security by restricting page access to parts of the Web API.",
"icons": {
"48": "images/uic-48.png",
@@ -46,7 +46,7 @@
"lib/storage.js",
"lib/URI.js",
"content_scripts/dist/standards.js",
- "background_scripts/bootstrap.js"
+ "background_scripts/background.js"
]
},
"options_ui": {
diff --git a/popup/css/popup.css b/popup/css/popup.css
new file mode 100644
index 0000000..c1fd3fe
--- /dev/null
+++ b/popup/css/popup.css
@@ -0,0 +1,7 @@
+body, html {
+ min-width: 320px;
+}
+
+section .row {
+ margin-bottom: 1em;
+}
\ No newline at end of file
diff --git a/popup/js/example.js b/popup/js/popup.js
similarity index 74%
rename from popup/js/example.js
rename to popup/js/popup.js
index 6639d6f..27cfc4c 100644
--- a/popup/js/example.js
+++ b/popup/js/popup.js
@@ -1,5 +1,14 @@
+/*jslint es6: true*/
+/*global window*/
(function () {
const rootObject = window.browser || window.chrome;
+ const configureButton = window.document.getElementById("config-page-link");
+
+ configureButton.addEventListener("click", function (event) {
+ rootObject.runtime.openOptionsPage();
+ event.preventDefault();
+ event.stopImmediatePropagation();
+ }, false);
rootObject.tabs.executeScript(
{
@@ -20,9 +29,13 @@
const liElm = document.createElement("li");
liElm.className = "list-group-item";
+ if (domainRule !== "(default)") {
+ liElm.className += " list-group-item-success";
+ }
const spanElm = document.createElement("span");
spanElm.className = "badge";
+
const badgeText = document.createTextNode(domainRule);
spanElm.appendChild(badgeText);
liElm.appendChild(spanElm);
diff --git a/popup/popup.html b/popup/popup.html
index 7818f3e..7203b16 100644
--- a/popup/popup.html
+++ b/popup/popup.html
@@ -7,14 +7,30 @@
<title>Frame listing popup</title>
<link href="../config/css/bootstrap.min.css" rel="stylesheet">
<link href="../config/css/bootstrap-theme.min.css" rel="stylesheet">
+ <link href="css/popup.css" rel="stylesheet">
</head>
<body>
- <section>
- This page has loaded the followng frames…
- <ul class="list-group">
- </ul>
+ <header class="container">
+ <div class="row">
+ <div class="col-xs-12">
+ <h2>Blocking Rules</h2>
+ </div>
+ </div>
+ </header>
+ <section class="container">
+ <div class="row">
+ <div class="col-xs-12">
+ <p>The following origins are execiting code on this page.</p>
+ <ul class="list-group">
+ </ul>
+
+ <button type="button" id="config-page-link" class="btn btn-default btn-block">
+ Configure blocking rules
+ </button>
+ </div>
+ </div>
</section>
- <script src="js/example.js"></script>
+ <script src="js/popup.js"></script>
</body>
</html>