Cleanup files, split sidebar and toolbar
This commit is contained in:
Arkadiusz Wieczorek
parent
eed5aba0ec
commit
39a7e34cb4
|
|
@ -15,6 +15,3 @@ Note: At the moment, we support Polish language because this extension generates
|
||||||
3. `npm run build`
|
3. `npm run build`
|
||||||
4. The build code is located in the `lib/` directory
|
4. The build code is located in the `lib/` directory
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
import { RequestCluster } from '../request-cluster';
|
import { RequestCluster } from '../../request-cluster';
|
||||||
import { ParsedAnswers } from './parse-answers';
|
import { ParsedAnswers } from './parse-answers';
|
||||||
import NoInformationAtAllProblem from './problems/no-information-at-all';
|
import NoInformationAtAllProblem from './problems/no-information-at-all';
|
||||||
import { Problem } from './problems/problem';
|
import { Problem } from './problems/problem';
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
import { RequestCluster } from '../request-cluster';
|
import { RequestCluster } from '../../request-cluster';
|
||||||
import { getDate } from '../util';
|
import { getDate } from '../../util';
|
||||||
import deduceProblems from './deduce-problems';
|
import deduceProblems from './deduce-problems';
|
||||||
import { Explainers } from './explainers';
|
import { Explainers } from './explainers';
|
||||||
import { ParsedAnswers } from './parse-answers';
|
import { ParsedAnswers } from './parse-answers';
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { HAREntry } from '../extended-request';
|
import { HAREntry } from '../../extended-request';
|
||||||
import { StolenDataEntry } from '../stolen-data-entry';
|
import { StolenDataEntry } from '../../stolen-data-entry';
|
||||||
import { getshorthost, unique } from '../util';
|
import { getshorthost, unique } from '../../util';
|
||||||
|
|
||||||
function handleNewFile(
|
function handleNewFile(
|
||||||
element: HTMLInputElement,
|
element: HTMLInputElement,
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
import { RequestCluster } from '../../request-cluster';
|
import { RequestCluster } from '../../../request-cluster';
|
||||||
import { ExplainerKey } from '../explainers';
|
import { ExplainerKey } from '../explainers';
|
||||||
import { ParsedAnswers } from '../parse-answers';
|
import { ParsedAnswers } from '../parse-answers';
|
||||||
|
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
import { RequestCluster } from '../../request-cluster';
|
import { RequestCluster } from '../../../request-cluster';
|
||||||
import { wordlist } from '../../util';
|
import { wordlist } from '../../../util';
|
||||||
import { ExplainerKey } from '../explainers';
|
import { ExplainerKey } from '../explainers';
|
||||||
import { ParsedAnswers } from '../parse-answers';
|
import { ParsedAnswers } from '../parse-answers';
|
||||||
import { v } from '../verbs';
|
import { v } from '../verbs';
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
import { RequestCluster } from '../../request-cluster';
|
import { RequestCluster } from '../../../request-cluster';
|
||||||
import { ExplainerKey } from '../explainers';
|
import { ExplainerKey } from '../explainers';
|
||||||
import { ParsedAnswers, ParsedHostAnswers } from '../parse-answers';
|
import { ParsedAnswers, ParsedHostAnswers } from '../parse-answers';
|
||||||
import { v } from '../verbs';
|
import { v } from '../verbs';
|
||||||
|
|
@ -3,7 +3,7 @@
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8" />
|
<meta charset="utf-8" />
|
||||||
<title>Treść maila do zgłoszenia</title>
|
<title>Treść maila do zgłoszenia</title>
|
||||||
<link rel="stylesheet" href="/lib/report-window/report-window.css" />
|
<link rel="stylesheet" href="/lib/components/report-window/report-window.css" />
|
||||||
<link rel="stylesheet" href="/node_modules/survey-react/survey.css" />
|
<link rel="stylesheet" href="/node_modules/survey-react/survey.css" />
|
||||||
<link rel="stylesheet" href="/node_modules/survey-react/modern.css" />
|
<link rel="stylesheet" href="/node_modules/survey-react/modern.css" />
|
||||||
</head>
|
</head>
|
||||||
|
|
@ -12,6 +12,6 @@
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
<script src="/node_modules/react/umd/react.development.js"></script>
|
<script src="/node_modules/react/umd/react.development.js"></script>
|
||||||
<script src="/node_modules/react-dom/umd/react-dom.development.js"></script>
|
<script src="/node_modules/react-dom/umd/react-dom.development.js"></script>
|
||||||
<script src="/lib/report-window/report-window.js"></script>
|
<script src="/lib/components/report-window/report-window.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
@import '../sidebar/fonts.scss';
|
@import './../../styles/colors.scss';
|
||||||
@import '../sidebar/colors.scss';
|
// @import './../../styles/fonts';
|
||||||
|
|
||||||
html {
|
html {
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import ReactDOM from 'react-dom';
|
import ReactDOM from 'react-dom';
|
||||||
import { getMemory } from '../memory';
|
import { getMemory } from '../../memory';
|
||||||
import { useEmitter } from '../util';
|
import { useEmitter } from '../../util';
|
||||||
|
|
||||||
import './report-window.scss';
|
import './report-window.scss';
|
||||||
import Questions from './questions';
|
import Questions from './questions';
|
||||||
|
|
@ -12,15 +12,15 @@
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
<link
|
<link
|
||||||
rel="stylesheet"
|
rel="stylesheet"
|
||||||
href="/lib/sidebar/global.css"
|
href="/lib/styles/global.css"
|
||||||
>
|
>
|
||||||
<link
|
<link
|
||||||
rel="stylesheet"
|
rel="stylesheet"
|
||||||
href="/lib/sidebar/sidebar.css"
|
href="/lib/components/sidebar/sidebar.css"
|
||||||
>
|
>
|
||||||
<script src="/node_modules/react/umd/react.production.min.js"></script>
|
<script src="/node_modules/react/umd/react.production.min.js"></script>
|
||||||
<script src="/node_modules/react-dom/umd/react-dom.production.min.js"></script>
|
<script src="/node_modules/react-dom/umd/react-dom.production.min.js"></script>
|
||||||
<script src="/lib/sidebar/sidebar.js"></script>
|
<script src="/lib/components/sidebar/sidebar.js"></script>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
@import './colors.scss';
|
@import '../../styles/colors.scss';
|
||||||
|
|
||||||
.sidebar {
|
.sidebar {
|
||||||
.header {
|
.header {
|
||||||
|
|
@ -10,7 +10,7 @@
|
||||||
border-bottom: 1px solid $light-grey;
|
border-bottom: 1px solid $light-grey;
|
||||||
position: sticky;
|
position: sticky;
|
||||||
top: 0;
|
top: 0;
|
||||||
background: #fff;
|
background: #ffffff;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
|
|
||||||
&--without-logo {
|
&--without-logo {
|
||||||
|
|
@ -1,9 +1,9 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import ReactDOM from 'react-dom';
|
import ReactDOM from 'react-dom';
|
||||||
import Options from '../options';
|
import Options from '../../options';
|
||||||
import { StolenData } from './stolen-data';
|
import { StolenData } from './stolen-data';
|
||||||
import { getshorthost, useEmitter } from '../util';
|
import { getshorthost, useEmitter } from '../../util';
|
||||||
import { getMemory } from '../memory';
|
import { getMemory } from '../../memory';
|
||||||
browser.browserAction.setBadgeBackgroundColor({ color: '#ffb900' });
|
browser.browserAction.setBadgeBackgroundColor({ color: '#ffb900' });
|
||||||
|
|
||||||
async function getCurrentTab() {
|
async function getCurrentTab() {
|
||||||
|
|
@ -14,14 +14,8 @@ async function getCurrentTab() {
|
||||||
return tab;
|
return tab;
|
||||||
}
|
}
|
||||||
|
|
||||||
function setDomainsNumber(counter: number) {
|
|
||||||
browser.browserAction.setBadgeText({ text: counter.toString() });
|
|
||||||
browser.browserAction.setTitle({
|
|
||||||
title: `Rentgen - ${counter !== 1 ? counter + ' podmiotów' : counter + ' podmiot'} `,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
import './global.scss';
|
import './../../styles/global.scss';
|
||||||
import './sidebar.scss';
|
import './sidebar.scss';
|
||||||
|
|
||||||
const Sidebar = () => {
|
const Sidebar = () => {
|
||||||
|
|
@ -61,6 +55,7 @@ const Sidebar = () => {
|
||||||
}
|
}
|
||||||
setOrigin(url.origin);
|
setOrigin(url.origin);
|
||||||
};
|
};
|
||||||
|
|
||||||
browser.tabs.onUpdated.addListener(listener);
|
browser.tabs.onUpdated.addListener(listener);
|
||||||
listener();
|
listener();
|
||||||
return () => {
|
return () => {
|
||||||
|
|
@ -74,7 +69,6 @@ const Sidebar = () => {
|
||||||
return setMarksOccurrence(true);
|
return setMarksOccurrence(true);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
setDomainsNumber(Object.values(getMemory().getClustersForOrigin(origin)).length);
|
|
||||||
|
|
||||||
return setMarksOccurrence(false);
|
return setMarksOccurrence(false);
|
||||||
}, [eventCounts['*'], origin]);
|
}, [eventCounts['*'], origin]);
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
@import './colors.scss';
|
@import '../../styles/colors.scss';
|
||||||
|
|
||||||
.stolen-data-cluster-container {
|
.stolen-data-cluster-container {
|
||||||
.domains-container {
|
.domains-container {
|
||||||
|
|
@ -1,8 +1,8 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { getMemory } from '../memory';
|
import { getMemory } from '../../memory';
|
||||||
import { StolenDataEntry } from '../stolen-data-entry';
|
import { StolenDataEntry } from '../../stolen-data-entry';
|
||||||
|
|
||||||
import { maskString, useEmitter } from '../util';
|
import { maskString, useEmitter } from '../../util';
|
||||||
|
|
||||||
import './stolen-data-cluster.scss';
|
import './stolen-data-cluster.scss';
|
||||||
|
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
@import './colors.scss';
|
@import '../../styles/colors.scss';
|
||||||
|
|
||||||
.stolen-data-container {
|
.stolen-data-container {
|
||||||
padding-top: .5rem;
|
padding-top: .5rem;
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
import { getMemory } from '../memory';
|
import { getMemory } from '../../memory';
|
||||||
import { RequestCluster } from '../request-cluster';
|
import { RequestCluster } from '../../request-cluster';
|
||||||
|
|
||||||
import StolenDataCluster from './stolen-data-cluster';
|
import StolenDataCluster from './stolen-data-cluster';
|
||||||
|
|
||||||
27
components/toolbar/toolbar.html
Normal file
27
components/toolbar/toolbar.html
Normal file
|
|
@ -0,0 +1,27 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<style>
|
||||||
|
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div id="toolbar"></div>
|
||||||
|
<link
|
||||||
|
rel="stylesheet"
|
||||||
|
href="/lib/styles/global.css"
|
||||||
|
>
|
||||||
|
<link
|
||||||
|
rel="stylesheet"
|
||||||
|
href="/lib/components/toolbar/toolbar.css"
|
||||||
|
>
|
||||||
|
<script src="/node_modules/react/umd/react.production.min.js"></script>
|
||||||
|
<script src="/node_modules/react-dom/umd/react-dom.production.min.js"></script>
|
||||||
|
<script src="/lib/components/toolbar/toolbar.js"></script>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
117
components/toolbar/toolbar.scss
Normal file
117
components/toolbar/toolbar.scss
Normal file
|
|
@ -0,0 +1,117 @@
|
||||||
|
@import '../../styles/colors.scss';
|
||||||
|
|
||||||
|
.toolbar {
|
||||||
|
padding: 0 .5rem;
|
||||||
|
|
||||||
|
.header {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 6.67rem 1fr 1.25rem;
|
||||||
|
align-items: center;
|
||||||
|
max-height: 3.5rem;
|
||||||
|
min-height: 3.5rem;
|
||||||
|
border-bottom: 1px solid $light-grey;
|
||||||
|
position: sticky;
|
||||||
|
top: 0;
|
||||||
|
background: #ffffff;
|
||||||
|
z-index: 1;
|
||||||
|
|
||||||
|
&--without-logo {
|
||||||
|
grid-template-columns: 1fr 1.25rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.webpage-metadata {
|
||||||
|
word-break: break-all;
|
||||||
|
display: flex;
|
||||||
|
flex-flow: column;
|
||||||
|
flex-wrap: nowrap;
|
||||||
|
font-size: 0.875rem;
|
||||||
|
font-weight: 600;
|
||||||
|
justify-content: center;
|
||||||
|
padding-left: 1rem;
|
||||||
|
color: #000;
|
||||||
|
|
||||||
|
&--without-logo {
|
||||||
|
padding-left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
&--hyperlink {
|
||||||
|
font-weight: 400;
|
||||||
|
color: $ultra-black-color;
|
||||||
|
max-height: 2rem;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
border: none;
|
||||||
|
background: transparent;
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
nav {
|
||||||
|
padding: 0.25rem 0;
|
||||||
|
border-bottom: 1px solid $light-grey;
|
||||||
|
|
||||||
|
button {
|
||||||
|
border: none;
|
||||||
|
cursor: pointer;
|
||||||
|
color: $ultra-black-color;
|
||||||
|
padding: 0.25rem 0rem;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: nowrap;
|
||||||
|
line-height: 1.25rem;
|
||||||
|
background: #fff;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: #000;
|
||||||
|
text-decoration: underline;
|
||||||
|
svg path {
|
||||||
|
fill: #000;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:disabled {
|
||||||
|
cursor: not-allowed;
|
||||||
|
color: $disabled-grey;
|
||||||
|
svg path {
|
||||||
|
fill: $disabled-grey;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
padding-left: 0.5rem;
|
||||||
|
font-size: 0.875rem;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.warning-container {
|
||||||
|
background-color: $pale-yellow;
|
||||||
|
border-left: 4px solid $contrast-yellow;
|
||||||
|
margin-top: 0.5rem;
|
||||||
|
font-size: 0.875rem;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: calc(100% - 2rem) 2rem;
|
||||||
|
align-items: flex-start;
|
||||||
|
|
||||||
|
span {
|
||||||
|
padding: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
justify-content: flex-end;
|
||||||
|
border: none;
|
||||||
|
cursor: pointer;
|
||||||
|
color: $ultra-black-color;
|
||||||
|
line-height: 1.25rem;
|
||||||
|
background: transparent;
|
||||||
|
padding: 0.5rem 0.5rem;
|
||||||
|
display: flex;
|
||||||
|
align-self: flex-start;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
204
components/toolbar/toolbar.tsx
Normal file
204
components/toolbar/toolbar.tsx
Normal file
|
|
@ -0,0 +1,204 @@
|
||||||
|
import React from 'react';
|
||||||
|
import ReactDOM from 'react-dom';
|
||||||
|
import { useEmitter } from '../../util';
|
||||||
|
import { getMemory } from '../../memory';
|
||||||
|
browser.browserAction.setBadgeBackgroundColor({ color: '#ffb900' });
|
||||||
|
|
||||||
|
async function getCurrentTab() {
|
||||||
|
const [tab] = await browser.tabs.query({
|
||||||
|
active: true,
|
||||||
|
windowId: browser.windows.WINDOW_ID_CURRENT,
|
||||||
|
});
|
||||||
|
return tab;
|
||||||
|
}
|
||||||
|
|
||||||
|
import './../../styles/global.scss';
|
||||||
|
import './toolbar.scss';
|
||||||
|
|
||||||
|
const Toolbar = () => {
|
||||||
|
const [origin, setOrigin] = React.useState<string | null>(null);
|
||||||
|
const [minValueLength, setMinValueLength] = React.useState<number | null>(
|
||||||
|
localStorage.getItem('minValueLength') === null
|
||||||
|
? 7
|
||||||
|
: (localStorage.getItem('minValueLength') as unknown as number)
|
||||||
|
);
|
||||||
|
const [cookiesOnly, setCookiesOnly] = React.useState<boolean>(false);
|
||||||
|
const [stolenDataView, setStolenDataView] = React.useState<boolean>(true);
|
||||||
|
const [cookiesOrOriginOnly, setCookiesOrOriginOnly] = React.useState<boolean>(false);
|
||||||
|
const [eventCounts, setEventCounts] = useEmitter(getMemory());
|
||||||
|
const [marksOccurrence, setMarksOccurrence] = React.useState<boolean>(false);
|
||||||
|
const [warningDataDialogAck, setWarningDataDialogAck] = React.useState<boolean>(
|
||||||
|
localStorage.getItem('warningDataDialogAck') === null
|
||||||
|
? true
|
||||||
|
: localStorage.getItem('warningDataDialogAck') == 'true'
|
||||||
|
? true
|
||||||
|
: false
|
||||||
|
);
|
||||||
|
const [logoVisibility, setLogoVisibility] = React.useState<boolean>(
|
||||||
|
localStorage.getItem('logoVisibility') === null
|
||||||
|
? false
|
||||||
|
: localStorage.getItem('logoVisibility') == 'true'
|
||||||
|
? true
|
||||||
|
: false
|
||||||
|
);
|
||||||
|
|
||||||
|
React.useEffect(() => {
|
||||||
|
const listener = async () => {
|
||||||
|
console.log('tab change!');
|
||||||
|
const tab = await getCurrentTab();
|
||||||
|
const url = new URL(tab.url);
|
||||||
|
if (url.origin.startsWith('moz-extension')) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
setOrigin(url.origin);
|
||||||
|
};
|
||||||
|
|
||||||
|
browser.tabs.onUpdated.addListener(listener);
|
||||||
|
listener();
|
||||||
|
return () => {
|
||||||
|
browser.tabs.onUpdated.removeListener(listener);
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
|
React.useEffect(() => {
|
||||||
|
for (const cluster of Object.values(getMemory().getClustersForOrigin(origin))) {
|
||||||
|
if (cluster.hasMarks()) {
|
||||||
|
return setMarksOccurrence(true);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return setMarksOccurrence(false);
|
||||||
|
}, [eventCounts['*'], origin]);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="toolbar">
|
||||||
|
<header className={logoVisibility ? 'header' : 'header header--without-logo'}>
|
||||||
|
<img
|
||||||
|
src="../assets/logo-internet-czas-dzialac.svg"
|
||||||
|
height={40}
|
||||||
|
style={!logoVisibility ? { display: 'none' } : null}
|
||||||
|
></img>
|
||||||
|
<div
|
||||||
|
className={
|
||||||
|
logoVisibility
|
||||||
|
? 'webpage-metadata'
|
||||||
|
: 'webpage-metadata webpage-metadata--without-logo'
|
||||||
|
}
|
||||||
|
>
|
||||||
|
{origin ? (
|
||||||
|
<>
|
||||||
|
<span>Analiza strony</span>
|
||||||
|
<span className="webpage-metadata--hyperlink">{origin}</span>
|
||||||
|
</>
|
||||||
|
) : (
|
||||||
|
<span>Przejdź do wybranej strony internetowej</span>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
{stolenDataView ? (
|
||||||
|
<a href="https://internet-czas-dzialac.pl">
|
||||||
|
<img src="/assets/icons/info_circle_outline.svg" width="20" height="20" />
|
||||||
|
</a>
|
||||||
|
) : (
|
||||||
|
<button onClick={() => setStolenDataView(true)}>
|
||||||
|
<img src="/assets/icons/short_left.svg" width="20" height="20" />
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
|
</header>
|
||||||
|
|
||||||
|
{stolenDataView ? (
|
||||||
|
<nav>
|
||||||
|
<button onClick={() => setStolenDataView(!stolenDataView)}>
|
||||||
|
<img src="/assets/icons/settings.svg" width="20" height="20" />
|
||||||
|
<span>Ustawienia</span>
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
onClick={() => {
|
||||||
|
getMemory().removeRequestsFor(origin);
|
||||||
|
getMemory().emit('change', false, origin, 'clicked trash');
|
||||||
|
setMarksOccurrence(false);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<img src="/assets/icons/trash_full.svg" width="20" height="20" />
|
||||||
|
<span>Wyczyść historię wtyczki</span>
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
onClick={() => {
|
||||||
|
getMemory().removeCookiesFor(origin);
|
||||||
|
getMemory().emit('change', false, origin, 'clicked clear cookies');
|
||||||
|
setMarksOccurrence(false);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<img src="/assets/icons/cookie.svg" width="20" height="20" />
|
||||||
|
<span>Wyczyść ciasteczka</span>
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
disabled={!marksOccurrence}
|
||||||
|
title={
|
||||||
|
marksOccurrence
|
||||||
|
? 'Kliknij, aby wygenerować wiadomość'
|
||||||
|
: 'Zaznacz poniżej elementy, aby móc wygenerować wiadomość'
|
||||||
|
}
|
||||||
|
onClick={() => {
|
||||||
|
const params = [
|
||||||
|
'height=' + screen.height,
|
||||||
|
'width=' + screen.width,
|
||||||
|
'fullscreen=yes',
|
||||||
|
].join(',');
|
||||||
|
window.open(
|
||||||
|
`/report-window/report-window.html?origin=${origin}`,
|
||||||
|
'new_window',
|
||||||
|
params
|
||||||
|
);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<svg
|
||||||
|
width="20"
|
||||||
|
height="20"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M20 20H4C2.89543 20 2 19.1046 2 18V5.913C2.04661 4.84255 2.92853 3.99899 4 4H20C21.1046 4 22 4.89543 22 6V18C22 19.1046 21.1046 20 20 20ZM4 7.868V18H20V7.868L12 13.2L4 7.868ZM4.8 6L12 10.8L19.2 6H4.8Z"
|
||||||
|
fill="#2E3A59"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
|
||||||
|
<span>Utwórz wiadomość dla administratora witryny</span>
|
||||||
|
</button>
|
||||||
|
</nav>
|
||||||
|
) : null}
|
||||||
|
|
||||||
|
<section>
|
||||||
|
{stolenDataView ? (
|
||||||
|
<>
|
||||||
|
{warningDataDialogAck ? (
|
||||||
|
<section className="warning-container">
|
||||||
|
<span>
|
||||||
|
<strong>Uwaga!</strong> Niekoniecznie każda przechwycona poniżej
|
||||||
|
informacja jest daną osobową. Niektóre z podanych domen mogą
|
||||||
|
należeć do właściciela strony i nie reprezentować podmiotów
|
||||||
|
trzecich.
|
||||||
|
</span>
|
||||||
|
<button
|
||||||
|
onClick={() => {
|
||||||
|
setWarningDataDialogAck(false);
|
||||||
|
localStorage.setItem(
|
||||||
|
'warningDataDialogAck',
|
||||||
|
false as unknown as string
|
||||||
|
);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<img src="/assets/icons/close_big.svg" width="16" height="16" />
|
||||||
|
</button>
|
||||||
|
</section>
|
||||||
|
) : null}
|
||||||
|
<div>stolen data</div>
|
||||||
|
</>
|
||||||
|
) : null}
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
ReactDOM.render(<Toolbar />, document.getElementById('toolbar'));
|
||||||
|
|
@ -44,9 +44,10 @@ let skipReactImports = {
|
||||||
esbuild
|
esbuild
|
||||||
.build({
|
.build({
|
||||||
entryPoints: [
|
entryPoints: [
|
||||||
'sidebar/sidebar.tsx',
|
'components/toolbar/toolbar.tsx',
|
||||||
|
'components/sidebar/sidebar.tsx',
|
||||||
'test.ts',
|
'test.ts',
|
||||||
'report-window/report-window.tsx',
|
'components/report-window/report-window.tsx',
|
||||||
'background.ts',
|
'background.ts',
|
||||||
],
|
],
|
||||||
bundle: true,
|
bundle: true,
|
||||||
|
|
|
||||||
|
|
@ -19,7 +19,7 @@
|
||||||
"browser_action": {
|
"browser_action": {
|
||||||
"default_icon": "assets/icon-addon.svg",
|
"default_icon": "assets/icon-addon.svg",
|
||||||
"default_title": "Rentgen",
|
"default_title": "Rentgen",
|
||||||
"default_popup": "sidebar/sidebar.html"
|
"default_popup": "components/toolbar/toolbar.html"
|
||||||
},
|
},
|
||||||
"icons": {
|
"icons": {
|
||||||
"16": "assets/icon-addon.svg",
|
"16": "assets/icon-addon.svg",
|
||||||
|
|
|
||||||
14
memory.ts
14
memory.ts
|
|
@ -3,6 +3,14 @@ import { getshorthost, makeThrottle } from './util';
|
||||||
import { EventEmitter } from 'events';
|
import { EventEmitter } from 'events';
|
||||||
import { RequestCluster } from './request-cluster';
|
import { RequestCluster } from './request-cluster';
|
||||||
|
|
||||||
|
function setDomainsNumber(counter: number, tabId: number) {
|
||||||
|
browser.browserAction.setBadgeText({ text: counter.toString(), tabId });
|
||||||
|
browser.browserAction.setTitle({
|
||||||
|
title: `Rentgen - liczba wykrytych podmiotów: ${counter}`,
|
||||||
|
tabId,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
export default class Memory extends EventEmitter {
|
export default class Memory extends EventEmitter {
|
||||||
origin_to_history = {} as Record<string, Record<string, RequestCluster>>;
|
origin_to_history = {} as Record<string, Record<string, RequestCluster>>;
|
||||||
private throttle = makeThrottle(100);
|
private throttle = makeThrottle(100);
|
||||||
|
|
@ -21,6 +29,12 @@ export default class Memory extends EventEmitter {
|
||||||
}
|
}
|
||||||
this.origin_to_history[request.origin][shorthost].add(request);
|
this.origin_to_history[request.origin][shorthost].add(request);
|
||||||
this.emit('change', false, shorthost, 'registered request(shorthost emit)');
|
this.emit('change', false, shorthost, 'registered request(shorthost emit)');
|
||||||
|
|
||||||
|
console.log(this.getClustersForOrigin(request.origin));
|
||||||
|
setDomainsNumber(
|
||||||
|
Object.values(this.getClustersForOrigin(request.origin)).length,
|
||||||
|
request.tabId
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
constructor() {
|
constructor() {
|
||||||
|
|
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
@import './sidebar/colors.scss';
|
@import './styles/colors.scss';
|
||||||
|
|
||||||
.options-container {
|
.options-container {
|
||||||
padding-top: 0.5rem;
|
padding-top: 0.5rem;
|
||||||
|
|
|
||||||
5769
package-lock.json
generated
5769
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
BIN
screenshot.png
BIN
screenshot.png
Binary file not shown.
|
Before Width: | Height: | Size: 1023 KiB |
BIN
screenshot2.png
BIN
screenshot2.png
Binary file not shown.
|
Before Width: | Height: | Size: 275 KiB |
BIN
screenshot3.png
BIN
screenshot3.png
Binary file not shown.
|
Before Width: | Height: | Size: 265 KiB |
|
|
@ -1,49 +0,0 @@
|
||||||
@font-face {
|
|
||||||
font-family: 'Fira Code';
|
|
||||||
src: url('./../assets/fonts/fira-code/woff2/FiraCode-Light.woff2') format('woff2'),
|
|
||||||
url('./../assets/fonts/fira-code/woff/FiraCode-Light.woff') format('woff');
|
|
||||||
font-weight: 300;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: 'Fira Code';
|
|
||||||
src: url('./../assets/fonts/fira-code/woff2/FiraCode-Regular.woff2') format('woff2'),
|
|
||||||
url('./../assets/fonts/fira-code/woff/FiraCode-Regular.woff') format('woff');
|
|
||||||
font-weight: 400;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: 'Fira Code';
|
|
||||||
src: url('./../assets/fonts/fira-code/woff2/FiraCode-Medium.woff2') format('woff2'),
|
|
||||||
url('./../assets/fonts/fira-code/woff/FiraCode-Medium.woff') format('woff');
|
|
||||||
font-weight: 500;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: 'Fira Code';
|
|
||||||
src: url('./../assets/fonts/fira-code/woff2/FiraCode-SemiBold.woff2') format('woff2'),
|
|
||||||
url('./../assets/fonts/fira-code/woff/FiraCode-SemiBold.woff') format('woff');
|
|
||||||
font-weight: 600;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: 'Fira Code';
|
|
||||||
src: url('./../assets/fonts/fira-code/woff2/FiraCode-Bold.woff2') format('woff2'),
|
|
||||||
url('./../assets/fonts/fira-code/woff/FiraCode-Bold.woff') format('woff');
|
|
||||||
font-weight: 700;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: 'Fira Code VF';
|
|
||||||
src: url('./../assets/fonts/fira-code/woff2/FiraCode-VF.woff2')
|
|
||||||
format('woff2-variations'),
|
|
||||||
url('./../assets/fonts/fira-code/woff/FiraCode-VF.woff') format('woff-variations');
|
|
||||||
/* font-weight requires a range: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Fonts/Variable_Fonts_Guide#Using_a_variable_font_font-face_changes */
|
|
||||||
font-weight: 300 700;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
48
styles/fonts.scss
Normal file
48
styles/fonts.scss
Normal file
|
|
@ -0,0 +1,48 @@
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Fira Code';
|
||||||
|
src: url('../assets/fonts/fira-code/woff2/FiraCode-Light.woff2') format('woff2'),
|
||||||
|
url('../assets/fonts/fira-code/woff/FiraCode-Light.woff') format('woff');
|
||||||
|
font-weight: 300;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Fira Code';
|
||||||
|
src: url('../assets/fonts/fira-code/woff2/FiraCode-Regular.woff2') format('woff2'),
|
||||||
|
url('../assets/fonts/fira-code/woff/FiraCode-Regular.woff') format('woff');
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Fira Code';
|
||||||
|
src: url('../assets/fonts/fira-code/woff2/FiraCode-Medium.woff2') format('woff2'),
|
||||||
|
url('../assets/fonts/fira-code/woff/FiraCode-Medium.woff') format('woff');
|
||||||
|
font-weight: 500;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Fira Code';
|
||||||
|
src: url('../assets/fonts/fira-code/woff2/FiraCode-SemiBold.woff2') format('woff2'),
|
||||||
|
url('../assets/fonts/fira-code/woff/FiraCode-SemiBold.woff') format('woff');
|
||||||
|
font-weight: 600;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Fira Code';
|
||||||
|
src: url('../assets/fonts/fira-code/woff2/FiraCode-Bold.woff2') format('woff2'),
|
||||||
|
url('../assets/fonts/fira-code/woff/FiraCode-Bold.woff') format('woff');
|
||||||
|
font-weight: 700;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Fira Code VF';
|
||||||
|
src: url('../assets/fonts/fira-code/woff2/FiraCode-VF.woff2') format('woff2-variations'),
|
||||||
|
url('../assets/fonts/fira-code/woff/FiraCode-VF.woff') format('woff-variations');
|
||||||
|
/* font-weight requires a range: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Fonts/Variable_Fonts_Guide#Using_a_variable_font_font-face_changes */
|
||||||
|
font-weight: 300 700;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
@ -11,7 +11,9 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
min-width: 24rem;
|
width: 400px;
|
||||||
|
height: 600px;
|
||||||
|
overflow-x: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
html {
|
html {
|
||||||
Loading…
Reference in New Issue
Block a user