Html Utils extension

d954mas · December 24, 2025, 4:30am

defold-html-utils

Features

Focus the canvas and check focus state.
Save/load strings in localStorage.
Detect mobile devices.

Setup

You can use defold-html-utils in your own project by adding this project as Defold library dependencies.
Open your game.project file and in the dependencies field under project add:

https://github.com/d954mas/defold-html-utils/archive/master.zip

Usage

Example is in main/main.script.

function init(self)
    html_utils.focus()
    print("focused:", html_utils.is_focused())

    local ok_save, saved_data = html_utils.save_data("test/path", "hello")
    print("save:", ok_save, saved_data)

    local ok_load, loaded_data = html_utils.load_data("test/path")
    print("load:", ok_load, loaded_data)

    print("mobile:", html_utils.is_mobile())
end

API

html_utils.focus() — focus the HTML5 canvas.
html_utils.is_focused() -> boolean — return whether the canvas is focused.
html_utils.load_data(path: string) -> boolean, string — load data by key.
html_utils.save_data(path: string, data: string) -> boolean, string — save data by key.
html_utils.is_mobile() -> boolean — detect mobile device.

Platforms

HTML5 only.

britzl · December 24, 2025, 7:44am

Good stuff! Thanks for sharing. I wonder if some of these should be part of the built in functions? I can definitely see is_mobile() being very useful to decide about input methods (virtual controller vs keyboard etc). What about the others? How are you using them?

d954mas · December 24, 2025, 8:24am

focus, after every ads finish on poki. Focus must be return by poki, but manually focus make it better.

localstorage better then indexdb

github.com/subsoap/defsave

defsave/defsave.lua

815ff18a0


      
          		else
          			print("DefSave: Warning attempt to reload already file has been blocked")
          			return true
          		end
          	end
          
          	local loaded_file = {}
          	if html5 then
          		-- sys.load can't be used for HTML5 apps running on iframe from a different origin (cross-origin iframe)
          		-- use `localStorage` instead because of this limitation on default IndexedDB storage used by Defold
          		local web_data = html5.run(string.format(get_localStorage, path))
          
          		if web_data == "{}" then
          			loaded_file = {}
          		elseif M.use_serialize then
          			loaded_file = sys.deserialize( defsave_ext.decode_base64(web_data) )
          		else
          			loaded_file = json.decode(web_data)
          		end
          	else
          		loaded_file  = sys.load(path)

IsMobile worked good. I use it to show wasd tooltip on pc, or virtualpad and buttons on mobile.
IsMobile use deprecated api, but i don’t find better alternative. At least you have 4 ways:)

https://blog.devgenius.io/4-ways-to-detect-mobile-browsers-in-javascript-943b66657524

gianmichele · December 24, 2025, 12:58pm

Agree! They are definitely useful.

@d954mas What’s the main advantage of using local storage instead of indexdb?

d954mas · December 24, 2025, 2:02pm

sys.load can’t be used for HTML5 apps running on iframe from a different origin (cross-origin iframe)
– use localStorage instead because of this limitation on default IndexedDB