diff --git a/packages/frontend/src/pages/room.vue b/packages/frontend/src/pages/room.vue index 85b3cb2af4..2bc5d3dfb6 100644 --- a/packages/frontend/src/pages/room.vue +++ b/packages/frontend/src/pages/room.vue @@ -62,6 +62,8 @@ SPDX-License-Identifier: AGPL-3.0-only Exit edit mode Edit mode addObject + Export + Import @@ -412,6 +414,37 @@ function save() { localStorage.setItem('roomData', JSON.stringify(engine.value.roomState)); } +function expor() { + if (engine.value == null) return; + const dataStr = 'data:text/json;charset=utf-8,' + encodeURIComponent(JSON.stringify(engine.value.roomState)); + const dlAnchorElem = window.document.createElement('a'); + dlAnchorElem.setAttribute('href', dataStr); + dlAnchorElem.setAttribute('download', 'room.json'); + dlAnchorElem.click(); +} + +function impor() { + if (engine.value == null) return; + const inputElem = window.document.createElement('input'); + inputElem.setAttribute('type', 'file'); + inputElem.setAttribute('accept', 'application/json'); + inputElem.addEventListener('change', () => { + const file = inputElem.files?.[0]; + if (file == null) return; + const reader = new FileReader(); + reader.onload = () => { + try { + localStorage.setItem('roomData', reader.result as string); + window.location.reload(); + } catch (e) { + alert('Failed to load room data: ' + e); + } + }; + reader.readAsText(file); + }); + inputElem.click(); +} + definePage(() => ({ title: 'Room', icon: 'ti ti-door',