jan/openreplay
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(tracker): fix mice svg size issue

Browse source
This commit is contained in:
sylenien 2022-09-20 14:35:04 +02:00
parent 3f4e421941
commit 93f1054ccd
1 changed files with 9 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
tracker/tracker-assist/src/Mouse.ts
View file

@ -7,18 +7,18 @@ export default class Mouse {
constructor(private readonly agentName?: string) {
this.mouse = document.createElement('div')
const agentBubble = document.createElement('div')
const svg ='<?xml version="1.0" encoding="utf-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="32" height="32" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 28 28" enable-background="new 0 0 28 28" xml:space="preserve"><polygon fill="#FFFFFF" points="8.2,20.9 8.2,4.9 19.8,16.5 13,16.5 12.6,16.6 "/><polygon fill="#FFFFFF" points="17.3,21.6 13.7,23.1 9,12 12.7,10.5 "/><rect x="12.5" y="13.6" transform="matrix(0.9221 -0.3871 0.3871 0.9221 -5.7605 6.5909)" width="2" height="8"/><polygon points="9.2,7.3 9.2,18.5 12.2,15.6 12.6,15.5 17.4,15.5 "/></svg>'
const svg ='<svg version="1.1" width="20" height="20" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" xml:space="" viewBox="8.2 4.9 11.6 18.2"><polygon fill="#FFFFFF" points="8.2,20.9 8.2,4.9 19.8,16.5 13,16.5 12.6,16.6 "></polygon><polygon fill="#FFFFFF" points="17.3,21.6 13.7,23.1 9,12 12.7,10.5 "></polygon><rect x="12.5" y="13.6" transform="matrix(0.9221 -0.3871 0.3871 0.9221 -5.7605 6.5909)" width="2" height="8"></rect><polygon points="9.2,7.3 9.2,18.5 12.2,15.6 12.6,15.5 17.4,15.5 "></polygon></svg>'
this.mouse.innerHTML = svg
this.mouse.setAttribute('data-openreplay-hidden', '')
Object.assign(agentBubble.style, {
position: 'absolute',
padding: '4px 6px',
borderRadius: '8px',
padding: '4px 5px',
borderRadius: '4px',
backgroundColor: '#394EFF',
color: 'white',
bottom: '-14px',
left: '55%',
bottom: '-20px',
left: '65%',
fontSize: '12px',
whiteSpace: 'nowrap',
})
@ -47,8 +47,10 @@ export default class Mouse {
this.position = pos
Object.assign(this.mouse.style, {
left: `${pos[0] || 0}px`,
top: `${pos[1] || 0}px`,
// we're moving it off by few pixels
// so the doc.elementFromPoint works
left: `${(pos[0] || 0) + 3}px`,
top: `${(pos[1] || 0) + 3}px`,
})
}