2022-06-18 22:01:43 +00:00
<!DOCTYPE html>
< html >
< head >
< meta charset = "utf-8" >
< meta http-equiv = "X-UA-Compatible" content = "IE=edge" >
< title > Dice Tool< / title >
< meta name = "viewport" content = "width=device-width, initial-scale=1" >
< link rel = "stylesheet" href = "style.css" >
< link href = "https://fonts.googleapis.com/icon?family=Material+Icons" rel = "stylesheet" >
< script src = "https://code.jquery.com/jquery-3.6.0.min.js" integrity = "sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin = "anonymous" > < / script >
< / head >
2022-06-19 16:53:01 +00:00
< body class = "compactMode" >
2022-06-18 22:01:43 +00:00
< div class = "headerBar" >
< div style = "float: left; text-align: left;" >
Dice Tool
< / div >
< div style = "float: right; text-align: right;" >
2022-06-19 16:53:01 +00:00
< button class = "material-icons toc" onclick = "document.body.classList.toggle('compactMode');" > build< / button >
2022-06-18 22:01:43 +00:00
< button class = "material-icons" onclick = "rollAllDie(cont)" > shuffle< / button >
< button class = "material-icons" onclick = "if (confirm('Are you sure you want to remove everything?')) $('.content').find('.die').remove()" > cancel< / button >
< / div >
< / div >
< div class = "fab" >
< button class = "material-icons" title = "Add Dice" onclick = "addDie(cont);" > add_circle< / button >
< button class = "material-icons" title = "Add Counter" onclick = "addDie(cont, 1, 'Counter', true);" > pin< / button >
< button class = "material-icons" title = "Add Bag" onclick = "addDieBag(cont);" > create_new_folder< / button >
< / div >
2022-06-18 22:51:24 +00:00
< div class = "content" ondrop = "drop(event)" ondragover = "allowDrop(event)" > < div class = "dropHere" > < / div > < / div >
2022-06-18 22:01:43 +00:00
< templates >
2022-06-18 22:42:00 +00:00
< template id = "dieUI" > < div class = "die rollable{IS_COUNTER}" id = "{RAND_ID}" draggable = "true" ondragstart = "drag(event)" >
2022-06-18 22:01:43 +00:00
< div >
2022-06-19 16:53:01 +00:00
< span class = "material-icons icon ident" > casino< / span > < input class = "title hos" placeholder = "Name" type = "text" value = "{TITLE_DIE}" onfocusout = "this.setAttribute('value', this.value);" / >
< input class = "die-color hos" type = "color" value = "transparent" onchange = "this.setAttribute('value', this.value);this.parentElement.parentElement.style.backgroundColor = this.value;" / >
< button class = "material-icons icon indi neg" onclick = "tp(this).remove()" > delete< / button > < br class = "hos" / >
2022-06-18 22:01:43 +00:00
< div class = "hideIfCounter" > < button class = "material-icons icon indi pos" title = "Roll die" onclick = "rollDie(ht(tpp(this)))" > shuffle< / button > < / div >
< / div >
< div style = "text-align: right;" >
2022-06-19 16:53:01 +00:00
< button class = "material-icons icon hos" onclick = "changeVal(ht($(this)), -1)" > remove< / button >
< button class = "material-icons icon hos" onclick = "changeVal(ht($(this)), 1)" > add< / button >
< span class = "hideIfCounter hos" > < button class = "material-icons icon" title = "Cut die to value" onclick = "cutVal(ht(tp(this)))" > content_cut< / button > < / span > < br / >
< span > < h2 class = "die-value" > {DIE_VALUE}< / h2 > < span class = "hideIfCounter hos" > / < input class = "die-sides" type = "number" min = "1" max = "10000" value = "{DIE_SIDES}" onfocusout = "this.setAttribute('value', this.value);" / > < / span > < / span >
2022-06-18 22:01:43 +00:00
< / div >
2022-06-18 22:42:00 +00:00
< / div > < / template >
< template id = "dieBagUI" > < div class = "die bag" id = "{RAND_ID}" draggable = "true" ondragstart = "drag(event)" >
2022-06-18 22:01:43 +00:00
< div >
2022-06-19 16:53:01 +00:00
< span class = "material-icons icon ident" > folder< / span > < input class = "title hos" placeholder = "Name" type = "text" value = "{TITLE_DIE}" onfocusout = "this.setAttribute('value', this.value);" / > < input class = "die-color hos" tabIndex = "0" type = "color" value = "transparent" onchange = "this.setAttribute('value', this.value);this.parentElement.parentElement.style.backgroundColor = this.value;" / >
< button class = "material-icons icon indi neg" onclick = "if (confirm('Are you sure you want to remove this bag?')) tp(this).remove()" > delete< / button > < br class = "hos" / >
2022-06-18 22:01:43 +00:00
< button class = "material-icons icon indi pos" title = "Roll all dies inside" onclick = "rollAllDie(ht(tp(this)))" > shuffle< / button >
2022-06-19 16:53:01 +00:00
< button class = "material-icons icon indi pos hos" title = "Add Dice" onclick = "addDie(tp(this).find('.dropHere').get(0))" > add_circle< / button >
< button class = "material-icons icon indi pos hos" title = "Add Counter" onclick = "addDie(tp(this).find('.dropHere').get(0), 1, 'Counter', true)" > pin< / button >
< button class = "material-icons icon indi pos hos" title = "Add Bag" onclick = "addDieBag(tp(this).find('.dropHere').get(0))" > create_new_folder< / button >
2022-06-18 22:01:43 +00:00
< / div >
< div class = "dropHere" > < / div >
2022-06-18 22:42:00 +00:00
< / div > < / template >
2022-06-18 22:01:43 +00:00
< / templates >
< script src = "script.js" > < / script >
< / body >
< / html >
