2023-11-28 02:32:46 +00:00
import { _ as s , o as a , c as n , Q as l } from "./chunks/framework.1169fbc9.js" ; const d = JSON . parse ( '{"title":"Clickables","description":"","frontmatter":{},"headers":[],"relativePath":"public/gamedevtree/docs/clickables.md","filePath":"public/gamedevtree/docs/clickables.md","lastUpdated":1701137241000}' ) , e = { name : "public/gamedevtree/docs/clickables.md" } , t = l ( ` <h1 id="clickables" tabindex="-1">Clickables <a class="header-anchor" href="#clickables" aria-label="Permalink to "Clickables""> </a></h1><p>Clickables are any kind of thing that you can click for an effect. They're a more generalized version of Buyables.</p><p>DO NOT USE THESE TO MAKE THINGS THAT YOU CLICK REPEATEDLY FOR A BONUS BECAUSE THOSE ARE AWFUL.</p><p>There are several differences between the two. One is that a buyable's saved data is its amount as a Decimal, while Clickables store a "state" which can be a number or string, but not Decimal, array, or object). Buyables have a number of extra features which you can see on their page. Clickables also have a smaller default size.</p><p>You can get and set a clickable's state with getClickableState(layer, id) and setClickableState(layer, id, state). You can use clickableEffect(layer, id) to get the current effects of a clickable.</p><p>Clickables should be formatted like this:</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">clickables</span><span style="color:#E1E4E8;">: {</span></span>
2023-11-07 00:46:27 +00:00
< span class = "line" > < span style = "color:#E1E4E8;" > < / s p a n > < s p a n s t y l e = " c o l o r : # B 3 9 2 F 0 ; " > r o w s < / s p a n > < s p a n s t y l e = " c o l o r : # E 1 E 4 E 8 ; " > : # < / s p a n > < s p a n s t y l e = " c o l o r : # F 9 7 5 8 3 ; " > o f < / s p a n > < s p a n s t y l e = " c o l o r : # E 1 E 4 E 8 ; " > r o w s < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#E1E4E8;" > < / s p a n > < s p a n s t y l e = " c o l o r : # B 3 9 2 F 0 ; " > c o l s < / s p a n > < s p a n s t y l e = " c o l o r : # E 1 E 4 E 8 ; " > : # < / s p a n > < s p a n s t y l e = " c o l o r : # F 9 7 5 8 3 ; " > o f < / s p a n > < s p a n s t y l e = " c o l o r : # E 1 E 4 E 8 ; " > c o l u m n s < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#E1E4E8;" > < / s p a n > < s p a n s t y l e = " c o l o r : # B 3 9 2 F 0 ; " > m a s t e r B u t t o n P r e s s < / s p a n > < s p a n s t y l e = " c o l o r : # E 1 E 4 E 8 ; " > ( ) < / s p a n > < s p a n s t y l e = " c o l o r : # 6 A 7 3 7 D ; " > / / * * o p t i o n a l * * I f t h i s i s p r e s e n t , a n a d d i t i o n a l b u t t o n w i l l a p p e a r a b o v e t h e c l i c k a b l e s . < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#E1E4E8;" > < /span><span style="color:#6A737D;">/ / pressing it will call the function . < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#E1E4E8;" > < / s p a n > < s p a n s t y l e = " c o l o r : # B 3 9 2 F 0 ; " > m a s t e r B u t t o n T e x t < / s p a n > < s p a n s t y l e = " c o l o r : # E 1 E 4 E 8 ; " > : < / s p a n > < s p a n s t y l e = " c o l o r : # 9 E C B F F ; " > & q u o t ; P r e s s m e ! & q u o t ; < / s p a n > < s p a n s t y l e = " c o l o r : # E 1 E 4 E 8 ; " > < / s p a n > < s p a n s t y l e = " c o l o r : # 6 A 7 3 7 D ; " > / / * * o p t i o n a l * * t e x t t o d i s p l a y o n t h e M a s t e r B u t t o n < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#E1E4E8;" > < / s p a n > < s p a n s t y l e = " c o l o r : # B 3 9 2 F 0 ; " > s h o w M a s t e r B u t t o n < / s p a n > < s p a n s t y l e = " c o l o r : # E 1 E 4 E 8 ; " > ( ) { } < / s p a n > < s p a n s t y l e = " c o l o r : # 6 A 7 3 7 D ; " > / / * * o p t i o n a l * * , a f u n c t i o n d e t e r m i n i n g w h e t h e r o r n o t t o s h o w t h e b u t t o n . D e f a u l t s t o t r u e i f a b s e n t . < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#E1E4E8;" > < / s p a n > < s p a n s t y l e = " c o l o r : # 7 9 B 8 F F ; " > 1 1 < / s p a n > < s p a n s t y l e = " c o l o r : # E 1 E 4 E 8 ; " > : { < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#E1E4E8;" > < / s p a n > < s p a n s t y l e = " c o l o r : # B 3 9 2 F 0 ; " > d i s p l a y < / s p a n > < s p a n s t y l e = " c o l o r : # E 1 E 4 E 8 ; " > ( ) { < / s p a n > < s p a n s t y l e = " c o l o r : # F 9 7 5 8 3 ; " > r e t u r n < / s p a n > < s p a n s t y l e = " c o l o r : # E 1 E 4 E 8 ; " > < / s p a n > < s p a n s t y l e = " c o l o r : # 9 E C B F F ; " > & q u o t ; B l a h & q u o t ; < / s p a n > < s p a n s t y l e = " c o l o r : # E 1 E 4 E 8 ; " > } , < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#E1E4E8;" > etc < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#E1E4E8;" > } < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#E1E4E8;" > etc < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#E1E4E8;" > } < / s p a n > < / s p a n > < / c o d e > < / p r e > < p r e c l a s s = " s h i k i g i t h u b - l i g h t v p - c o d e - l i g h t " > < c o d e > < s p a n c l a s s = " l i n e " > < s p a n s t y l e = " c o l o r : # 2 4 2 9 2 E ; " > < / s p a n > < s p a n s t y l e = " c o l o r : # 6 F 4 2 C 1 ; " > c l i c k a b l e s < / s p a n > < s p a n s t y l e = " c o l o r : # 2 4 2 9 2 E ; " > : { < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#24292E;" > < / s p a n > < s p a n s t y l e = " c o l o r : # 6 F 4 2 C 1 ; " > r o w s < / s p a n > < s p a n s t y l e = " c o l o r : # 2 4 2 9 2 E ; " > : # < / s p a n > < s p a n s t y l e = " c o l o r : # D 7 3 A 4 9 ; " > o f < / s p a n > < s p a n s t y l e = " c o l o r : # 2 4 2 9 2 E ; " > r o w s < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#24292E;" > < / s p a n > < s p a n s t y l e = " c o l o r : # 6 F 4 2 C 1 ; " > c o l s < / s p a n > < s p a n s t y l e = " c o l o r : # 2 4 2 9 2 E ; " > : # < / s p a n > < s p a n s t y l e = " c o l o r : # D 7 3 A 4 9 ; " > o f < / s p a n > < s p a n s t y l e = " c o l o r : # 2 4 2 9 2 E ; " > c o l u m n s < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#24292E;" > < / s p a n > < s p a n s t y l e = " c o l o r : # 6 F 4 2 C 1 ; " > m a s t e r B u t t o n P r e s s < / s p a n > < s p a n s t y l e = " c o l o r : # 2 4 2 9 2 E ; " > ( ) < / s p a n > < s p a n s t y l e = " c o l o r : # 6 A 7 3 7 D ; " > / / * * o p t i o n a l * * I f t h i s i s p r e s e n t , a n a d d i t i o n a l b u t t o n w i l l a p p e a r a b o v e t h e c l i c k a b l e s . < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#24292E;" > < /span><span style="color:#6A737D;">/ / pressing it will call the function . < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#24292E;" > < / s p a n > < s p a n s t y l e = " c o l o r : # 6 F 4 2 C 1 ; " > m a s t e r B u t t o n T e x t < / s p a n > < s p a n s t y l e = " c o l o r : # 2 4 2 9 2 E ; " > : < / s p a n > < s p a n s t y l e = " c o l o r : # 0 3 2 F 6 2 ; " > & q u o t ; P r e s s m e ! & q u o t ; < / s p a n > < s p a n s t y l e = " c o l o r : # 2 4 2 9 2 E ; " > < / s p a n > < s p a n s t y l e = " c o l o r : # 6 A 7 3 7 D ; " > / / * * o p t i o n a l * * t e x t t o d i s p l a y o n t h e M a s t e r B u t t o n < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#24292E;" > < / s p a n > < s p a n s t y l e = " c o l o r : # 6 F 4 2 C 1 ; " > s h o w M a s t e r B u t t o n < / s p a n > < s p a n s t y l e = " c o l o r : # 2 4 2 9 2 E ; " > ( ) { } < / s p a n > < s p a n s t y l e = " c o l o r : # 6 A 7 3 7 D ; " > / / * * o p t i o n a l * * , a f u n c t i o n d e t e r m i n i n g w h e t h e r o r n o t t o s h o w t h e b u t t o n . D e f a u l t s t o t r u e i f a b s e n t . < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#24292E;" > < / s p a n > < s p a n s t y l e = " c o l o r : # 0 0 5 C C 5 ; " > 1 1 < / s p a n > < s p a n s t y l e = " c o l o r : # 2 4 2 9 2 E ; " > : { < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#24292E;" > < / s p a n > < s p a n s t y l e = " c o l o r : # 6 F 4 2 C 1 ; " > d i s p l a y < / s p a n > < s p a n s t y l e = " c o l o r : # 2 4 2 9 2 E ; " > ( ) { < / s p a n > < s p a n s t y l e = " c o l o r : # D 7 3 A 4 9 ; " > r e t u r n < / s p a n > < s p a n s t y l e = " c o l o r : # 2 4 2 9 2 E ; " > < / s p a n > < s p a n s t y l e = " c o l o r : # 0 3 2 F 6 2 ; " > & q u o t ; B l a h & q u o t ; < / s p a n > < s p a n s t y l e = " c o l o r : # 2 4 2 9 2 E ; " > } , < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#24292E;" > etc < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#24292E;" > } < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#24292E;" > etc < / s p a n > < / s p a n >
< span class = "line" > < span style = "color:#24292E;" > } < / s p a n > < / s p a n > < / c o d e > < / p r e > < / d i v > < p > F e a t u r e s : < / p > < u l > < l i > < p > t i t l e : < s t r o n g > o p t i o n a l < / s t r o n g > , d i s p l a y e d a t t h e t o p i n a l a r g e r f o n t I t c a n a l s o b e a f u n c t i o n t h a t r e t u r n s u p d a t i n g t e x t . < / p > < / l i > < l i > < p > e f f e c t ( ) : < s t r o n g > o p t i o n a l < / s t r o n g > , A f u n c t i o n t h a t c a l c u l a t e s a n d r e t u r n s t h e c u r r e n t v a l u e s o f b o n u s e s o f t h i s c l i c k a b l e . C a n r e t u r n a v a l u e o r a n o b j e c t c o n t a i n i n g m u l t i p l e v a l u e s . < / p > < / l i > < l i > < p > d i s p l a y ( ) : A f u n c t i o n r e t u r n i n g e v e r y t h i n g t h a t s h o u l d b e d i s p l a y e d o n t h e c l i c k a b l e a f t e r t h e t i t l e , l i k e l y c h a n g i n g b a s e d o n i t s s t a t e . C a n u s e b a s i c H T M L . < / p > < / l i > < l i > < p > u n l o c k e d ( ) : < s t r o n g > o p t i o n a l < / s t r o n g > , A f u n c t i o n r e t u r n i n g a b o o l t o d e t e r m i n e i f t h e c l i c k a b l e i s v i s i b l e o r n o t . D e f a u l t i s u n l o c k e d . < / p > < / l i > < l i > < p > c a n C l i c k ( ) : A f u n c t i o n r e t u r n i n g a b o o l t o d e t e r m i n e i f y o u c a n c l i c k t h e c l i c k a b l e . < / p > < / l i > < l i > < p > o n C l i c k ( ) : A f u n c t i o n t h a t i m p l e m e n t s c l i c k i n g o n e o f t h e c l i c k a b l e . < / p > < / l i > < l i > < p > s t y l e : < s t r o n g > O p t i o n a l < / s t r o n g > , A p p l i e s C S S t o t h i s c l i c k a b l e , i n t h e f o r m o f a n o b j e c t w h e r e t h e k e y s a r e C S S a t t r i b u t e s , a n d t h e v a l u e s a r e t h e v a l u e s f o r t h o s e a t t r i b u t e s ( b o t h a s s t r i n g s ) < / p > < / l i > < l i > < p > l a y e r : < s t r o n g > A s s i g n e d a u t o m a g i c a l l y < / s t r o n g > . I t & # 3 9 ; s t h e s a m e v a l u e a s t h e n a m e o f t h i s l a y e r , s o y o u c a n d o p l a y e r [ t h i s . l a y e r ] . p o i n t s o r s i m i l a r . < / p > < / l i > < l i > < p > i d : < s t r o n g > A s s i g n e d a u t o m a g i c a l l y < / s t r o n g > . I t & # 3 9 ; s t h e & q u o t ; k e y & q u o t ; w h i c h t h e c l i c k a b l e w a s s t o r e d u n d e r , f o r c o n v e n i e n t a c c e s s . T h e c l i c k a b l e i n t h e e x a m p l e & # 3 9 ; s i d i s 1 1 . < / p > < / l i > < / u l > ` , 9 ) , o = [ t ] ; f u n c t i o n p ( c , r , i , E , y , u ) { r e t u r n a ( ) , n ( " d i v " , n u l l , o ) } c o n s t b = s ( e , [ [ " r e n d e r " , p ] ] ) ; e x p o r t { d a s _ _ p a g e D a t a , b a s d e f a u l t } ;