garrett/BattysPriceCheck
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

GUI front end for reading text from arbitrary points

Browse Source
This commit is contained in:
Garrett Woodford
2023-09-28 14:48:20 -05:00
parent b09fc5af11
commit 398db10e6b
4 changed files with 82 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@@ -1,2 +1,3 @@
*.swp *.swp
node_modules node_modules
*.png

13
server.js
View File

@@ -19,13 +19,14 @@ var puppeteer = require("puppeteer");
const { createWorker } = require("tesseract.js"); const { createWorker } = require("tesseract.js");
const pug = require('pug'); // const pug = require('pug');
const { exec } = require('child_process'); const { exec } = require('child_process');
const path = require('path'); const path = require('path');
app.set('view engine', "pug") app.set('view engine', "pug")
app.use("/images", express.static(path.join(__dirname, '/images'))); // app.use("/images", express.static(path.join(__dirname, '/images')));
app.use("/images", express.static(path.join(__dirname, "/savedImages")));
app.use("/static", express.static(path.join(__dirname, "/static"))); app.use("/static", express.static(path.join(__dirname, "/static")));
const baseFilePath = "./savedImages"; const baseFilePath = "./savedImages";
@@ -34,6 +35,10 @@ app.get('/', function (req, res) {
res.send('Hello World'); res.send('Hello World');
}); });
app.get("/upload", function(req, res){
res.sendFile(path.join( __dirname, "views/Upload.html"));
});
app.get("/takeScreenshot", async function(req, res){ app.get("/takeScreenshot", async function(req, res){
let url = req.query["url"]; let url = req.query["url"];
let name = req.query["name"]; let name = req.query["name"];
@@ -63,17 +68,19 @@ app.get("/getValueFromImage", async function(req, res){
let width = req.query["width"];//75 let width = req.query["width"];//75
let height = req.query["height"];//30 let height = req.query["height"];//30
console.log("Loading Image");
const img = fs.readFileSync(`${baseFilePath}/${name}.png`); const img = fs.readFileSync(`${baseFilePath}/${name}.png`);
const worker = await createWorker("eng"); const worker = await createWorker("eng");
const rectangle = { left: left, top: top, width: width, height: height }; const rectangle = { left: left, top: top, width: width, height: height };
let myText = "Default"; console.log(JSON.stringify(rectangle));
(async () => { (async () => {
const { const {
data: { text }, data: { text },
} = await worker.recognize(img, } = await worker.recognize(img,
{ rectangle } { rectangle }
); );
console.log("Found Price!");
res.send(text); res.send(text);
res.end(); res.end();
console.log(text); console.log(text);

2
static/jquery-3.7.1.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

69
views/Upload.html Normal file
View File

@@ -0,0 +1,69 @@
<html>
<head>
<script src="../static/jquery-3.7.1.min.js"></script>
<script>
</script>
</head>
<form id="mainForm">
URL: <input type="text" id="url" />
Name: <input type="text" id="name" />
<input type="submit" id="submitURLButton" title="submit" />
</form>
<form id="coordsForm">
Top:<input type="text" id="top"/>
Left:<input type="text" id="left" />
Height:<input type="text" id="height" />
Width:<input type="text" id="width" />
</form>
<div id="finalPrice"></div>
<img src="" id="screenshot" />
<script>
(function (window, document, undefined) {
$("#mainForm").on("submit", function(event){
event.preventDefault();
let url = $("#url")[0].value;
let name = $("#name")[0].value;
console.log(`http://localhost:8001/takeScreenshot?name=${name}&url=${url}`);
$.ajax({
url: `http://localhost:8001/takeScreenshot?name=${name}&url=${url}`,
}).done(function(){
$("#screenshot")[0].src = `http://localhost:8001/images/${name}.png`;
});
});
$("#screenshot").click(function(event){
let offset = $(this).offset();
if($("#left")[0].value){
$("#height")[0].value = Math.floor((event.pageY - offset.top) - $("#top")[0].value);
$("#width")[0].value = Math.floor(event.pageX - offset.left) - ($("#left")[0].value);
let name = $("#name")[0].value;
let top = $("#top")[0].value;
let left = $("#left")[0].value;
let width = $("#width")[0].value;
let height = $("#height")[0].value;
let newUrl = `http://localhost:8001/getValueFromImage?name=${name}&top=${top}&left=${left}&height=${height}&width=${width}`;
console.log(`${newUrl}`);
$.ajax({
url: newUrl,
}).done(function (response) {
console.log("Found Price!!!");
$("#finalPrice")[0].innerText = response;
});
}else{
$("#left")[0].value = Math.floor(event.pageX - offset.left);
$("#top")[0].value = Math.floor(event.pageY - offset.top);
}
});
})(this, this.document);
</script>
</html>