Skip to content

Commit

Permalink
many changes:
Browse files Browse the repository at this point in the history 
•replace toggler+textarea with AdvTextArea
•handle \r better (see issue #1)
•replace tbd_set_disabled with set_loading
•redesign string editor
•more console helpers
  • Loading branch information
@xBZZZZ
xBZZZZ committed Jul 2, 2023
1 parent 683d93d commit a4e9a0a
Show file tree
Hide file tree
Showing 9 changed files with 377 additions and 276 deletions.
16 changes: 11 additions & 5 deletions src/css.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,6 @@ input[type=text],input[type=number],textarea{
input,textarea{
vertical-align:middle;
}
a.btn{
white-space:pre;
padding:0 2px;
}
optgroup{
color:rgb(255,255,255);
background-color:rgb(50,0,50);
Expand Down Expand Up @@ -499,11 +495,21 @@ hr{
background-color:rgb(200,200,200);
contain:strict;
}
.hbox{
display:flex;
}
.vbox{
display:flex;
flex-direction:column;
}
.growc>*{
flex-grow:1;
}
a.thiccb{
padding:10px;
color:rgb(0,0,255);
text-decoration:underline;
white-space:normal;
white-space:pre-wrap;
}
input.thiccb{
padding:10px;
Expand Down
9 changes: 5 additions & 4 deletions src/js/cc.js
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
'use strict';

function save_modal(buffers,name,blobopts){
tbd_set_disabled(false);
set_loading(false);
var g=gui_div_with_html('display:flex;flex-direction:column;','<a rel="noreferrer" class="btn" style="padding:10px;">save <strong></strong></a><input class="thiccb" type="button" value="back" onclick="window.URL.revokeObjectURL(current_gui().bloburl);pop_gui();"/>'),a=g.firstChild;
g.bloburl=a.href=URL.createObjectURL(new Blob(buffers,blobopts));
a.lastChild.textContent=a.download=name;
Expand All @@ -13,6 +13,7 @@ function push_loading_modal(file_name){
g.dataset.ccFileName=file_name;
g.error_tag=g.firstChild;
push_gui(g);
set_loading(true);
}

var valid_type_re=RegExp('^[a-z]$','');
Expand Down Expand Up @@ -79,9 +80,9 @@ function load_cc_data(cc_data){
'<input class="thiccb" type="button" value="back"/>\
<h2 style="margin:5px 0;">done</h2>\
<input class="thiccb" type="button" value="open in dict editor" onclick="var g=current_gui();if(g.dict_editor)push_gui(g.dict_editor);else{push_dict_editor(g.cc_data.dict,g.dataset.ccFileName);(g.dict_editor=current_gui()).dataset.reusable=&quot;&quot;;}"/>\
<input class="thiccb" type="button" value="save encrypted (windows and android)" '+(window.CompressionStream?'onclick="var g=current_gui();tbd_set_disabled(true);cc_save_gzip(g.cc_data,g.dataset.ccFileName);"':'title="your browser doesn&apos;t support CompressionStream" disabled=""')+'/>\
<input class="thiccb" type="button" value="save encrypted (mac os) (slow)" '+(typeof subtlecrypto==='object'?'onclick="var g=current_gui();tbd_set_disabled(true);cc_save_aes(g.cc_data,g.dataset.ccFileName,this.nextSibling);"/><progress title="encrypting (mac os) (slow)" aria-label="encrypting (mac os) (slow)" max="64" value="0" style="display:none;"':subtlecrypto)+'/>\
<input class="thiccb" type="button" value="save xml" onclick="tbd_set_disabled(true);try{var a=[],m=new CcXmlMaker(a.push.bind(a),2),g=current_gui();m.r(g.cc_data);m.f();save_modal(a,g.dataset.ccFileName,xmlblobopts);}catch(error){say_error(&quot;save xml&quot;,error);}"/>\
<input class="thiccb" type="button" value="save encrypted (windows and android)" '+(window.CompressionStream?'onclick="var g=current_gui();set_loading(true);cc_save_gzip(g.cc_data,g.dataset.ccFileName);"':'title="your browser doesn&apos;t support CompressionStream" disabled=""')+'/>\
<input class="thiccb" type="button" value="save encrypted (mac os) (slow)" '+(typeof subtlecrypto==='object'?'onclick="var g=current_gui();set_loading(true);cc_save_aes(g.cc_data,g.dataset.ccFileName,this.nextSibling);"/><progress title="encrypting (mac os) (slow)" aria-label="encrypting (mac os) (slow)" max="64" value="0" style="display:none;"':subtlecrypto)+'/>\
<input class="thiccb" type="button" value="save xml" onclick="set_loading(true);try{var a=[],m=new CcXmlMaker(a.push.bind(a),2),g=current_gui();m.r(g.cc_data);m.f();save_modal(a,g.dataset.ccFileName,xmlblobopts);}catch(error){say_error(&quot;save xml&quot;,error);}"/>\
<input class="thiccb" type="button" value="open copy in new tab"/>';
a=a.tbd=Array.prototype.slice.call(a.querySelectorAll('input:enabled'));
a[0].addEventListener('click',pop_gui,onceel);
Expand Down
59 changes: 50 additions & 9 deletions src/js/console_helpers.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,12 +7,12 @@ Object.defineProperties(window,{
'get':function(){
var g=current_gui();
if(g.dataset.guiType!=='stringeditor')throw Error('not string editor');
return g.decoded.value;
return g.decoded.getval();
},
'set':function(val){
var g=current_gui();
if(g.dataset.guiType!=='stringeditor')throw Error('not string editor');
set_toggler_and_val(g.decoded,String(val));
g.decoded.setval(String(val));
}
},
'se':{
Expand All @@ -21,26 +21,38 @@ Object.defineProperties(window,{
'get':function(){
var g=current_gui();
if(g.dataset.guiType!=='stringeditor')throw Error('not string editor');
return g.encoded.value;
return g.encoded.getval();
},
'set':function(val){
var g=current_gui();
if(g.dataset.guiType!=='stringeditor')throw Error('not string editor');
set_toggler_and_val(g.encoded,String(val));
g.encoded.setval(String(val));
}
},
'ok':{
'configurable':true,
'enumerable':true,
'get':function(){
if(guis[guis.length-1].dataset.guiType!=='objeditordialog')throw Error('not object editor dialog');
return guis[guis.length-2].obj_editor.i_dialog_key.value.replace(ObjEditor.re2,'\r');
},
'set':function(val){
if(guis[guis.length-1].dataset.guiType!=='objeditordialog')throw Error('not object editor dialog');
var o=guis[guis.length-2].obj_editor;
o.s_dialog_key.value=o.i_dialog_key.value=String(val).replace(ObjEditor.re1,';');
}
},
'ovs':{
'configurable':true,
'enumerable':true,
'get':function(){
if(guis[guis.length-1].dataset.guiType!=='objeditordialog')throw Error('not object editor dialog');
return guis[guis.length-2].obj_editor.i_dialog_value.value;
return guis[guis.length-2].obj_editor.i_dialog_value.value.replace(ObjEditor.re2,'\r');
},
'set':function(val){
if(guis[guis.length-1].dataset.guiType!=='objeditordialog')throw Error('not object editor dialog');
var o=guis[guis.length-2].obj_editor;
o.i_dialog_value.value=val;
o.dialog_value_oninput();
o.s_dialog_value.value=o.i_dialog_value.value=String(val).replace(ObjEditor.re1,';');
}
},
'ov':{
Expand All @@ -56,8 +68,37 @@ Object.defineProperties(window,{
if(guis[guis.length-1].dataset.guiType!=='objeditordialog')throw Error('not object editor dialog');
if(!Number.isFinite(val-=0))throw Error('failed to parse value as finite number');
var o=guis[guis.length-2].obj_editor;
o.i_dialog_value.value=val;
o.dialog_value_oninput();
o.s_dialog_value.value=o.i_dialog_value.value=String(val);
}
},
'ik':{
'configurable':true,
'enumerable':true,
'get':function(){
var g=current_gui();
if(g.dataset.guiType!=='itemeditor')throw Error('not item editor');
return g.key_input.getval();
},
'set':function(val){
var g=current_gui();
if(g.dataset.guiType!=='itemeditor')throw Error('not item editor');
g.key_input.setval(String(val));
}
},
'iv':{
'configurable':true,
'enumerable':true,
'get':function(){
var g=current_gui();
if(g.dataset.guiType!=='itemeditor')throw Error('not item editor');
if(g.edit_button.cc_dict_item.type==='d')throw Error('can\'t get value of <d> as string');
return g.value_input.getval();
},
'set':function(val){
var g=current_gui();
if(g.dataset.guiType!=='itemeditor')throw Error('not item editor');
if(g.edit_button.cc_dict_item.type==='d')throw Error('can\'t set value of <d> as string');
g.value_input.setval(String(val));
}
}
});
80 changes: 33 additions & 47 deletions src/js/dict_editor.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -199,7 +199,7 @@ function push_xml_ie(){
var g=hopen('div'),tbd=g.tbd=[];
g.last_blob_url='';
g.new_items=null;
hattr('data-is-modal','display:grid;grid-template-columns:auto auto;grid-template-rows:30px 30px 30px auto;');
g.dataset.isModal='display:grid;grid-template-columns:auto auto;grid-template-rows:30px 30px 30px auto;';
hbutton('back',xml_ie_back,onceel).className='npnb';tbd.push(hclose());
hbutton('back (no write)',xml_ie_back_no_write,onceel).className='npnb';tbd.push(hclose());
g.drop_file_input=hopen('input');hcurr().className='npnb';hcurr().type='file';hstyle('grid-column','1/3');tbd.push(hclose());
Expand Down Expand Up @@ -235,7 +235,7 @@ function xml_ie_show_error(e){
li.setAttribute('style','background-color:#F00;');
li.textContent=e;
g.status.appendChild(li);
tbd_set_disabled(false);
set_loading(false);
}

function xml_ie_filereader_onerror(){
Expand All @@ -252,7 +252,7 @@ function xml_ie_filereader_onload(){
d.setAttribute('style','background-color:#0F0;');
d.textContent='imported';
g.status.appendChild(d);
tbd_set_disabled(false);
set_loading(false);
}catch(error){
xml_ie_show_error(error);
}
Expand All @@ -273,7 +273,7 @@ function xml_ie_import(){
g.status.appendChild(f);
return;
}
tbd_set_disabled(true);
set_loading(true);
try{
var fr=new FileReader();
fr.addEventListener('error',xml_ie_filereader_onerror,onceel);
Expand Down Expand Up @@ -422,20 +422,6 @@ function open_value_in_dict_editor_onclick(){
dict_editor_add_path_link(i.value,i.key).click();
}

function open_value_in_encoded_string_editor_onclick(){
var i=current_gui().value_input;
string_editor(set_toggler_and_val.bind(null,i),null,i.value);
}

function open_value_in_object_editor_onclick(){
var i=current_gui().value_input;
try{
new ObjEditor(i.value,set_toggler_and_val.bind(null,i));
}catch(error){
say_error('object editor',error);
}
}

function dict_item_onclick(e){
var item=(e=e.target).cc_dict_item,g,f;
if(!item)return;
Expand All @@ -444,7 +430,8 @@ function dict_item_onclick(e){
else delete e.stuckActive;
return;
}
(g=hopen('div')).dataset.isModal='display:grid;grid-template-columns:auto auto;';
(g=hopen('div')).dataset.guiType='itemeditor';
g.dataset.isModal='display:grid;grid-template-columns:auto auto;';
(g.edit_button=e).dataset.stuckActive='';
hbutton('back',item_editor_back_button_onclick);hclose();
hbutton('back (no write)',item_editor_back_no_write_button_onclick,onceel);hclose();
Expand All @@ -455,30 +442,27 @@ function dict_item_onclick(e){
htext('editing item #');
g.item_num_tn=htext(1+current_gui().cc_dict.indexOf(item));
hclose('h2');
(f=g.key_input=textarea_in_fieldset(g,'key','display:flex;flex-direction:row;grid-column:1/3;')).value=item.key;
f.style.flexGrow='1';
(f=g.type_input=input_in_fieldset(g,'type','text','display:flex;flex-direction:row;grid-column:1/3;')).value=item.type;
f.style.flexGrow='1';
f.minLength=f.maxLength=1;
f.pattern='[a-z]';
hfieldset('key','use in JS console:\n ik - key as string').className='objeditorfs';
(g.key_input=new AdvTextArea(hcurr())).setval(item.key);
hclose('fieldset');
hfieldset('type');
hstyle('display','flex');
hstyle('grid-column','1/3');
(f=cre('input')).type='text';
f.style.flexGrow='1';
f.minLength=f.maxLength=1;
f.pattern='[a-z]';
f.value=item.type;
hcurr().appendChild(g.type_input=f);
hclose('fieldset');
if(item.type==='d'){
f.disabled=true;
hbutton('open value in dict editor',open_value_in_dict_editor_onclick);
hstyle('grid-column','1/3');
hclose();
}else{
hfieldset('value');
hstyle('display','flex');
hstyle('flex-direction','column');
hstyle('grid-column','1/3');
(f=g.value_input=cre('textarea')).style.flexGrow='1';
add_toggler(hopen('div').appendChild(f)).style.margin='auto 0';
set_toggler_and_val(f,item.value);
hstyle('display','flex');
hstyle('flex-direction','row');
hclose('div');
hbutton('open in encoded string editor',open_value_in_encoded_string_editor_onclick);hclose();
hbutton('open in object editor',open_value_in_object_editor_onclick);hclose();
hfieldset('value','use in JS console:\n iv - value as string').className='objeditorfs';
(g.value_input=new AdvTextArea(hcurr())).setval(item.value);
hclose('fieldset');
}
hbutton('duplicate item',item_editor_duplicate);hclose();
Expand All @@ -488,7 +472,7 @@ function dict_item_onclick(e){

function item_editor_duplicate(){
var g=current_gui(),eb=g.edit_button,i=eb.cc_dict_item,t;
if(i.type==='d')i={'key':g.key_input.value,'type':'d','value':JSON.parse(JSON.stringify(i.value))};
if(i.type==='d')i={'key':g.key_input.getval(),'type':'d','value':JSON.parse(JSON.stringify(i.value))};
else{
if(!(t=g.type_input.value)){
alert('empty type');
Expand All @@ -502,7 +486,7 @@ function item_editor_duplicate(){
alert('invalid type '+t);
return;
}
i={'key':g.key_input.value,'type':t,'value':g.value_input.value};
i={'key':g.key_input.getval(),'type':t,'value':g.value_input.getval()};
}
delete eb.dataset.stuckActive;
(g.edit_button=dict_editor_add_item(t=guis[guis.length-2],i,(g.item_num_tn.nodeValue=2+t.cc_dict.indexOf(eb.cc_dict_item))-1)).dataset.stuckActive='';
Expand Down Expand Up @@ -530,9 +514,9 @@ function item_editor_back_button_onclick(){
return;
}
i.type=g.type_input.value;
i.value=g.value_input.value;
i.value=g.value_input.getval();
}
i.key=g.key_input.value;
i.key=g.key_input.getval();
b.value=dict_item_display_string(i);
delete b.dataset.stuckActive;
pop_gui();
Expand All @@ -548,16 +532,16 @@ function item_editor_delete_button_onclick(){
}

function push_search(){
var g=gui_div_with_html('display:flex;flex-direction:column;',
'<div style="display:flex;flex-direction:row;">\
<input onclick="pop_gui();" style="flex-grow:1;margin:0 1px;height:25px;padding:0;" type="button" value="back"/>\
<label class="btn" style="flex-grow:1;margin:0;display:flex;height:25px;padding:0;">\
var g=gui_div_with_html(true,
'<div class="hbox growc">\
<input onclick="pop_gui();" style="margin:0 1px;height:25px;padding:0;" type="button" value="back"/>\
<label class="btn" style="margin:0;display:flex;height:25px;padding:0;">\
<input style="margin:auto 0 auto auto;width:18px;height:18px;" checked="" onchange="var g=current_gui();g[this.checked?&quot;appendChild&quot;:&quot;removeChild&quot;](g.ul_container);" type="checkbox"/>\
<span style="margin:auto auto auto 0;">\
<strong>0</strong> results\
</span>\
</label>\
<input onclick="try{search_result();}catch(error){say_error(&quot;search&quot;,error);}" style="flex-grow:1;margin:0 1px;height:25px;padding:0;" type="button" value="search"/>\
<input onclick="try{search_result();}catch(error){say_error(&quot;search&quot;,error);}" style="margin:0 1px;height:25px;padding:0;" type="button" value="search"/>\
</div>\
<table style="border-spacing:1px;width:100%;">\
<thead>\
Expand Down Expand Up @@ -586,6 +570,7 @@ function push_search(){
<div style="height:200px;flex-shrink:0;" class="resizebox">\
<ul style="white-space:pre;margin:2px 0;"></ul>\
</div>');
g.className='vbox';
g.tr_template=(g.tbody=g.querySelector('tbody')).firstChild.cloneNode(true);
g.results_count=g.firstChild.querySelector('strong');
g.cc_dict=current_gui().cc_dict;
Expand Down Expand Up @@ -650,7 +635,7 @@ function search_test_querys(item,querys){
}

function push_rename_helper(){
var g=gui_div_with_html('display:flex;flex-direction:column;',sof(
var g=gui_div_with_html(true,sof(
'<input type="button" value="back"/>\
<details>\
<summary>help</summary>\
Expand All @@ -672,6 +657,7 @@ examples:\
</details>\
<textarea></textarea>\
<input type="button" value="rename"/>',Number));
g.className='vbox';
g.command_input=g.querySelector('textarea');
g.firstChild.addEventListener('click',pop_gui,onceel);
g.lastChild.addEventListener('click',rename_onclick,passiveel);
Expand Down
Loading

0 comments on commit a4e9a0a

Please sign in to comment.