kj7rrv/hcra
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Convert client to use img

Browse Source 
Removing the tiling feature allowed me to switch the client to use img
instead of canvas.
This commit is contained in:
Samuel Sloniker 2021-07-16 16:42:52 -07:00
parent 798e0c34aa
commit 19fdad9153
2 changed files with 3 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
client/index.html
View File

@ -18,7 +18,7 @@
</div>
<div id=holder style="display:none">
<div id=errorbox style="width: 800px; height: 480px">Loading...</div>
<canvas id=canvas width=800 height=480 style="width: 800px; height: 480px; display: none"></canvas>
<img id=canvas width=800 height=480 style="width: 800px; height: 480px; display: none"></canvas>
</div>
<script src=js/main.js></script>
</body>

13
client/js/main.js
View File

@ -28,15 +28,8 @@ function setup() {
ws.send('pass ' + localStorage.getItem('password'))
setInterval(function(){ws.send('ack')}, 3000)
} else if ( type == 'pic' ) {
pos = e.data.split('%')[1]
x = Number(pos.split('x')[0])
y = Number(pos.split('x')[1])
data = e.data.split('%')[2]
img = new Image()
img.src = data
img.addEventListener("load", function(){
ctx.drawImage(img,x,y)
})
canvas.src = data
errorbox.style.display = 'none'
canvas.style.display = 'block'
} else if ( type == 'err' ) {
@ -100,7 +93,7 @@ function connect(e) {
}
let canvas = document.querySelector('canvas')
let canvas = document.querySelector('#canvas')
let errorbox = document.querySelector('#errorbox')
let login = document.querySelector('#login')
@ -113,8 +106,6 @@ let start_button = document.querySelector('#start')
let is_short = true
let click_timeout
let ctx = canvas.getContext("2d")
let displayWidth, displayHeight
let ws