From c5c78b3eb06a095192899c025b4450081c8ca1f4 Mon Sep 17 00:00:00 2001 From: Harley White Date: Fri, 7 May 2021 00:16:22 -0400 Subject: [PATCH] Added mouse-holding functionality to buy/clickables --- changelog.md | 4 +++- docs/clickables.md | 2 ++ js/Demo/demoLayers.js | 4 +++- js/components.js | 42 ++++++++++++++++++++++++++++++++++++---- js/technical/displays.js | 11 ++++------- js/technical/temp.js | 10 +++++++++- 6 files changed, 59 insertions(+), 14 deletions(-) diff --git a/changelog.md b/changelog.md index 9d06af2..8ee9259 100644 --- a/changelog.md +++ b/changelog.md @@ -1,10 +1,12 @@ # The Modding Tree changelog: -# v2.5: Dreams Really Do Come True - +# v2.5: Dreams Really Do Come True - 5/7/21 - Optimizations, hopefully a significant amount. - Added OOM/s point gen display at high values (thanks to Ducdat!) - Only one tab will display if the window is not wide enough (also thanks to Ducdat!) +- Holding down a buyable's button now buys it continuously. - New milestone setting will also show the most recently unlocked milestone. (Also renamed all settings to be clearer) +- Added an onHold feature for clickables. - Layer nodes will be highlighted even if the player is on the same tab. - Added customizable node glowColor. - Added buyable purchaseLimit. diff --git a/docs/clickables.md b/docs/clickables.md index f21db92..49b83ce 100644 --- a/docs/clickables.md +++ b/docs/clickables.md @@ -38,6 +38,8 @@ Features: - onClick(): A function that implements clicking one of the clickable. +- onHold(): **optional** A function that is called 20x/sec when the button is held for at least 0.25 seconds. + - style: **optional**. Applies CSS to this clickable, in the form of an object where the keys are CSS attributes, and the values are the values for those attributes (both as strings). - layer: **assigned automagically**. It's the same value as the name of this layer, so you can do `player[this.layer].points` or similar. diff --git a/js/Demo/demoLayers.js b/js/Demo/demoLayers.js index e381aa0..4f79516 100644 --- a/js/Demo/demoLayers.js +++ b/js/Demo/demoLayers.js @@ -452,9 +452,11 @@ addLayer("f", { default: player[this.layer].clickables[this.id] = "Start" break; - } }, + onHold(){ + console.log("Clickkkkk...") + }, style() { switch(getClickableState(this.layer, this.id)){ case "Start": diff --git a/js/components.js b/js/components.js index d952505..d597d68 100644 --- a/js/components.js +++ b/js/components.js @@ -260,7 +260,7 @@ function loadVue() {
@@ -268,7 +268,23 @@ function loadVue() {
- ` + `, + data() { return { interval: false, time: 0,}}, + methods: { + start() { + if (!this.interval) { + this.interval = setInterval((function() { + if(this.time >= 5) + buyBuyable(this.layer, this.data) + this.time = this.time+1 + }).bind(this), 50)} + }, + stop() { + clearInterval(this.interval) + this.interval = false + this.time = 0 + } + }, }) Vue.component('respec-button', { @@ -305,11 +321,29 @@ function loadVue() { v-if="tmp[layer].clickables && tmp[layer].clickables[data]!== undefined && tmp[layer].clickables[data].unlocked" v-bind:class="{ upg: true, can: tmp[layer].clickables[data].canClick, locked: !tmp[layer].clickables[data].canClick}" v-bind:style="[tmp[layer].clickables[data].canClick ? {'background-color': tmp[layer].color} : {}, size ? {'height': size, 'width': size} : {}, tmp[layer].clickables[data].style]" - v-on:click="clickClickable(layer, data)"> + v-on:click="clickClickable(layer, data)" @mousedown="start" @mouseleave="stop" @mouseup="stop" @touchstart="start" @touchend="stop" @touchcancel="stop">


- ` + `, + data() { return { interval: false, time: 0,}}, + methods: { + start() { + if (!this.interval && layers[this.layer].clickables[this.data].onHold) { + this.interval = setInterval((function() { + let c = layers[this.layer].clickables[this.data] + if(this.time >= 5 && run(c.canClick, c)) { + run(c.onHold, c) + } + this.time = this.time+1 + }).bind(this), 50)} + }, + stop() { + clearInterval(this.interval) + this.interval = false + this.time = 0 + } + }, }) Vue.component('master-button', { diff --git a/js/technical/displays.js b/js/technical/displays.js index 09440ce..6bd4f08 100644 --- a/js/technical/displays.js +++ b/js/technical/displays.js @@ -56,13 +56,10 @@ function updateWidth() { if (player.splitMode === "disabled") splitScreen = false if (player.splitMode === "enabled") splitScreen = true - tmp.other = { - screenWidth: screenWidth, - splitScreen: splitScreen, - lastPoints: player.points, - oomps: tmp.other.oomps, - oompsMag: tmp.other.oompsMag, - } + + tmp.other.screenWidth = screenWidth + tmp.other.splitScreen = splitScreen + tmp.other.lastPoints = player.points } function updateOomps(diff) diff --git a/js/technical/temp.js b/js/technical/temp.js index 6f516bf..56831c6 100644 --- a/js/technical/temp.js +++ b/js/technical/temp.js @@ -6,7 +6,7 @@ var NaNalert = false; // Tmp will not call these var activeFunctions = [ "startData", "onPrestige", "doReset", "update", "automate", - "buy", "buyMax", "respec", "onComplete", "onPurchase", "onPress", "onClick", "masterButtonPress", + "buy", "buyMax", "respec", "onComplete", "onPurchase", "onPress", "onClick", "onHold", "masterButtonPress", "sellOne", "sellAll", "pay", "actualCostFunction", "actualEffectFunction", "effectDescription", "display", "fullDisplay", "effectDisplay", "rewardDisplay", ] @@ -44,8 +44,16 @@ function setupTemp() { splitScreen: window.innerWidth >=1024, lastPoints: player.points || new Decimal(0), oomps: new Decimal(0), + + held: { + time: null, + id: null, + layer: null, + type: null, + } } + temp = tmp }