mirror of
https://github.com/Investigamer/cardconjurer.git
synced 2025-07-28 13:51:50 -05:00
upgrayedd
This commit is contained in:
Kyle
22
data/site/other/askScryfall/askScryfall.js
Normal file
22
data/site/other/askScryfall/askScryfall.js
Normal file
@@ -0,0 +1,22 @@
|
||||
var fullAbilityList = new Array()
|
||||
|
||||
function loadAbilities() {
|
||||
var xhttp = new XMLHttpRequest();
|
||||
xhttp.onreadystatechange = function() {
|
||||
if (this.readyState == 4) {
|
||||
fullAbilityList = xhttp.responseText.split("$$$")
|
||||
for (var i = 0; i < 3; i ++) {
|
||||
fullAbilityList[i] = fullAbilityList[i].split(";")
|
||||
}
|
||||
}
|
||||
}
|
||||
xhttp.open("GET", "data/site/other/askScryfall/planeswalkerAbilities.txt", true);
|
||||
xhttp.send();
|
||||
}
|
||||
|
||||
function randomAbility(index) {
|
||||
possibleAbilities = fullAbilityList[index]
|
||||
document.getElementById("askScryfallResult").innerHTML = possibleAbilities[Math.floor(Math.random() * (possibleAbilities.length - 1))].replace(/\\"/g, '"')
|
||||
}
|
||||
|
||||
loadAbilities()
|
||||
@@ -0,0 +1,78 @@
|
||||
<!DOCTYPE html PUBLIC>
|
||||
<html>
|
||||
<head>
|
||||
<title>Ask Scryfall - Ability List Generator</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
</body>
|
||||
<script>
|
||||
var plusAbilities = new Array()
|
||||
var minusAbilities = new Array()
|
||||
var ultimateAbilities = new Array()
|
||||
function importPlaneswalkers(request) {
|
||||
var xhttp = new XMLHttpRequest();
|
||||
xhttp.onreadystatechange = function() {
|
||||
if (this.readyState == 4 && this.status == 200) {
|
||||
var planeswalkerList = this.responseText.split('oracle_text":"')
|
||||
var planeswalkerNameList = this.responseText.replace(/","name":"/g, "").split('"name":"')
|
||||
//console.log(planeswalkerNameList)
|
||||
var iAdjust = 0
|
||||
for (var i = 1; i < planeswalkerList.length; i++) {
|
||||
var planeswalkerAbilityList = planeswalkerList[i].split('",')[0].split(/\\n/g)
|
||||
var planeswalkerName = planeswalkerNameList[i - iAdjust].split(/",/g)[0]
|
||||
if (planeswalkerName.includes(" // ")) {
|
||||
planeswalkerName = planeswalkerName.split(" // ")[1]
|
||||
}
|
||||
for (var n = 0; n < planeswalkerAbilityList.length; n++) {
|
||||
if (planeswalkerAbilityList[n].includes(":")) {
|
||||
var abilityText = planeswalkerAbilityList[n].substr(planeswalkerAbilityList[n].indexOf(": ") + 2)
|
||||
if (abilityText != undefined) {
|
||||
//console.log(abilityText, planeswalkerName, iAdjust)
|
||||
abilityText = abilityText.replace(planeswalkerName, "Urza, Academy Headmaster")
|
||||
var abilityType = planeswalkerAbilityList[n].split(":")[0]
|
||||
if (!abilityType.includes("X")) {
|
||||
if (abilityType.includes("+")) {
|
||||
//plus
|
||||
plusAbilities[plusAbilities.length] = abilityText
|
||||
} else if (abilityType.includes("\u2212") && parseInt(abilityType.replace("\u2212", "")) > 4) {
|
||||
//ult
|
||||
ultimateAbilities[ultimateAbilities.length] = abilityText
|
||||
} else if (abilityType.includes("\u2212") || abilityType == "0") {
|
||||
//minus
|
||||
minusAbilities[minusAbilities.length] = abilityText
|
||||
} else {
|
||||
//do nothing
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
if (i < planeswalkerList.length - 1 && planeswalkerList[i - 1].includes('"card_faces"')) {
|
||||
iAdjust += 1
|
||||
}
|
||||
}
|
||||
if (this.responseText.includes('"has_more":true')) {
|
||||
importPlaneswalkers(this.responseText.split('"next_page":"')[1].split('","data"')[0].replace(/\\u0026/g, "&"))
|
||||
} else {
|
||||
var allAbilities = [plusAbilities, minusAbilities, ultimateAbilities]
|
||||
let csvContent = "data:text/csv;charset=utf-8,";
|
||||
|
||||
allAbilities.forEach(function(rowArray) {
|
||||
csvContent += rowArray.join(";") + "$$$";
|
||||
})
|
||||
var encodedUri = encodeURI(csvContent)
|
||||
window.open(encodedUri)
|
||||
}
|
||||
} else if (this.readyState == 4 && this.status == 404) {
|
||||
alert("An error occurred. Please try again.");
|
||||
}
|
||||
}
|
||||
xhttp.open("GET", request, true);
|
||||
xhttp.send();
|
||||
}
|
||||
importPlaneswalkers("https://api.scryfall.com/cards/search?order=released&q=type%3Dplaneswalker")
|
||||
</script>
|
||||
</html>
|
||||
|
||||
|
||||
BIN
data/site/other/askScryfall/minus.png
Normal file
BIN
data/site/other/askScryfall/minus.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 47 KiB |
1
data/site/other/askScryfall/planeswalkerAbilities.txt
Normal file
1
data/site/other/askScryfall/planeswalkerAbilities.txt
Normal file
File diff suppressed because one or more lines are too long
BIN
data/site/other/askScryfall/plus.png
Normal file
BIN
data/site/other/askScryfall/plus.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 44 KiB |
BIN
data/site/other/askScryfall/ultimate.png
Normal file
BIN
data/site/other/askScryfall/ultimate.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 49 KiB |
BIN
data/site/other/askScryfall/urzaBlank.png
Normal file
BIN
data/site/other/askScryfall/urzaBlank.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 653 KiB |
192
data/site/other/life/NoSleep.js
Normal file
192
data/site/other/life/NoSleep.js
Normal file
File diff suppressed because one or more lines are too long
362
data/site/other/life/life.js
Normal file
362
data/site/other/life/life.js
Normal file
@@ -0,0 +1,362 @@
|
||||
//============================================//
|
||||
// Card Conjurer, by Kyle Burton //
|
||||
//============================================//
|
||||
console.log("1.1")
|
||||
//define variables
|
||||
var playerCount, startingLifeTotal, firstPlayerWide = false, lastPlayerWide = false, playerList = [], rowHeight = 0, columnWidth = 0, rowCount = 0, isFullscreen = true, mouseClickId = 0, noSleep = new NoSleep(), canEnableNoSleep = false
|
||||
//Setup the enabler for no sleep
|
||||
document.addEventListener("click", enableNoSleep, false);
|
||||
function enableNoSleep() {
|
||||
if (canEnableNoSleep) {
|
||||
document.removeEventListener("click", enableNoSleep, false);
|
||||
noSleep.enable();
|
||||
}
|
||||
}
|
||||
//This function sets everything up
|
||||
function fullscreen() {
|
||||
//Full screen!
|
||||
grid = document.getElementById("gridShell")
|
||||
if (grid.requestFullscreen) {
|
||||
grid.requestFullscreen()
|
||||
} else if (grid.mozRequestFullScreen) {
|
||||
grid.mozRequestFullScreen()
|
||||
} else if (grid.webkitRequestFullscreen) {
|
||||
grid.webkitRequestFullscreen()
|
||||
} else if (grid.msRequestFullscreen) {
|
||||
grid.msRequestFullscreen()
|
||||
} else {
|
||||
isFullscreen = false
|
||||
document.getElementById("return").classList.add("permaHidden")
|
||||
document.getElementById("gridShell").classList.add("fullscreenUnavailable")
|
||||
}
|
||||
}
|
||||
function startGame() {
|
||||
canEnableNoSleep = document.getElementById("inputWakeLock").checked
|
||||
fullscreen()
|
||||
document.getElementById("return").classList.remove("hidden")
|
||||
//hide the settings and grab player count and starting life total
|
||||
document.getElementById("settings").classList.add("hidden")
|
||||
playerCount = parseInt(document.getElementById("inputPlayerCount").value)
|
||||
startingLifeTotal = parseInt(document.getElementById("inputStartingLife").value)
|
||||
//determine the layout based on player count
|
||||
if (playerCount % 2 == 0) {
|
||||
if (playerCount >= 6) {
|
||||
firstPlayerWide = true
|
||||
lastPlayerWide = true
|
||||
}
|
||||
} else {
|
||||
lastPlayerWide = true
|
||||
}
|
||||
//Make all the player boxes
|
||||
for (var i = 1; i <= playerCount; i ++) {
|
||||
//determine if the current box is rotated or widened
|
||||
var rotation, wide = false
|
||||
var orientationIndexAdjust = 0
|
||||
if (firstPlayerWide) {
|
||||
orientationIndexAdjust += 1
|
||||
}
|
||||
if (i == 1 && firstPlayerWide) {
|
||||
rotation = 180
|
||||
} else if (i == playerCount && lastPlayerWide) {
|
||||
rotation = 0
|
||||
} else if ((i + orientationIndexAdjust) % 2 == 0) {
|
||||
rotation = 270
|
||||
} else {
|
||||
rotation = 90
|
||||
}
|
||||
if ((i == 1 && firstPlayerWide) || (i == playerCount && lastPlayerWide)) {wide = true}
|
||||
playerList[i - 1] = new playerBox(i, rotation, wide)
|
||||
document.getElementById("inputPlayer").innerHTML += "<option value='" + i + "'>Player " + i + "</option>"
|
||||
}
|
||||
//Determine the grid size
|
||||
if (isFullscreen) {
|
||||
columnWidth = screen.width / 2 - 2
|
||||
} else {
|
||||
columnWidth = window.innerWidth / 2 - 2
|
||||
}
|
||||
rowCount = (playerCount - playerCount % 2) / 2 + 1
|
||||
if (playerCount == 2 || playerCount == 4) {
|
||||
rowCount -= 1
|
||||
}
|
||||
// console.log("Row count: " + rowCount)
|
||||
if (isFullscreen) {
|
||||
rowHeight = screen.height / rowCount - 2
|
||||
// console.log("Full screen, rowHeight: " + rowHeight)
|
||||
// console.log("screen.height: " + screen.height)
|
||||
} else {
|
||||
var heightToUse = window.innerHeight
|
||||
if (document.documentElement.clientHeight > heightToUse) {
|
||||
// console.log("document.documentElement.clientHeight: " + document.documentElement.clientHeight)
|
||||
heightToUse = document.documentElement.clientHeight
|
||||
}
|
||||
rowHeight = heightToUse / rowCount - 2
|
||||
// console.log("Not full screen, rowHeight: " + rowHeight)
|
||||
// console.log("window.innerHeight: " + window.innerHeight)
|
||||
}
|
||||
//Now that all the player boxes are made, they must be configured
|
||||
for (var i = 1; i <= playerCount; i++) {
|
||||
configurePlayerBox(i)
|
||||
}
|
||||
drawAllPlayerBoxes()
|
||||
}
|
||||
function playerBox(playerBoxID, canvasRotation, wide) {
|
||||
//Actually needed vars
|
||||
this.id = playerBoxID
|
||||
this.rotation = canvasRotation
|
||||
this.life = startingLifeTotal
|
||||
this.canvas = document.createElement("canvas")
|
||||
this.direction = 0
|
||||
this.holdTime = 0
|
||||
this.touchId = 0.5
|
||||
this.color = "#222222"
|
||||
this.textColor = "#ffffff"
|
||||
this.image = new Image()
|
||||
this.image.customVarID = playerBoxID
|
||||
this.image.onload = function() {drawPlayerBox(this.customVarID)}
|
||||
//vars to make navigation easier
|
||||
this.canvas.customVarID = playerBoxID
|
||||
this.canvas.customVarContext = this.canvas.getContext("2d")
|
||||
this.canvas.customVarContext.customVarCanvas = this.canvas
|
||||
//css classes
|
||||
this.canvas.classList.add("playerBox")
|
||||
if (wide) {
|
||||
this.canvas.classList.add("widePlayerBox")
|
||||
}
|
||||
//add it to the html
|
||||
document.getElementById("mainGrid").appendChild(this.canvas)
|
||||
}
|
||||
function configurePlayerBox(playerBoxID) {
|
||||
//All of this configures the size/shape/orientation of the player boxes
|
||||
var currentPlayer = playerList[playerBoxID - 1]
|
||||
var context = currentPlayer.canvas.customVarContext
|
||||
currentPlayer.canvas.width = columnWidth
|
||||
if (playerList[playerBoxID - 1].canvas.classList.contains("widePlayerBox")) {
|
||||
currentPlayer.canvas.width = columnWidth * 2 + 2
|
||||
}
|
||||
currentPlayer.canvas.height = rowHeight
|
||||
context.translate(currentPlayer.canvas.width / 2, currentPlayer.canvas.height / 2)
|
||||
context.rotate(Math.PI / 180 * currentPlayer.rotation)
|
||||
}
|
||||
|
||||
function resetLife() {
|
||||
for (var i = 1; i <= playerCount; i++) {
|
||||
playerList[i - 1].life = startingLifeTotal
|
||||
}
|
||||
document.getElementById('menu').classList.add('hidden')
|
||||
drawAllPlayerBoxes()
|
||||
}
|
||||
function updateColorSelector() {
|
||||
document.getElementById("inputPlayerColor").value = playerList[parseInt(document.getElementById("inputPlayer").value) - 1].color
|
||||
document.getElementById("inputTextColor").value = playerList[parseInt(document.getElementById("inputPlayer").value) - 1].textColor
|
||||
}
|
||||
function updateBackgroundColor(color) {
|
||||
playerList[parseInt(document.getElementById("inputPlayer").value) - 1].color = color
|
||||
drawPlayerBox(parseInt(document.getElementById("inputPlayer").value))
|
||||
}
|
||||
function updateTextColor(color) {
|
||||
playerList[parseInt(document.getElementById("inputPlayer").value) - 1].textColor = color
|
||||
drawPlayerBox(parseInt(document.getElementById("inputPlayer").value))
|
||||
}
|
||||
function loadImage(event, destination) {
|
||||
var input = event.target
|
||||
var reader = new FileReader()
|
||||
reader.onload = function() {
|
||||
var dataURL = reader.result
|
||||
destination.src = dataURL
|
||||
}
|
||||
reader.readAsDataURL(input.files[0])
|
||||
}
|
||||
var savedArtList = [], cardArtUrlList = [], cardArtArtistList = []
|
||||
function inputCardArtName(cardArtNameInput) {
|
||||
var xhttp = new XMLHttpRequest()
|
||||
xhttp.onreadystatechange = function() {
|
||||
if (this.readyState == 4 && this.status == 200) {
|
||||
savedArtList = this.responseText.split('"art_crop":"')
|
||||
savedArtList.splice(0, 1)
|
||||
document.getElementById("inputCardArtNameNumber").max = savedArtList.length
|
||||
document.getElementById("inputCardArtNameNumber").value = 1
|
||||
for (i = 0; i < savedArtList.length; i ++) {
|
||||
cardArtUrlList[i] = savedArtList[i].split('","border_crop":')[0]
|
||||
}
|
||||
for (i = 0; i < savedArtList.length; i ++) {
|
||||
cardArtArtistList[i] = savedArtList[i].slice(savedArtList[i].indexOf('"artist":"') + 10, savedArtList[i].indexOf('","border_color":'))
|
||||
}
|
||||
inputCardArtNameNumber(1)
|
||||
}
|
||||
}
|
||||
xhttp.open("GET", "https://api.scryfall.com/cards/search?order=released&unique=art&q=name%3D" + cardArtNameInput.replace(/ /g, "_"), true)
|
||||
xhttp.send()
|
||||
}
|
||||
function inputCardArtNameNumber(cardArtNameNumberInput) {
|
||||
playerList[parseInt(document.getElementById('inputPlayer').value) - 1].image.src = cardArtUrlList[cardArtNameNumberInput - 1]
|
||||
}
|
||||
document.getElementById("mainGrid").addEventListener("touchmove", function(event) {
|
||||
event.preventDefault()
|
||||
}, false)
|
||||
function rollRNG() {
|
||||
document.getElementById("rngOutput").innerHTML = Math.floor(Math.random() * (parseInt(document.getElementById("inputRNGMax").value) - parseInt(document.getElementById("inputRNGMin").value) + 1) + parseInt(document.getElementById("inputRNGMin").value))
|
||||
}
|
||||
function drawPlayerBox(playerBoxID) {
|
||||
var currentPlayerBox = playerList[playerBoxID - 1]
|
||||
var context = currentPlayerBox.canvas.customVarContext
|
||||
context.textBaseline = "middle"
|
||||
var tempFontSize = 100
|
||||
context.font = "100pt belerenbsc"
|
||||
context.fillStyle = currentPlayerBox.color
|
||||
var tempCanvasHeight = currentPlayerBox.canvas.height, tempCanvasWidth = currentPlayerBox.canvas.width
|
||||
if (playerList[playerBoxID - 1].rotation == 90 || playerList[playerBoxID - 1].rotation == 270) {
|
||||
tempCanvasHeight = tempCanvasWidth
|
||||
tempCanvasWidth = currentPlayerBox.canvas.height
|
||||
}
|
||||
context.fillRect(tempCanvasWidth / -2, tempCanvasHeight / -2, tempCanvasWidth, tempCanvasHeight)
|
||||
if (currentPlayerBox.image.src != "") {
|
||||
var imageToDraw = currentPlayerBox.image
|
||||
if (imageToDraw.width / imageToDraw.height > tempCanvasWidth / tempCanvasHeight) {
|
||||
//The image is wider and should be fitted to its height
|
||||
context.drawImage(imageToDraw, tempCanvasHeight / imageToDraw.height * imageToDraw.width / -2, tempCanvasHeight / -2, tempCanvasHeight / imageToDraw.height * imageToDraw.width, tempCanvasHeight)
|
||||
} else {
|
||||
//The image is taller and should be fitted to its width
|
||||
context.drawImage(imageToDraw, tempCanvasWidth / -2, tempCanvasWidth / imageToDraw.width * imageToDraw.height / -2, tempCanvasWidth, tempCanvasWidth / imageToDraw.width * imageToDraw.height)
|
||||
}
|
||||
}
|
||||
if (currentPlayerBox.life < 1) {
|
||||
context.fillStyle = "#0008"
|
||||
context.fillRect(tempCanvasWidth / -2, tempCanvasHeight / -2, tempCanvasWidth, tempCanvasHeight)
|
||||
context.fillStyle = "#800"
|
||||
} else {
|
||||
context.fillStyle = playerList[playerBoxID - 1].textColor
|
||||
}
|
||||
while (context.measureText(currentPlayerBox.life).width >= tempCanvasWidth) {
|
||||
tempFontSize -= 1
|
||||
context.font = tempFontSize + "pt belerenbsc"
|
||||
}
|
||||
var horizontalShift = -1 * parseInt(context.measureText(currentPlayerBox.life).width) / 2
|
||||
context.strokeStyle = "black"
|
||||
context.lineWidth = 5
|
||||
context.strokeText(currentPlayerBox.life, horizontalShift, 0)
|
||||
context.fillText(currentPlayerBox.life, horizontalShift, 0)
|
||||
}
|
||||
function drawAllPlayerBoxes() {
|
||||
for (var i = 1; i <= playerList.length; i ++) {
|
||||
drawPlayerBox(i)
|
||||
}
|
||||
}
|
||||
//Event Listener magic! (always records mouse/touch positions so the loop can work without events)
|
||||
var touchX = [], touchY = []
|
||||
document.getElementById("mainGrid").addEventListener("mousedown", startMouseCoordinates, true)
|
||||
window.addEventListener("mousemove", updateMouseCoordinates, true)
|
||||
window.addEventListener("mouseup", endMouseCoordinates, true)
|
||||
function startMouseCoordinates() {
|
||||
mouseClickId += 1
|
||||
playerList[event.target.customVarID - 1].touchId = mouseClickId
|
||||
singleTap(event.target)
|
||||
}
|
||||
function updateMouseCoordinates() {
|
||||
touchX[0] = event.clientX
|
||||
touchY[0] = event.clientY}
|
||||
function endMouseCoordinates() {
|
||||
for (var i = 1; i <= playerList.length; i++) {
|
||||
playerList[i - 1].touchId = 0.5
|
||||
}
|
||||
}
|
||||
window.addEventListener("touchstart", switchToTouchEvents, true)
|
||||
function switchToTouchEvents() {
|
||||
window.removeEventListener("touchstart", switchToTouchEvents, true)
|
||||
document.getElementById("mainGrid").removeEventListener("mousedown", startMouseCoordinates, true)
|
||||
window.removeEventListener("mousemove", updateMouseCoordinates, true)
|
||||
window.removeEventListener("mouseup", endMouseCoordinates, true)
|
||||
document.getElementById("mainGrid").addEventListener("touchstart", startTouch, true)
|
||||
window.addEventListener("touchmove", moveTouch, true)
|
||||
window.addEventListener("touchend", endTouch, true)
|
||||
}
|
||||
function startTouch() {
|
||||
playerList[event.changedTouches[0].target.customVarID - 1].touchId = event.changedTouches[0].identifier
|
||||
moveTouch()
|
||||
singleTap(event.changedTouches[0].target)
|
||||
}
|
||||
function moveTouch() {
|
||||
touchX = [], touchY = []
|
||||
for (var i = 0; i < event.touches.length; i ++) {
|
||||
touchX[i] = event.touches[i].clientX
|
||||
touchY[i] = event.touches[i].clientY
|
||||
}
|
||||
}
|
||||
function endTouch() {
|
||||
for (var i = 1; i <= playerList.length; i++) {
|
||||
if (playerList[i - 1].touchId == event.changedTouches[0].identifier) {
|
||||
playerList[i - 1].touchId = 0.5
|
||||
}
|
||||
}
|
||||
moveTouch()
|
||||
}
|
||||
//Tap (and click) functions
|
||||
function singleTap(targetPlayerBox) {
|
||||
// console.log("Box #" + targetPlayerBox.customVarID + " was pressed")
|
||||
var playerBoxBounds = targetPlayerBox.getBoundingClientRect()
|
||||
// console.log("Bounds:")
|
||||
// console.log(playerBoxBounds)
|
||||
var tappedPlayerBox = playerList[targetPlayerBox.customVarID - 1]
|
||||
var lifeAdjust = 0
|
||||
// console.log("Rotation: " + tappedPlayerBox.rotation)
|
||||
// console.log("touchX: " + touchX[touchX.length - 1] + "\ntouchY: " + touchY[touchY.length - 1])
|
||||
if (tappedPlayerBox.rotation == 0 || tappedPlayerBox.rotation == 180) {
|
||||
// console.log(touchX[touchX.length - 1])
|
||||
// console.log(playerBoxBounds.width / 2 + playerBoxBounds.left)
|
||||
if (touchX[touchX.length - 1] > playerBoxBounds.width / 2 + playerBoxBounds.left) {
|
||||
lifeAdjust = 1
|
||||
} else {
|
||||
lifeAdjust = -1
|
||||
}
|
||||
} else {
|
||||
// console.log(touchY[touchY.length - 1])
|
||||
// console.log(playerBoxBounds.height / 2 + playerBoxBounds.top)
|
||||
if (touchY[touchY.length - 1] > playerBoxBounds.height / 2 + playerBoxBounds.top) {
|
||||
lifeAdjust = 1
|
||||
} else {
|
||||
lifeAdjust = -1
|
||||
}
|
||||
}
|
||||
if (tappedPlayerBox.rotation == 180 || tappedPlayerBox.rotation == 270) {
|
||||
lifeAdjust *= -1
|
||||
}
|
||||
// console.log(lifeAdjust)
|
||||
tappedPlayerBox.direction = lifeAdjust
|
||||
tappedPlayerBox.life += lifeAdjust
|
||||
drawPlayerBox(tappedPlayerBox.id)
|
||||
setTimeout(clockCheck.bind(null, tappedPlayerBox, tappedPlayerBox.touchId), 500)
|
||||
}
|
||||
function clockCheck(tappedPlayerBox, lastTapID) {
|
||||
if (tappedPlayerBox.touchId == lastTapID) {
|
||||
tappedPlayerBox.life += tappedPlayerBox.direction
|
||||
drawPlayerBox(tappedPlayerBox.id)
|
||||
if (tappedPlayerBox.holdTime >= 150) {
|
||||
setTimeout(clockCheck.bind(null, tappedPlayerBox, tappedPlayerBox.touchId), 10)
|
||||
} else if (tappedPlayerBox.holdTime >= 50) {
|
||||
setTimeout(clockCheck.bind(null, tappedPlayerBox, tappedPlayerBox.touchId), 50)
|
||||
} else {
|
||||
setTimeout(clockCheck.bind(null, tappedPlayerBox, tappedPlayerBox.touchId), 100)
|
||||
}
|
||||
tappedPlayerBox.holdTime += 1
|
||||
} else {
|
||||
tappedPlayerBox.holdTime = 0
|
||||
}
|
||||
}
|
||||
//Hopefully stops the pesky double-tap zoom:
|
||||
var doubleTouchStartTimestamp = 0
|
||||
document.getElementById("mainGrid").addEventListener("touchstart", function() {
|
||||
var now = +(new Date())
|
||||
if (doubleTouchStartTimestamp + 500 > now){
|
||||
event.preventDefault()
|
||||
}
|
||||
doubleTouchStartTimestamp = now
|
||||
})
|
||||
//Updated :D
|
||||
|
||||
var inputsToRemoveAutocorrect = document.querySelectorAll("input");
|
||||
|
||||
inputsToRemoveAutocorrect.forEach(input => {
|
||||
input.setAttribute("autocomplete", "off")
|
||||
input.setAttribute("autocorrect", "off")
|
||||
input.setAttribute("autocapitalize", "off")
|
||||
input.setAttribute("spellcheck", false)
|
||||
})
|
||||
BIN
data/site/other/life/menuButton.png
Normal file
BIN
data/site/other/life/menuButton.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 810 B |
BIN
data/site/other/life/menuExitButton.png
Normal file
BIN
data/site/other/life/menuExitButton.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
134
data/site/other/setSymbol/setSymbol.js
Normal file
134
data/site/other/setSymbol/setSymbol.js
Normal file
@@ -0,0 +1,134 @@
|
||||
var svg = document.getElementById('displaySVG');
|
||||
var svgWidth = 500, svgHeight = 500, setSymbolWidth = 300, setSymbolHeight = 300;
|
||||
var svgStroke = svg.children[1]
|
||||
var svgFill = svg.children[2]
|
||||
svg.setAttribute('width', svgWidth);
|
||||
svg.setAttribute('height', svgHeight);
|
||||
var imageType = 'svg';
|
||||
var canvas = document.getElementById('displayCanvas');
|
||||
canvas.width = svgWidth
|
||||
canvas.height = svgHeight
|
||||
var context = canvas.getContext('2d');
|
||||
var setSymbolImage = new Image();
|
||||
setSymbolImage.onload = drawSetSymbol;
|
||||
var setSymbolPath = '';
|
||||
fetchSVGData('https://raw.githubusercontent.com/andrewgioia/Keyrune/master/svg/rtr.svg');
|
||||
|
||||
|
||||
function fetchSVGData(url) {
|
||||
hideShow();
|
||||
var xhttp = new XMLHttpRequest();
|
||||
xhttp.onreadystatechange = function() {
|
||||
if (this.readyState == 4 && xhttp.status != 404) {
|
||||
imageType = 'svg'
|
||||
setSymbolPath = xhttp.responseText.split('d="')[1].split('"></path>')[0];
|
||||
svgStroke.setAttribute('d', setSymbolPath);
|
||||
svgFill.setAttribute('d', setSymbolPath);
|
||||
var svgPathBoundingBox = svgStroke.getBBox();
|
||||
if (svgPathBoundingBox.width > svgPathBoundingBox.height) {
|
||||
scaleAmount = setSymbolWidth / svgPathBoundingBox.width;
|
||||
} else {
|
||||
scaleAmount = setSymbolHeight / svgPathBoundingBox.height;
|
||||
}
|
||||
svgStroke.setAttribute('transform', 'scale(' + scaleAmount + ') translate(' + parseFloat(((svgWidth - svgPathBoundingBox.width * scaleAmount)/2/scaleAmount)-svgPathBoundingBox.x) + ', ' + parseFloat(((svgHeight - svgPathBoundingBox.height * scaleAmount)/2/scaleAmount)-svgPathBoundingBox.y) + ')');
|
||||
svgFill.setAttribute('transform', 'scale(' + scaleAmount + ') translate(' + parseFloat(((svgWidth - svgPathBoundingBox.width * scaleAmount)/2/scaleAmount)-svgPathBoundingBox.x) + ', ' + parseFloat(((svgHeight - svgPathBoundingBox.height * scaleAmount)/2/scaleAmount)-svgPathBoundingBox.y) + ')');
|
||||
decorateSVG();
|
||||
}
|
||||
}
|
||||
xhttp.open('GET', url, true);
|
||||
xhttp.send();
|
||||
}
|
||||
|
||||
function decorateSVG() {
|
||||
if (imageType == 'svg') {
|
||||
var setSymbolGradient = document.getElementById('inputSetSymbolRarity').value;
|
||||
var setSymbolStrokeColor = 'black';
|
||||
if (setSymbolGradient == 'Common') {
|
||||
setSymbolStrokeColor = 'white'
|
||||
}
|
||||
svgStroke.setAttribute('stroke', setSymbolStrokeColor)
|
||||
svgFill.setAttribute('fill', 'url(#grad' + setSymbolGradient + ')');
|
||||
} else {
|
||||
drawSetSymbol()
|
||||
}
|
||||
}
|
||||
|
||||
function downloadSetSymbolImage(linkElement) {
|
||||
linkElement.download = 'setSymbol.' + imageType
|
||||
if (imageType == 'svg') {
|
||||
var serializer = new XMLSerializer();
|
||||
var source = serializer.serializeToString(svg);
|
||||
|
||||
//add name spaces.
|
||||
if(!source.match(/^<svg[^>]+xmlns="http\:\/\/www\.w3\.org\/2000\/svg"/)){
|
||||
source = source.replace(/^<svg/, '<svg xmlns="http://www.w3.org/2000/svg"');
|
||||
}
|
||||
if(!source.match(/^<svg[^>]+"http\:\/\/www\.w3\.org\/1999\/xlink"/)){
|
||||
source = source.replace(/^<svg/, '<svg xmlns:xlink="http://www.w3.org/1999/xlink"');
|
||||
}
|
||||
|
||||
//add xml declaration
|
||||
source = '<?xml version="1.0" standalone="no"?>\r\n' + source;
|
||||
|
||||
//convert svg source to URI data scheme.
|
||||
var url = "data:image/svg+xml;charset=utf-8,"+encodeURIComponent(source);
|
||||
|
||||
//set url value to a element's href attribute.
|
||||
linkElement.href = url;
|
||||
} else {
|
||||
var setSymbolDownload = canvas.toDataURL();
|
||||
linkElement.href = setSymbolDownload;
|
||||
}
|
||||
}
|
||||
|
||||
function uploadImage(event) {
|
||||
var input = event.target;
|
||||
var reader = new FileReader();
|
||||
reader.onload = function() {
|
||||
imageType = 'png';
|
||||
hideShow();
|
||||
setSymbolImage.src = reader.result;
|
||||
}
|
||||
reader.readAsDataURL(input.files[0]);
|
||||
}
|
||||
|
||||
function drawSetSymbol() {
|
||||
var scaleAmount;
|
||||
if (setSymbolImage.width > setSymbolImage.height) {
|
||||
scaleAmount = setSymbolWidth / setSymbolImage.width;
|
||||
} else {
|
||||
scaleAmount = setSymbolHeight / setSymbolImage.height;
|
||||
}
|
||||
context.globalCompositeOperation = 'source-over';
|
||||
context.clearRect(0, 0, svgWidth, svgHeight);
|
||||
var x1 = (svgWidth - setSymbolImage.width * scaleAmount) / 2, y1 = (svgHeight - setSymbolImage.height * scaleAmount) / 2, x2 = x1 + setSymbolImage.width * scaleAmount, y2 = y1 + setSymbolImage.height * scaleAmount;
|
||||
context.drawImage(setSymbolImage, x1, y1, x2 - x1, y2 - y1);
|
||||
context.globalCompositeOperation = 'source-in';
|
||||
var gradient = context.createLinearGradient(x1, y1, x2, y1);
|
||||
var gradientColors = document.getElementById('grad' + document.getElementById('inputSetSymbolRarity').value).innerHTML.split('stop-color:');
|
||||
gradient.addColorStop(0, gradientColors[1].split(';')[0]);
|
||||
gradient.addColorStop(0.5, gradientColors[2].split(';')[0]);
|
||||
gradient.addColorStop(1, gradientColors[3].split(';')[0]);
|
||||
context.fillStyle = gradient;
|
||||
context.fillRect(x1, y1, x2 - x1, y2 - y1);
|
||||
}
|
||||
|
||||
function hideShow() {
|
||||
if (imageType == 'svg') {
|
||||
if (svg.classList.contains('hidden')) {
|
||||
svg.classList.remove('hidden');
|
||||
}
|
||||
if (!canvas.classList.contains('hidden')) {
|
||||
canvas.classList.add('hidden');
|
||||
}
|
||||
} else {
|
||||
if (canvas.classList.contains('hidden')) {
|
||||
canvas.classList.remove('hidden');
|
||||
}
|
||||
if (!svg.classList.contains('hidden')) {
|
||||
svg.classList.add('hidden');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user