{"version":3,"sources":["../node_modules/typescript/lib sync","utils/canvas.js","components/InputForm.jsx","App.js","index.js"],"names":["webpackEmptyContext","req","e","Error","code","keys","resolve","module","exports","id","loadImage","url","Promise","reject","img","Image","onload","onerror","console","log","src","draw","ctx","x","y","then","drawImage","drawLogo","width","height","p","marginX","marginY","sWidth","sHeight","dx","dy","dWidth","dHeight","createCanvas","homeLogo","awayLogo","homeScore","awayScore","homeScorePen","awayScorePen","onChange","canvas","document","querySelector","layer1","getContext","clearRect","font","fillStyle","fonts","load","all","home","away","homePen","awayPen","fillText","layer2","finalScore","dataUrl","toDataURL","sorter","a","b","name","InputForm","props","useForm","register","handleSubmit","setValue","formState","errors","fetchResult","axios","get","response","data","live","last","homeTeam","awayTeam","homeGoals","awayGoals","onSubmit","useEffect","homeTeamLogo","teams","find","t","awayTeamLogo","sort","map","type","min","max","defaultValue","onClick","App","useState","dataImage","setDataImage","className","rootElement","getElementById","ReactDOM","render"],"mappings":"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","file":"static/js/main.53fa913d.chunk.js","sourcesContent":["function webpackEmptyContext(req) {\n\tvar e = new Error(\"Cannot find module '\" + req + \"'\");\n\te.code = 'MODULE_NOT_FOUND';\n\tthrow e;\n}\nwebpackEmptyContext.keys = function() { return []; };\nwebpackEmptyContext.resolve = webpackEmptyContext;\nmodule.exports = webpackEmptyContext;\nwebpackEmptyContext.id = 21;","import { visitFunctionBody } from \"typescript\";\n\nconst loadImage = (url) => {\n return new Promise((resolve, reject) => {\n const img = new Image();\n img.onload = () => {\n resolve(img);\n };\n img.onerror = () => reject(console.log(`load ${url} fail`));\n img.src = url;\n });\n};\n\nconst draw = (ctx, src, x, y) => {\n return loadImage(src).then((img) => { \n ctx.drawImage(img, x, y);\n });\n};\n\nconst drawLogo = (ctx, src, x, y) => {\n return loadImage(src).then((img) => { \n const {width, height} = img; \n const max_height = 237;\n const max_width = 231;\n let p = 1;\n if(height > max_height){\n p = max_height / height;\n }\n if((width * p) > max_width) {\n p = max_width/ width;\n }\n console.log(width,height, p, width * p, height * p); \n const marginX = ((width * p) - max_width) / 2;\n const marginY = ((height * p) - max_height) / 2;\n console.log(marginX,marginY);\n const sx = 0;\n const sy = 0;\n const sWidth = width\n const sHeight = height;\n const dx = x - marginX;\n const dy = y - marginY;\n const dWidth = width * p;\n const dHeight = height * p; \n ctx.drawImage(img,sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight);\n });\n};\n\n\n\nconst createCanvas = (homeLogo, awayLogo, homeScore, awayScore, homeScorePen, awayScorePen,onChange) => {\n const canvas = document.querySelector(\"canvas\");\n const layer1 = canvas.getContext(\"2d\");\n layer1.clearRect(0, 0, canvas.width, canvas.height);\n layer1.font = \"italic 102px Rubik\";\n layer1.fillStyle = \"#fff\";\n document.fonts\n .load(\"italic 102px Rubik\")\n .then(() => draw(layer1, \"./assets/bg.png\", 0, 0))\n .then(() =>\n Promise.all([\n draw(layer1, \"./assets/ft-bg.png\", 203, 292),\n draw(layer1, \"./assets/right.png\", 899, 474),\n draw(layer1, \"./assets/left.png\", 0, 569),\n draw(layer1, \"./assets/vs.png\", 471, 583)\n ])\n )\n .then(() =>\n Promise.all([\n draw(layer1, \"./assets/ft.png\", 118, 311),\n //Logo Home\n drawLogo(layer1, `./assets/logos/${awayLogo}`, 205, 513),\n //Logo Away\n drawLogo(layer1, `./assets/logos/${homeLogo}`, 644, 513),\n ])\n )\n .then(() => {\n finalScore(homeScore, awayScore,homeScorePen, awayScorePen);\n })\n .then(() => {\n const dataUrl = canvas.toDataURL('image/png');\n onChange(dataUrl);\n });\n};\n\nfunction finalScore(home, away, homePen, awayPen) {\n const layer1 = document.querySelector(\"canvas\").getContext(\"2d\");\n layer1.fillText(away, 44, 685);\n //Away Score\n layer1.fillText(home, 950, 590);\n\n if(homePen + awayPen > 0){\n //Penelties \n const canvas = document.querySelector(\"canvas\");\n const layer2 = canvas.getContext(\"2d\"); \n layer2.clearRect(0, 0, 0, 0);\n layer2.font = \"italic 36px Rubik\";\n layer2.fillStyle = \"#fff\";\n layer2.fillText(`(${awayPen})`, 54, 720);\n //Away Score\n layer2.fillText(`(${homePen})`, 960, 625);\n }\n\n}\n\nfunction download() {\n const canvas = document.querySelector(\"canvas\");\n const dataUrl = canvas.toDataURL('image/png');\n const oldImg = document.querySelector('img');\n if(oldImg){\n oldImg.remove();\n }\n const img = document.createElement('img');\n img.src = dataUrl;\n document.body.appendChild(img); \n}\n\nexport { createCanvas };\n","import axios from \"axios\";\nimport { useEffect, useMemo } from \"react\";\nimport { useForm } from \"react-hook-form\";\nimport { setConstantValue, WatchFileKind } from \"typescript\";\nimport { createCanvas } from \"../utils/canvas\";\nimport teams from \"./teams.json\";\n\nconst sorter = (function(a,b) {return (a.name > b.name) ? 1 : ((b.name > a.name) ? -1 : 0);} );\n\nexport default function InputForm(props) {\n const {\n register,\n handleSubmit,\n setValue,\n formState: { errors }\n } = useForm();\n function fetchResult() {\n axios.get('https://live.hapoel.dev').then( (response) => {\n const { data } = response;\n const { homeTeam, awayTeam, homeGoals, awayGoals, } = (data.live || data.last);\n setValue('homeTeam', homeTeam);\n setValue('awayTeam', awayTeam);\n setValue('homeScore', homeGoals);\n setValue('awayScore', awayGoals);\n handleSubmit(onSubmit)();\n } )\n }\n\n useEffect(fetchResult,[]);\n\n const { onChange } = props;\n\n const onSubmit = (data) => {\n const { homeTeam, awayTeam, homeScore, awayScore, homeScorePen, awayScorePen } = data;\n const homeTeamLogo = teams.find((t) => t.name === homeTeam)?.url || \"\";\n const awayTeamLogo = teams.find((t) => t.name === awayTeam)?.url || \"\";\n createCanvas(homeTeamLogo, awayTeamLogo, homeScore, awayScore,homeScorePen, awayScorePen, onChange);\n };\n\n return (\n \n );\n}\n","import InputForm from \"./components/InputForm\";\nimport \"./styles.css\";\nimport { useState } from \"react\";\n\nexport default function App() {\n const [dataImage, setDataImage] = useState();\n return (\n \n
HPT Tempalte Generator
\n
\n
\n
\n