Finish draft of new chat contacts
There's probably still a lot of typos
This commit is contained in:
om
parent
e0b37b2012
commit
911a58bd6b
137
chatapp.svg
137
chatapp.svg
|
|
@ -52,6 +52,7 @@ const visible_chat_area = {'top': 60,
|
|||
const typing_speed = 50;
|
||||
|
||||
var conversation_count = 0;
|
||||
var current_dialog = null;
|
||||
|
||||
/// SVG 1.1 doesn't do proper text splitting into several lines.
|
||||
/// we need to do it ourselves.
|
||||
|
|
@ -84,6 +85,16 @@ function split_text_into_lines(text, upper_line_length) {
|
|||
return result;
|
||||
}
|
||||
|
||||
function is_hyperlink(str) {
|
||||
return str.startsWith('http');
|
||||
}
|
||||
|
||||
function create_link_node(url) {
|
||||
let link = create_svg_node('a', {target:'_blank', href: url});
|
||||
link.appendChild(document.createTextNode(url));
|
||||
return link;
|
||||
}
|
||||
|
||||
/// A class holding a text chat message.
|
||||
///
|
||||
/// *ChatMessages are owned by a Dialog.
|
||||
|
|
@ -118,7 +129,11 @@ function TextChatMessage(message_text, is_myself) {
|
|||
'width': '5%'
|
||||
});
|
||||
|
||||
tspan.appendChild(document.createTextNode(line));
|
||||
if(is_hyperlink(line)) {
|
||||
tspan.appendChild(create_link_node(line));
|
||||
} else {
|
||||
tspan.appendChild(document.createTextNode(line));
|
||||
}
|
||||
text.appendChild(tspan);
|
||||
|
||||
height_so_far += line_height;
|
||||
|
|
@ -270,23 +285,36 @@ function start_chat(who) {
|
|||
case 'Kæreste':
|
||||
dialog_kaereste();
|
||||
break;
|
||||
case 'Politiven':
|
||||
dialog_politi();
|
||||
break;
|
||||
case 'ChatSupport':
|
||||
dialog_support();
|
||||
break;
|
||||
case 'Nabopige':
|
||||
dialog_nabopige();
|
||||
break;
|
||||
default:
|
||||
alert(`kontakten ${who} er ikke implementeret endnu`);
|
||||
}
|
||||
}
|
||||
|
||||
function Dialog(chat_partner) {
|
||||
function Dialog() {
|
||||
let conversation_id = ++conversation_count;
|
||||
this.messages = [];
|
||||
this.y_shift = visible_chat_area.top; // for scrolling
|
||||
this.all_elements_height = 0; // also for scrolling
|
||||
|
||||
this.is_active = function() {
|
||||
return conversation_id == conversation_count;
|
||||
}
|
||||
|
||||
async function post_message(dialog, message, is_myself) {
|
||||
if(!is_myself && dialog.messages.length) {
|
||||
await wait(message.length * typing_speed);
|
||||
} // first message should be instant
|
||||
|
||||
if(conversation_id != conversation_count) {
|
||||
if(!dialog.is_active()) {
|
||||
return; // Do not add messages to old conversation
|
||||
}
|
||||
|
||||
|
|
@ -299,16 +327,22 @@ function Dialog(chat_partner) {
|
|||
let bottom = dialog.all_elements_height + dialog.y_shift;
|
||||
let scroll = Math.max(0, bottom - visible_chat_area.bottom);
|
||||
while(scroll > line_height) {
|
||||
dialog.y_shift -= line_height;
|
||||
dialog.scroll_by(-line_height);
|
||||
scroll -= line_height;
|
||||
dialog.messages.forEach(msg => msg.shift_y_pos(dialog.y_shift));
|
||||
await wait(50);
|
||||
}
|
||||
}
|
||||
|
||||
this.scroll_by = function(change) {
|
||||
this.y_shift += change;
|
||||
this.messages.forEach(msg => msg.shift_y_pos(this.y_shift));
|
||||
}
|
||||
|
||||
this.me = async function(message, will_be_flagged) {
|
||||
await wait(1500); // give me some time to read
|
||||
await type_message(message);
|
||||
if(!this.is_active()) return;
|
||||
await type_message(this, message);
|
||||
if(!this.is_active()) return;
|
||||
hit_send_button();
|
||||
await local_message_processing(will_be_flagged);
|
||||
clear_input_field();
|
||||
|
|
@ -320,7 +354,7 @@ function Dialog(chat_partner) {
|
|||
}
|
||||
}
|
||||
|
||||
async function type_message(message) {
|
||||
async function type_message(dialog, message) {
|
||||
clear_input_field(); // just to be sure
|
||||
let text = document.getElementById('message_input_data').firstChild;
|
||||
|
||||
|
|
@ -331,6 +365,7 @@ async function type_message(message) {
|
|||
await wait(typing_speed);
|
||||
text.data += c;
|
||||
}
|
||||
if(!dialog.is_active()) break;
|
||||
await wait(20); // otherwise it's too fast
|
||||
}
|
||||
}
|
||||
|
|
@ -355,25 +390,34 @@ async function local_message_processing(will_be_flagged) {
|
|||
let text_element = document.getElementById('message_status');
|
||||
let indicator = text_element.childNodes[0];
|
||||
indicator.data = 'scanning for illegal content';
|
||||
await wait(1500);
|
||||
await wait(200);
|
||||
if(will_be_flagged) {
|
||||
let box = document.getElementById('message_status_box');
|
||||
text_element.setAttribute('fill', 'red');
|
||||
box.setAttribute('fill', 'yellow');
|
||||
indicator.data = 'Reporting suspicious content';
|
||||
await wait(1500);
|
||||
await wait(1000);
|
||||
text_element.setAttribute('fill', 'white');
|
||||
box.setAttribute('fill', 'blue');
|
||||
}
|
||||
indicator.data = 'encrypting message';
|
||||
await wait(200);
|
||||
await wait(250);
|
||||
indicator.data = 'sending message';
|
||||
await wait(200);
|
||||
await wait(100);
|
||||
indicator.data = 'message was sent';
|
||||
}
|
||||
|
||||
async function scroll_up() {
|
||||
current_dialog.scroll_by(line_height);
|
||||
}
|
||||
|
||||
async function scroll_down() {
|
||||
current_dialog.scroll_by(-line_height);
|
||||
}
|
||||
|
||||
async function dialog_ven() {
|
||||
let d = new Dialog('Ven');
|
||||
let d = new Dialog();
|
||||
current_dialog = d;
|
||||
await d.me("hej");
|
||||
await d.you("tak for sidst!");
|
||||
await d.you('Har du hørt om den nye EU lov "ChatControl"?');
|
||||
|
|
@ -391,14 +435,16 @@ async function dialog_ven() {
|
|||
}
|
||||
|
||||
async function dialog_mor() {
|
||||
let d = new Dialog('Mor');
|
||||
let d = new Dialog();
|
||||
current_dialog = d;
|
||||
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("(naked stick figure image here)");
|
||||
}
|
||||
|
||||
async function dialog_kaereste() {
|
||||
let d = new Dialog('Kæreste');
|
||||
let d = new Dialog();
|
||||
current_dialog = d;
|
||||
await d.me('hej smukkeste');
|
||||
await d.you('hej, jeg har lige tænkt på dig!');
|
||||
await d.you('og derfor har jeg taget et sexet billede');
|
||||
|
|
@ -407,20 +453,73 @@ async function dialog_kaereste() {
|
|||
await d.me('du ser stadig så ung ud.');
|
||||
await d.me('Jeg tror at vi skal være forsigtige, fordi der er en overvågning af vores beskeder');
|
||||
await d.you('What the fuck??? Hvem overvågner os?????');
|
||||
await d.me('Det kan være at chattilbyderen gør det, fordi de har lov til det');
|
||||
await d.me('Det kan være at udbyderen gør det, fordi de har lov til det');
|
||||
await d.me('Men i fremtiden vil det faktisk blive forpligtende at scanne beskeder i EU\'en');
|
||||
await d.me('Og hvis der er beskeder som "ligner" børneborno får politiet en kopi af dem');
|
||||
await d.you('Jeg vil hellere ikke at politiet får mine nøgenbilleder. Det er min krop og jeg vil selv bestemme over det!');
|
||||
}
|
||||
|
||||
async function dialog_politi() {
|
||||
let d = new Dialog();
|
||||
current_dialog = d;
|
||||
await d.me('Hej, jeg har et spørgsmål');
|
||||
await d.me('Har du hørt om chatcontrollen og hvad tænker du på det?');
|
||||
await d.you('Jeg er bekendt med det. Og det er faktisk et ret dårlig idé');
|
||||
await d.you('Problemet er at der er så mange falsk positive resultater som skal analyseres');
|
||||
await d.you('Og jeg gider ikke kigge på folkets private beskeder. Det er jo deres fortrolgie samtaler');
|
||||
await d.you('Jeg vil heller ikke at mine kolleger se hvad jeg skriver til min kæreste, kun fordi jeg hypotetisk kunne gøre noget illegalt');
|
||||
await d.you('Tænk bare hvor absurd idén er: Hvorfor aflytter vi ikke bare alle telefoner? Der vil være nogle forbrydelser vi vil opdage!');
|
||||
await d.you('Men så har vi den totale overvågning og ikke længere en fri samfund.');
|
||||
}
|
||||
|
||||
async function dialog_support() {
|
||||
let d = new Dialog();
|
||||
current_dialog = d;
|
||||
await d.you('Velkommen til supporten af ChatWorld. Hvad kan jeg hjælpe dig med?');
|
||||
await d.me('Jeg mistænker at chatprogrammet scanner mine end-to-end krypterede beskeder. Er det rigtigt?');
|
||||
await d.you('Ja, det er en feature som cheffen ville gerne have.');
|
||||
await d.you('Der var nogle som har misbrugt chattjenesten til børneporno og det giver meget dårlig publicity og derfor har cheffen valgt at scanne end-to-end krypterede beskeder');
|
||||
await d.you('børneporno er jo en meget dårlig ting. Men jeg synes ikke at det giver mening at aflytte alle private beskeder.');
|
||||
await d.you('og teknologien kan misbruges til mange ting. Jeg som tekniker kan ikke se hvad søgefunktionen faktisk leder efter.');
|
||||
await d.you('Det kan være at det vil finde alternative politiske beskeder og markerer det som illegal selv om de ikke er.');
|
||||
await d.you('Det er en fare for demokratiet hvis fortrolige beskeder bliver scannet for ting som den politiske elite ikke ønsker');
|
||||
await d.you('Men det er desværre mit job at vedligeholde driften af overvågningen');
|
||||
await d.me('Det løser ikke mit problem. Men tak for informationen. Jeg vil se hvad jeg kan gør for at undgår overvågningen i fremtiden', true);
|
||||
await d.you('Beklager at jeg kan ikke tilbyde noget bedre. Men jeg håber at du forstår situationen');
|
||||
}
|
||||
|
||||
async function dialog_nabopige() {
|
||||
let d = new Dialog();
|
||||
current_dialog = d;
|
||||
await d.you('Gæt hvem har snart fødselsdag!');
|
||||
await d.me('Det er dig?');
|
||||
await d.you('Rigtigt! Det var måske for nemt');
|
||||
await d.me('Hvor gammel bliver du så?');
|
||||
await d.you('ti');
|
||||
await d.you('Jeg glæder mig meget til festen. Jeg har inviteret en masse mennesker');
|
||||
await d.you('Du er også inviteret!');
|
||||
await d.you('Hej, jeg vil gerne fortælle dig en hjemlighed');
|
||||
await d.you('Men jeg kan desværre ikke gøre det over chatten');
|
||||
await d.you('Fordi jeg ved at hvad vi skriver her bliver analyseret');
|
||||
await d.you('Og det vil ikke være en hjemlighed hvis der er andre læser med');
|
||||
await d.me('Du kan gerne fortælle mig hjemligheden i morgen, når jeg kommer forbi', true);
|
||||
await d.me('Jeg er overrasket over at du ved noget om chatovervågningen');
|
||||
await d.you('Ja, det er meget kedeligt. Jeg har læst noget om det og jeg kan overhovet ikke lide det');
|
||||
await d.you('Det er bedre hvis man har gode voksne venner som man har tillid til end hvis der er en computer som læser alt hvad man skriver');
|
||||
await d.me('helt enig');
|
||||
await d.me('børn har også brug for hjemligheder og fortrolighed!');
|
||||
}
|
||||
|
||||
]]>
|
||||
</script>
|
||||
|
||||
<!-- [right] contact name view -->
|
||||
<g id="contact_name_box">
|
||||
<rect x="300" y="0" width="300" height="50" fill="yellow" />
|
||||
<polyline points="300,20 320,0 320,40" fill="blue" onclick="swipe_viewport()" /> <!-- XXX: these polyline points depend on the svg width -->
|
||||
<text x="375" y="30" id="contact_indicator">loading...</text>
|
||||
<polyline points="300,20 320,0 320,40" fill="blue" onclick="swipe_viewport()" />
|
||||
<polyline points="560,20 600,20 580,0" fill="blue" onclick="scroll_up()" />
|
||||
<polyline points="560,30 600,30 580,50" fill="blue" onclick="scroll_down()" />
|
||||
<text x="350" y="30" id="contact_indicator">loading...</text>
|
||||
</g>
|
||||
|
||||
<!-- [right] messages view -->
|
||||
|
|
@ -445,8 +544,8 @@ async function dialog_kaereste() {
|
|||
<text x="15" y="75" onclick="start_chat('Ven')">Ven</text>
|
||||
<text x="15" y="100" onclick="start_chat('Mor')">Mor</text>
|
||||
<text x="15" y="125" onclick="start_chat('Kæreste')">Kæreste❤</text>
|
||||
<text x="15" y="150" onclick="start_chat('Politi')">Politi</text>
|
||||
<text x="15" y="175" onclick="start_chat('Tekniker')">Chat Support</text>
|
||||
<text x="15" y="150" onclick="start_chat('Politiven')">Politiven</text>
|
||||
<text x="15" y="175" onclick="start_chat('ChatSupport')">Chat Support</text>
|
||||
<text x="15" y="200" onclick="start_chat('Nabopige')">nabopige</text>
|
||||
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 19 KiB |
Loading…
Reference in New Issue