a2/chatcontrol-live-demo
1
0
Fork 0
forked from om/chatcontrol-live-demo
Code Issues Pull requests Projects Releases Wiki Activity

Compare commits

base: a2:067afdb1872e2571c73d59a787e5931e89bb0bac
Branches Tags
a2:master
a2:asbjørn-additions
om:master
..
compare: a2:0f5ad57aec315972480ca2b546267f6eeb39c9dd
Branches Tags
a2:asbjørn-additions
a2:master
om:master

No commits in common. "067afdb1872e2571c73d59a787e5931e89bb0bac" and "0f5ad57aec315972480ca2b546267f6eeb39c9dd" have entirely different histories.
067afdb187 ... 0f5ad57aec

1 changed files with 21 additions and 23 deletions
Show stats Expand all files Collapse all files

44
chatapp.svg
View file

@ -73,7 +73,7 @@ function ChatMessage(message_text, is_myself) {
/// Render the chat message on the screen /// Render the chat message on the screen
this.draw = function() { this.draw = function() {
let text = document.createElementNS(svgns, 'text'); let text = document.createElementNS(svgns, 'text');
let x = 100 + (is_myself ? 10 : 50); let x = (is_myself)?10 :50;
text.setAttribute('x', `${x}%`); text.setAttribute('x', `${x}%`);
lines.forEach(function(line) { lines.forEach(function(line) {
@ -133,11 +133,9 @@ function swipe_viewport() {
let coords = svg.getAttribute('viewBox').split(' '); let coords = svg.getAttribute('viewBox').split(' ');
let x = parseInt(coords.shift()); let x = parseInt(coords.shift());
if(x == 0) { if(x == 0) {
// moving from messages to contacts
var step = 5; var step = 5;
var end = width; var end = width;
} else { } else {
// moving from contacts to messages
var step = -5; var step = -5;
var end = 0; var end = 0;
} }
@ -219,21 +217,21 @@ async function dialog_ven() {
await d.you('Har du hørt om den nye EU lov "ChatControl"?'); await d.you('Har du hørt om den nye EU lov "ChatControl"?');
await d.me("nej, det har jeg ikke"); await d.me("nej, det har jeg ikke");
await d.me("hvad handler det om?"); await d.me("hvad handler det om?");
await d.you('EU kommissionen planlægger at læse alle chatbeskeder i EU'); await d.you('EU comissionen planlægger at læse alle chatbeskeder i EUen');
await d.me('Ja, men vi krypterer jo vores beskeder? Tough luck!'); await d.me('Ja, men vi krypterer jo vores beskeder? Tough luck!');
await d.you('Det tager de højde for. Aflytningen vil ske før krypteringen på din telefon!'); await d.you('Det tager de højde for. Aflytningen vil ske før krypteringen på din lokale telefon!');
await d.me('Det lyder overhovedet ikke rart. Hvorfor vil de gøre det?'); await d.me('Det lyder overhoved ikke rart. Hvorfor vil de gøre det?');
await d.you('De siger at det er for at beskytte børn på nettet.'); await d.you('De siger at det er for at beskytte børn på nettet.');
await d.you('Men det giver ikke meget mening'); await d.you('Men det giver ikke meget mening');
await d.me('Alle vores beskeder skal scannes på grund af børn på nettet? Det lyder dumt!'); await d.me('Alle vores beskeder skal scannes på grund af børn på nettet? Det lyder dumt!');
await d.you('Her kan du læse mere om det:'); await d.you('Her kan du finde mere informationer om det:');
await d.you('https://chatcontrol.eu'); await d.you('https://chatcontrol.eu');
} }
async function dialog_mor() { async function dialog_mor() {
let d = new Dialog('Mor'); let d = new Dialog('Mor');
await d.you("Jeg har fundet nogle gamle familiebilleder fra vores ferie 10 år siden"); await d.you("Jeg har fundet nogle gamle familiebilleder fra vores ferie 10 år siden");
await d.you("Her leger du på stranden"); await d.you("Her spiller du på stranden");
await d.you("(naked stick figure image here)"); await d.you("(naked stick figure image here)");
} }
@ -241,30 +239,30 @@ async function dialog_kaereste() {
let d = new Dialog('Kæreste'); let d = new Dialog('Kæreste');
await d.me('hej smukkeste'); await d.me('hej smukkeste');
await d.you('hej, jeg har lige tænkt på dig!'); await d.you('hej, jeg har lige tænkt på dig!');
await d.you('og derfor har jeg taget et sexet billede'); await d.you('og derfor har jeg lavet an sexy billede');
await d.you('(silly naked stick figure image here)') await d.you('(silly naked stick figure image here)')
} }
]]> ]]>
</script> </script>
<!-- [right] contact name view --> <!-- [left] contact name view -->
<rect x="100%" y="0" width="100%" height="10%" fill="yellow" /> <rect x="0" y="0" width="100%" height="10%" fill="yellow" />
<polyline points="300,20 320,0 320,40" fill="blue" onclick="swipe_viewport()" /> <!-- XXX: these polyline points depend on the svg width --> <polyline points="0,20 20,0 20,40" fill="blue" onclick="swipe_viewport()" />
<text x="125%" y="30" id="contact_indicator">loading...</text> <text x="50" y="30" id="contact_indicator">loading...</text>
<!-- [right] messages view --> <!-- [left] messages view -->
<rect x="100%" y="10%" width="100%" height="90%" style="stroke: green; stroke-width: 10px" fill="blue" /> <rect x="0" y="10%" width="100%" height="90%" style="stroke: green; stroke-width: 10px" fill="blue" />
<rect id="messages_background" x="105%" y="15%" z="2" width="90%" height="85%" fill="pink" /> <rect id="messages_background" x="5%" y="15%" z="2" width="90%" height="85%" fill="pink" />
<g id="messages"></g> <g id="messages"></g>
<!-- [left] contact list --> <!-- [right] contact list -->
<rect x="0" y="0" width="100%" height="10%" fill="yellow" /> <rect x="100%" y="0" width="100%" height="10%" fill="yellow" />
<text x="20%" y="30">Dine kontakter</text> <text x="120%" y="30">Dine kontakter</text>
<rect x="0" y="10%" width="100%" height="100%" style="stroke: green; stroke-width: 10px" fill="aqua" /> <rect x="100%" y="10%" width="100%" height="100%" style="stroke: green; stroke-width: 10px" fill="aqua" />
<text x="5%" y="15%" onclick="start_chat('Ven')">Ven</text> <text x="105%" y="15%" onclick="start_chat('Ven')">Ven</text>
<text x="5%" y="20%" onclick="start_chat('Mor')">Mor</text> <text x="105%" y="20%" onclick="start_chat('Mor')">Mor</text>
<text x="5%" y="25%" onclick="start_chat('Kæreste')">Kæreste&#10084;</text> <text x="105%" y="25%" onclick="start_chat('Kæreste')">Kæreste&#10084;</text>
</svg> </svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.1 KiB

After

Width:  |  Height:  |  Size: 8 KiB