py-gtk-notes/webview/app.js

/**
 * {}
 * @author yutent<yutent.io@gmail.com>
 * @date 2023/07/20 14:19:13
 */

import 'es.shim'
import { html, css, Component } from 'wkit'

class App extends Component {
  static props = {
    input: '',
    img: ''
  }

  static styles = css`
    .output {
      max-width: 100%;
      white-space: pre-wrap;
      word-break: break-all;
    }
  `

  render() {
    return html`
      <button @click=${this.test1}>Test 1</button>
      <button @click=${this.test2}>Test 2</button>

      <a target="_blank" href="about:blank">打开控制台</a>

      <div class="output">loading...</div>

      <input value=${this.input} />

      <hr />
      <button @click=${this.writeImage}>写图片到剪切板</button>
      <button
        @click=${async function () {
          native.quit()
        }}
      >
        退出
      </button>
      <button @click=${this.createTray}>tray</button>
      <button @click=${this.register}>screen</button>
      <button
        @click=${function () {
          native.globalShortcut.unregisterAll(['<Ctrl>b', '<Ctrl>a'])
        }}
      >
        unregisterall
      </button>
      <img style="width:100px;border:1px solid #09f;" src=${this.img} />
      <textarea @paste=${this.pasteImg}></textarea>
    `
  }

  async test1() {
    let txt = await native.clipboard.readText()
    console.log('<><><>', txt)
    this.input = txt
  }

  async test2() {
    native.clipboard.writeText('这是一段写进剪切板的文本')
  }

  async writeImage() {
    let img = await native.image('/code/gtk/webkit/debian.png')
    native.clipboard.writeImage(img)
    // native.clipboard.writeImage('/code/gtk/webkit/red.png')
    try {
      this.img = URL.createObjectURL(await img.export())
    } catch (err) {
      alert(err)
    }
  }

  quit() {
    native.quit()
  }

  createTray() {
    native.tray()
  }

  async register() {
    // console.log(await native.globalShortcut.enabled)

    native.globalShortcut.register('<Ctrl>2', function () {
      alert('<Ctrl>2被绑定了')
    })
    // console.log(await native.screen.getAllDisplays())
    // console.log(await native.screen.getPrimaryDisplay())
  }

  async pasteImg(ev) {
    let items = ev.clipboardData.items
    // let items = ev.clipboardData.getData('image/png')
    // let items = await navigator.clipboard.read()
    // let img

    console.log(items)
    return
    // for (let item of items) {
    //   if (item.types.includes('image/png')) {
    //     img = await item.getType('image/png')
    //     console.log(img)
    //     this.img = URL.createObjectURL(img)
    //     return
    //   }
    // }

    // let img = await window?.native?.clipboard?.readImage()

    // console.log(img)

    // if (img) {
    //   this.img = URL.createObjectURL(await img.export())
    // }

    for (let it of items) {
      let file = it.getAsFile()
      if (file) {
        this.img = URL.createObjectURL(file)
        break
      }
    }
  }
}

App.reg('app')