buta
This commit is contained in:
parent
f0424dcbdd
commit
b87002c7a1
8 changed files with 88 additions and 24 deletions
|
@ -1,3 +1,7 @@
|
||||||
body {
|
body {
|
||||||
width: 800px;
|
min-width: 800px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.list-group-item .badge a {
|
||||||
|
color: white;
|
||||||
}
|
}
|
|
@ -10,16 +10,26 @@
|
||||||
<link href="css/bootstrap-theme.min.css" rel="stylesheet">
|
<link href="css/bootstrap-theme.min.css" rel="stylesheet">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header>
|
|
||||||
</header>
|
|
||||||
<section class="container">
|
<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="row">
|
||||||
<div class="col-xs-4 col-md-4 well">
|
<div class="col-xs-4 col-md-4 well">
|
||||||
<domain-rules :domain-names="domainNames" :selected-domain="selectedDomain"></domain-rules>
|
<domain-rules :domain-names="domainNames" :selected-domain="selectedDomain"></domain-rules>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="col-xs-7 col-md-7 col-md-offset-1 col-xs-offset-1">
|
<div class="col-xs-8 col-md-8">
|
||||||
<web-api-standards :standards="standards" :selected-standards="selectedStandards"></web-api-standards>
|
<web-api-standards :standards="standards"
|
||||||
|
:selected-standards="selectedStandards"
|
||||||
|
:selected-domain="selectedDomain">
|
||||||
|
</web-api-standards>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
|
@ -5,11 +5,17 @@
|
||||||
const standardsDefaults = window.WEB_API_MANAGER.defaults;
|
const standardsDefaults = window.WEB_API_MANAGER.defaults;
|
||||||
|
|
||||||
Vue.component("web-api-standards", {
|
Vue.component("web-api-standards", {
|
||||||
props: ["standards", "selectedStandards"],
|
props: ["standards", "selectedStandards", "selectedDomain"],
|
||||||
template: `
|
template: `
|
||||||
<div class="web-api-standards-container">
|
<div class="web-api-standards-container">
|
||||||
<div class="form-horizontal">
|
<h3>Pattern: <code>{{ selectedDomain }}</code></h3>
|
||||||
<div class="form-group">
|
|
||||||
|
<div class="panel panel-default form-horizontal">
|
||||||
|
<div class="panel-heading">
|
||||||
|
Default configurations
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="panel-body">
|
||||||
<button @click="onConservativeClicked">
|
<button @click="onConservativeClicked">
|
||||||
Use Conservative Settings
|
Use Conservative Settings
|
||||||
</button>
|
</button>
|
||||||
|
@ -18,15 +24,23 @@
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="checkbox" v-for="standard in standards">
|
|
||||||
<label>
|
<div class="panel panel-default">
|
||||||
<input type="checkbox"
|
<div class="panel-heading">Blocked standards</div>
|
||||||
:value="standard.info.idenitifer"
|
|
||||||
v-model="selectedStandards"
|
<ul class="list-group">
|
||||||
@change="onStandardChecked">
|
<li class="list-group-item" v-for="standard in standards">
|
||||||
{{ standard.info.idenitifer }}
|
<span v-if="standard.info.url" class="badge">
|
||||||
<a href="{{ standard.info.url }}" v-if="standard.info.url">[info]</a>
|
<a href="{{ standard.info.url }}">info</a>
|
||||||
</label>
|
</span>
|
||||||
|
|
||||||
|
<input type="checkbox"
|
||||||
|
:value="standard.info.idenitifer"
|
||||||
|
v-model="selectedStandards"
|
||||||
|
@change="onStandardChecked">
|
||||||
|
{{ standard.info.idenitifer }}
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
`,
|
`,
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
{
|
{
|
||||||
"manifest_version": 2,
|
"manifest_version": 2,
|
||||||
"name": "WebAPI Manager",
|
"name": "WebAPI Manager",
|
||||||
"version": "0.4",
|
"version": "0.5",
|
||||||
"description": "Improves browser security by restricting page access to parts of the Web API.",
|
"description": "Improves browser security by restricting page access to parts of the Web API.",
|
||||||
"icons": {
|
"icons": {
|
||||||
"48": "images/uic-48.png",
|
"48": "images/uic-48.png",
|
||||||
|
@ -46,7 +46,7 @@
|
||||||
"lib/storage.js",
|
"lib/storage.js",
|
||||||
"lib/URI.js",
|
"lib/URI.js",
|
||||||
"content_scripts/dist/standards.js",
|
"content_scripts/dist/standards.js",
|
||||||
"background_scripts/bootstrap.js"
|
"background_scripts/background.js"
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
"options_ui": {
|
"options_ui": {
|
||||||
|
|
7
popup/css/popup.css
Normal file
7
popup/css/popup.css
Normal file
|
@ -0,0 +1,7 @@
|
||||||
|
body, html {
|
||||||
|
min-width: 320px;
|
||||||
|
}
|
||||||
|
|
||||||
|
section .row {
|
||||||
|
margin-bottom: 1em;
|
||||||
|
}
|
|
@ -1,5 +1,14 @@
|
||||||
|
/*jslint es6: true*/
|
||||||
|
/*global window*/
|
||||||
(function () {
|
(function () {
|
||||||
const rootObject = window.browser || window.chrome;
|
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(
|
rootObject.tabs.executeScript(
|
||||||
{
|
{
|
||||||
|
@ -20,9 +29,13 @@
|
||||||
|
|
||||||
const liElm = document.createElement("li");
|
const liElm = document.createElement("li");
|
||||||
liElm.className = "list-group-item";
|
liElm.className = "list-group-item";
|
||||||
|
if (domainRule !== "(default)") {
|
||||||
|
liElm.className += " list-group-item-success";
|
||||||
|
}
|
||||||
|
|
||||||
const spanElm = document.createElement("span");
|
const spanElm = document.createElement("span");
|
||||||
spanElm.className = "badge";
|
spanElm.className = "badge";
|
||||||
|
|
||||||
const badgeText = document.createTextNode(domainRule);
|
const badgeText = document.createTextNode(domainRule);
|
||||||
spanElm.appendChild(badgeText);
|
spanElm.appendChild(badgeText);
|
||||||
liElm.appendChild(spanElm);
|
liElm.appendChild(spanElm);
|
|
@ -7,14 +7,30 @@
|
||||||
<title>Frame listing popup</title>
|
<title>Frame listing popup</title>
|
||||||
<link href="../config/css/bootstrap.min.css" rel="stylesheet">
|
<link href="../config/css/bootstrap.min.css" rel="stylesheet">
|
||||||
<link href="../config/css/bootstrap-theme.min.css" rel="stylesheet">
|
<link href="../config/css/bootstrap-theme.min.css" rel="stylesheet">
|
||||||
|
<link href="css/popup.css" rel="stylesheet">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<section>
|
<header class="container">
|
||||||
This page has loaded the followng frames…
|
<div class="row">
|
||||||
<ul class="list-group">
|
<div class="col-xs-12">
|
||||||
</ul>
|
<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>
|
</section>
|
||||||
<script src="js/example.js"></script>
|
<script src="js/popup.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue