ami/src/ami.js/mami/domaintrans.jsx

70 lines
3.5 KiB
JavaScript

#include common.js
#include utility.js
const AmiDomainTransition = function(onExport, onDismiss) {
if(typeof onDismiss !== 'function')
throw 'onDismiss must be a function';
let exportTidbit, modernButton, exportButton;
let arrowsTarget1, arrowsTarget2;
const html = <div class="domaintrans">
<div class="domaintrans-body">
<div class="domaintrans-domain domaintrans-domain-main">
<div class="domaintrans-domain-header">
Compatibility Chat
</div>
<div class="domaintrans-domain-display">
<div class="domaintrans-domain-text domaintrans-domain-orig"><div>sockchat.flashii.net/legacy</div></div>
{arrowsTarget1 = <div class="domaintrans-domain-arrow" />}
<div class="domaintrans-domain-text domaintrans-domain-new"><div>sockchat.flashii.net</div></div>
</div>
</div>
<div class="domaintrans-domain domaintrans-domain-compat">
<div class="domaintrans-domain-header">
Flashii Chat
</div>
<div class="domaintrans-domain-display">
<div class="domaintrans-domain-text domaintrans-domain-orig"><div>sockchat.flashii.net</div></div>
{arrowsTarget2 = <div class="domaintrans-domain-arrow" />}
<div class="domaintrans-domain-text domaintrans-domain-new"><div>chat.flashii.net</div></div>
</div>
</div>
<div class="domaintrans-text">
<p>At long last, modern chat is being moved back to its proper subdomain. This means the original client can have the sockchat subdomain all to itself like the AJAX Chat!</p>
{exportTidbit = <p>You can use this screen to export your settings for the modern client. Pressing "Export settings" will let you save your settings for the modern client, you can then import this file using the "Import settings" button within the modern client.</p>}
<p>This screen won't show up again after you press "Continue to chat".</p>
</div>
<div class="domaintrans-options">
{modernButton = <div><a class="domaintrans-option" href={MAMI_URL} target="_blank">
<div class="domaintrans-option-icon"><div class="sprite sprite-autoscroll" /></div>
<div class="domaintrans-option-text">Open modern client</div>
</a></div>}
{exportButton = <div><button class="domaintrans-option" onclick={onExport}>
<div class="domaintrans-option-icon"><div class="sprite sprite-autoscroll" /></div>
<div class="domaintrans-option-text">Export settings</div>
</button></div>}
<div><button class="domaintrans-option" onclick={onDismiss}>
<div class="domaintrans-option-icon"><div class="sprite sprite-autoscroll" /></div>
<div class="domaintrans-option-text">Continue to chat</div>
</button></div>
</div>
</div>
</div>;
for(let i = 0; i < 5; ++i)
arrowsTarget1.appendChild(<span>▼</span>);
for(let i = 0; i < 5; ++i)
arrowsTarget2.appendChild(<span>▼</span>);
if(typeof onExport !== 'function') {
$r(exportTidbit);
$r(modernButton);
$r(exportButton);
}
return {
appendTo: parent => parent.appendChild(html),
remove: () => $r(html),
};
};