マイペースなプログラミング日記

DTMやプログラミングにお熱なd-kamiがマイペースに書くブログ

kotlinでFile API ドラッグ&ドロップ編

kotlinでFile APIで遊んでるソースコード。ファイルがドロップされたらブラウザのconsoleにファイル名が表示されるはず…。JavaScriptにも変換できるならWebGLだって…めんどくさそう

import kotlin.browser.document
import org.w3c.dom.HTMLDivElement
import org.w3c.dom.DragEvent
import org.w3c.dom.asList

fun main(args: Array<String>) {
    val dropZone = document.createElement("div") as HTMLDivElement;

    dropZone.addEventListener("dragover", { e -> drag(e as DragEvent) }, false)
    dropZone.addEventListener("drop", { e -> drop(e as DragEvent) }, false)

    dropZone.style.width = "600px"
    dropZone.style.height = "600px"

    document.body!!.appendChild(dropZone)
}

fun drop(event: DragEvent) {
    event.stopPropagation()
    event.preventDefault()

    event.dataTransfer!!.files.asList().forEach{ println(it.name) }
}

fun drag(event: DragEvent) {
    event.stopPropagation()
    event.preventDefault()
}