Browse Source

moved main login into separate file

pull/24/head
Guillermo 10 years ago
parent
commit
e23d75f0a9
  1. 131
      index.html
  2. 129
      main.js

131
index.html

@ -69,136 +69,7 @@ @@ -69,136 +69,7 @@
-->
<script src="https://rawgit.com/naptha/tesseract.js/master/lib/Tesseract.js"></script>
<script>
var prog = document.getElementById('prog')
var out = document.getElementById('out')
var disp = document.getElementById('display')
var dctx = disp.getContext('2d')
disp.width = 0
disp.height = 0
document.getElementById('runbutton').onclick = function(){
setrunning(0)
run(myCodeMirror)
}
function show_progress(p){
if(p.loaded_lang_model) prog.value = p.loaded_lang_model
if(p.recognized) prog.value = p.recognized
setrunning(p.recognized)
out.innerText = JSON.stringify(p)
}
function setrunning(v){
if (v == 1) {
document.getElementById('running').style.display = 'none'
document.getElementById('run').style.display = 'block'
// out.style.visibility = 'hidden'
}
else {
document.getElementById('running').style.display = 'block'
document.getElementById('run').style.display = 'none'
}
}
function display(result) {
console.log(result)
disp.width = document.getElementById('to_ocr').naturalWidth
disp.height = document.getElementById('to_ocr').naturalHeight
disp.style.width = document.getElementById('to_ocr').offsetWidth
disp.style.height = document.getElementById('to_ocr').offsetHeight
dctx.shadowColor = "#fff"
dctx.shadowOffsetX = 0;
dctx.shadowOffsetY = 0;
dctx.shadowBlur = 10;
var m = result.words.map(function(w){
var b = w.bbox
var k = (function(){
dctx.font = '20px Comic Sans MS'
dctx.font = 20*(b.x1-b.x0)/dctx.measureText(w.text).width+"px Comic Sans MS"
// dctx.fillStyle="rgba(255,255,255,.01)"
// dctx.fillRect(b.x0,b.y0,b.x1-b.x0, b.y1-b.y0)
dctx.fillStyle="rgba(255,0,255,.1)"
dctx.fillText(w.text, b.x0, w.baseline.y0);
// dctx.strokeStyle = "rgba(255,255,255,.1)"
// dctx.strokeText(w.text, b.x0, w.baseline.y0);
})
// k()
return k
})
var times = 0
function draw(i){
times++
for (var j = 0; j < i; j++) {
m[j]()
};
if(times<200){
setTimeout(function(){
if(i+1<m.length){
draw(i+1)
}
else {
draw(i)
}
},10)
}
else{
console.log('done')
}
}
draw(0)
}
window.onresize = function() {
disp.style.width = document.getElementById('to_ocr').offsetWidth
disp.style.height = document.getElementById('to_ocr').offsetHeight
}
function run(c){
eval(c.getValue())
}
var val =
"var img = document.querySelector('img#to_ocr')\n\
\n\
Tesseract\n\
.recognize( img, {progress: show_progress} )\n\
.then( display )"
var myCodeMirror = CodeMirror(document.getElementById('editor'),{
// lineNumbers: true,
viewportMargin: Infinity,
value: val
});
var img = document.getElementById('to_ocr')
if (img.complete) {
run(myCodeMirror)
} else{
img.onload = function(){
run(myCodeMirror)
}
}
</script>
<script src="main.js"></script>
<script src="animation/raf.js"></script>
<script src="animation/mouse.js"></script>

129
main.js

@ -0,0 +1,129 @@ @@ -0,0 +1,129 @@
var prog = document.getElementById('prog')
var out = document.getElementById('out')
var disp = document.getElementById('display')
var dctx = disp.getContext('2d')
disp.width = 0
disp.height = 0
document.getElementById('runbutton').onclick = function(){
setrunning(0)
run(myCodeMirror)
}
function show_progress(p){
if(p.loaded_lang_model) prog.value = p.loaded_lang_model
if(p.recognized) prog.value = p.recognized
setrunning(p.recognized)
out.innerText = JSON.stringify(p)
out.innerText = JSON.stringify(p)
}
function setrunning(v){
if (v == 1) {
document.getElementById('running').style.display = 'none'
document.getElementById('run').style.display = 'block'
// out.style.visibility = 'hidden'
}
else {
document.getElementById('running').style.display = 'block'
document.getElementById('run').style.display = 'none'
}
}
function display(result) {
console.log(result)
disp.width = document.getElementById('to_ocr').naturalWidth
disp.height = document.getElementById('to_ocr').naturalHeight
disp.style.width = document.getElementById('to_ocr').offsetWidth
disp.style.height = document.getElementById('to_ocr').offsetHeight
dctx.shadowColor = "#fff"
dctx.shadowOffsetX = 0;
dctx.shadowOffsetY = 0;
dctx.shadowBlur = 10;
var m = result.words.map(function(w){
var b = w.bbox
var k = (function(){
dctx.font = '20px Comic Sans MS'
dctx.font = 20*(b.x1-b.x0)/dctx.measureText(w.text).width+"px Comic Sans MS"
// dctx.fillStyle="rgba(255,255,255,.01)"
// dctx.fillRect(b.x0,b.y0,b.x1-b.x0, b.y1-b.y0)
dctx.fillStyle="rgba(255,0,255,.1)"
dctx.fillText(w.text, b.x0, w.baseline.y0);
// dctx.strokeStyle = "rgba(255,255,255,.1)"
// dctx.strokeText(w.text, b.x0, w.baseline.y0);
})
// k()
return k
})
var times = 0
function draw(i){
times++
for (var j = 0; j < i; j++) {
m[j]()
};
if(times<200){
setTimeout(function(){
if(i+1<m.length){
draw(i+1)
}
else {
draw(i)
}
},10)
}
else{
console.log('done')
}
}
draw(0)
}
window.onresize = function() {
disp.style.width = document.getElementById('to_ocr').offsetWidth
disp.style.height = document.getElementById('to_ocr').offsetHeight
}
function run(c){
eval(c.getValue())
}
var val =
"var img = document.querySelector('img#to_ocr')\n\
\n\
Tesseract\n\
.recognize( img, {progress: show_progress} )\n\
.then( display )"
var myCodeMirror = CodeMirror(document.getElementById('editor'),{
// lineNumbers: true,
viewportMargin: Infinity,
value: val
});
var img = document.getElementById('to_ocr')
if (img.complete) {
run(myCodeMirror)
} else{
img.onload = function(){
run(myCodeMirror)
}
}
Loading…
Cancel
Save