refactor: 獨立 openImageViewer
This commit is contained in:
@@ -1,23 +1,8 @@
|
|||||||
|
import openImageViewer from "../openImageViewer.ts"
|
||||||
|
import { snackbar } from "../snackbar.ts"
|
||||||
|
|
||||||
import { $ } from 'mdui/jq'
|
import { $ } from 'mdui/jq'
|
||||||
|
|
||||||
import 'pinch-zoom-element'
|
|
||||||
import { snackbar } from "../snackbar.ts";
|
|
||||||
|
|
||||||
function openImageViewer(src: string) {
|
|
||||||
$('#image-viewer-dialog-inner').empty()
|
|
||||||
|
|
||||||
const e = new Image()
|
|
||||||
e.onload = () => ($('#image-viewer-dialog-inner').get(0) as any).scaleTo(0.1, {
|
|
||||||
// Transform origin. Can be a number, or string percent, eg "50%"
|
|
||||||
originX: '50%',
|
|
||||||
originY: '50%',
|
|
||||||
// Should the transform origin be relative to the container, or content?
|
|
||||||
relativeTo: 'container',
|
|
||||||
})
|
|
||||||
e.src = src
|
|
||||||
$('#image-viewer-dialog-inner').append(e)
|
|
||||||
$('#image-viewer-dialog').attr('open', 'true')
|
|
||||||
}
|
|
||||||
|
|
||||||
customElements.define('chat-image', class extends HTMLElement {
|
customElements.define('chat-image', class extends HTMLElement {
|
||||||
constructor() {
|
constructor() {
|
||||||
|
|||||||
17
client/ui/openImageViewer.ts
Normal file
17
client/ui/openImageViewer.ts
Normal file
@@ -0,0 +1,17 @@
|
|||||||
|
import { $ } from 'mdui/jq'
|
||||||
|
import 'pinch-zoom-element'
|
||||||
|
export default function openImageViewer(src: string) {
|
||||||
|
$('#image-viewer-dialog-inner').empty()
|
||||||
|
|
||||||
|
const e = new Image()
|
||||||
|
e.onload = () => ($('#image-viewer-dialog-inner').get(0) as any).scaleTo(0.1, {
|
||||||
|
// Transform origin. Can be a number, or string percent, eg "50%"
|
||||||
|
originX: '50%',
|
||||||
|
originY: '50%',
|
||||||
|
// Should the transform origin be relative to the container, or content?
|
||||||
|
relativeTo: 'container',
|
||||||
|
})
|
||||||
|
e.src = src
|
||||||
|
$('#image-viewer-dialog-inner').append(e)
|
||||||
|
$('#image-viewer-dialog').attr('open', 'true')
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user