Reorganize PDF or HTML content for a blind user? - pdf
Are there any tools or ways to fix a bit random order of elements in PDF without OCR?
Using pdf2json and JS below, I am able to build web page with inputs and arrow navigation (easily readable by any screen reader), but still far from perfect.
var elList = [];
var uqIdx = {x:[],y:[]};
function show(json) {
var fnt = json[0].fonts;
var fntI = {};
for (var f in fnt) {
fntI[fnt[f].fontspec] = fnt[f];
}
var txt = json[0].text;
var cp = [];
for (var t in txt) {
if (txt[t].data !== ' ') {
cp.push(txt[t]);
}
}
var prev;
for (var t in cp) {
if (prev) {
if (Math.abs(prev.top - cp[t].top) < prev.height / 2) {
var x = prev.left + prev.width; var x2 = cp[t].left;
if (x < x2 && x2 - x > 5 || x2 - x < -5) {
if ((x2 - x) / 2 > prev.data.length / 10 || prev.data.substr(-1) !== ' ') {
prev = cp[t];
continue;
}
}
prev.data += cp[t].data;
prev.width += cp[t].width;
delete cp[t];
continue;
}
}
prev = cp[t];
}
cp.sort(boxCmp);
for (var t in cp)
{
var d = document.createElement('INPUT');
d.setAttribute("style", "position:absolute;top:"+cp[t].top+"pt;left:"+cp[t].left+
"pt;font:" + fntI[cp[t].font].size + "pt " + fntI[cp[t].font].family + ";width:" + cp[t].width + "pt;height:" + cp[t].height + "pt;");
elList.push([cp[t].left, cp[t].left + cp[t].width, d, cp[t].top, cp[t].top + cp[t].height, cp[t].data]);
if (uqIdx.x.indexOf(cp[t].left) < 0) uqIdx.x.push(cp[t].left);
if (uqIdx.y.indexOf(cp[t].top) < 0) uqIdx.y.push(cp[t].top);
d.value = cp[t].data;
document.body.appendChild(d);
}
elList[0][2].focus();
// document.write(document.body.innerHTML);
// document.close;
uqIdx.x.sort(num);
uqIdx.y.sort(num);
}
function boxCmp (a, b) {
if (Math.abs(a.top - b.top) <= 4) {
if (Math.abs(a.left - b.left) <= 2) return 0;
else return a.left - b.left;
} else return a.top - b.top;
}
var me;
function moveEl() {
var el = event.srcElement;
if(event.srcElement.tagName != 'INPUT') return;
if(event.key.indexOf("Page") == 0) return;
var i=0;
while (i<elList.length && elList[i][2] != el) i++;
me = elList[i], flw=[];
if(event.key.indexOf("Down") > -1) {
while (++i < elList.length) if (elList[i][3] > me[3]) flw.push(elList[i]);
flw.sort(distance);
} else
if(event.key.indexOf("Up") > -1) {
while (i--) if (elList[i][3] < me[3]) flw.push(elList[i]);
flw.sort(distance);
} else
if(event.key.indexOf("Left") > -1) {
while (i--) if (elList[i][0] < me[0] && me[3] <= elList[i][4]) flw.push(elList[i]); else break;
flw.sort(distanceX);
} else
if(event.key.indexOf("Right") > -1) {
while (++i < elList.length) if (elList[i][0] > me[0] && me[4] >= elList[i][3]) flw.push(elList[i]); else break;
flw.sort(distanceX);
} else return;
if (!flw.length) return;
flw[0][2].focus();
}
function distance(a,b) {
var ac0 = Math.abs(me[0] - a[0]) + Math.abs(me[3] - a[3]);
var ac1 = Math.abs(me[1] - a[1]) + Math.abs(me[4] - a[4]);
var bc0 = Math.abs(me[0] - b[0]) + Math.abs(me[3] - b[3]);
var bc1 = Math.abs(me[1] - b[1]) + Math.abs(me[4] - b[4]);
return Math.min(ac0,ac1) - Math.min(bc0,bc1);
}
function distanceX(a,b) {
var ac = Math.abs(me[0] - a[0]);
var bc = Math.abs(me[0] - b[0]);
return ac - bc;
}
function num(a,b) { return a-b; }
function XL() {
var xl = [];
for(var y=0;y<uqIdx.y.length;y++) {
var r = [];
for(var x=0;x<uqIdx.x.length;x++) r.push([]);
xl.push(r);
}
var x = uqIdx;
for(var i=0;i<elList.length;i++) {
var el = elList[i];
xl[uqIdx.y.indexOf(el[3])][uqIdx.x.indexOf(el[0])] = el[2].value;
}
var str = '';
for(var y=0;y<uqIdx.y.length;y++) {
str += xl[y].join('\t').replace(/\t+$/, '') + '\n';
}
var ta;
if (document.getElementsByTagName('TEXTAREA').length) ta = document.getElementsByTagName('TEXTAREA')[0];
else {
ta = document.createElement('TEXTAREA');
ta.setAttribute("style", "width:100%;height:100%;position:absolute");
ta.onblur = clear;
document.body.appendChild(ta);
}
ta.value = str;
ta.focus();
}
function loadData() {
//json = JSON.parse(document.frames[0].document.body.innerText);
show(json);
document.body.onkeydown = moveEl;
document.body.ondblclick = XL;
}
function clear(t) {
document.body.removeChild(event.srcElement);
}
var json = [{"number":1,"pages":12,"height":1188,"width":918,"fonts":[{"fontspec":"0","size":"14","family":"Times","color":"#000000"},{"fontspec":"1","size":"16","family":"Helvetica","color":"#000000"},{"fontspec":"2","size":"12","family":"Helvetica","color":"#000000"},{"fontspec":"3","size":"11","family":"Helvetica","color":"#000000"},{"fontspec":"4","size":"11","family":"Helvetica","color":"#000000"},{"fontspec":"5","size":"12","family":"Helvetica","color":"#000000"},{"fontspec":"6","size":"12","family":"Helvetica","color":"#000000"},{"fontspec":"7","size":"12","family":"Times","color":"#000000"}],"text":[{"top":1093,"left":455,"width":8,"height":21,"font":0,"data":"1"},{"top":127,"left":372,"width":68,"height":17,"font":1,"data":"Vaccine"},{"top":127,"left":445,"width":49,"height":17,"font":1,"data":"Injury"},{"top":127,"left":499,"width":47,"height":17,"font":1,"data":"Table"},{"top":186,"left":116,"width":49,"height":12,"font":3,"data":"Applies"},{"top":186,"left":169,"width":30,"height":12,"font":3,"data":"Only"},{"top":186,"left":203,"width":13,"height":12,"font":3,"data":"to"},{"top":186,"left":219,"width":57,"height":12,"font":3,"data":"Petitions"},{"top":186,"left":280,"width":18,"height":12,"font":3,"data":"for"},{"top":186,"left":302,"width":94,"height":12,"font":3,"data":"Compensation"},{"top":186,"left":400,"width":31,"height":12,"font":3,"data":"Filed"},{"top":186,"left":435,"width":37,"height":12,"font":3,"data":"under"},{"top":186,"left":477,"width":20,"height":12,"font":3,"data":"the"},{"top":186,"left":501,"width":53,"height":12,"font":3,"data":"National"},{"top":186,"left":558,"width":51,"height":12,"font":3,"data":"Vaccine"},{"top":186,"left":613,"width":37,"height":12,"font":3,"data":"Injury"},{"top":186,"left":654,"width":94,"height":12,"font":3,"data":"Compensation"},{"top":186,"left":751,"width":56,"height":12,"font":3,"data":"Program"},{"top":202,"left":116,"width":21,"height":12,"font":3,"data":"on "},{"top":202,"left":137,"width":14,"height":12,"font":3,"data":"or"},{"top":202,"left":154,"width":29,"height":12,"font":3,"data":"after"},{"top":202,"left":187,"width":40,"height":12,"font":3,"data":"March"},{"top":202,"left":231,"width":19,"height":12,"font":3,"data":"21,"},{"top":202,"left":254,"width":30,"height":12,"font":3,"data":"2017"},{"top":240,"left":108,"width":18,"height":14,"font":5,"data":"(a)"},{"top":240,"left":130,"width":17,"height":14,"font":5,"data":"In "},{"top":240,"left":147,"width":82,"height":14,"font":5,"data":"accordance "},{"top":240,"left":229,"width":31,"height":14,"font":5,"data":"with "},{"top":240,"left":260,"width":52,"height":14,"font":5,"data":"section "},{"top":240,"left":311,"width":43,"height":14,"font":5,"data":"312(b)"},{"top":240,"left":359,"width":12,"height":14,"font":5,"data":"of"},{"top":240,"left":375,"width":21,"height":14,"font":5,"data":"the"},{"top":240,"left":400,"width":55,"height":14,"font":5,"data":"National"},{"top":240,"left":460,"width":72,"height":14,"font":5,"data":"Childhood "},{"top":240,"left":531,"width":57,"height":14,"font":5,"data":"Vaccine "},{"top":240,"left":589,"width":37,"height":14,"font":5,"data":"Injury"},{"top":240,"left":630,"width":22,"height":14,"font":5,"data":"Act"},{"top":240,"left":656,"width":12,"height":14,"font":5,"data":"of"},{"top":240,"left":672,"width":37,"height":14,"font":5,"data":"1986,"},{"top":240,"left":714,"width":27,"height":14,"font":5,"data":"title "},{"top":240,"left":741,"width":12,"height":14,"font":5,"data":"III"},{"top":240,"left":758,"width":12,"height":14,"font":5,"data":"of"},{"top":257,"left":108,"width":41,"height":14,"font":5,"data":"Public"},{"top":257,"left":153,"width":28,"height":14,"font":5,"data":"Law"},{"top":257,"left":185,"width":51,"height":14,"font":5,"data":"99-660,"},{"top":257,"left":240,"width":29,"height":14,"font":5,"data":"100 "},{"top":257,"left":269,"width":31,"height":14,"font":5,"data":"Stat."},{"top":257,"left":304,"width":37,"height":14,"font":5,"data":"3779 "},{"top":257,"left":341,"width":22,"height":14,"font":5,"data":"(42"},{"top":257,"left":367,"width":44,"height":14,"font":5,"data":"U.S.C."},{"top":257,"left":416,"width":59,"height":14,"font":5,"data":"300aa-1 "},{"top":257,"left":475,"width":34,"height":14,"font":5,"data":"note)"},{"top":257,"left":513,"width":29,"height":14,"font":5,"data":"and "},{"top":257,"left":542,"width":48,"height":14,"font":5,"data":"section"},{"top":257,"left":594,"width":51,"height":14,"font":5,"data":"2114(c)"},{"top":257,"left":649,"width":13,"height":14,"font":5,"data":"of"},{"top":257,"left":666,"width":25,"height":14,"font":5,"data":"the "},{"top":257,"left":691,"width":41,"height":14,"font":5,"data":"Public"},{"top":257,"left":736,"width":43,"height":14,"font":5,"data":"Health"},{"top":274,"left":108,"width":54,"height":14,"font":5,"data":"Service "},{"top":274,"left":162,"width":26,"height":14,"font":5,"data":"Act,"},{"top":274,"left":192,"width":16,"height":14,"font":5,"data":"as"},{"top":274,"left":212,"width":62,"height":14,"font":5,"data":"amended"},{"top":274,"left":279,"width":36,"height":14,"font":5,"data":"(PHS"},{"top":274,"left":319,"width":27,"height":14,"font":5,"data":"Act)"},{"top":274,"left":350,"width":26,"height":14,"font":5,"data":"(42 "},{"top":274,"left":375,"width":44,"height":14,"font":5,"data":"U.S.C."},{"top":274,"left":424,"width":90,"height":14,"font":5,"data":"300aa-14(c)),"},{"top":274,"left":518,"width":25,"height":14,"font":5,"data":"the "},{"top":274,"left":543,"width":62,"height":14,"font":5,"data":"following "},{"top":274,"left":606,"width":11,"height":14,"font":5,"data":"is"},{"top":274,"left":621,"width":12,"height":14,"font":5,"data":"a "},{"top":274,"left":633,"width":37,"height":14,"font":5,"data":"table "},{"top":274,"left":670,"width":12,"height":14,"font":5,"data":"of"},{"top":274,"left":686,"width":62,"height":14,"font":5,"data":"vaccines,"},{"top":274,"left":753,"width":21,"height":14,"font":5,"data":"the"},{"top":292,"left":108,"width":51,"height":14,"font":5,"data":"injuries,"},{"top":292,"left":164,"width":73,"height":14,"font":5,"data":"disabilities,"},{"top":292,"left":241,"width":62,"height":14,"font":5,"data":"illnesses,"},{"top":292,"left":307,"width":72,"height":14,"font":5,"data":"conditions,"},{"top":292,"left":383,"width":29,"height":14,"font":5,"data":"and "},{"top":292,"left":412,"width":45,"height":14,"font":5,"data":"deaths"},{"top":292,"left":461,"width":61,"height":14,"font":5,"data":"resulting "},{"top":292,"left":522,"width":30,"height":14,"font":5,"data":"from"},{"top":292,"left":557,"width":25,"height":14,"font":5,"data":"the "},{"top":292,"left":581,"width":97,"height":14,"font":5,"data":"administration "},{"top":292,"left":679,"width":12,"height":14,"font":5,"data":"of"},{"top":292,"left":696,"width":36,"height":14,"font":5,"data":"such "},{"top":292,"left":731,"width":62,"height":14,"font":5,"data":"vaccines,"},{"top":309,"left":108,"width":29,"height":14,"font":5,"data":"and "},{"top":309,"left":137,"width":25,"height":14,"font":5,"data":"the "},{"top":309,"left":162,"width":33,"height":14,"font":5,"data":"time "},{"top":309,"left":195,"width":41,"height":14,"font":5,"data":"period"},{"top":309,"left":240,"width":12,"height":14,"font":5,"data":"in"},{"top":309,"left":256,"width":42,"height":14,"font":5,"data":"which "},{"top":309,"left":299,"width":21,"height":14,"font":5,"data":"the"},{"top":309,"left":324,"width":24,"height":14,"font":5,"data":"first"},{"top":309,"left":352,"width":61,"height":14,"font":5,"data":"symptom"},{"top":309,"left":417,"width":13,"height":14,"font":5,"data":"or"},{"top":309,"left":435,"width":93,"height":14,"font":5,"data":"manifestation "},{"top":309,"left":528,"width":12,"height":14,"font":5,"data":"of"},{"top":309,"left":545,"width":37,"height":14,"font":5,"data":"onset"},{"top":309,"left":585,"width":13,"height":14,"font":5,"data":"or"},{"top":309,"left":603,"width":12,"height":14,"font":5,"data":"of"},{"top":309,"left":620,"width":25,"height":14,"font":5,"data":"the "},{"top":309,"left":645,"width":67,"height":14,"font":5,"data":"significant"},{"top":309,"left":716,"width":82,"height":14,"font":5,"data":"aggravation "},{"top":326,"left":108,"width":12,"height":14,"font":5,"data":"of"},{"top":326,"left":125,"width":36,"height":14,"font":5,"data":"such "},{"top":326,"left":161,"width":51,"height":14,"font":5,"data":"injuries,"},{"top":326,"left":216,"width":73,"height":14,"font":5,"data":"disabilities,"},{"top":326,"left":294,"width":62,"height":14,"font":5,"data":"illnesses,"},{"top":326,"left":360,"width":72,"height":14,"font":5,"data":"conditions,"},{"top":326,"left":436,"width":29,"height":14,"font":5,"data":"and "},{"top":326,"left":465,"width":45,"height":14,"font":5,"data":"deaths"},{"top":326,"left":514,"width":11,"height":14,"font":5,"data":"is"},{"top":326,"left":529,"width":17,"height":14,"font":5,"data":"to "},{"top":326,"left":546,"width":37,"height":14,"font":5,"data":"occur"},{"top":326,"left":586,"width":30,"height":14,"font":5,"data":"after"},{"top":326,"left":621,"width":55,"height":14,"font":5,"data":"vaccine "},{"top":326,"left":676,"width":98,"height":14,"font":5,"data":"administration "},{"top":326,"left":773,"width":18,"height":14,"font":5,"data":"for"},{"top":343,"left":108,"width":61,"height":14,"font":5,"data":"purposes"},{"top":343,"left":174,"width":12,"height":14,"font":5,"data":"of"},{"top":343,"left":190,"width":64,"height":14,"font":5,"data":"receiving "},{"top":343,"left":254,"width":98,"height":14,"font":5,"data":"compensation "},{"top":343,"left":352,"width":38,"height":14,"font":5,"data":"under"},{"top":343,"left":395,"width":21,"height":14,"font":5,"data":"the"},{"top":343,"left":420,"width":62,"height":14,"font":5,"data":"Program."},{"top":343,"left":486,"width":74,"height":14,"font":5,"data":"Paragraph "},{"top":343,"left":560,"width":18,"height":14,"font":5,"data":"(b)"},{"top":343,"left":582,"width":12,"height":14,"font":5,"data":"of"},{"top":343,"left":599,"width":23,"height":14,"font":5,"data":"this"},{"top":343,"left":626,"width":52,"height":14,"font":5,"data":"section "},{"top":343,"left":678,"width":27,"height":14,"font":5,"data":"sets"},{"top":343,"left":710,"width":34,"height":14,"font":5,"data":"forth "},{"top":343,"left":744,"width":64,"height":14,"font":5,"data":"additional"},{"top":361,"left":108,"width":67,"height":14,"font":5,"data":"provisions"},{"top":361,"left":180,"width":25,"height":14,"font":5,"data":"that"},{"top":361,"left":209,"width":26,"height":14,"font":5,"data":"are "},{"top":361,"left":235,"width":21,"height":14,"font":5,"data":"not"},{"top":361,"left":260,"width":69,"height":14,"font":5,"data":"separately"},{"top":361,"left":333,"width":39,"height":14,"font":5,"data":"listed "},{"top":361,"left":372,"width":16,"height":14,"font":5,"data":"in "},{"top":361,"left":388,"width":23,"height":14,"font":5,"data":"this"},{"top":361,"left":415,"width":42,"height":14,"font":5,"data":"Table "},{"top":361,"left":457,"width":21,"height":14,"font":5,"data":"but"},{"top":361,"left":482,"width":25,"height":14,"font":5,"data":"that"},{"top":361,"left":511,"width":68,"height":14,"font":5,"data":"constitute "},{"top":361,"left":580,"width":26,"height":14,"font":5,"data":"part"},{"top":361,"left":610,"width":12,"height":14,"font":5,"data":"of"},{"top":361,"left":626,"width":12,"height":14,"font":5,"data":"it."},{"top":361,"left":642,"width":74,"height":14,"font":5,"data":"Paragraph "},{"top":361,"left":716,"width":18,"height":14,"font":5,"data":"(c)"},{"top":361,"left":738,"width":12,"height":14,"font":5,"data":"of"},{"top":361,"left":755,"width":23,"height":14,"font":5,"data":"this"},{"top":378,"left":108,"width":51,"height":14,"font":5,"data":"section "},{"top":378,"left":159,"width":27,"height":14,"font":5,"data":"sets"},{"top":378,"left":191,"width":34,"height":14,"font":5,"data":"forth "},{"top":378,"left":225,"width":25,"height":14,"font":5,"data":"the "},{"top":378,"left":250,"width":87,"height":14,"font":5,"data":"qualifications"},{"top":378,"left":341,"width":29,"height":14,"font":5,"data":"and "},{"top":378,"left":371,"width":27,"height":14,"font":5,"data":"aids"},{"top":378,"left":402,"width":17,"height":14,"font":5,"data":"to "},{"top":378,"left":419,"width":92,"height":14,"font":5,"data":"interpretation "},{"top":378,"left":511,"width":18,"height":14,"font":5,"data":"for"},{"top":378,"left":532,"width":25,"height":14,"font":5,"data":"the "},{"top":378,"left":557,"width":38,"height":14,"font":5,"data":"terms"},{"top":378,"left":599,"width":37,"height":14,"font":5,"data":"used "},{"top":378,"left":636,"width":16,"height":14,"font":5,"data":"in "},{"top":378,"left":652,"width":25,"height":14,"font":5,"data":"the "},{"top":378,"left":676,"width":42,"height":14,"font":5,"data":"Table."},{"top":378,"left":722,"width":71,"height":14,"font":5,"data":"Conditions"},{"top":395,"left":108,"width":29,"height":14,"font":5,"data":"and "},{"top":395,"left":137,"width":47,"height":14,"font":5,"data":"injuries"},{"top":395,"left":189,"width":25,"height":14,"font":5,"data":"that"},{"top":395,"left":218,"width":21,"height":14,"font":5,"data":"do "},{"top":395,"left":239,"width":21,"height":14,"font":5,"data":"not"},{"top":395,"left":264,"width":33,"height":14,"font":5,"data":"meet"},{"top":395,"left":301,"width":25,"height":14,"font":5,"data":"the "},{"top":395,"left":326,"width":38,"height":14,"font":5,"data":"terms"},{"top":395,"left":368,"width":12,"height":14,"font":5,"data":"of"},{"top":395,"left":385,"width":25,"height":14,"font":5,"data":"the "},{"top":395,"left":410,"width":86,"height":14,"font":5,"data":"qualifications"},{"top":395,"left":501,"width":29,"height":14,"font":5,"data":"and "},{"top":395,"left":530,"width":27,"height":14,"font":5,"data":"aids"},{"top":395,"left":561,"width":17,"height":14,"font":5,"data":"to "},{"top":395,"left":578,"width":91,"height":14,"font":5,"data":"interpretation "},{"top":395,"left":670,"width":26,"height":14,"font":5,"data":"are "},{"top":395,"left":696,"width":21,"height":14,"font":5,"data":"not"},{"top":395,"left":721,"width":42,"height":14,"font":5,"data":"within "},{"top":395,"left":763,"width":25,"height":14,"font":5,"data":"the "},{"top":413,"left":108,"width":42,"height":14,"font":5,"data":"Table."},{"top":413,"left":154,"width":74,"height":14,"font":5,"data":"Paragraph "},{"top":413,"left":228,"width":18,"height":14,"font":5,"data":"(d)"},{"top":413,"left":250,"width":12,"height":14,"font":5,"data":"of"},{"top":413,"left":267,"width":23,"height":14,"font":5,"data":"this"},{"top":413,"left":295,"width":51,"height":14,"font":5,"data":"section "},{"top":413,"left":346,"width":28,"height":14,"font":5,"data":"sets"},{"top":413,"left":378,"width":34,"height":14,"font":5,"data":"forth "},{"top":413,"left":412,"width":12,"height":14,"font":5,"data":"a "},{"top":413,"left":425,"width":56,"height":14,"font":5,"data":"glossary"},{"top":413,"left":485,"width":12,"height":14,"font":5,"data":"of"},{"top":413,"left":501,"width":38,"height":14,"font":5,"data":"terms"},{"top":413,"left":543,"width":37,"height":14,"font":5,"data":"used "},{"top":413,"left":580,"width":16,"height":14,"font":5,"data":"in "},{"top":413,"left":595,"width":73,"height":14,"font":5,"data":"paragraph "},{"top":413,"left":668,"width":22,"height":14,"font":5,"data":"(c)."},{"top":551,"left":226,"width":57,"height":14,"font":2,"data":"Vaccine"},{"top":533,"left":408,"width":55,"height":14,"font":2,"data":"Illness, "},{"top":533,"left":463,"width":73,"height":14,"font":2,"data":"disability, "},{"top":533,"left":536,"width":41,"height":14,"font":2,"data":"injury"},{"top":551,"left":418,"width":15,"height":14,"font":2,"data":"or"},{"top":551,"left":437,"width":67,"height":14,"font":2,"data":"condition"},{"top":551,"left":509,"width":57,"height":14,"font":2,"data":"covered"},{"top":499,"left":591,"width":35,"height":14,"font":2,"data":"Time"},{"top":499,"left":631,"width":46,"height":14,"font":2,"data":"period"},{"top":499,"left":680,"width":20,"height":14,"font":2,"data":"for"},{"top":499,"left":705,"width":32,"height":14,"font":2,"data":"first "},{"top":499,"left":737,"width":67,"height":14,"font":2,"data":"symptom"},{"top":516,"left":589,"width":15,"height":14,"font":2,"data":"or"},{"top":516,"left":608,"width":97,"height":14,"font":2,"data":"manifestation"},{"top":516,"left":710,"width":18,"height":14,"font":2,"data":"of "},{"top":516,"left":728,"width":44,"height":14,"font":2,"data":"onset "},{"top":516,"left":773,"width":15,"height":14,"font":2,"data":"or"},{"top":516,"left":792,"width":18,"height":14,"font":2,"data":"of "},{"top":533,"left":597,"width":79,"height":14,"font":2,"data":"significant "},{"top":533,"left":676,"width":85,"height":14,"font":2,"data":"aggravation"},{"top":533,"left":765,"width":33,"height":14,"font":2,"data":"after"},{"top":551,"left":616,"width":59,"height":14,"font":2,"data":"vaccine "},{"top":551,"left":675,"width":103,"height":14,"font":2,"data":"administration"},{"top":579,"left":110,"width":8,"height":14,"font":5,"data":"I."},{"top":579,"left":122,"width":61,"height":14,"font":5,"data":"Vaccines"},{"top":579,"left":187,"width":73,"height":14,"font":5,"data":"containing "},{"top":579,"left":260,"width":49,"height":14,"font":5,"data":"tetanus"},{"top":579,"left":313,"width":44,"height":14,"font":5,"data":"toxoid "},{"top":579,"left":357,"width":34,"height":14,"font":5,"data":"(e.g.,"},{"top":596,"left":110,"width":42,"height":14,"font":5,"data":"DTaP,"},{"top":596,"left":156,"width":34,"height":14,"font":5,"data":"DTP,"},{"top":596,"left":195,"width":24,"height":14,"font":5,"data":"DT,"},{"top":596,"left":223,"width":22,"height":14,"font":5,"data":"Td,"},{"top":596,"left":249,"width":13,"height":14,"font":5,"data":"or"},{"top":596,"left":266,"width":24,"height":14,"font":5,"data":"TT)"},{"top":579,"left":400,"width":14,"height":14,"font":5,"data":"A."},{"top":579,"left":418,"width":81,"height":14,"font":5,"data":"Anaphylaxis"},{"top":596,"left":400,"width":14,"height":14,"font":5,"data":"B."},{"top":596,"left":418,"width":58,"height":14,"font":5,"data":"Brachial "},{"top":596,"left":476,"width":51,"height":14,"font":5,"data":"Neuritis"},{"top":575,"left":587,"width":21,"height":20,"font":7,"data":"?4 "},{"top":575,"left":607,"width":42,"height":20,"font":7,"data":"hours."},{"top":596,"left":587,"width":34,"height":14,"font":5,"data":"2-28 "},{"top":596,"left":621,"width":32,"height":14,"font":5,"data":"days"},{"top":596,"left":656,"width":26,"height":14,"font":5,"data":"(not"},{"top":596,"left":686,"width":27,"height":14,"font":5,"data":"less"},{"top":596,"left":717,"width":29,"height":14,"font":5,"data":"than"},{"top":596,"left":751,"width":12,"height":14,"font":5,"data":"2 "},{"top":596,"left":763,"width":31,"height":14,"font":5,"data":"days"},{"top":614,"left":587,"width":29,"height":14,"font":5,"data":"and "},{"top":614,"left":616,"width":21,"height":14,"font":5,"data":"not"},{"top":614,"left":641,"width":39,"height":14,"font":5,"data":"more "},{"top":614,"left":679,"width":29,"height":14,"font":5,"data":"than"},{"top":614,"left":712,"width":21,"height":14,"font":5,"data":"28 "},{"top":614,"left":733,"width":41,"height":14,"font":5,"data":"days)."},{"top":642,"left":400,"width":15,"height":14,"font":5,"data":"C."},{"top":642,"left":419,"width":60,"height":14,"font":5,"data":"Shoulder"},{"top":642,"left":483,"width":37,"height":14,"font":5,"data":"Injury"},{"top":642,"left":524,"width":52,"height":14,"font":5,"data":"Related"},{"top":659,"left":400,"width":17,"height":14,"font":5,"data":"to "},{"top":659,"left":417,"width":57,"height":14,"font":5,"data":"Vaccine "},{"top":659,"left":474,"width":95,"height":14,"font":5,"data":"Administration"},{"top":637,"left":587,"width":29,"height":20,"font":7,"data":"?48 "},{"top":637,"left":616,"width":42,"height":20,"font":7,"data":"hours."},{"top":687,"left":400,"width":15,"height":14,"font":5,"data":"D."},{"top":687,"left":419,"width":70,"height":14,"font":5,"data":"Vasovagal"},{"top":687,"left":493,"width":56,"height":14,"font":5,"data":"syncope"},{"top":683,"left":587,"width":21,"height":20,"font":7,"data":"?1 "},{"top":683,"left":607,"width":34,"height":20,"font":7,"data":"hour."},{"top":716,"left":110,"width":12,"height":14,"font":5,"data":"II."},{"top":716,"left":126,"width":61,"height":14,"font":5,"data":"Vaccines"},{"top":716,"left":191,"width":73,"height":14,"font":5,"data":"containing "},{"top":716,"left":264,"width":43,"height":14,"font":5,"data":"whole "},{"top":716,"left":307,"width":23,"height":14,"font":5,"data":"cell"},{"top":716,"left":334,"width":60,"height":14,"font":5,"data":"pertussis"},{"top":733,"left":110,"width":57,"height":14,"font":5,"data":"bacteria,"},{"top":733,"left":171,"width":66,"height":14,"font":5,"data":"extracted "},{"top":733,"left":237,"width":13,"height":14,"font":5,"data":"or"},{"top":733,"left":254,"width":41,"height":14,"font":5,"data":"partial"},{"top":733,"left":299,"width":23,"height":14,"font":5,"data":"cell"},{"top":733,"left":326,"width":60,"height":14,"font":5,"data":"pertussis"},{"top":750,"left":110,"width":57,"height":14,"font":5,"data":"bacteria,"},{"top":750,"left":171,"width":13,"height":14,"font":5,"data":"or"},{"top":750,"left":189,"width":50,"height":14,"font":5,"data":"specific"},{"top":750,"left":243,"width":60,"height":14,"font":5,"data":"pertussis"},{"top":750,"left":307,"width":67,"height":14,"font":5,"data":"antigen(s)"},{"top":767,"left":110,"width":34,"height":14,"font":5,"data":"(e.g.,"},{"top":767,"left":148,"width":34,"height":14,"font":5,"data":"DTP,"},{"top":767,"left":186,"width":42,"height":14,"font":5,"data":"DTaP,"},{"top":767,"left":233,"width":14,"height":14,"font":5,"data":"P,"},{"top":767,"left":251,"width":63,"height":14,"font":5,"data":"DTP-Hib)"},{"top":716,"left":400,"width":14,"height":14,"font":5,"data":"A."},{"top":716,"left":418,"width":81,"height":14,"font":5,"data":"Anaphylaxis"},{"top":711,"left":587,"width":21,"height":20,"font":7,"data":"?4 "},{"top":711,"left":607,"width":42,"height":20,"font":7,"data":"hours."},{"top":796,"left":400,"width":14,"height":14,"font":5,"data":"B."},{"top":796,"left":418,"width":108,"height":14,"font":5,"data":"Encephalopathy"},{"top":796,"left":530,"width":13,"height":14,"font":5,"data":"or"},{"top":813,"left":400,"width":79,"height":14,"font":5,"data":"encephalitis"},{"top":791,"left":587,"width":29,"height":20,"font":7,"data":"?72 "},{"top":791,"left":616,"width":42,"height":20,"font":7,"data":"hours."},{"top":841,"left":400,"width":15,"height":14,"font":5,"data":"C."},{"top":841,"left":419,"width":60,"height":14,"font":5,"data":"Shoulder"},{"top":841,"left":483,"width":37,"height":14,"font":5,"data":"Injury"},{"top":841,"left":524,"width":56,"height":14,"font":5,"data":"Related "},{"top":858,"left":400,"width":17,"height":14,"font":5,"data":"to "},{"top":858,"left":417,"width":57,"height":14,"font":5,"data":"Vaccine "},{"top":858,"left":474,"width":95,"height":14,"font":5,"data":"Administration"},{"top":837,"left":587,"width":29,"height":20,"font":7,"data":"?48 "},{"top":837,"left":616,"width":42,"height":20,"font":7,"data":"hours."},{"top":887,"left":400,"width":15,"height":14,"font":5,"data":"D."},{"top":887,"left":419,"width":70,"height":14,"font":5,"data":"Vasovagal"},{"top":887,"left":493,"width":56,"height":14,"font":5,"data":"syncope"},{"top":882,"left":587,"width":21,"height":20,"font":7,"data":"?1 "},{"top":882,"left":607,"width":34,"height":20,"font":7,"data":"hour."},{"top":915,"left":110,"width":17,"height":14,"font":5,"data":"III."},{"top":915,"left":130,"width":61,"height":14,"font":5,"data":"Vaccines"},{"top":915,"left":195,"width":73,"height":14,"font":5,"data":"containing "},{"top":915,"left":268,"width":60,"height":14,"font":5,"data":"measles,"},{"top":915,"left":332,"width":54,"height":14,"font":5,"data":"mumps,"}]}]
input {
padding:0px;
border: 1px solid #e0e0e0;
}
input:focus {
background-color: red;
}
<body onload="loadData()" style="width:800px;height:400px">
</body>
After any input get focus arrows navigate to nearest input in particular direction and double click shows textarea with Tab separated content which could be coppied to XL directly.
Part of PDF www.hrsa.gov vaccineinjurytable.pdf used as demo PDF JSON export.
Got problems with some PDFs and found node.js way.
Setup pre-requisties pdf2json#1.2.0: npm i -g pdf2json
Convert and show PDF:
node pdf2htm.js inputFile.pdf
Here node.js (converts PDF 2 JSON, merge with input, save as htm of same name and opens result in default browser):
const fileta = process.argv[2];
const fs = require('fs');
const path = require('path');
const dest = fileta.split('.')[0].replace(/\s+/g, '_') + '.htm';
var exec = require('child_process').exec;
const PDFParser = require(path.join(process.env.APPDATA, 'npm/node_modules', 'pdf2json'));
const pdfParser = new PDFParser();
pdfParser.on('pdfParser_dataError', errData => console.error(errData.parserError));
pdfParser.on('pdfParser_dataReady', pdfData => {
var src = fs.readFileSync(path.join(__dirname, 'showPDF.htm')).toString().split('€');
fs.writeFileSync(path.join(__dirname, dest),
src[0] + 'var json=' +
unescape(decodeURI(JSON.stringify(pdfData))) +
'.formImage.Pages;' +
src[1]
);
console.log(dest);
exec(path.join(__dirname, dest), (a, b, c) => {});
});
pdfParser.loadPDF(path.join(__dirname, fileta));
And here json presenting file
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<style>input{padding:0px;border:1px solid #e0e0e0;}input:focus{background-color:red;}</style>
<script type="text/javascript">
var elList = [];
var uqIdx = {x:[],y:[]}, json;
€
function show(json) {
if (json === undefined) {
var s = document.createElement("SCRIPT");
s.src = location.hash.substr(1);
document.body.appendChild(s);
return;
}
var txt = json[0].Texts;
var cp = [];
for (var t in txt) {
if (txt[t].R[0].T !== ' ') {
cp.push(txt[t]);
}
}
var prev, mX = 27, mY = 27;
for (var t in cp) {
cp[t].x *= mX;
cp[t].y *= mY;
if (prev) {
if (Math.abs(prev.y - cp[t].y) < prev.R[0].TS[1] / 2) {
var x = prev.x + prev.w; var x2 = cp[t].x;
if (x < x2 && x2 - x > 5 || x2 - x < -5) {
if ((x2 - x) / 2 > prev.R[0].T.length / 10 || prev.R[0].T.substr(-1) !== ' ') {
prev = cp[t];
continue;
}
}
prev.R[0].T += cp[t].R[0].T;
prev.w += cp[t].w;
delete cp[t];
continue;
}
}
prev = cp[t];
}
cp.sort(boxCmp);
for (var t in cp)
{
var d = document.createElement('INPUT');
d.setAttribute("style", "position:absolute;top:"+cp[t].y+";left:"+cp[t].x);
d.value = unescape(decodeURI(cp[t].R[0].T));
elList.push([cp[t].x, cp[t].x + d.value.length, d, cp[t].y, cp[t].y + 10, cp[t].R[0].T]);
if (uqIdx.x.indexOf(cp[t].x) < 0) uqIdx.x.push(cp[t].x);
if (uqIdx.y.indexOf(cp[t].y) < 0) uqIdx.y.push(cp[t].y);
document.body.appendChild(d);
}
elList[0][2].focus();
uqIdx.x.sort(num);
uqIdx.y.sort(num);
}
function boxCmp (a, b) {
if (Math.abs(a.y - b.y) <= 4) {
if (Math.abs(a.x - b.x) <= 2) return 0;
else return a.x - b.x;
} else return a.y - b.y;
}
var me;
function moveEl() {
var el = event.srcElement;
if(event.srcElement.tagName != 'INPUT') return;
if(event.key.indexOf("Page") == 0) return;
var i=0;
while (i<elList.length && elList[i][2] != el) i++;
me = elList[i], flw=[];
if(event.key.indexOf("Down") > -1) {
while (++i < elList.length) if (elList[i][3] > me[3]) flw.push(elList[i]);
flw.sort(distance);
} else
if(event.key.indexOf("Up") > -1) {
while (i--) if (elList[i][3] < me[3]) flw.push(elList[i]);
flw.sort(distance);
} else
if(event.key.indexOf("Left") > -1) {
while (i--) if (elList[i][0] < me[0] && me[3] <= elList[i][4]) flw.push(elList[i]); else break;
flw.sort(distanceX);
} else
if(event.key.indexOf("Right") > -1) {
while (++i < elList.length) if (elList[i][0] > me[0] && me[4] >= elList[i][3]) flw.push(elList[i]); else break;
flw.sort(distanceX);
} else return;
if (!flw.length) return;
flw[0][2].focus();
}
function distance(a,b) {
var ac0 = Math.abs(me[0] - a[0]) + Math.abs(me[3] - a[3]);
var ac1 = Math.abs(me[1] - a[1]) + Math.abs(me[4] - a[4]);
var bc0 = Math.abs(me[0] - b[0]) + Math.abs(me[3] - b[3]);
var bc1 = Math.abs(me[1] - b[1]) + Math.abs(me[4] - b[4]);
return Math.min(ac0,ac1) - Math.min(bc0,bc1);
}
function distanceX(a,b) {
var ac = Math.abs(me[0] - a[0]);
var bc = Math.abs(me[0] - b[0]);
return ac - bc;
}
function num(a,b) { return a-b; }
function XL() {
var xl = [];
for(var y=0;y<uqIdx.y.length;y++) {
var r = [];
for(var x=0;x<uqIdx.x.length;x++) r.push([]);
xl.push(r);
}
var x = uqIdx;
for(var i=0;i<elList.length;i++) {
var el = elList[i];
xl[uqIdx.y.indexOf(el[3])][uqIdx.x.indexOf(el[0])] = el[2].value;
}
var str = '';
for(var y=0;y<uqIdx.y.length;y++) {
str += xl[y].join('\t').replace(/\t+$/, '') + '\n';
}
var ta;
if (document.getElementsByTagName('TEXTAREA').length) ta = document.getElementsByTagName('TEXTAREA')[0];
else {
ta = document.createElement('TEXTAREA');
ta.setAttribute("style", "width:100%;height:100%;position:absolute");
ta.onblur = clear;
document.body.appendChild(ta);
}
ta.value = str;
ta.focus();
}
function clear(t) {
document.body.removeChild(event.srcElement);
}
</script>
</head>
<body onload="show(json);" ondblclick="XL()" onkeydown="moveEl()"></body>
</html>
Arrows moves to next nearest element in particular direction, double click shows textarea containing tab delimitted data for excel.
Related
Trying to generate custom play button for SoundCloud API
I was experimenting with SoundCloud API in Elementor, but I couldn't solve a problem because I have very little knowledge about JS. I was trying to achieve custom play/stop button.
I added a play icon, which changes to a stop icon
It started playing as it should be, but now it's not stopping.
So when I click the icon with the id of #playBPP works well but when I click to the button again it's not working.
This is where I added JS.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script>
<!-- SoundCloud-->
<script type="text/javascript" src="http://w.soundcloud.com/player/api.js"></script>
<script type="text/javascript">
// Play - Stop
$(function(){
var widget1 = SC.Widget("bppRadioPlayer");
$("#playBPP").click(function() {
widget1.play();
});
$("toggle-pause").click(function() {
widget1.pause();
});
});
// Audio button toggle
const audioButton = document.querySelector('.audio-button');
audioButton.addEventListener('click', function(){
audioButton.classList.toggle('toggle-pause');
});
</script>
<iframe id="bppRadioPlayer" width="100%" height="160" scrolling="no" src="http://w.soundcloud.com/player/?url=https://soundcloud.com/sdyld/bpp-bonvoyage" frameborder="0" ></iframe>
Icon HTML
<div class="elementor-element elementor-element-ff4607e audio-button elementor-view-default elementor-widget elementor-widget-icon" data-id="ff4607e" data-element_type="widget" id="playBPP" data-widget_type="icon.default">
<div class="elementor-widget-container">
<div class="elementor-icon-wrapper">
<div class="elementor-icon">
<i aria-hidden="true" class="fas fa-play"></i> </div>
</div>
</div>
</div>
.toggle-pause .elementor-icon i::before{
content: '\f04c';
}
check out the page screenshot
I updated the snippet to achieve the goal, dropping here, so you can use.
var SC = "object" == typeof SC ? SC : {};
SC.Widget = function(e) {
var t = {};
function n(r) {
if (t[r]) return t[r].exports;
var o = t[r] = {
i: r,
l: !1,
exports: {}
};
return e[r].call(o.exports, o, o.exports, n), o.l = !0, o.exports
}
return n.m = e, n.c = t, n.d = function(e, t, r) {
n.o(e, t) || Object.defineProperty(e, t, {
enumerable: !0,
get: r
})
}, n.r = function(e) {
"undefined" != typeof Symbol && Symbol.toStringTag && Object.defineProperty(e, Symbol.toStringTag, {
value: "Module"
}), Object.defineProperty(e, "__esModule", {
value: !0
})
}, n.t = function(e, t) {
if (1 & t && (e = n(e)), 8 & t) return e;
if (4 & t && "object" == typeof e && e && e.__esModule) return e;
var r = Object.create(null);
if (n.r(r), Object.defineProperty(r, "default", {
enumerable: !0,
value: e
}), 2 & t && "string" != typeof e)
for (var o in e) n.d(r, o, function(t) {
return e[t]
}.bind(null, o));
return r
}, n.n = function(e) {
var t = e && e.__esModule ? function() {
return e.default
} : function() {
return e
};
return n.d(t, "a", t), t
}, n.o = function(e, t) {
return Object.prototype.hasOwnProperty.call(e, t)
}, n.p = "", n(n.s = 0)
}([function(e, t, n) {
var r, o, i, u = n(1),
a = n(2),
c = n(3),
s = u.api,
l = u.bridge,
d = [],
f = [],
p = /^http(?:s?)/;
function E(e) {
var t, n;
for (t = 0, n = f.length; t < n && !1 !== e(f[t]); t++);
}
function v(e) {
return e.contentWindow ? e.contentWindow : e.contentDocument && "parentWindow" in e.contentDocument ? e.contentDocument.parentWindow : null
}
function _(e) {
var t, n = [];
for (t in e) e.hasOwnProperty(t) && n.push(e[t]);
return n
}
function S(e, t, n) {
n.callbacks[e] = n.callbacks[e] || [], n.callbacks[e].push(t)
}
function h(e, t) {
var n = !0;
return t.callbacks[e] = [], E((function(t) {
if ((t.callbacks[e] || []).length) return n = !1, !1
})), n
}
function y(e, t, n) {
var r, o, i = v(n);
if (!i.postMessage) return !1;
r = n.getAttribute("src").split("?")[0], o = JSON.stringify({
method: e,
value: t
}), "//" === r.substr(0, 2) && (r = window.location.protocol + r), r = r.replace(/http:\/\/(w|wt).soundcloud.com/, "https://$1.soundcloud.com"), i.postMessage(o, r)
}
function b(e) {
var t;
return E((function(n) {
if (n.instance === e) return t = n, !1
})), t
}
function g(e) {
var t;
return E((function(n) {
if (v(n.element) === e) return t = n, !1
})), t
}
function m(e, t) {
return function(n) {
var r, o = !!((r = n) && r.constructor && r.call && r.apply),
i = b(this),
u = !o && t ? n : null,
a = o && !t ? n : null;
return a && S(e, a, i), y(e, u, i.element), this
}
}
function R(e, t, n) {
var r, o, i;
for (r = 0, o = t.length; r < o; r++) e[i = t[r]] = m(i, n)
}
function O(e, t, n) {
return e + "?url=" + t + "&" + function(e) {
var t, n, r = [];
for (t in e) e.hasOwnProperty(t) && (n = e[t], r.push(t + "=" + ("start_track" === t ? parseInt(n, 10) : n ? "true" : "false")));
return r.join("&")
}(n)
}
function w(e, t, n) {
var r, o, i = e.callbacks[t] || [];
for (r = 0, o = i.length; r < o; r++) i[r].apply(e.instance, n);
(function(e) {
var t, n = !1;
for (t in a)
if (a.hasOwnProperty(t) && a[t] === e) {
n = !0;
break
} return n
}(t) || t === s.READY) && (e.callbacks[t] = [])
}
function A(e) {
var t, n, r, o, i;
try {
n = JSON.parse(e.data)
} catch (e) {
return !1
}
return t = g(e.source), r = n.method, o = n.value, (!t || P(e.origin) === P(t.domain)) && (t ? (r === s.READY && (t.isReady = !0, w(t, "__LATE_BINDING__"), h("__LATE_BINDING__", t)), r !== s.PLAY || t.playEventFired || (t.playEventFired = !0), r !== s.PLAY_PROGRESS || t.playEventFired || (t.playEventFired = !0, w(t, s.PLAY, [o])), i = [], void 0 !== o && i.push(o), void w(t, r, i)) : (r === s.READY && d.push(e.source), !1))
}
function P(e) {
return e.replace(p, "")
}
window.addEventListener ? window.addEventListener("message", A, !1) : window.attachEvent("onmessage", A), e.exports = i = function(e, t, n) {
var i;
if (("" === (i = e) || i && i.charCodeAt && i.substr) && (e = document.getElementById(e)), ! function(e) {
return !(!e || 1 !== e.nodeType || "IFRAME" !== e.nodeName.toUpperCase())
}(e)) throw new Error("SC.Widget function should be given either iframe element or a string specifying id attribute of iframe element.");
t && (n = n || {}, e.src = O("http://wt.soundcloud.test:9200/", t, n));
var u, a, c = g(v(e));
return c && c.instance ? c.instance : (u = d.indexOf(v(e)) > -1, a = new r(e), f.push(new o(a, e, u)), a)
}, i.Events = s, window.SC = window.SC || {}, window.SC.Widget = i, o = function(e, t, n) {
this.instance = e, this.element = t, this.domain = function(e) {
var t, n, r, o = "";
"//" === e.substr(0, 2) && (e = window.location.protocol + e);
for (r = e.split("/"), t = 0, n = r.length; t < n && t < 3; t++) o += r[t], t < 2 && (o += "/");
return o
}(t.getAttribute("src")), this.isReady = !!n, this.callbacks = {}
}, (r = function() {}).prototype = {
constructor: r,
load: function(e, t) {
if (e) {
t = t || {};
var n = this,
r = b(this),
o = r.element,
i = o.src,
u = i.substr(0, i.indexOf("?"));
r.isReady = !1, r.playEventFired = !1, o.onload = function() {
n.bind(s.READY, (function() {
var e, n = r.callbacks;
for (e in n) n.hasOwnProperty(e) && e !== s.READY && y(l.ADD_LISTENER, e, r.element);
t.callback && t.callback()
}))
}, o.src = O(u, e, t)
}
},
bind: function(e, t) {
var n = this,
r = b(this);
return r && r.element && (e === s.READY && r.isReady ? setTimeout(t, 1) : r.isReady ? (S(e, t, r), y(l.ADD_LISTENER, e, r.element)) : S("__LATE_BINDING__", (function() {
n.bind(e, t)
}), r)), this
},
unbind: function(e) {
var t, n = b(this);
n && n.element && (t = h(e, n), e !== s.READY && t && y(l.REMOVE_LISTENER, e, n.element))
}
}, R(r.prototype, _(a)), R(r.prototype, _(c), !0)
}, function(e, t) {
t.api = {
LOAD_PROGRESS: "loadProgress",
PLAY_PROGRESS: "playProgress",
PLAY: "play",
PAUSE: "pause",
FINISH: "finish",
SEEK: "seek",
READY: "ready",
OPEN_SHARE_PANEL: "sharePanelOpened",
CLICK_DOWNLOAD: "downloadClicked",
CLICK_BUY: "buyClicked",
ERROR: "error"
}, t.bridge = {
REMOVE_LISTENER: "removeEventListener",
ADD_LISTENER: "addEventListener"
}
}, function(e, t) {
e.exports = {
GET_VOLUME: "getVolume",
GET_DURATION: "getDuration",
GET_POSITION: "getPosition",
GET_SOUNDS: "getSounds",
GET_CURRENT_SOUND: "getCurrentSound",
GET_CURRENT_SOUND_INDEX: "getCurrentSoundIndex",
IS_PAUSED: "isPaused"
}
}, function(e, t) {
e.exports = {
PLAY: "play",
PAUSE: "pause",
TOGGLE: "toggle",
SEEK_TO: "seekTo",
SET_VOLUME: "setVolume",
NEXT: "next",
PREV: "prev",
SKIP: "skip"
}
}]);
//# sourceMappingURL=http://ent/web-sourcemaps/api.js-27d0ec1de3c5.map
const widget = SC.Widget(document.getElementById('track'));
const playBtn = document.getElementById("playRadio");
playBtn.addEventListener('click', function(e) {
e.preventDefault();
widget.toggle();
});
function myFunction(x) {
x.classList.toggle("fa-stop");
}
widget.getCurrentSoundIndex(function(sound) {
console.log(sound.title);
});
#playRadio {
font-size: 72px;
width: 50%;
text-align: center;
padding: 40px;
}
<!DOCTYPE html>
<html>
<head>
<script src="https://kit.fontawesome.com/0b1431f7fb.js" crossorigin="anonymous"></script>
</head>
<body>
<i id="playRadio" onclick="myFunction(this)" class="fas fa-play"></i>
<iframe id="track" width="100%" height="166" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/249593158&color=ff5500&auto_play=false&hide_related=false&show_comments=true&show_user=true&show_reposts=false"></iframe>
</body>
</html>
calling a function inside mongoose hook 'post save' returns same doc
In my schema I'm having a post save hook like
DateInfoSchema.post('save', function (doc) {
var newDoc = helper. getListTimeRate(doc);
console.log(newDoc);
});
Then I'm having a helper module in that I'm having a function to calculate date range
lets consider 'doc' startdate and enddate so I want to calculate date range from start date to enddate
module.exports = {
getListTimeRate: function (data, yearEndDate) {
var toDate = new Date(),
weekName = ["Sun","Mon","Tue","Wed","Thu","Fri","Sat"];
Date.prototype.addDays = function(days) {
var dateAdd = new Date(this.valueOf());
dateAdd.setDate(dateAdd.getDate() + days);
return dateAdd;
};
function getDates(startDate, stopDate) {
var dateArray = [];
var currentDate = startDate;
if (currentDate == undefined){
while (currentDate <= stopDate) {
dateArray.push(currentDate);
currentDate = currentDate.addDays(1);
}
return dateArray;
}else {
var newCurrentDate = new Date(currentDate.toISOString().substr(0,10));
var newStopDate = new Date(stopDate.toISOString().substr(0,10));
while (newCurrentDate <= newStopDate) {
dateArray.push(newCurrentDate);
newCurrentDate = newCurrentDate.addDays(1);
}
return dateArray;
}
}
function calcRange(entry) {
// function get time
var dateList = [],
newList = [];
if (toDate < entry.endDate) {
// calc from endDate
newList = getDates(entry.startDate, entry.endDate);
//status often
selectDateFromOften();
} else {
if (yearEndDate) {
newList = getDates(entry.startDate, entry.endDate);
} else {
newList = getDates(entry.startDate, toDate);
}
// calc from toDate
//status often
selectDateFromOften();
}
function getDateTimeAnother() {
if (entry.hour) {
var setHour = entry.hour.getHours(),
setMin = entry.hour.getMinutes(),
setSecond = entry.hour.getSeconds();
}
dateList.forEach(function(entryDate){
entryDate.setHours(setHour);
entryDate.setMinutes(setMin);
entryDate.setSeconds(setSecond);
});
entry.rangeDate = dateList;
var compareUsedDate = [];
_.forEach(entry.frequencyId, function(value) {
compareUsedDate.push(value.dateRated);
});
entry.rangeDate = _.differenceBy(entry.rangeDate, compareUsedDate,Math.floor);
entry.rangeDate = entry.rangeDate.filter(function( element ) {
return element !== undefined;
});
console.log(dateList);
if (yearEndDate) {
return dateList;
}
}
function selectDateFromOften() {
switch(entry.oftenStatus) {
// Daily
case "0":
for (var i = 0; i< newList.length; i++) {
dateList.push(newList[i]);
}
getDateTimeAnother();
break;
//Weekly
case "1":
for (var i = 0; i< newList.length; i++) {
if (i == 0 || i % 7 == 0) {
dateList.push(newList[i]);
}
}
getDateTimeAnother();
break;
//Bi-Weekly
case "2":
for (var i = 0; i< newList.length; i++) {
if (i == 0 || i % 14 == 0) {
dateList.push(newList[i]);
}
}
getDateTimeAnother();
break;
//Monthly
case "3":
// for (var i = newList.length-1; i >= 0; i--) {
for (var i = 0; i< newList.length; i++) {
if (i == 0 || i % 28 == 0) {
dateList.push(newList[i]);
}
}
getDateTimeAnother();
break;
//Custom Date
case "4":
dateList = newList;
getDateCustom();
break;
default:
}
}
}
if (data.length) {
_.forEach(data, function(entry) {
if(entry.startDate != undefined){
calcRange(entry);
}
});
} else {
if(data.startDate != undefined){
calcRange(data);
}
}
return data;
}
};
But inside the hook 'newDoc' doesn't have 'rangeDate' field in it. Can anyone help me solve this issue? Thank you.
Ripple exchanges websocket equivalent for ripple data apiv2
I'm trying to get the exchanges in ripple and I found this data API and its working. But I want to use the ripple websocket tool for some reasons. Is there any websocket equivalent for this data API?
I think there is equivalent if you use "tx_history" command in the socket but Sorry to tell you that the json result are not equal to your specific data result.
ripple data apiv2 is being played by ajax. see the result json formatter in ripple for exchange:
} else if (resp.rows.length) {
resp.rows[0] = {
base_currency: resp.rows[0].base_currency,
base_issuer: resp.rows[0].base_issuer,
base_amount: resp.rows[0].base_amount,
counter_amount: resp.rows[0].counter_amount,
counter_currency: resp.rows[0].counter_currency,
counter_issuer: resp.rows[0].counter_issuer,
rate: resp.rows[0].rate,
executed_time: resp.rows[0].executed_time,
ledger_index: resp.rows[0].ledger_index,
buyer: resp.rows[0].buyer,
seller: resp.rows[0].seller,
taker: resp.rows[0].taker,
provider: resp.rows[0].provider,
autobridged_currency: resp.rows[0].autobridged_currency,
autobridged_issuer: resp.rows[0].autobridged_issuer,
offer_sequence: resp.rows[0].offer_sequence,
tx_type: resp.rows[0].tx_type,
tx_index: resp.rows[0].tx_index,
node_index: resp.rows[0].node_index,
tx_hash: resp.rows[0].tx_hash
};
}
res.csv(resp.rows, filename);
} else {
res.json({
result: 'success',
count: resp.rows.length,
marker: resp.marker,
exchanges: resp.rows
});
} }
and it can be only access by get url :
route: '/v2/exchanges/{:base}/{:counter}'
that is bind in there server.js:
app.get('/v2/exchanges/:base/:counter', routes.getExchanges);
and last hint this is their database query using hbase:
HbaseClient.getExchanges = function (options, callback) {
var base = options.base.currency + '|' + (options.base.issuer || '');
var counter = options.counter.currency + '|' + (options.counter.issuer
||''); var table;
var keyBase;
var startRow;
var endRow;
var descending;
var columns;
if (counter.toLowerCase() > base.toLowerCase()) {
keyBase = base + '|' + counter;
} else {
keyBase = counter + '|' + base;
options.invert = true; }
if (!options.interval) {
table = 'exchanges';
descending = options.descending ? true : false;
options.unreduced = true;
//only need certain columns
if (options.reduce) {
columns = [
'd:base_amount',
'd:counter_amount',
'd:rate',
'f:executed_time',
'f:buyer',
'f:seller',
'f:taker'
];
}
} else if (exchangeIntervals.indexOf(options.interval) !== -1) {
keyBase = options.interval + '|' + keyBase;
descending = options.descending ? true : false;
table = 'agg_exchanges';
} else {
callback('invalid interval: ' + options.interval);
return; }
startRow = keyBase + '|' + options.start.hbaseFormatStartRow();
endRow = keyBase + '|' + options.end.hbaseFormatStopRow();
if (options.autobridged) {
options.filterstring = "DependentColumnFilter('f', 'autobridged_currency')";
if (columns) {
columns.push('f:autobridged_currency');
} }
this.getScanWithMarker(this, {
table: table,
startRow: startRow,
stopRow: endRow,
marker: options.marker,
limit: options.limit,
descending: descending,
columns: columns,
filterString: options.filterstring }, function (err, resp) {
if (!resp) {
resp = {rows: []};
}
if (!resp.rows) {
resp.rows = [];
}
if (options.reduce && options.unreduced) {
if (descending) {
resp.rows.reverse();
}
resp.reduced = reduce(resp.rows);
} else if (table === 'exchanges') {
resp.rows = formatExchanges(resp.rows);
} else {
resp.rows = formatAggregates(resp.rows);
}
callback(err, resp); });
/** * formatExchanges */
function formatExchanges (rows) {
rows.forEach(function(row) {
var key = row.rowkey.split('|');
delete row.base_issuer;
delete row.base_currency;
delete row.counter_issuer;
delete row.counter_currency;
row.base_amount = parseFloat(row.base_amount);
row.counter_amount = parseFloat(row.counter_amount);
row.rate = parseFloat(row.rate);
row.offer_sequence = Number(row.offer_sequence || 0);
row.ledger_index = Number(row.ledger_index);
row.tx_index = Number(key[6]);
row.node_index = Number(key[7]);
row.time = utils.unformatTime(key[4]).unix();
});
if (options.invert) {
rows = invertPair(rows);
}
return rows; }
/** * formatAggregates */
function formatAggregates (rows) {
rows.forEach(function(row) {
var key = row.rowkey.split('|');
row.base_volume = parseFloat(row.base_volume),
row.counter_volume = parseFloat(row.counter_volume),
row.buy_volume = parseFloat(row.buy_volume),
row.count = Number(row.count);
row.open = parseFloat(row.open);
row.high = parseFloat(row.high);
row.low = parseFloat(row.low);
row.close = parseFloat(row.close);
row.vwap = parseFloat(row.vwap);
row.close_time = Number(row.close_time);
row.open_time = Number(row.open_time);
});
if (options.invert) {
rows = invertPair(rows);
}
return rows; }
/** * if the base/counter key was inverted, we need to swap * some of the values in the results */
function invertPair (rows) {
var swap;
var i;
if (options.unreduced) {
for (i=0; i<rows.length; i++) {
rows[i].rate = 1/rows[i].rate;
//swap base and counter vol
swap = rows[i].base_amount;
rows[i].base_amount = rows[i].counter_amount;
rows[i].counter_amount = swap;
//swap buyer and seller
swap = rows[i].buyer;
rows[i].buyer = rows[i].seller;
rows[i].seller = swap;
}
} else {
for (i=0; i<rows.length; i++) {
//swap base and counter vol
swap = rows[i].base_volume;
rows[i].base_volume = rows[i].counter_volume;
rows[i].counter_volume = swap;
//swap high and low
swap = 1/rows[i].high;
rows[i].high = 1/rows[i].low;
rows[i].low = swap;
//invert open, close, vwap
rows[i].open = 1/rows[i].open;
rows[i].close = 1/rows[i].close;
rows[i].vwap = 1/rows[i].vwap;
//invert buy_volume
rows[i].buy_volume /= rows[i].vwap;
}
}
return rows; }
/** * reduce * reduce all rows */
function reduce (rows) {
var buyVolume = 0;
var reduced = {
open: 0,
high: 0,
low: Infinity,
close: 0,
base_volume: 0,
counter_volume: 0,
buy_volume: 0,
count: 0,
open_time: 0,
close_time: 0
};
rows = formatExchanges(rows);
// filter out small XRP amounts
rows = rows.filter(function(row) {
if (options.base.currency === 'XRP' && row.base_amount < 0.0005) {
return false;
} else if (options.counter.currency === 'XRP' && row.counter_amount < 0.0005) {
return false;
} else {
return true;
}
});
if (rows.length) {
reduced.open_time = moment.unix(rows[0].time).utc().format();
reduced.close_time = moment.unix(rows[rows.length-1].time).utc().format();
reduced.open = rows[0].rate;
reduced.close = rows[rows.length -1].rate;
reduced.count = rows.length;
} else {
reduced.low = 0;
return reduced;
}
rows.forEach(function(row) {
reduced.base_volume += row.base_amount;
reduced.counter_volume += row.counter_amount;
if (row.rate < reduced.low) reduced.low = row.rate;
if (row.rate > reduced.high) reduced.high = row.rate;
if (row.buyer === row.taker) {
reduced.buy_volume += row.base_amount;
}
});
reduced.vwap = reduced.counter_volume / reduced.base_volume;
return reduced; } };
Maybe you should make a custom websocket that make your RPC call upgrade to 1.1 http protocol (ws).
In nodejs you can simply
// for http
var http = require('http');
// for websocket
var ws = require("nodejs-websocket")
var options = {
host: 'URL-RPC-HERE',
port: '80',
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
'Content-Length': post_data.length
}
};
var req = http.request(options, function(res) {
// after getting the response wich is the <res>
// we can upgrade it to ws
upToWebsocket(res);
});
//Upgrade to websocket
var upToWebsocket = function(json) {
var server = ws.createServer(function (conn) {
conn.on("json", function (str) {
conn.sendText(str.toUpperCase()+"!!!")
})
conn.on("close", function (code, reason) {
console.log("Connection closed")
})
}).listen(8001)
}
And also if you have Rippled running on a server this does not help because there's no RPC or WS that supports exchange API.
How to get the video ended event in titanium appcelerator
I have load video url at run time using the setInterval() before assign video i am try to clear the setinterval
Also have used onComplete="donextcall" for assingn new video path to videoview but it fire twice so please help me
<VideoPlayer id="videoPlayersinglezone" ns="Ti.Media" autoplay="true" height="100%" width="100%" onComplete="donextcall" url="" backgroundColor="black" />
var f = Ti.Filesystem.getFile(Ti.Filesystem.externalStorageDirectory +'SinglezoneData/', singleimgs[tempcall]);
clearInterval(x)
$.videoPlayersinglezone.url = f.nativePath;
$.videoPlayersinglezone.show();
I have using titanium 3.1.1 and alloy 1.2.2 anything missing please tell me.
Full code example
var common = require('common');
var singleimgs = [];
var fistentry = 0;
doFirstClickSingleZone();
function doFirstClickSingleZone() {
var totalads = Titanium.App.Properties.getString('total_files_on_sdcard');
$.videoPlayersinglezone.mediaControlStyle = Titanium.Media.VIDEO_CONTROL_HIDDEN;
LoadData(totalads);
}
function LoadData(adscount) {
var fistcall = 0;
for (var i = 0; i < adscount; i++) {
singleimgs[i] = Titanium.App.Properties.getString('dwnfname' + i);
}
}
var tempcall=0;
function donextcall() {
/*
fistentry++;
if (fistentry % 2 == 0) {
} else {
tempcall++;
RenderAd(tempcall);
}
*/
tempcall++;
RenderAd(tempcall);
}
function RenderAd(imgid) {
if (imgid == singleimgs.length) {
tempcall = 0;
} else {
tempcall= imgid;
}
var t = Titanium.App.Properties.getString('timeInt');
var x = setInterval(function() {
if (tempcall < singleimgs.length) {
var arry = [];
arry = singleimgs[tempcall].split(".");
var exte;
exte = arry[arry.length - 1];
if (exte == 'png' || exte == 'jpg' || exte == 'gif' || exte == 'jpeg' || exte == 'tif') {
common.getnotification();
$.videoPlayersinglezone.url = "";
$.videoPlayersinglezone.hide();
var f = Ti.Filesystem.getFile(Ti.Filesystem.externalStorageDirectory +'SinglezoneData/', singleimgs[tempcall]);
$.myImg.image = f.nativePath;
$.myImg.show();
tempcall++;
} else {
//if(exte=='mp4' || exte=='avi' || exte=='3gp' || exte=='mov' || exte == 'flv'){
common.getnotification();
var f = Ti.Filesystem.getFile(Ti.Filesystem.externalStorageDirectory +'SinglezoneData/', singleimgs[tempcall]);
//Titanium.App.Properties.setString('videopath', f.nativePath);
//Titanium.App.Properties.setString('imgcount', tempcall++);
$.myImg.image = '';
$.myImg.hide();
clearInterval(x);
$.videoPlayersinglezone.url = f.nativePath;
$.videoPlayersinglezone.show();
}
} else {
common.getnotification();
clearInterval(x);
callAgain();
}
}, 10000);
}
//this callaAgain() I have use to call RenderAd(imgid) to display image or video randomly so u have any solution please help me my application aim to display image or video from sdcard randomly
function callAgain() {
RenderAd(singleimgs.length);
}
Having issues with moving div
I am trying to create a 300px by 300 px div box that moves with mouse. The only thing is when the visitor click on div it disappear. Any help would be greatly appreciated.
if((document.getElementById) && window.addEventListener ||
window.attachEvent){ (function(){ var hairCol = "#ff0000";
var d = document; var my = -10; var mx = -10; var r; var
vert = "";
var idx = document.getElementsByTagName('div').length;
var thehairs = "<div id='theiframe' scrolling='no'
style='position:absolute;width:53px;height:23px;overflow:hidden;border:0;opacity:"
+ opacity +";filter:alpha(opacity=" + opacity * 100+ ");'>dsdsds"; document.write(thehairs); var like =
document.getElementById("theiframe");
document.getElementsByTagName('body')[0].appendChild(like);
var pix = "px"; var domWw = (typeof window.innerWidth ==
"number"); var domSy = (typeof window.pageYOffset == "number");
if (domWw) r = window; else{ if (d.documentElement &&
typeof d.documentElement.clientWidth == "number" &&
d.documentElement.clientWidth != 0)
r = d.documentElement; else{
if (d.body && typeof d.body.clientWidth == "number")
r = d.body; } }
if(time != 0){ setTimeout(function(){
document.getElementsByTagName('body')[0].removeChild(like);
if (window.addEventListener){
document.removeEventListener("mousemove",mouse,false);
}
else if (window.attachEvent){
document.detachEvent("onmousemove",mouse);
}
}, time); }
function scrl(yx){ var y,x; if (domSy){
y = r.pageYOffset;
x = r.pageXOffset; } else{
y = r.scrollTop;
x = r.scrollLeft; } return (yx == 0) ? y:x; }
function mouse(e){ var msy = (domSy)?window.pageYOffset:0; if
(!e)
e = window.event; if (typeof e.pageY == 'number'){
my = e.pageY - 5 - msy;
mx = e.pageX - 4; } else{
my = e.clientY - 6 - msy;
mx = e.clientX - 6; } vert.top = my + scrl(0) + pix; vert.left = mx + pix; }
function ani(){ vert.top = my + scrl(0) + pix; setTimeout(ani,
300); }
function init(){ vert =
document.getElementById("theiframe").style; ani(); } if
(window.addEventListener){
window.addEventListener("load",init,false);
document.addEventListener("mousemove",mouse,false); } else if
(window.attachEvent){ window.attachEvent("onload",init);
document.attachEvent("onmousemove",mouse); }
})();
}//End.