Gitlab CSE Unil

Commit 32860652 authored by M. Chardon's avatar M. Chardon
Browse files

init vigenere

parent 5d8fc9f5
<!DOCTYPE html>
<html>
<head>
<title>Attack Vigen&egrave;re</title>
<meta name="author" content="Marion CHARDON for ESC/RISET - University of Lausanne" />
<meta name="description" content="Free Web tool for discovering Vigenère cipher">
<meta name="keywords" content="Cipher, Encrypting, Vigenere">
<meta charset="UTF-8">
<link rel="stylesheet" href="js/jquery/jquery-ui.min.css">
<link rel="stylesheet" href="../node_modules/bootstrap3/dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="css/dashboard.css" />
<link rel="stylesheet" href="../node_modules/font-awesome/css/font-awesome.min.css" />
<link rel="stylesheet" href="../css/logo_unil.css" />
<link rel="stylesheet" href="css/graph.css">
<link rel="stylesheet" href="css/general.css">
<link rel="stylesheet" href="js/datatable/jquery.dataTables.min.css">
<link rel="stylesheet" href="js/datatable/dataTables.jqueryui.min.css">
<link href="js/select/select2.min.css" rel="stylesheet" />
<script src="../node_modules/jquery/dist/jquery.min.js"></script>
<script src="../node_modules/bootstrap3/dist/js/bootstrap.min.js"></script>
<script src="js/jquery/jquery-ui.min.js"></script>
<script src="js/datatable/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="js/controlleur.js"></script>
<script type="text/javascript" src="js/entity/text.js"></script>
<script type="text/javascript" src="js/entity/letter.js"></script>
<script type="text/javascript" src="js/entity/patern.js"></script>
<script type="text/javascript" src="js/viewAttack.js"></script>
<script type="text/javascript" src="js/viewCommun.js"></script>
<script type="text/javascript" src="js/graph/d3.v3.min.js" charset="utf-8"></script>
<script type="text/javascript" src="js/graph/d3.tip.v0.6.3.js"></script>
<script type="text/javascript" src="js/graph.js"></script>
<script src="js/select/select2.full.min.js"></script>
<script src="../js/jquery.i18n/libs/CLDRPluralRuleParser/src/CLDRPluralRuleParser.js"></script>
<script src="../js/jquery.i18n/jquery.i18n/src/jquery.i18n.js"></script>
<script src="../js/jquery.i18n/jquery.i18n/src/jquery.i18n.messagestore.js"></script>
<script src="../js/jquery.i18n/jquery.i18n/src/jquery.i18n.fallbacks.js"></script>
<script src="../js/jquery.i18n/jquery.i18n/src/jquery.i18n.parser.js"></script>
<script src="../js/jquery.i18n/jquery.i18n/src/jquery.i18n.emitter.js"></script>
<script src="../js/jquery.i18n/jquery.i18n/src/jquery.i18n.language.js"></script>
<script src="js/languages.js"></script>
</head>
<body>
<!--nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#"><span class="i18n" data-lang="title"></span></a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="index.html" target="_blank"><span class="i18n" data-lang="menu_encryption"></span></a></li>
<li class="active"><a href="#"><span class="i18n" data-lang="menu_decryption"></span></a></li>
<li><a onclick="initCommun('en');"><img style="background: white; height:25px;" alt="English" src="images/flags/english.png"/></a></li>
<li><a onclick="initCommun('fr');"><img style="background: white;height:25px;" alt="Français" src="images/flags/french.png"/></a></li>
<li><a href="#" data-toggle="modal" data-target="#help"><span class="i18n" data-lang="menu_help"></span></a></li>
</ul>
</div>
</div>
</nav-->
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container" style="max-width: none;">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="../"><img src="../img/g3761.png" alt="" style="height:28px;display: inline;"/>Cryptex - <span class="i18n" data-lang="title"></span></a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="index.html" target="_blank"><span class="i18n" data-lang="menu_encryption"></span></a></li>
<li class="active"><a href="#"><span class="i18n" data-lang="menu_decryption"></span></a></li>
<li><a onclick="initCommun('en');"><img style="background: white; height:25px;" alt="English" src="../img/flags/english.png"/></a></li>
<li><a onclick="initCommun('fr');"><img style="background: white;height:25px;" alt="Français" src="../img/flags/french.png"/></a></li>
<li><a href="#" data-toggle="modal" data-target="#help"><span class="i18n" data-lang="menu_help"></span></a></li>
</ul>
</div>
</div>
</nav>
<div class="container-fluid" style="margin-bottom: 100px;">
<div class="row">
<div class="col-sm-12 col-md-3" id='divprincipaldataresult'>
<table style='width:100%;'>
<tr>
<td style='vertical-align: top;'>
<button data-toggle="collapse" data-target="#dataresult" onclick='setTimeout(changeVisuData, 100);' id='buttonvisudata' type="button" class="btn btn-default" data-lang="decrypt_hide_panel">
<i class="fa fa-fw fa-caret-left"></i>
</button>
<input id='visudatastatus' value='1' type='hidden' />
</td>
<td style='padding-left: 5px;'>
<div class="collapse in" style="min-height: 680px;min-width: 200px;" id="dataresult" >
<fieldset>
<legend style="font-size: 14pt; border-color: rgba(0, 0, 0, 0.3);border-radius: 0.3em 0.3em 0.3em 0.3em;border-style: solid;border-width: 1px;box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2) inset;background-color:white;padding: 4px;">
<i class="fa fa-fw fa-folder-open"></i>
<strong><span class="i18n" data-lang="decrypt_sub1_title"></span></strong>
</legend>
</fieldset>
<div class='row'>
<div class="col-sm-12">
<ul class="nav nav-tabs">
<li class="active"><a data-toggle="tab" href="#dataresult-1"><span class="i18n" data-lang="decrypt_sub1_sub1_title"></span></a></li>
<li><a data-toggle="tab" href="#dataresult-2"><span class="i18n" data-lang="decrypt_sub1_sub2_title"></span></a></li>
</ul>
<div class="tab-content">
<div id="dataresult-1" class="tab-pane fade in active">
<div style="margin-bottom: 10px;padding-top: 10px;">
<label><span class="i18n" data-lang="decrypt_sub1_sub1_encrypt_mess"></span></label>
<div class="btn-group" data-toggle="buttons" style="padding-left:5%;margin-bottom: 5px;">
<label class="btn btn-default active" onclick="textareaBrut('text_chiffre_input', $('#text_chiffre_input_masque').val());" >
<input type="radio" name="formatTextEncrypted" id="formatTextEncrypted1" checked="checked" /><i class="fa fa-fw fa-align-justify"></i>
</label>
<label class="btn btn-default" onclick="repliquerTexteChiffrer('text_chiffre_input', 'text_chiffre_input_masque');textareaCol('text_chiffre_input', $('#text_chiffre_input_masque').val());" >
<input type="radio" name="formatTextEncrypted" id="formatTextEncrypted2" /><i class="fa fa-th" aria-hidden="true"></i>
</label>
</div>
</div>
<textarea id="text_chiffre_input" style="width:100%;height:300px;" data-lang='decrypt_sub1_sub1_textarea' onchange="initText();" class="form-control"></textarea>
<input type="hidden" id="text_chiffre_input_masque" />
<div class="panel-group" style="margin-top: 10px;">
<div class="panel panel-warning">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" href="#exemplediv"><span class="i18n" data-lang="example"></span></a>
</h4>
</div>
<div id="exemplediv" class="panel-collapse collapse">
<div class="panel-body">
<table class="table table-condensed table-striped" id="exempleTable"></table>
</div>
</div>
</div>
</div>
</div>
<div id="dataresult-2" class="tab-pane fade">
<div id="div_cleLongueurResultat" style="display: none;padding-top: 10px;">
<label><span class="i18n" data-lang="decrypt_sub1_sub2_key_length"></span></label>&nbsp;<input id="cleLongueurResultat" readonly style="width: 30px;"/>
</div>
<div id="div_cleResultatText" style="display: none;">
<label><span class="i18n" data-lang="decrypt_sub1_sub2_key_final"></span></label>&nbsp;&nbsp;&nbsp;<input id="cleResultatText" readonly/>
<hr/>
</div>
<div id="div_finalClearText" style="display: none;">
<label><span class="i18n" data-lang="decrypt_sub1_sub2_cleartext"></span></label>
<div class="btn-group" data-toggle="buttons" style="padding-left:5%;margin-bottom: 5px;">
<label class="btn btn-default active" onclick="textareaBrut('finalClearText', $('#text_dechiffreWork').val());" >
<input type="radio" name="formatText" id="formatTextClear1" checked="checked" /><i class="fa fa-fw fa-align-justify"></i>
</label>
<label class="btn btn-default" onclick="textareaCol('finalClearText', $('#text_dechiffreWork').val());" >
<input type="radio" name="formatText" id="formatTextClear2" /><i class="fa fa-th" aria-hidden="true"></i>
</label>
</div>
<textarea id="finalClearText" style="width:100%;height:300px;" class="form-control"></textarea>
</div>
</div>
</div>
</div>
</div>
</div>
</td>
</tr>
</table>
</div>
<div class="col-sm-12 col-md-9" style="min-height: 680px;min-width: 400px;" id='divprincipaloperation'>
<fieldset>
<legend style="font-size: 14pt; border-color: rgba(0, 0, 0, 0.3);border-radius: 0.3em 0.3em 0.3em 0.3em;border-style: solid;border-width: 1px;box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2) inset;background-color:white;padding: 4px;">
<i class="fa fa-fw fa-wrench"></i>
<strong><span class="i18n" data-lang="decrypt_sub2_title"></span></strong>
</legend>
</fieldset>
<div id="div_operation">
<h3><span class="i18n" data-lang="decrypt_sub2_sub1_title"></span></h3>
<div>
<div class="row">
<div class="col-sm-12">
<span class="i18n" data-lang="decrypt_sub2_sub1_goal"></span>
</div>
</div>
<div id="div_longueurcle">
<ul>
<li><a href="#tabs-1">1. <span class="i18n" data-lang="decrypt_sub2_sub1_kasiski"></span></a></li>
<li><a href="#tabs-2">2. <span class="i18n" data-lang="decrypt_sub2_sub1_ic"></span></a></li>
<li><a href="#tabs-3"><i class="fa fa-fw fa-arrow-right"></i> <span class="i18n" data-lang="decrypt_sub2_sub1_final_key"></span></a></li>
</ul>
<div id="tabs-1">
<div class="row">
<div class="col-sm-11">
<div class="form-horizontal">
<div class="form-group">
<label class="col-sm-7 col-md-6 control-label"><span class="i18n" data-lang="decrypt_sub2_sub1_kasi_desc"></span></label>
<div class="col-sm-5">
<input id="gramm" type="text" style="width: 50px;" class='form-control' />
<button id="searchGramm" type="button" class="btn btn-default" onclick="searchGramm(getTexteChiffrer(), $('#gramm').val());showGCDFrequencies();"><i class="fa fa-fw fa-search"></i> <span class="i18n" data-lang="btn_search"></span></button>
</div>
</div>
</div>
</div>
<div class="col-sm-1">
<button type="button" class="btn btn-default" data-toggle="collapse" data-target="#helpKasi" onclick="setTimeout(resizeTableHelpKasi, 100);"><i class="fa fa-fw fa-life-saver"></i></button>
</div>
</div>
<div id="helpKasi" class="collapse alert alert-success" style="margin: 10px;"></div>
<div id="div_resultFasiski">
<button type="button" class="btn btn-default" onclick="showGCDFrequencies();" style="margin-bottom: 30px;" data-toggle="tooltip" data-lang="decrypt_sub2_sub1_final_gcd" data-placement="right">
<i class="fa fa-fw fa-bar-chart"></i> <span class="i18n" data-lang="btn_gcd_freq"></span>
</button>
<div class="panel-group">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" href="#collapseKasi" id="linkcollapseKasi">
<span class="glyphicon glyphicon-collapse-down"></span> <span class="i18n" data-lang="see_more_details"></span>
</a>
</h4>
</div>
<div id="collapseKasi" class="panel-collapse collapse">
<div class="panel-body">
<div class="ui-widget" id="kasi_warning_gcd" style='display:none;'>
<div class="ui-state-highlight ui-corner-all" style="margin-top: 10px; margin-bottom: 10px; padding: 0.2em;">
<p><i class="fa fa-info-circle"></i>
<strong><span class="i18n" data-lang="info"></span></strong> <span class="i18n" data-lang="decrypt_sub2_sub1_kasi_info"></span>.</p>
</div>
</div>
<table id='tab_res_kasi' class="display" width='100%;'>
<thead>
<tr>
<th><span class="i18n" data-lang="decrypt_sub2_sub1_kasi_tab_col1"></span></th>
<th><span class="i18n" data-lang="decrypt_sub2_sub1_kasi_tab_col2"></span></th>
<th><span class="i18n" data-lang="decrypt_sub2_sub1_kasi_tab_col3"></span></th>
<th><span class="i18n" data-lang="decrypt_sub2_sub1_kasi_tab_col4"></span></th>
<th><span class="i18n" data-lang="decrypt_sub2_sub1_kasi_tab_col5"></span></th>
<th><span class="i18n" data-lang="decrypt_sub2_sub1_kasi_tab_col6"></span></th>
<th></th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
</div>
</div>
</div>
<button type="button" class="btn btn-default" onclick='$("#div_longueurcle").tabs("option", "active", 2);'>
<i class="fa fa-fw fa-arrow-circle-right"></i> <span class="i18n" data-lang="btn_next"></span>
</button>
</div>
</div>
<div id="tabs-2">
<div class="row" style="margin-bottom: 5px;">
<div class="col-sm-11">
<div class="form-horizontal">
<div class="form-group">
<label class="col-sm-3 col-md-2 control-label"><span class="i18n" data-lang="nbre_colmn"></span>:</label>
<div class="col-sm-9">
<input id="colonne" type="text" style="width: 50px;" class='form-control' onclick="$(this).select();" />
<button type="button" class="btn btn-default" onclick="calculerIC(getTexteChiffrer(), $('#colonne').val());" data-toggle="tooltip" data-lang="decrypt_sub2_sub1_ic_legend" data-placement="right">
<i class="fa fa-fw fa-bar-chart"></i> <span class="i18n" data-lang="lib_ic_by_column"></span>
</button>
</div>
</div>
</div>
</div>
<div class="col-sm-1">
<button type="button" class="btn btn-default" data-toggle="collapse" data-target="#helpIC"><i class="fa fa-fw fa-life-saver"></i></button>
</div>
</div>
<div id="helpIC" class="collapse alert alert-success" style="margin: 10px;"></div>
<textarea id="text_chiffre_colonnes" rows="18" readonly class='form-control'></textarea><br/>
<button type="button" class="btn btn-default" onclick='$("#div_longueurcle").tabs("option", "active", 2);'>
<i class="fa fa-fw fa-arrow-circle-right"></i> <span class="i18n" data-lang="btn_next"></span>
</button>
</div>
<div id="tabs-3">
<div class="form-horizontal">
<div class="form-group">
<label class="col-sm-2 control-label"><i class="fa fa-fw fa-arrow-circle-right"></i><span class="i18n" data-lang="decrypt_sub1_sub2_key_length"></span></label>
<div class="col-sm-9">
<input id="tailleCleSup" type="text" style="width: 50px;" class='form-control' onclick="$(this).select();"/>
<button id="tailleCleSupValid" type="button" class="btn btn-default" onclick="validerTailleCle($('#tailleCleSup').val());">
<i class="fa fa-fw fa-check"></i> <span class="i18n" data-lang="btn_validate"></span>
</button>
</div>
</div>
</div>
</div>
</div>
</div>
<h3><span class="i18n" data-lang="decrypt_sub2_sub2_title"></span></h3>
<div>
<div class="row">
<div class="col-sm-11">
<table style="text-align: center;" id='tableDistanceRelativeEntete'>
<tr id='trTailleCle'><td></td></tr>
<tr id='trShiftCle'><td></td></tr>
</table>
</div>
<div class="col-sm-1">
<button type="button" class="btn btn-default" data-toggle="collapse" data-target="#helpIC2"><i class="fa fa-fw fa-life-saver"></i></button>
</div>
</div>
<div id="helpIC2" class="collapse alert alert-success" style="margin: 10px;"></div>
<input type='hidden' id='colA' value="0"/>
<input type='hidden' id='colB' value="1"/>
<div id='table_dis_relative_affichage' style='display: none;'>
<p style='margin-top: 25px;margin-bottom: 5px;'>
<span class="i18n" data-lang="decrypt_sub2_sub2_desc1"></span> (<span style="color:red;"><span class="i18n" data-lang="decrypt_sub2_sub2_red"></span></span>), <span class="i18n" data-lang="decrypt_sub2_sub2_desc2"></span> (<span style="color:blue;"><span class="i18n" data-lang="decrypt_sub2_sub2_blue"></span></span>).
</p>
<table style='margin-top: 15px;margin-bottom: 5px;'>
<tr>
<td style='font-weight: bold;'>
<i class="fa fa-fw fa-lock"></i>
<span class="i18n" data-lang="decrypt_sub2_sub2_original_text"></span>
</td>
<td style="padding-top: 10px;padding-left: 20px;padding-right: 10px;vertical-align: top;"></td>
<td style='font-weight: bold;'>
<i class="fa fa-fw fa-gears"></i>
<span class="i18n" data-lang="decrypt_sub2_sub2_original_text"></span>
</td>
<td style="padding-top: 10px;padding-left: 20px;vertical-align: top;"></td>
</tr>
<tr>
<td>
<div id='div_dist_relative' style="text-align: center;"></div>
</td>
<td style="padding-top: 60px;padding-left: 10px;padding-right: 25px;vertical-align: top;">
<button type="button" class="btn btn-default" onclick="calculerMIC(getTexteChiffrer(), $('#tailleCleSup').val(), $('#colA').val(), $('#colB').val());" data-toggle="tooltip" data-lang="decrypt_sub2_sub2_btn_calculate" data-placement="bottom">
<i class="fa fa-fw fa-bar-chart"></i> <span class="i18n" data-lang="decrypt_sub2_sub2_btn_mic1"></span><br/>
<span class="i18n" data-lang="decrypt_sub2_sub2_btn_mic2"></span> <span style="color:red;"><span class="i18n" data-lang="decrypt_sub2_sub2_red"></span></span><br/>
<span class="i18n" data-lang="decrypt_sub2_sub2_btn_mic3"></span> <span style="color:blue;"><span class="i18n" data-lang="decrypt_sub2_sub2_blue"></span></span>
</button>
</td>
<td>
<div id='div_dist_relative_res' style="text-align: center;"></div>
<input type='hidden' id='text_dist_relative_res' value=""/>
</td>
<td style="padding-top: 60px;padding-left: 10px;vertical-align: top;">
<button type="button" class="btn btn-default" onclick="calculerMIC($('#text_dist_relative_res').val(), $('#tailleCleSup').val(), $('#colA').val(), $('#colB').val());" data-toggle="tooltip" data-lang="decrypt_sub2_sub2_btn_calculate" data-placement="bottom">
<i class="fa fa-fw fa-bar-chart"></i> <span class="i18n" data-lang="decrypt_sub2_sub2_btn_mic1"></span><br/>
<span class="i18n" data-lang="decrypt_sub2_sub2_btn_mic2"></span> <span style="color:red;"><span class="i18n" data-lang="decrypt_sub2_sub2_red"></span></span><br/>
<span class="i18n" data-lang="decrypt_sub2_sub2_btn_mic3"></span> <span style="color:blue;"><span class="i18n" data-lang="decrypt_sub2_sub2_blue"></span></span>
</button>
</td>
</tr>
</table>
<button id="decallageRelatifValid" type="button" class="btn btn-default" onclick="validerDecallageRelatif($('#tailleCleSup').val(), $('#text_dist_relative_res').val());">
<i class="fa fa-fw fa-check"></i> <span class="i18n" data-lang="decrypt_sub2_sub2_validate"></span>
</button>
</div>
<div id='table_dis_relative_affichage_back'>
<p><i class="fa fa-info-circle"></i>
<span class="i18n" data-lang="decrypt_sub2_sub2_no_validation"></span>
</p>
</div>
</div>
<h3><span class="i18n" data-lang="decrypt_sub2_sub3_title"></span></h3>
<div>
<div class="row">
<div class="col-sm-11">
<table style="text-align: center;" id='tableGlobalshiftEntete'>
<tr id='trBase' ><td></td></tr>
<tr id='trGlobalShiftKeyDecalRelatif'><td></td></tr>
<tr id='trGlobalShiftKey' ><td></td></tr>
<tr id='trGlobalShift' ><td></td></tr>
<tr id='trGlobalShiftKeyRes'><td></td></tr>
</table>
</div>
<div class="col-sm-1">
<button type="button" class="btn btn-default" data-toggle="collapse" data-target="#helpIC3"><i class="fa fa-fw fa-life-saver"></i></button>
</div>
</div>
<div id="helpIC3" class="collapse alert alert-success" style="margin: 10px;"></div>
<div id='table_global_shift_affichage' style='display: none;'>
<table style='margin-top: 25px;margin-bottom: 5px;'>
<tr style='vertical-align: top;'>
<td style='font-weight: bold;padding-bottom: 15px;'>
<i class="fa fa-fw fa-gears"></i>
<span class="i18n" data-lang="decrypt_sub2_sub2_shifted_text"></span>
</td>
<td></td>
<td style='font-weight: bold;'>
<i class="fa fa-fw fa-unlock"></i>
<span class="i18n" data-lang="decrypt_sub2_sub3_cleartext"></span>
</td>
</tr>
<tr>
<td>
<div id='decallageRelatifValidTraitement' style="text-align: center;"></div>
</td>
<td style="margin-top: 0px;padding-left: 15px;padding-right: 15px;vertical-align: top;text-align: center;">
<input type='text' id='globalShift' style="width:50px;" class='form-control' onclick="$(this).select();" /><br/>
<button type="button" class="btn btn-default" onclick="calculerMICLangages($('#text_dist_relative_res').val());" style="margin-top: 20px;" data-toggle="tooltip" data-lang="decrypt_sub2_sub3_btn_mic_legend" data-placement="bottom">
<i class="fa fa-fw fa-bar-chart"></i> <span class="i18n" data-lang="decrypt_sub2_sub3_btn_mic"></span>
</button><br/><br/>
<label for="selectLangs"><span class="i18n" data-lang="decrypt_sub2_sub3_select_lang1"></span><br/><span class="i18n" data-lang="decrypt_sub2_sub3_select_lang2"></span>:</label><br/>
<select id="selectLangs" multiple="multiple" style="width: 100px" class='form-control'>
<option value="English" data-lang="English"></option>
<option value="French" data-lang="French"></option>
<option value="German" data-lang="German"></option>
<option value="Italian" data-lang="Italian"></option>
<option value="Spanish" data-lang="Spanish"></option>
</select>
</td>
<td>
<div id='decallageRelatifValidTraitementRes' style="text-align: center;"></div>
<input type='hidden' id='text_dechiffreWork' value=""/>
</td>
</tr>
</table>
<button id="dechiffrer" type="button" class="btn btn-default" onclick="getClearResultats($('#text_dechiffreWork').val(), $('#tailleCleSup').val());">
<i class="fa fa-fw fa-check"></i> <span class="i18n" data-lang="decrypt_sub2_sub3_btn_cleartext"></span>
</button>
</div>
<div id='table_global_shift_affichage_back'>
<p><i class="fa fa-info-circle"></i>
<span class="i18n" data-lang="decrypt_sub2_sub3_no_validation"></span>.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div id='div_ic' class="modal fade" role="dialog" >
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">&times;</button>
<h4 class="modal-title"><span class="i18n" data-lang="encrypt_popup_ic_title"></span></h4>
</div>
<div class="modal-body">
<div id='calculIcDetail'>
<div class="ui-corner-all" style="padding: 0 .7em;">
<p><i class="fa fa-arrow-right" aria-hidden="true"></i> <span class="i18n" data-lang="encrypt_popup_ic_res"></span> <input type="text" readonly="readonly" id="ic"/></p>
</div>
<div class="panel-group">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" href="#collapseicmore" id='linkcollapseh1'>
<span class="glyphicon glyphicon-collapse-down"></span> <span class="i18n" data-lang="see_more_details"></span>
</a>
</h4>
</div>
<div id="collapseicmore" class="panel-collapse collapse">
<div class="panel-body">
<b><span class="i18n" data-lang="encrypt_popup_ic_lettre_occ"></span></b>
<table style="margin-bottom: 10px;margin-top: 5px;">
<tr>
<td>A</td><td><input type="text" class="icX" readonly="readonly" id="icA"/></td>
<td>C</td><td><input type="text" class="icX" readonly="readonly" id="icC"/></td>
<td>E</td><td><input type="text" class="icX" readonly="readonly" id="icE"/></td>
<td>G</td><td><input type="text" class="icX" readonly="readonly" id="icG"/></td>
<td>I</td><td><input type="text" class="icX" readonly="readonly" id="icI"/></td>
<td>K</td><td><input type="text" class="icX" readonly="readonly" id="icK"/></td>
<td>M</td><td><input type="text" class="icX" readonly="readonly" id="icM"/></td>
<td>O</td><td><input type="text" class="icX" readonly="readonly" id="icO"/></td>
<td>Q</td><td><input type="text" class="icX" readonly="readonly" id="icQ"/></td>
<td>S</td><td><input type="text" class="icX" readonly="readonly" id="icS"/></td>
<td>U</td><td><input type="text" class="icX" readonly="readonly" id="icU"/></td>
<td>W</td><td><input type="text" class="icX" readonly="readonly" id="icW"/></td>
<td>Y</td><td><input type="text" class="icX" readonly="readonly" id="icY"/></td>
</tr>
<tr>
<td>B</td><td><input type="text" class="icX" readonly="readonly" id="icB"/></td>
<td>D</td><td><input type="text" class="icX" readonly="readonly" id="icD"/></td>
<td>F</td><td><input type="text" class="icX" readonly="readonly" id="icF"/></td>
<td>H</td><td><input type="text" class="icX" readonly="readonly" id="icH"/></td>
<td>J</td><td><input type="text" class="icX" readonly="readonly" id="icJ"/></td>
<td>L</td><td><input type="text" class="icX" readonly="readonly" id="icL"/></td>
<td>N</td><td><input type="text" class="icX" readonly="readonly" id="icN"/></td>
<td>P</td><td><input type="text" class="icX" readonly="readonly" id="icP"/></td>
<td>R</td><td><input type="text" class="icX" readonly="readonly" id="icR"/></td>
<td>T</td><td><input type="text" class="icX" readonly="readonly" id="icT"/></td>
<td>V</td><td><input type="text" class="icX" readonly="readonly" id="icV"/></td>
<td>X</td><td><input type="text" class="icX" readonly="readonly" id="icX"/></td>
<td>Z</td><td><input type="text" class="icX" readonly="readonly" id="icZ"/></td>
</tr>
</table>
<b><span class="i18n" data-lang="encrypt_popup_ic_nb_lettre"></span></b> <input type="text" readonly="readonly" id="nbreLettres"/>
</div>
</div>
</div>
</div>
<hr/>
</div>
<svg id='graphic'></svg>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">OK</button>
</div>
</div>
</div>
</div>
<div id='div_kasiski' class="modal fade" role="dialog" >
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">&times;</button>
<h4 class="modal-title"><span class="i18n" data-lang="decrypt_popup_kasiski_title"></span></h4>
</div>
<div class="modal-body">
<div id="kasiski_text"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">OK</button>
</div>
</div>
</div>
</div>
<div id='div_mic' class="modal fade" role="dialog" >
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">&times;</button>
<h4 class="modal-title"><span class="i18n" data-lang="decrypt_popup_mic_title"></span></h4>
</div>
<div class="modal-body">
<svg id='graphmic'></svg>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">OK</button>
</div>
</div>
</div>
</div>
<div id='div_pgcd' class="modal fade" role="dialog" >
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">&times;</button>
<h4 class="modal-title"><span class="i18n" data-lang="decrypt_popup_pgcd_title"></span></h4>
</div>
<div class="modal-body">
<svg id='graphgcd'></svg>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">OK</button>
</div>
</div>
</div>
</div>
<div id='div_mictot' class="modal fade" role="dialog" >
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">&times;</button>
<h4 class="modal-title"><span class="i18n" data-lang="decrypt_popup_mictot_title"></span></h4>
</div>
<div class="modal-body">
<svg id='graphmictot'></svg>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">OK</button>
</div>
</div>
</div>
</div>
<div id='div_erreur_rest_cle' class="modal fade" role="dialog" >
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">&times;</button>
<h4 class="modal-title"><span class="i18n" data-lang="decrypt_popup_warning_title"></span></h4>
</div>
<div class="modal-body">
<p>
<span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 50px 0;"></span>
<span class="i18n" data-lang="decrypt_popup_warning_desc"></span>
</p>
<p>
<span class="i18n" data-lang="decrypt_popup_warning_quest"></span>
</p>
</div>