funky-framadate-front/src/app/features/shared/components/ui/static-pages/ciphering/ciphering.component.html

99 lines
3.8 KiB
HTML

<div class="ciphering padded">
<h2 class="title">
Essais de chiffrement pour un framadate zéro knoledge
</h2>
<div class="columns">
<div class="column">
<section class="boxed-shadow">
<h3 class="title">Chiffrement simple</h3>
<input type="text" [(ngModel)]="plainText" (ngModelChange)="encrypt(plainText)" />
texte clair de {{ plainText.length }} caractères à convertir en truc indéchiffrable (à priori)
<br />
simple ciphered. On assigne un numéro à chaque caractère, séparé par un tiret en sortie.
<strong class="cipher-result">
<app-copy-text [textToCopy]="simpleCipheredText" [displayLabelButton]="false"></app-copy-text>
{{ simpleCipheredText }}
</strong>
<br />
<h3 class="title">Avec un peu de sel?</h3>
<input type="text" [(ngModel)]="salt" />
({{ salt.length }} caractères)
<br />
simple ciphered avec un sel. on ajoute le sel avant le texte puis on passe le tout dans la conversion
comme ci-dessus. on obtient un message de {{ plainText.length }} + {{ salt.length }} caractères
convertis en {{ plainText.length + salt.length }} nombres séparés par des tirets.
<strong class="cipher-result">
<app-copy-text
[textToCopy]="simpleCipheredTextWithSalt"
[displayLabelButton]="false"
></app-copy-text>
{{ simpleCipheredTextWithSalt }}
</strong>
<h3 class="title">Légèrement épicé</h3>
simple cipher avec un sel avant et un saupoudrage du sel sur chacun des caractères de la phrase. la
valeur du caractère est ajoutée à la valeur du caractère du sel correspondant. une fois arrivé à la fin
du sel on reprend au début pour saupoudrer toute la phrase à chiffrer.
<strong class="cipher-result">
<app-copy-text
[textToCopy]="simpleCipheredTextWithSpreadSalt"
[displayLabelButton]="false"
></app-copy-text>
{{ simpleCipheredTextWithSpreadSalt }}
</strong>
<br />
<h3 class="title">On en remet une couche</h3>
Les nombres que l'on a obtenu peuvent être transmis après une opération de conversion en caractères. On
a donc autant de caractères que juste avant. ça ressemble déjà plus à un message pas évident à
déchiffrer.
<strong class="cipher-result">
<app-copy-text [textToCopy]="layerOnSpread" [displayLabelButton]="false"></app-copy-text>
{{ layerOnSpread }}
</strong>
</section>
</div>
<div class="column"></div>
</div>
<section class="boxed-shadow">
<h3 class="title">Déchiffrement simple</h3>
Collez ici le texte chiffré à convertir en truc lisible par l'opération
<strike>du saint esprit</strike> réalisée dans l'autre sens.
<br />
<input type="text" [(ngModel)]="cipheredText" />
<br />
Simple texte déchiffré. Il suffit de séparer les numéros en caractère et trouver à quel caractère correspond une
autre pour trouver n'importe quel caractère ayant le même chiffre.
<strong class="cipher-result">
{{ simpleDeCipheredText }}
</strong>
simple texte déchiffré avec sel, en enlevant les {{ salt.length }} premiers caractères du sel
<strong class="cipher-result">
{{ simpleDeCipheredTextWithSalt }}
</strong>
Simple texte déchiffré avec sel saupoudré, en enlevant à chaque caractère la valeur du caractère courant du sel.
Sans connaître le sel il est déjà plus difficile de deviner la phrase, mais des régularités apparaissent encore.
<strong class="cipher-result">
{{ simpleDeCipheredTextWithSpreadSalt }}
</strong>
</section>
<section class="is-boxed">
<h3>Chiffrement AES</h3>
<app-wip-todo></app-wip-todo>
<input type="text" [(ngModel)]="cipheredText" />
texte avancé à déchiffrer
<br />
<input type="text" [(ngModel)]="salt" />
salt
<input type="text" [(ngModel)]="initial_vector" />
initial_vector
<br />
<input type="text" [(ngModel)]="key" />
key
</section>
</div>