Compare commits

...

8 commits

Author SHA1 Message Date
om 00677633bc Merge branch 'master' into feature/links-section
To resove merge conflict
2022-10-14 12:06:29 +02:00
om cd65e92e9b Merge pull request 'Add mobile phone frame to page' (#6) from feature/more-mobile-phone into master
Reviewed-on: #6
no language checks needed
2022-10-14 10:02:41 +00:00
om becf04a5b4 Add mobile phone frame to page 2022-10-14 11:59:22 +02:00
om 13105b1c60 typo 2022-10-13 23:34:42 +02:00
om 16eff4c895 Style things a bit more up 2022-10-13 23:32:36 +02:00
om 942b948bb2 Merge pull request 'Detect language based on URL' (#4) from feature/automatic-language-switch into master
Reviewed-on: #4
2022-10-13 19:07:39 +00:00
om 2d13672dde Use URLSearchParams for more robust lang selection 2022-10-10 07:30:58 +02:00
om 758367ba69 Detect language based on URL
If the outer website is english/danish, the chatapp will use the same
language.
2022-10-09 22:13:21 +02:00
5 changed files with 247 additions and 38 deletions

View file

@ -7,6 +7,8 @@
<link rel="stylesheet" type="text/css" href="../style.css" />
</head>
<body>
<div style="width: 100%">
<div id="content">
<div id="language_choice">
<a href="../en/"><img src="../img/english.svg"
@ -17,33 +19,54 @@
height="28" /></a>
</div>
<h1><span class="besked">ChatControl: Dine private beskeder skal overvåges</span></h1>
<h1><div class="besked">ChatControl: Dine private beskeder skal overvåges</div></h1>
<p>
EU-kommissionen har lavet et nyt lovforslag for at beskytte børn mod misbrug.
Formålet er godt, men loven er dårlig, fordi den kræver, at kommunikationstjenester
skal overvåges, hvis der er en mulighed for at børn
bruger dem, eller hvis der er en mulighed for at dele billeder af børnemisbrug.
EU-kommissionen har lavet et nyt lovforslag for at beskytte børn mod misbrug&#x1F607;.
Formålet er godt, men loven er dårlig&#x1F914;, fordi den kræver, at kommunikationstjenester
skal overvåges&#x1F9D0;, hvis der er en mulighed for at børn&#x1F476;
bruger dem, eller hvis der er en mulighed for at dele billeder af børnemisbrug&#x1F4F2;.
Det vil påvirke langt de fleste chat tjenester og vil betyde at din kommunikation
vil blive overvåget, fordi alle brugere af almindelige kommunikationstjenster
vil være mistænkte for børnemisbrug.
vil blive overvåget&#x1F4F3;, fordi alle brugere af almindelige kommunikationstjenster
vil være mistænkte for børnemisbrug&#x1F46E;.
</p>
<div id="app-area">
<object id="movie" data="../img/chatapp.svg" type="image/svg+xml"></object>
<p id="movie-sidetext">
Lær mere om ChatControllen og hvorfor det er en dårlig idé, i vores interaktive ChatControl film ude til venstre.
</p>
<div id="app-area"><!-- two columns -->
<div id="phone_frame">
<div style="background-image: url(../img/phone_frame.svg)">
<object id="movie"
data="../img/chatapp.svg?lang=da"
type="image/svg+xml"></object>
<div style="min-height: 102px"></div><!-- spacer -->
</div>
</div>
<div id="movie-sidetext">
<p>
Lær mere om ChatControllen og hvorfor det er en dårlig idé, i vores interaktive ChatControl film ude til venstre.
</p>
<p>
<svg version="1.1"
xmlns="http://www.w3.org/2000/svg"
width="20"
height="40"
viewBox="0 0 20 40">
<polyline points="0,20 20,0 20,40"
fill="#0084FF"
onclick="swipe_viewport()" />
</svg>
Du kan bruge den blå pil for at åbne kontaktlisten
</p>
</div>
</div><!-- end #app-area -->
<p>
Hvad kan man så gøre imod lovforslaget? Det er vigtigt at folk bliver oplyste om det.
Hvad kan man så gøre imod lovforslaget?&#x1F607; Det er vigtigt at folk bliver oplyste om det&#x1F4E3;.
Del linket til denne side! Snak med andre om det og tal med
<a href="https://www.europarl.europa.eu/meps/da/full-list">dine politikere i Europaparlamentet</a>
<a href="https://www.europarl.europa.eu/meps/da/full-list">dine politikere i Europaparlamentet</a>&#127466;&#127482;
om det (eller skriv en venlig e-mail til dem).
Det er vigtigt at der er en offentlig diskussion om emnet og at politikere ved
at loven er en elendig idé - selvom tanken er god.
Det er vigtigt at der er en offentlig diskussion om emnet&#x1F5E8; og at politikere ved
at loven er en elendig idé&#x1F640; - selvom tanken er god&#x1F63E;.
</p>
<h4>Flere informationer</h4>
@ -78,5 +101,12 @@ at loven er en elendig idé - selvom tanken er god.
</li>
</ul>
</div><!-- end #content -->
</div><!-- end center content -->
<script>
function swipe_viewport() {
document.getElementById('movie').contentDocument.getElementById('to_contact_list_button').onclick();
}
</script>
</body>
</html>

View file

@ -7,6 +7,8 @@
<link rel="stylesheet" type="text/css" href="../style.css" />
</head>
<body>
<div style="width: 100%"><!-- center content -->
<div id="content">
<div id="language_choice">
<a href="../en/"><img src="../img/english.svg"
@ -17,38 +19,59 @@
height="28" /></a>
</div>
<h1><span class="besked">Chat Control: Your private messages will be scanned</span></h1>
<h1><div class="besked">Chat Control: Your private messages will be scanned</div></h1>
<p>
The EU commission has proposed a new law to protect children against abuse.
The cause is good, but the law itself is bad, because it requires that
online services with messaging functionality have to be surveilled
if there is a possibility for children to use the service
or if users could potentially use the service to exchange child abuse material.
The EU commission has proposed a new law to protect children against abuse&#x1F607;.
The cause is good, but the law itself is bad&#x1F914;, because it requires that
online services with messaging functionality have to be surveilled&#x1F9D0;
if there is a possibility for children&#x1F476; to use the service
or if users could potentially use the service to exchange child abuse material&#x1F4F2;.
This will affect many communication services
and it will mean that <em>your</em> communication will be scanned,
and it will mean that <em>your</em> communication will be scanned&#x1F4F3;,
because all users of regular communication services
will be treated as suspects for child abuse.
will be treated as suspects for child abuse&#x1F46E;.
</p>
<div id="app-area">
<object id="movie" data="../img/chatapp.svg" type="image/svg+xml"></object>
<p id="movie-sidetext">
<div id="app-area"><!-- two columns -->
<div id="phone_frame">
<div style="background-image: url(../img/phone_frame.svg)">
<object id="movie"
data="../img/chatapp.svg?lang=en"
type="image/svg+xml"></object>
<div style="min-height: 102px"></div><!-- spacer -->
</div>
</div>
<div id="movie-sidetext">
<p>
Learn more about Chat Control and why it is a bad idea by watching our
interactive film on the left.
</p>
</p>
<p>
<svg version="1.1"
xmlns="http://www.w3.org/2000/svg"
width="20"
height="40"
viewBox="0 0 20 40">
<polyline points="0,20 20,0 20,40"
fill="#0084FF"
onclick="swipe_viewport()" />
</svg>
You can use the blue arrow to open the contact list
</p>
</div>
</div><!-- end #app-area -->
<p>
Whan can be done against this proposed law?
It is important that more people know about it.
Whan can be done against this proposed law?&#x1F607;
It is important that more people know about it&#x1F4E3;.
Share the link to this page!
Chat with others about it and talk with
<a href="https://www.europarl.europa.eu/meps/en/full-list">your representatives in the European Parliament</a>
<a href="https://www.europarl.europa.eu/meps/en/full-list">your representatives in the European Parliament</a>&#127466;&#127482;
about it (or write a nice e-mail to them).
It is important that there is a public discussion about this topic,
so that politicians realise that the law is a bad idea
even though this is for a good cause.
It is important that there is a public discussion about this topic&#x1F5E8;,
so that politicians realise that the law is a bad idea&#x1F640;
even though this is for a good cause&#x1F63E;
</p>
<h4>More information</h4>
@ -83,5 +106,12 @@ even though this is for a good cause.
</li>
</ul>
</div><!-- end #content -->
</div><!-- end center content -->
<script>
function swipe_viewport() {
document.getElementById('movie').contentDocument.getElementById('to_contact_list_button').onclick();
}
</script>
</body>
</html>

View file

@ -68,7 +68,9 @@ const typing_speed = 50;
var conversation_count = 0;
var current_dialog = null;
var current_language = "da";
var current_language = new URLSearchParams(location.search).get('lang') ?? 'da';
var current_dialog_fn = null;
/// SVG 1.1 doesn't do proper text splitting into several lines.
@ -698,7 +700,7 @@ async function dialog_nabopige_en() {
<!-- [right] contact name view -->
<g id="contact_name_box">
<rect x="300" y="0" width="300" height="50" fill="#F5F5F5"/>
<polyline points="300,20 320,0 320,40" fill="#0084FF" onclick="swipe_viewport()" />
<polyline points="300,20 320,0 320,40" fill="#0084FF" onclick="swipe_viewport()" id="to_contact_list_button" />
<polyline points="560,20 600,20 580,0" fill="#0084FF" onclick="scroll_up()" />
<polyline points="560,30 600,30 580,50" fill="#0084FF" onclick="scroll_down()" />
<text x="325" y="30" id="contact_indicator">loading...</text>

Before

Width:  |  Height:  |  Size: 27 KiB

After

Width:  |  Height:  |  Size: 27 KiB

137
img/phone_frame.svg Normal file
View file

@ -0,0 +1,137 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="480"
height="1020"
viewBox="20 100 130 100"
version="1.1"
id="svg8"
inkscape:version="1.2.1 (9c6d41e410, 2022-07-14, custom)"
sodipodi:docname="phone_frame.svg"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:dc="http://purl.org/dc/elements/1.1/">
<!--
license: public domain
origin: https://freesvg.org/mobile-phone-silhouette
-->
<title
id="title3727">generic_edge_android_phone_device</title>
<defs
id="defs2">
<linearGradient
inkscape:collect="always"
id="linearGradient3719">
<stop
style="stop-color:#666666;stop-opacity:1"
offset="0"
id="stop3715" />
<stop
id="stop3725"
offset="0.08058813"
style="stop-color:#f3f3f3;stop-opacity:1;" />
<stop
id="stop3723"
offset="0.90476203"
style="stop-color:#ffffff;stop-opacity:1" />
<stop
style="stop-color:#f2f2f2;stop-opacity:0;"
offset="1"
id="stop3717" />
</linearGradient>
<linearGradient
inkscape:collect="always"
xlink:href="#linearGradient3719"
id="linearGradient3721"
x1="109.84773"
y1="45.198696"
x2="129.29164"
y2="45.131882"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(4.9876188,0,0,6.181233,-528.78249,-67.440936)" />
</defs>
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="1.4"
inkscape:cx="92.142857"
inkscape:cy="586.78571"
inkscape:document-units="mm"
inkscape:current-layer="layer1"
showgrid="false"
units="px"
inkscape:window-width="1676"
inkscape:window-height="1004"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:showpageshadow="2"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1" />
<metadata
id="metadata5">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title>generic_edge_android_phone_device</dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0,-106.49998)">
<rect
id="rect10"
width="89.313583"
height="200.25793"
x="21.762379"
y="122.34576"
style="stroke-width:1.46436"
ry="14.773128"
inkscape:export-xdpi="90"
inkscape:export-ydpi="90" />
<rect
style="fill:url(#linearGradient3721);fill-opacity:1;stroke:none;stroke-width:1.55052"
id="rect20"
width="85.314461"
height="168.09663"
x="23.761925"
y="133.67665"
ry="5.9881759"
inkscape:export-xdpi="90"
inkscape:export-ydpi="90" />
<circle
style="fill:#f2f2f2;stroke:none;stroke-width:1.31964"
id="path22"
cx="66.419189"
cy="311.68604"
r="5.8320432"
inkscape:export-xdpi="90"
inkscape:export-ydpi="90" />
<rect
style="fill:#f2f2f2;stroke:none;stroke-width:1.31964076"
id="rect24"
width="19.794613"
height="2.7099769"
x="56.521885"
y="126.9505"
ry="1.3549885"
inkscape:export-xdpi="90"
inkscape:export-ydpi="90" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 3.9 KiB

View file

@ -1,3 +1,8 @@
#content {
max-width: 600px;
margin: 0 auto;
}
.besked {
color: #FFFFFF;
background-color: #0084FF;
@ -17,17 +22,22 @@ p {
#app-area {
display: grid;
grid-template-columns: 350px 300px;
grid-template-columns: 350px 240px;
gap: 10px;
grid-auto-rows: minmax(350px, auto);
}
#movie {
#phone_frame {
margin-left: 10px;
grid-column: 1;
grid-row: 1;
}
#movie {
margin-left: 17px;
margin-top: 77px;
}
#movie-sidetext {
grid-column: 2;
grid-row: 1;