package Ġcom . github . ch os am uel . k ish i be . ui Ċ Ċ import Ġcom . github . ch os am uel . k ish i be . svg . sv gn s Ċ import Ġkotlinx . browser . document Ċ import Ġkotlinx . browser . window Ċ import Ġorg . w 3 c . dom . svg . SVG Element Ċ Ċ open Ġclass ĠBase UI Ġ{ ĊĠĠĠ Ġval ĠUI Ġ= Ġdocument . createElement NS ( sv gn s ," svg ") ĊĠĠĠ Ġvar Ġwidth Ġ= Ġwindow . innerWidth ĊĠĠĠ Ġvar Ġheight Ġ= Ġwindow . innerHeight ĊĠĠĠ Ġvar ĠonClick Outer Ġ= Ġ{} ĊĠĠĠ Ġvar Ġon Release Outer Ġ= Ġ{} ĊĊĠĠĠ Ġinit Ġ{ ĊĠĠĠĠĠĠĠ ĠUI . setAttribute (" width "," ${ width }") ĊĠĠĠĠĠĠĠ ĠUI . setAttribute (" height "," ${ height }") ĊĠĠĠĠĠĠĠ ĠUI . setAttribute (" style "," position : Ġabsolute ; top : 0 ; left : 0 ; ") ĊĠĠĠĠĠĠĠ Ġ/** ĊĠĠĠĠĠĠĠ ĠUI Ġcurrently Ġblocks Ġout Ġcanvas Ġmouse Ġevents Ġbecause Ġit Ġis Ġfull Ġsized . ĊĠĠĠĠĠĠĠ ĠSo Ġadding Ġevent Ġlisteners Ġto Ġthe ĠSVG Ġblock Ġitself Ġis Ġa Ġhack Ġfor Ġnow . ĊĠĠĠĠĠĠĠ ĠNeed Ġto Ġdeclare Ġonclick Ġlambda Ġin Ġdrawer Ġclass Ġfor Ġthe ĠUI . ĊĠĠĠĠĠĠĠ ĠPerhaps Ġin Ġthe Ġfuture , Ġuse Ġdrawer Ġclass Ġto Ġappend Ġthe ĠUI Ġand Ġfill ĊĠĠĠĠĠĠĠ Ġthe ĠonClick Ġfrom Ġthere . ĊĠĠĠĠĠĠĠĠ Ġ*/ ĊĠĠĠĠĠĠĠ ĠUI . addEventListener (" mousedown ", { ĊĠĠĠĠĠĠĠĠĠĠĠ Ġval Ġtgt Ġ= Ġit . target Ġas ĠSVG Element ĊĠĠĠĠĠĠĠĠĠĠĠ Ġif (! tgt . classList . contains (" btn ")){ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠonClick Outer () ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġ}) ĊĠĠĠĠĠĠĠ ĠUI . addEventListener (" touch start ", { ĊĠĠĠĠĠĠĠĠĠĠĠ Ġval Ġtgt Ġ= Ġit . target Ġas ĠSVG Element ĊĠĠĠĠĠĠĠĠĠĠĠ Ġif (! tgt . classList . contains (" btn ")){ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠonClick Outer () ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġ}) ĊĠĠĠĠĠĠĠ ĠUI . addEventListener (" mouseup ", { ĊĠĠĠĠĠĠĠĠĠĠĠ Ġval Ġtgt Ġ= Ġit . target Ġas ĠSVG Element ĊĠĠĠĠĠĠĠĠĠĠĠ Ġif (! tgt . classList . contains (" btn ")){ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġon Release Outer () ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġ}) ĊĠĠĠĠĠĠĠ ĠUI . addEventListener (" mouse leave ", { ĊĠĠĠĠĠĠĠĠĠĠĠ Ġval Ġtgt Ġ= Ġit . target Ġas ĠSVG Element ĊĠĠĠĠĠĠĠĠĠĠĠ Ġif (! tgt . classList . contains (" btn ")){ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġon Release Outer () ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġ}) ĊĠĠĠĠĠĠĠ ĠUI . addEventListener (" touch end ", { ĊĠĠĠĠĠĠĠĠĠĠĠ Ġval Ġtgt Ġ= Ġit . target Ġas ĠSVG Element ĊĠĠĠĠĠĠĠĠĠĠĠ Ġif (! tgt . classList . contains (" btn ")){ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġon Release Outer () ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġ}) ĊĠĠĠĠĠĠĠ ĠUI . addEventListener (" touch cancel ", { ĊĠĠĠĠĠĠĠĠĠĠĠ Ġval Ġtgt Ġ= Ġit . target Ġas ĠSVG Element ĊĠĠĠĠĠĠĠĠĠĠĠ Ġif (! tgt . classList . contains (" btn ")){ ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġon Release Outer () ĊĠĠĠĠĠĠĠĠĠĠĠ Ġ} ĊĠĠĠĠĠĠĠ Ġ}) ĊĠĠĠ Ġ} ĊĠĠĠ Ġfun Ġset Width ( w : ĠDouble ){ ĊĠĠĠĠĠĠĠ ĠUI . setAttribute (" width "," ${ w }") ĊĠĠĠ Ġ} ĊĠĠĠ Ġfun Ġset Height ( h : ĠDouble ){ ĊĠĠĠĠĠĠĠ ĠUI . setAttribute (" height "," ${ h }") ĊĠĠĠ Ġ} ĊĠĠĠ Ġfun Ġset Position ( x : ĠDouble , Ġy : ĠDouble ){ ĊĠĠĠĠĠĠĠ ĠUI . setAttribute (" style "," position : Ġabsolute ; top :$ y ; left :$ x ; ") ĊĠĠĠ Ġ} ĊĊĠĠĠ Ġfun Ġappend To Document (){ ĊĠĠĠĠĠĠĠ Ġdocument . body ?. appendChild ( UI ) ĊĠĠĠ Ġ} Ċ }