Script to add rows to an HTML table using YAD and bash

[kjdixo]

Script to add rows to an HTML table using YAD and bash
I needed an easy to use foreign language 'verb tables' lookup system.
Portable and easy to use and optimized for use in Palemoon browser on my Samsung Galaxy Tab4 7 inch tablet.
I wanted to watch subtitled foreign soaps on my Samsung Galaxy Tablet and (when I did not understand some subtitled text) flip to the verb tables.
Over the past few years my many attempts at this have all been shelved and abandoned usually at the stage when I realise a design flaw that will obviously grow with the amount of data.
Verb tables generally follow rules, there are regular verbs that follow the rules and irregular ones that don't.
There are thousands of them, whilst learning you start with a few and pick up a few more every day.
They have been written into small pocket books and large thick books.
Do those books have JavaScript search functions to pick up multiple instances of a text string? . . . no I don't think so.
I did not want to have to consult online web sites, with often annoying advertising or with some kind of monetizing and profiling of users, or highly tuned obviously politically biased text examples.
I wanted it to be offline, available instantly and free.
Written in HTML, CSS and JavaScript as I enjoy doing it that way.

The concept is ok, the idea of implementation as a local html page is ok.
What must be made easier than in my previous attempts is the tedious task of adding new verbs.
I needed a way to automate that.
I have been using bash scripts quite successfully for a while, so I thought that I could make a nifty data entry script, using YAD and bash.
The script will write the data directly onto an html page.
The html page will not be created on the android tablet, the bash script and data entry will be on my puppy linux desktop computer.
Then all I do is transfer the HTML, CSS, JS and background wallpaper .png to my tablet.
The system now has easy methods to import, export, copy and modify in bulk, after which there is only minimal manual editing left to do.
With this system I can add a new verb with 56 table entries very, very quickly.
Before, with previous methods, it was either automatic code (PHP in a web page which calculated verb structure, but it got too complicated and I didn't trust it), or I had to enter everything manually.

Extra note regarding development . . . I am on backup 63 of this, backup 1 was on 5th October one month ago.

Here are some screenshots and all the code in a tar.gz.
I will explain more another time.

[kjdixo]

add-line.sh

Note: from code add-line.sh
cd /root/verbs/Documents-on-tablet might not be what you are using, so change it accordingly.
I changed the folder name 'Documents-on-tablet' to be 'everything' as you can probably see I uploaded 'everything.tar.gz'.
cd /root/verbs/everything would probably now be needed for it to work.
So check this is correct before using the script.

Code: Select all

#! /bin/bash
# define delete_entry

delete_entry(){
delete_verb=$(yad --on-top --mouse --title "Delete $verb ... sure?" --button="Completely:3" --button="Delete from html:4")
ret=$?
if [[ $ret -eq 3 ]];then # Delete txt and html
rm -rf verbs-data/$verb.txt
# delete row of table with $verb, if it already exists
sed -i'.bak' '/'$verb'/d' verbs2.html
exit 0;
fi
if [[ $ret -eq 4 ]];then # Delete html
# delete row of table with $verb, if it already exists
sed -i'.bak' '/'$verb'/d' verbs2.html
exit 0;
fi
}

cd /root/verbs/Documents-on-tablet
verb=$(find verbs-data -type f -iname "*.txt" -printf "%f\n" | sort | sed 's/.txt//g' | awk '{printf "%s!", $1}')
echo $verb
dialog=$(yad --width=300 --on-top --mouse --title "Edit Text File" --form --field ":cb" "${verb%%!}" --button="gtk-ok:0")
ret=$?
if [[ $ret -ne 0 ]];then
exit 0
fi
verb=$(echo $dialog | awk 'BEGIN {FS="|" }{print $1}')
echo $verb
. verbs-data/$verb.txt
xmodmap -e "keycode 65 = underscore"
dialog=$(yad --mouse --title "$verb.txt ... change first field to export as something else" --form --width=1500 --columns=2 --selectable-labels \
--field='<b>verb</b>' \
--field='<b>eng</b>' \
--field='<span foreground="firebrick">pres-ind-eu</span>' \
--field='<span foreground="firebrick">pres-ind-tu</span>' \
--field='<span foreground="firebrick">pres-ind-ve</span>' \
--field='<span foreground="firebrick">pres-ind-ns</span>' \
--field='<span foreground="firebrick">pres-ind-vs</span>' \
--field='<span foreground="firebrick"><b>eng</b></span>' \
--field='pret-imp-eu' \
--field='pret-imp-tu' \
--field='pret-imp-ve' \
--field='pret-imp-ns' \
--field='pret-imp-vs' \
--field='<b>eng</b>' \
--field='<span foreground="firebrick">pret-ind-eu</span>' \
--field='<span foreground="firebrick">pret-ind-tu</span>' \
--field='<span foreground="firebrick">pret-ind-ve</span>' \
--field='<span foreground="firebrick">pret-ind-ns</span>' \
--field='<span foreground="firebrick">pret-ind-vs</span>' \
--field='<span foreground="firebrick"><b>eng</b></span>' \
--field='fut-ind-eu' \
--field='fut-ind-tu' \
--field='fut-ind-ve' \
--field='fut-ind-ns' \
--field='fut-ind-vs' \
--field='<b>eng</b>' \
--field='<span foreground="firebrick">fut-per-eu</span>' \
--field='<span foreground="firebrick">fut-per-tu</span>' \
--field='<span foreground="firebrick">fut-per-ve</span>' \
--field='<span foreground="firebrick">fut-per-ns</span>' \
--field='<span foreground="firebrick">fut-per-vs</span>' \
--field='<span foreground="firebrick"><b>eng</b></span>' \
--field='cond-eu' \
--field='cond-tu' \
--field='cond-ve' \
--field='cond-ns' \
--field='cond-vs' \
--field='<b>eng</b>' \
--field='<span foreground="firebrick">pret-sub-(se)-eu</span>' \
--field='<span foreground="firebrick">pret-sub-(se)-tu</span>' \
--field='<span foreground="firebrick">pret-sub-(se)-ve</span>' \
--field='<span foreground="firebrick">pret-sub-(se)-ns</span>' \
--field='<span foreground="firebrick">pret-sub-(se)-vs</span>' \
--field='<span foreground="firebrick"><b>eng</b></span>' \
--field='pres-sub-(que)-eu' \
--field='pres-sub-(que)-tu' \
--field='pres-sub-(que)-ve' \
--field='pres-sub-(que)-ns' \
--field='pres-sub-(que)-vs' \
--field='<b>eng</b>' \
--field='<span foreground="firebrick">fut-sub-(quando)-eu</span>' \
--field='<span foreground="firebrick">fut-sub-(quando)-tu</span>' \
--field='<span foreground="firebrick">fut-sub-(quando)-ve</span>' \
--field='<span foreground="firebrick">fut-sub-(quando)-ns</span>' \
--field='<span foreground="firebrick">fut-sub-(quando)-vs</span>' \
--field='<span foreground="firebrick"><b>eng</b></span>' \
"$v1" "$v2" \
"$v3" "$v4" "$v5" "$v6" "$v7" "$v8" \
"$v9" "$v10" "$v11" "$v12" "$v13" "$v14" \
"$v15" "$v16" "$v17" "$v18" "$v19" "$v20" \
"$v21" "$v22" "$v23" "$v24" "$v25" "$v26" \
"$v27" "$v28" "$v29" "$v30" "$v31" "$v32" \
"$v33" "$v34" "$v35" "$v36" "$v37" "$v38" \
"$v39" "$v40" "$v41" "$v42" "$v43" "$v44" \
"$v45" "$v46" "$v47" "$v48" "$v49" "$v50" \
"$v51" "$v52" "$v53" "$v54" "$v55" "$v56" \
--button="Delete:5" --button="New:6" --button="View:2" --button="Import:3" --button="Export:4" --button="gtk-ok:0" \
--field="<span foreground='blue'><b><big><big>à á â ã ç é ê í ó ô õ ú</big></big></b></span>:LBL")
ret=$?
if [[ $ret -eq 6 ]]; then
cp verbs-data/$verb.txt verbs-data/NEW.txt
# change first line of NEW.txt from 'v1=$verb' to 'v1=NEW'
sed -i "1s/.*/v1=NEW/" verbs-data/NEW.txt
fi
if [[ $ret -eq 2 ]]; then
geany verbs2.html verbs-data/$verb.txt
fi
if [[ $ret -eq 3 ]]; then
# create YAD combo box of all verbs in verbs2.html
readarray a < verbs2.html
# clear buffer std.txt
> std.txt
for element in "${a[@]}"
do
vbs=$(echo "$element" | awk 'BEGIN {FS="<tr><td>" }{print $2}' | awk 'BEGIN {FS="</td><td>" }{print $1}' | sort | awk '{printf "%s", $1}' | sed 's/<\/td><td//g')
# one by one extract verbs from verbs2.html
echo $vbs >> std.txt
done
# remove blank lines
sed -i '/^$/d' std.txt
# replace each newline with !
vb=$(tr '\n' '!' < std.txt)
# select a verb to import
dialog2=$(yad --on-top --mouse --width=500 --title "Import" --form --field ":cb" "${vb%%!}" --button="to $verb:0")
ret=$?
if [[ $ret -ne 0 ]];then
exit 0
fi
vsource=$(echo $dialog2 | awk 'BEGIN {FS="|" }{print $1}')

# test1:  vsource=$(echo "DAR")
table_row=$(awk '/'$vsource'/' verbs2.html)
echo $table_row
echo $table_row > verbs-data/$verb.txt
echo $vsource
echo $verb

sed -i "s|<tr><td>||g" verbs-data/$verb.txt

sed -i "s|</td><td>|\n|g" verbs-data/$verb.txt

sed -i "s|</td><td class=\"i\">|\n_irr_|g" verbs-data/$verb.txt

sed -i "s|</td></tr>|\n|g" verbs-data/$verb.txt

sed -i "s| |_|g" verbs-data/$verb.txt

awk '{printf("v%5d=%s\n", NR,$0)}' verbs-data/$verb.txt > tmp && mv tmp verbs-data/$verb.txt

sed -i "s| ||g" verbs-data/$verb.txt
# after clicking import button $verb.txt has new imported $vsource data
# first line of $verb.txt "v1=" defines $verb.txt filename to be written to
# first line must be $verb (old) not $vsource (new) for update to occur to $verb
sed -i "1s/$vsource/$verb/" verbs-data/$verb.txt
exit 0
fi
if [[ $ret -eq 5 ]]; then
delete_entry
exit 0
fi

if [[ $ret -eq 4 ]] || [[ $ret -eq 0 ]]; then
setxkbmap -layout gb
v1=$(echo $dialog | awk 'BEGIN {FS="|" }{print $1}') 
v2=$(echo $dialog | awk 'BEGIN {FS="|" }{print $2}') 
v3=$(echo $dialog | awk 'BEGIN {FS="|" }{print $3}') 
v4=$(echo $dialog | awk 'BEGIN {FS="|" }{print $4}') 
v5=$(echo $dialog | awk 'BEGIN {FS="|" }{print $5}') 
v6=$(echo $dialog | awk 'BEGIN {FS="|" }{print $6}') 
v7=$(echo $dialog | awk 'BEGIN {FS="|" }{print $7}') 
v8=$(echo $dialog | awk 'BEGIN {FS="|" }{print $8}') 
v9=$(echo $dialog | awk 'BEGIN {FS="|" }{print $9}') 
v10=$(echo $dialog | awk 'BEGIN {FS="|" }{print $10}') 
v11=$(echo $dialog | awk 'BEGIN {FS="|" }{print $11}') 
v12=$(echo $dialog | awk 'BEGIN {FS="|" }{print $12}') 
v13=$(echo $dialog | awk 'BEGIN {FS="|" }{print $13}') 
v14=$(echo $dialog | awk 'BEGIN {FS="|" }{print $14}') 
v15=$(echo $dialog | awk 'BEGIN {FS="|" }{print $15}') 
v16=$(echo $dialog | awk 'BEGIN {FS="|" }{print $16}') 
v17=$(echo $dialog | awk 'BEGIN {FS="|" }{print $17}') 
v18=$(echo $dialog | awk 'BEGIN {FS="|" }{print $18}') 
v19=$(echo $dialog | awk 'BEGIN {FS="|" }{print $19}') 
v20=$(echo $dialog | awk 'BEGIN {FS="|" }{print $20}') 
v21=$(echo $dialog | awk 'BEGIN {FS="|" }{print $21}') 
v22=$(echo $dialog | awk 'BEGIN {FS="|" }{print $22}') 
v23=$(echo $dialog | awk 'BEGIN {FS="|" }{print $23}') 
v24=$(echo $dialog | awk 'BEGIN {FS="|" }{print $24}') 
v25=$(echo $dialog | awk 'BEGIN {FS="|" }{print $25}') 
v26=$(echo $dialog | awk 'BEGIN {FS="|" }{print $26}') 
v27=$(echo $dialog | awk 'BEGIN {FS="|" }{print $27}') 
v28=$(echo $dialog | awk 'BEGIN {FS="|" }{print $28}') 
v29=$(echo $dialog | awk 'BEGIN {FS="|" }{print $29}') 
v30=$(echo $dialog | awk 'BEGIN {FS="|" }{print $30}') 
v31=$(echo $dialog | awk 'BEGIN {FS="|" }{print $31}') 
v32=$(echo $dialog | awk 'BEGIN {FS="|" }{print $32}') 
v33=$(echo $dialog | awk 'BEGIN {FS="|" }{print $33}') 
v34=$(echo $dialog | awk 'BEGIN {FS="|" }{print $34}') 
v35=$(echo $dialog | awk 'BEGIN {FS="|" }{print $35}') 
v36=$(echo $dialog | awk 'BEGIN {FS="|" }{print $36}') 
v37=$(echo $dialog | awk 'BEGIN {FS="|" }{print $37}') 
v38=$(echo $dialog | awk 'BEGIN {FS="|" }{print $38}') 
v39=$(echo $dialog | awk 'BEGIN {FS="|" }{print $39}') 
v40=$(echo $dialog | awk 'BEGIN {FS="|" }{print $40}') 
v41=$(echo $dialog | awk 'BEGIN {FS="|" }{print $41}') 
v42=$(echo $dialog | awk 'BEGIN {FS="|" }{print $42}') 
v43=$(echo $dialog | awk 'BEGIN {FS="|" }{print $43}') 
v44=$(echo $dialog | awk 'BEGIN {FS="|" }{print $44}') 
v45=$(echo $dialog | awk 'BEGIN {FS="|" }{print $45}') 
v46=$(echo $dialog | awk 'BEGIN {FS="|" }{print $46}') 
v47=$(echo $dialog | awk 'BEGIN {FS="|" }{print $47}') 
v48=$(echo $dialog | awk 'BEGIN {FS="|" }{print $48}') 
v49=$(echo $dialog | awk 'BEGIN {FS="|" }{print $49}') 
v50=$(echo $dialog | awk 'BEGIN {FS="|" }{print $50}') 
v51=$(echo $dialog | awk 'BEGIN {FS="|" }{print $51}') 
v52=$(echo $dialog | awk 'BEGIN {FS="|" }{print $52}') 
v53=$(echo $dialog | awk 'BEGIN {FS="|" }{print $53}') 
v54=$(echo $dialog | awk 'BEGIN {FS="|" }{print $54}') 
v55=$(echo $dialog | awk 'BEGIN {FS="|" }{print $55}') 
v56=$(echo $dialog | awk 'BEGIN {FS="|" }{print $56}') 
if [[ $ret -eq 4 ]]; then
# delete row of table with $verb, if it already exists
sed -i'.bak' '/'$verb'/d' verbs2.html
# temporarily remove last line </table></body></html>
dd if=/dev/null of=verbs2.html bs=1 seek=$(echo $(stat --format=%s verbs2.html ) - $( tail -n1 verbs2.html | wc -c) | bc )
# append exported verb
echo '<tr><td>'"$v1"'</td><td>'"$v2"'</td><td>'"$v3"'</td><td>'"$v4"'</td><td>'"$v5"'</td><td>'"$v6"'</td><td>'"$v7"'</td><td>'"$v8"'</td><td>'"$v9"'</td><td>'"$v10"'</td><td>'"$v11"'</td><td>'"$v12"'</td><td>'"$v13"'</td><td>'"$v14"'</td><td>'"$v15"'</td><td>'"$v16"'</td><td>'"$v17"'</td><td>'"$v18"'</td><td>'"$v19"'</td><td>'"$v20"'</td><td>'"$v21"'</td><td>'"$v22"'</td><td>'"$v23"'</td><td>'"$v24"'</td><td>'"$v25"'</td><td>'"$v26"'</td><td>'"$v27"'</td><td>'"$v28"'</td><td>'"$v29"'</td><td>'"$v30"'</td><td>'"$v31"'</td><td>'"$v32"'</td><td>'"$v33"'</td><td>'"$v34"'</td><td>'"$v35"'</td><td>'"$v36"'</td><td>'"$v37"'</td><td>'"$v38"'</td><td>'"$v39"'</td><td>'"$v40"'</td><td>'"$v41"'</td><td>'"$v42"'</td><td>'"$v43"'</td><td>'"$v44"'</td><td>'"$v45"'</td><td>'"$v46"'</td><td>'"$v47"'</td><td>'"$v48"'</td><td>'"$v49"'</td><td>'"$v50"'</td><td>'"$v51"'</td><td>'"$v52"'</td><td>'"$v53"'</td><td>'"$v54"'</td><td>'"$v55"'</td><td>'"$v56"'</td></tr>' | sed 's/<td>_irr_/<td class="i">/g' | sed 's/_/ /g' >> verbs2.html
# move it up the table and into alphabetical order
sed -e '/<tr><td>/,$d' verbs2.html > html-top.txt
sed -n '/<tr><td>/,$p' verbs2.html | sort > table-sorted.txt
cat html-top.txt table-sorted.txt > verbs2.html
echo '</table></body></html>' >> verbs2.html;
fi
if [[ -n $v1 ]]; then printf "v1=$v1%s\nv2=$v2%s\nv3=$v3%s\nv4=$v4%s\nv5=$v5%s\nv6=$v6%s\nv7=$v7%s\nv8=$v8%s\nv9=$v9%s\nv10=$v10%s\nv11=$v11%s\nv12=$v12%s\nv13=$v13%s\nv14=$v14%s\nv15=$v15%s\nv16=$v16%s\nv17=$v17%s\nv18=$v18%s\nv19=$v19%s\nv20=$v20%s\nv21=$v21%s\nv22=$v22%s\nv23=$v23%s\nv24=$v24%s\nv25=$v25%s\nv26=$v26%s\nv27=$v27%s\nv28=$v28%s\nv29=$v29%s\nv30=$v30%s\nv31=$v31%s\nv32=$v32%s\nv33=$v33%s\nv34=$v34%s\nv35=$v35%s\nv36=$v36%s\nv37=$v37%s\nv38=$v38%s\nv39=$v39%s\nv40=$v40%s\nv41=$v41%s\nv42=$v42%s\nv43=$v43%s\nv44=$v44%s\nv45=$v45%s\nv46=$v46%s\nv47=$v47%s\nv48=$v48%s\nv49=$v49%s\nv50=$v50%s\nv51=$v51%s\nv52=$v52%s\nv53=$v53%s\nv54=$v54%s\nv55=$v55%s\nv56=$v56" | sed 's/ /_/g' > verbs-data/"$v1".txt ;fi
find verbs-data -type f -iname "*.txt" -printf "%f\n" | sort > all-verbs.txt # all-verbs.txt is only for reference (not parsed)
else
setxkbmap -layout gb
fi

verbs.js

Code: Select all

//  reminder . . . get array.length outside loops not inside . . .
var p="";
// flag whether to completely reload page, or clear only certain parts - see clr()
flag="0";
for(var i=0;i<=9;i++){document.styleSheets[i].disabled=true;}
document.styleSheets[0].disabled=false;
var br=0;
// cancels tooltip example
function tooltipcancel(){
document.getElementById("text").innerHTML="";
document.getElementById("text").style.top="-200px";
}
// white button pressed
function btn(){
tooltipcancel();example();
for(var i=0;i<=9;i++){document.styleSheets[i].disabled=true;}
document.styleSheets[n].disabled=false;
}
// Filter table depending on verb ending AR, ER, IR
function aeir(){
for(var i=0;i<=3;i++){document.getElementById("a"+i).style.backgroundColor="white"}
if(v=='AR'){document.getElementById("a1").style.backgroundColor="yellow";document.getElementById('find').style.display='none';}
if(v=='ER'){document.getElementById("a2").style.backgroundColor="yellow";document.getElementById('find').style.display='none';}
if(v=='IR'){document.getElementById("a3").style.backgroundColor="yellow";document.getElementById('find').style.display='none';}
var table=document.getElementById("verbs");
var rows=table.getElementsByTagName("tr");
var rl=rows.length;
for(var i=0;i<rl;i++){
var tm=rows[i].getElementsByTagName('td');
document.getElementById("verbs").rows[i].style.display="none";
vb=tm[0].innerHTML.slice(-2);
if(vb==v){document.getElementById("verbs").rows[i].style="display:block;margin-top:0px;margin-bottom:2px"}
}}
// If a table cell is clicked then show a tooltip 'grammatical example'
function example(){
var table=document.getElementById("verbs");
var x=document.getElementsByTagName("td");
var trl=table.rows.length;
for(var i=0;i<trl;i++){for(var j=0;j<table.rows[i].cells.length;j++)
table.rows[i].cells[j].onclick=function(){
var c=this.cellIndex+1;
var t=this.innerHTML;
var txt=document.getElementById("text");
var p="";
// grammatical rules applied, to construct example tooltip
if((c==39)||(c==40)||(c==41)||(c==42)||(c==43)){p="se "}
if((c==45)||(c==46)||(c==47)||(c==48)||(c==49)){p="que "}
if((c==51)||(c==52)||(c==53)||(c==54)||(c==55)){p="quando "}
if((c==3)||(c==9)||(c==15)||(c==21)||(c==27)||(c==33)||(c==39)||(c==45)||(c==51))txt.innerHTML=p+" eu "+t;
if((c==4)||(c==10)||(c==16)||(c==22)||(c==28)||(c==34)||(c==40)||(c==46)||(c==52))txt.innerHTML=p+" tu "+t;
if((c==5)||(c==11)||(c==17)||(c==23)||(c==29)||(c==35)||(c==41)||(c==47)||(c==53))txt.innerHTML=p+" você "+t;
if((c==6)||(c==12)||(c==18)||(c==24)||(c==30)||(c==36)||(c==42)||(c==48)||(c==54))txt.innerHTML=p+" nós "+t;
if((c==7)||(c==13)||(c==19)||(c==25)||(c==31)||(c==37)||(c==43)||(c==49)||(c==55))txt.innerHTML=p+" vocês "+t;
if(txt.innerHTML!=""){document.getElementById('text').style.top='10px'}
// if column 1 first td verb title clicked then tag verb for subsequent display
if(c==1){
document.getElementById("a4").style.display="inline";
if((document.getElementById("a4").innerHTML=="SELECT")&&(this.innerHTML.slice(0,4)!='>')&&(flag==0)){this.innerHTML='>'+this.innerHTML;document.getElementById('find').style.display='none';}
else{var sel=this.innerHTML;sel=sel.replace('>',"");this.innerHTML=sel;}
var gt=this.innerHTML.slice(0,4);
if(gt=='>'){this.style.backgroundColor='yellow'}else{this.style.backgroundColor='#ffe'}
if(document.getElementById("find").innerHTML=="Clear"){document.getElementById('a4').style.display='none'}
}
}}}
// display tagged verbs
function choose(){
for(var i=0;i<=3;i++){document.getElementById("a"+i).style.backgroundColor="white"}	
document.getElementById("a4").style.display="inline";
var table=document.getElementById("verbs");
var rows=table.getElementsByTagName("tr");
var rl=rows.length;
for(var i=0;i<rl;i++){
document.getElementById("a4").style.display="none";	
var tm=rows[i].getElementsByTagName('td');
vt=tm[0].innerHTML.slice(0,4);
if(vt=='>'){document.getElementById("verbs").rows[i].style="display:block;margin-top:0px;margin-bottom:2px";tm[0].style.backgroundColor="#ffe";tm[0].innerHTML=tm[0].innerHTML.slice(4)}
else{document.getElementById("verbs").rows[i].style="display:none";}
}}
// Find dialog
function srch(){
if(document.getElementById("find").innerHTML=="Clear"){clr()}	
else{
document.getElementById('menu').style.display='inline-block';
document.getElementById('search').style.display='inline-block';
document.getElementById('verbs').style.visibility='hidden';
document.getElementById('a0').style.display='none';
document.getElementById('a1').style.display='none';
document.getElementById('a2').style.display='none';
document.getElementById('a3').style.display='none';
document.getElementById("a4").style.display='none';
tooltipcancel();
document.getElementById("needle").innerHTML='';
document.getElementById('needle').style.display='none';}
}
// Clicked outside keypad area . . . so do nothing
function notkeypad(){document.onclick=function(event){}}
// Keypad clicked
function keypad(){
document.onclick=function(event) {
var target=event.target || event.srcElement;
document.getElementById('needle').style.display='inline-block';
if(target.innerHTML=='✔'){tick()}
if((target.innerHTML!='✘')&&(target.innerHTML.length==1)){document.getElementById("needle").innerHTML=document.getElementById("needle").innerHTML +target.innerHTML}
if((target.innerHTML=='✘')||(target.innerHTML=='✔')){document.getElementById("needle").innerHTML=document.getElementById("needle").innerHTML.substring(0,document.getElementById("needle").innerHTML.length-1)}
if(document.getElementById("needle").innerHTML==''){document.getElementById('needle').style.display='none'}
}}
// Search term entered . . . needle
function tick(){
var table=document.getElementById("verbs");
table.style.top='320px';
table.style.visibility='visible';
document.getElementById('menu').style.display='inline-block';
document.getElementById('a0').style.display='none';
document.getElementById('a1').style.display='none';
document.getElementById('a2').style.display='none';
document.getElementById('a3').style.display='none';
document.getElementById("find").innerHTML="Clear";
needle=document.getElementById("needle").innerHTML;
srch2();
}
// Results of search
function srch2(){flag=1;clr();
if(needle){
var table=document.getElementById("verbs");
var trl2=table.rows.length;
for(var i=0;i<trl2;i++){k=i+1;
var sheet=document.createElement('style');
sheet.innerHTML="tr:nth-child("+k+"){display:none}\n";document.body.appendChild(sheet)
}
var trl3=table.rows.length;
for(var i=0;i<trl3;i++){for(var j=0;j<table.rows[i].cells.length;j++){k=i+1;m=j+1;
var content=table.rows[i].cells[j].innerHTML;
var q=content.search(needle);
if(q!='-1'){
var sheet=document.createElement('style');
sheet.innerHTML="tr:nth-child("+k+"){display:block}\n";flag="1";
document.body.appendChild(sheet)
}
}}}}
function clr(){
if(flag=="0"){location.reload()}
else{
var table=document.getElementById("verbs");
var trl4=table.rows.length;
for(var i=0;i<trl4;i++){k=i+1;
var sheet=document.createElement('style');
sheet.innerHTML="tr:nth-child("+k+"){display:none}\n";flag="0";
document.body.appendChild(sheet);
}}}

[kjdixo]

If you type the first 5 characters of a data entry box as the string _irr_ it will be recognized to mean an irregular verb and will translate into a pink html table cell rather than pale green meaning regular verb.
It does this by changing a <td> cell to <td class="i"> where i is short for irregular and the style can be found in the style sheets.
The code generally chokes on spaces and so in the YAD dialog I always substitute them with underscores.
I have been a bit tricky and used xmodmap to hijack the spacebar and change it to inputting underscores.
xmodmap -e "keycode 65 = underscore"
when the code exits I reassert the space bar code by using the 'fix all keyboard oddities' line of code:
setxkbmap -layout gb
You will have to change this to 'setxkbmap -layout us' or whatever country you are in.
Note also if you exit the code prematurely whilst experimenting in console mode, then you will need to type:
setxkbmap -layout gb
into a terminal to get your spacebar back, or alternatively hardwire the code into your openbox right click menu.
So during verb editing in YAD you don't need to worry about typing underscores instead of spaces it is done automatically when you key the space bar.
Don't worry, as you can see from the screenshots . . . underscores in YAD dialog convert automatically to spaces in HTML.
The hijacking of the space bar by underscores is done so you don't type spaces into the script.

[kjdixo]

I like to be creative with stylesheets and use them for not only doing pretty styles, but also to help to simplify, or work in tandem with, the JavaScript logic, hiding and showing elements.
Style sheets are in places 'written on the fly' and the hard wired .css style sheets are referred to in the HTML in a certain order and number which correlates with some of the code loops.
What I mean to say is the structure is rigidly fixed and hardwired, but can be changed and expanded if you know what you are doing.
For instance in verbs2.html if you were to change the listing order of the stylesheets or add or remove some of them then it will most likely break the system.

[musher0]

Hello kjdixo.

Seems to me as though you're giving yourself a lot of trouble trying to
reinvent the wheel...

Doesn't all this material already exist on the Web? Here, for example.

BFN.

[kjdixo]

Hello musher0
Thanks for tuning in to the thread.
I do not think it is a lot of trouble, when it is a hobby and an enjoyable pastime, and I am applying one field of my interest to another, to solve a problem.
I like to think for myself . . . too often today we are taught what to think . . . not how to think.
I am not re-inventing the wheel as I have found nothing so far that does exactly what I want, in the way I want.

1. I am not new to this, having taken private lessons for about 8 years (not this last year though), nothing I have found online does exactly what I want the way I want it to.
2. I have found that common methods present either too much information or not enough, this obfuscates and complicates.
3. I look at the source code of sites on the internet (right click, view source) and I am usually horrified by the hidden scripts, tracking and profiling that takes place.
4. As I said I want to be offline and not subjected to targeted advertising, requests for donations, profiling or brainwashing by obviously biased text examples which draw examples from hidden agenda websites.
5. I hate the way the internet has become a monetizing machine with google ads everywhere and stupid thumbnails all over the place with moronic celebrity articles, it is the gutter and the jungle.
6. I do not trust a lot of websites and they lie when they say cookies are there to enhance the experience . . . as with the news we are told official reasons but not the real reasons.
7. I want european portuguese and most of the online websites provide brazilian portuguese.
8. I am keen to give examples of working code that will help others and then maybe inspire others to do similar..

That list will do for starters but there are many more reasons.
Anyway you made a fair comment and I hope that answers it for you.

[kjdixo]

I wrote my own custom keypad on the HTML page for a good reason.
Usually on a tablet when you try to enter text anywhere a built-in keypad appears.
That is okay but not ideal for my purposes.
1. The native keypad doesn't have the layout I require with the special foreign accented characters easily accessible.
2. I integrated my HTML keypad into the find dialog that searches for text strings and presents any row of the table that contains the string.
This function could be extended to include highlighting.