mirror of
https://github.com/Merricx/qrazybox.git
synced 2025-02-16 15:02:57 +01:00
Reworked Data Masking
This commit is contained in:
Merricx
parent
10c326174d
commit
1a3bbe2a7a
3 changed files with 72 additions and 78 deletions
|
|
@ -81,7 +81,7 @@ ul {list-style: none;}
|
|||
|
||||
.header div#header-menu {
|
||||
display: block;
|
||||
min-width: 600px;
|
||||
min-width: 630px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
|
|
@ -377,7 +377,7 @@ ul {list-style: none;}
|
|||
height: 400px;
|
||||
overflow: auto;
|
||||
margin-right: 20px;
|
||||
pointer-events: none;
|
||||
/*pointer-events: none;*/
|
||||
}
|
||||
|
||||
.overlay .box h3 {
|
||||
|
|
@ -959,6 +959,7 @@ noscript div h4 {
|
|||
.header div#header-menu {
|
||||
display: none;
|
||||
margin: 0;
|
||||
min-width: 100px;
|
||||
width: 150px;
|
||||
position: fixed;
|
||||
top: 60px;
|
||||
|
|
|
|||
44
index.html
44
index.html
|
|
@ -134,7 +134,7 @@
|
|||
<button id="btn-mask-show-pattern-area" class="toggle">Show</button>
|
||||
<div class="clear"></div>
|
||||
<div class="space"></div>
|
||||
<center><button id="btn-tools-mask" class="toggle">Unmask Data</button></center>
|
||||
<center><button id="btn-tools-mask" class="toggle">Mask Data</button></center>
|
||||
</div>
|
||||
<!-- END DATA UNMASKING TOOLBOX -->
|
||||
</div>
|
||||
|
|
@ -265,13 +265,17 @@
|
|||
<h6>Try all possibilities of Format Info Pattern when decoding</h6>
|
||||
</div>
|
||||
<div id="tools-unmasking">
|
||||
<h5>Data Unmasking</h5>
|
||||
<h6>Analyze QR code with its modules unmasked</h6>
|
||||
<h5>Data Masking</h5>
|
||||
<h6>Simulate data masking (XOR) with Mask pattern</h6>
|
||||
</div>
|
||||
<div id="tools-pad-recovery">
|
||||
<h5>Padding Bits Recovery</h5>
|
||||
<h6>Recover missing bits by placing terminator and padding bits</h6>
|
||||
</div>
|
||||
<div id="tools-data-analysis">
|
||||
<h5>Data Sequence Analysis</h5>
|
||||
<h6>Analyze data sequence of QR code</h6>
|
||||
</div>
|
||||
</div>
|
||||
<div class="space"></div>
|
||||
<button onclick="$('#div-tools').hide();">Close</button>
|
||||
|
|
@ -469,6 +473,39 @@
|
|||
</div>
|
||||
<!-- END REED-SOLOMON DECODER OVERLAY -->
|
||||
|
||||
<!-- START DATA MASKING OVERLAY -->
|
||||
<div class="overlay hide" id="div-data-masking">
|
||||
<center>
|
||||
<div class="box">
|
||||
<h3>Data Masking</h3>
|
||||
<div class="space"></div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<h5 class="left">Mask Pattern :</h5>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="slider" id="data-masking-slider">
|
||||
<div data="0">0</div>
|
||||
<div data="1">1</div>
|
||||
<div data="2">2</div>
|
||||
<div data="3">3</div>
|
||||
<div data="4">4</div>
|
||||
<div data="5">5</div>
|
||||
<div data="6">6</div>
|
||||
<div data="7">7</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
<div class="space"></div>
|
||||
<button class="left" onclick="$('#div-data-masking').hide();">Close</button>
|
||||
<button class="right" id="btn-data-masking-apply">Apply</button>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</center>
|
||||
</div>
|
||||
<!-- END DATA MASKING OVERLAY -->
|
||||
|
||||
<!-- START PADDING BITS RECOVERY OVERLAY -->
|
||||
<div class="overlay hide" id="div-padding-recovery">
|
||||
<center>
|
||||
|
|
@ -544,6 +581,7 @@
|
|||
|
||||
if(is_mobile) $(".warning").show();
|
||||
|
||||
//Detect unsupported HTML features using Modernizr
|
||||
else if(!Modernizr.canvas || !Modernizr.fileinput || !Modernizr.filereader || !Modernizr.imgcrossorigin || !Modernizr.json || !Modernizr.localstorage)
|
||||
$(".warning").show().find("h3").html("Please, upgrade your browser to use QRazyBox.<br>Unfortunately, your browser doesn't support some features that used by this tool.");
|
||||
|
||||
|
|
|
|||
101
js/main.js
101
js/main.js
|
|
@ -1,5 +1,5 @@
|
|||
|
||||
var VERSION = '0.1.20';
|
||||
var VERSION = '0.1.24';
|
||||
|
||||
var qr_version = 1;
|
||||
var qr_pixel_size = 15;
|
||||
|
|
@ -174,6 +174,16 @@ function refreshTable(){
|
|||
}
|
||||
}
|
||||
|
||||
function updateQRArray(new_data){
|
||||
for(var i=0; i < qr_array.length; i++){
|
||||
for(var j=0; j < qr_array[i].length; j++){
|
||||
if(is_data_module[i][j]){
|
||||
qr_array[i][j] = new_data[i][j];
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function getInfoBits(){
|
||||
var result = {ecc:"",mask:-1};
|
||||
$("#slider-mask div.active").removeClass("active");
|
||||
|
|
@ -872,7 +882,7 @@ $(document).ready(function(){
|
|||
if(Array.isArray(data)){
|
||||
$("#div-new").hide();
|
||||
generateTable(qr_version);
|
||||
qr_array = Array.prototype.slice.call(data);
|
||||
updateQRArray(data);
|
||||
clearHistory();
|
||||
updateHistory("Load from image");
|
||||
refreshTable();
|
||||
|
|
@ -1182,33 +1192,22 @@ $(document).ready(function(){
|
|||
})
|
||||
|
||||
$("#tools-unmasking").click(function(){
|
||||
if($(this).hasClass("active")){
|
||||
$(this).removeClass("active");
|
||||
masking_mode = false;
|
||||
unmask_status = false;
|
||||
$("#box-tools-masking").hide();
|
||||
$("#qr-mask-table").html("");
|
||||
} else {
|
||||
$(this).addClass("active");
|
||||
masking_mode = true;
|
||||
unmask_status = false;
|
||||
//if($("#qr-result").css == "none" && $("#div-extract").css == "none")
|
||||
$("#box-tools-masking").show();
|
||||
$("#btn-tools-mask").removeClass("active");
|
||||
|
||||
var mask_pattern = getFormatInfo(qr_array).mask;
|
||||
$("#mask-pattern").val("Pattern "+mask_pattern);
|
||||
$("#btn-mask-show-pattern-area").removeClass("active");
|
||||
}
|
||||
var current_mask = getFormatInfo(qr_array).mask;
|
||||
|
||||
$("#data-masking-slider div[data="+current_mask+"]").addClass("active");
|
||||
|
||||
$("#div-data-masking").show();
|
||||
$("#div-tools").hide();
|
||||
})
|
||||
|
||||
$("#btn-mask-plus").click(function(){
|
||||
var current_mask = getFormatInfo(qr_array).mask;
|
||||
if(current_mask == 7)
|
||||
return;
|
||||
$("#data-masking-slider div").click(function(){
|
||||
$("#data-masking-slider div.active").removeClass("active");
|
||||
$(this).addClass("active");
|
||||
})
|
||||
|
||||
if(unmask_status)
|
||||
maskDataBits();
|
||||
$("#btn-data-masking-apply").click(function(){
|
||||
var mask = $("#data-masking-slider div.active").attr("data");
|
||||
|
||||
var ecc = getFormatInfo(qr_array).ecc;
|
||||
if(ecc == 0)
|
||||
|
|
@ -1219,45 +1218,12 @@ $(document).ready(function(){
|
|||
ecc = 3;
|
||||
else if(ecc == 3)
|
||||
ecc = 2;
|
||||
var next_mask = parseInt(current_mask) + 1;
|
||||
qr_format_array = format_information_bits[ecc][next_mask].split("").reverse();
|
||||
|
||||
qr_format_array = format_information_bits[ecc][mask].split("").reverse();
|
||||
saveInfoTable(qr_size);
|
||||
$("#mask-pattern").val("Pattern "+next_mask);
|
||||
if($("#btn-mask-show-pattern-area").hasClass("active")){
|
||||
showMaskPatternArea();
|
||||
}
|
||||
if(unmask_status)
|
||||
maskDataBits();
|
||||
updateHistory("Data masking");
|
||||
})
|
||||
|
||||
$("#btn-mask-min").click(function(){
|
||||
var current_mask = getFormatInfo(qr_array).mask;
|
||||
if(current_mask == 0)
|
||||
return;
|
||||
|
||||
if(unmask_status)
|
||||
maskDataBits();
|
||||
|
||||
var ecc = getFormatInfo(qr_array).ecc;
|
||||
if(ecc == 0)
|
||||
ecc = 1;
|
||||
else if(ecc == 1)
|
||||
ecc = 0;
|
||||
else if(ecc == 2)
|
||||
ecc = 3;
|
||||
else if(ecc == 3)
|
||||
ecc = 2;
|
||||
var prev_mask = parseInt(current_mask) - 1;
|
||||
qr_format_array = format_information_bits[ecc][prev_mask].split("").reverse();
|
||||
saveInfoTable(qr_size);
|
||||
$("#mask-pattern").val("Pattern "+prev_mask);
|
||||
if($("#btn-mask-show-pattern-area").hasClass("active")){
|
||||
showMaskPatternArea();
|
||||
}
|
||||
if(unmask_status)
|
||||
maskDataBits();
|
||||
updateHistory("Data masking");
|
||||
maskDataBits();
|
||||
$("#div-data-masking").hide();
|
||||
})
|
||||
|
||||
$("#btn-mask-show-pattern-area").click(function(){
|
||||
|
|
@ -1271,17 +1237,6 @@ $(document).ready(function(){
|
|||
}
|
||||
})
|
||||
|
||||
$("#btn-tools-mask").click(function(){
|
||||
if($(this).hasClass("active")){
|
||||
$(this).removeClass("active");
|
||||
unmask_status = false;
|
||||
} else {
|
||||
$(this).addClass("active");
|
||||
unmask_status = true;
|
||||
}
|
||||
maskDataBits();
|
||||
})
|
||||
|
||||
$("#tools-pad-recovery").click(function(){
|
||||
recoverPadding();
|
||||
$("#div-padding-recovery").show();
|
||||
|
|
|
|||
Loading…
Reference in a new issue