Skip to content

Instantly share code, notes, and snippets.

@positlabs

positlabs/snap-debounce.js

Created March 22, 2023 17:32
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save positlabs/1d3b26924c327a29f5360824d61e5d6d to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save positlabs/1d3b26924c327a29f5360824d61e5d6d to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. positlabs created this gist Mar 22, 2023.
    91 changes: 91 additions & 0 deletions snap-debounce.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,91 @@
    /*
    Debouncing functions is used for delaying a function call until a certain amount of time has passed.
    In the example below, it's used to hide a slider after 3 seconds if the user isn't interacting with it.
    */

    /**
    * Polyfill for browser function setTimeout
    * @param {function} callback - function to trigger after timeout is completed
    * @param {number} delay - time in milliseconds to delay the callback
    * @returns {DelayedCallbackEvent} - event can be cancelled with `clearTimeout(event)`
    */
    function setTimeout(callback, delay) {
    var e = script.createEvent('DelayedCallbackEvent')
    e.reset(delay * .001)
    e.bind(callback)
    return e
    }

    /**
    * Polyfill for browser function clearTimeout
    * @param {DelayedCallbackEvent} event - The event returned from setTimeout
    */
    function clearTimeout(event) {
    event.enabled = false
    }

    /**
    * Debounce function generator for delaying a function call
    * @param {function} callback - function to debounce
    * @param {number} delay - time to delay, in milliseconds
    * @returns {function} - debounced function
    */
    function debounce(callback, delay) {
    if(!delay) throw Error('missing delay from debounce')
    var timeoutEvent
    return function () {
    // Clear any existing timeout
    if (timeoutEvent) {
    clearTimeout(timeoutEvent)
    }

    // Set a new timeout to call the callback function after a delay
    timeoutEvent = setTimeout(callback, delay)
    }
    }

    /*
    EXAMPLE
    Slider controller
    */

    //@input Component.AudioComponent audio
    /** @type {AudioComponent} */
    var audio = script.audio

    //@input Component.ScriptComponent sliderScript
    /** @type {ScriptComponent} */
    var sliderScript = script.sliderScript
    var slider = sliderScript.api

    slider.addCallback('onSliderValueChanged', function (v) {
    audio.volume = v
    // prevent hiding while using the slider
    debouncedHide()
    })

    var st = sliderScript.getSceneObject().getComponent('ScreenTransform')

    function show() {
    print('show slider')
    // show your slider!
    }

    function hide() {
    print('hide slider')
    // hide your slider!
    }

    var debouncedHide = debounce(hide, 3000)

    script.createEvent('TapEvent').bind(function () {
    // tapping the screen will show the slider
    show()
    // slider will hide if user hasn't tapped the screen or used the slider within 3 seconds
    debouncedHide()
    })