Iframe component.

2 files changed, 162 insertions, 0 deletions

diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Iframe.kt b/src/main/kotlin/pl/treksoft/kvision/html/Iframe.kt
new file mode 100644
index 00000000..d9c97ea7
--- /dev/null
+++ b/src/main/kotlin/pl/treksoft/kvision/html/Iframe.kt
@@ -0,0 +1,125 @@
+/*
+ * Copyright (c) 2018. Robert Jaros
+ */
+package pl.treksoft.kvision.html
+
+import com.github.snabbdom.VNode
+import pl.treksoft.kvision.core.Container
+import pl.treksoft.kvision.core.StringPair
+import pl.treksoft.kvision.core.Widget
+
+/**
+ * Iframe sandbox options.
+ */
+enum class Sandbox(internal val option: String) {
+    ALLOWFORMS("allow-forms"),
+    ALLOWPOINTERLOCK("allow-pointer-lock"),
+    ALLOWPOPUPS("allow-popups"),
+    ALLOWSAMEORIGIN("allow-same-origin"),
+    ALLOWSCRIPTS("allow-scripts"),
+    ALLOWTOPNAVIGATION("allow-top-navigation")
+}
+
+/**
+ * Iframe component.
+ *
+ * @constructor
+ * @param src the iframe document address
+ * @param srcdoc the HTML content of the iframe
+ * @param name the name of the iframe
+ * @param iframeWidth the width of the iframe
+ * @param iframeHeight the height of the iframe
+ * @param sandbox a set of Sandbox options
+ * @param classes a set of CSS class names
+ */
+open class Iframe(
+    src: String? = null, srcdoc: String? = null, name: String? = null, iframeWidth: Int? = null,
+    iframeHeight: Int? = null, sandbox: Set<Sandbox>? = null, classes: Set<String> = setOf()
+) : Widget(classes) {
+    /**
+     * The iframe document address.
+     */
+    var src by refreshOnUpdate(src)
+    /**
+     * The HTML content of the iframe.
+     */
+    var srcdoc by refreshOnUpdate(srcdoc)
+    /**
+     * The name of the iframe.
+     */
+    var name by refreshOnUpdate(name)
+    /**
+     * The width of the iframe.
+     */
+    var iframeWidth by refreshOnUpdate(iframeWidth)
+    /**
+     * The height of the iframe.
+     */
+    var iframeHeight by refreshOnUpdate(iframeHeight)
+    /**
+     * A set of Sandbox options.
+     */
+    var sandbox by refreshOnUpdate(sandbox)
+    /**
+     * A current location URL of the iframe.
+     */
+    var location: String?
+        get() = getLocation()
+        set(value) {
+            setLocation(value)
+        }
+
+    override fun render(): VNode {
+        return render("iframe")
+    }
+
+    override fun getSnAttrs(): List<StringPair> {
+        val pr = super.getSnAttrs().toMutableList()
+        src?.let {
+            pr.add("src" to it)
+        }
+        srcdoc?.let {
+            pr.add("srcdoc" to it)
+        }
+        name?.let {
+            pr.add("name" to it)
+        }
+        iframeWidth?.let {
+            pr.add("width" to it.toString())
+        }
+        iframeHeight?.let {
+            pr.add("height" to it.toString())
+        }
+        sandbox?.let {
+            pr.add("sandbox" to it.joinToString(" ") { it.option })
+        }
+        return pr
+    }
+
+    @Suppress("UnsafeCastFromDynamic")
+    private fun getLocation(): String? {
+        return getElementJQueryD()[0].contentWindow.location.href
+    }
+
+    private fun setLocation(location: String?) {
+        getElementJQueryD()[0].contentWindow.location.href = location ?: "about:blank"
+    }
+
+    companion object {
+        /**
+         * DSL builder extension function.
+         *
+         * It takes the same parameters as the constructor of the built component.
+         */
+        fun Container.iframe(
+            src: String? = null, srcdoc: String? = null, name: String? = null, iframeWidth: Int? = null,
+            iframeHeight: Int? = null, sandbox: Set<Sandbox>? = null, classes: Set<String> = setOf(),
+            init: (Iframe.() -> Unit)? = null
+        ): Iframe {
+            val iframe =
+                Iframe(src, srcdoc, name, iframeWidth, iframeHeight, sandbox, classes).apply { init?.invoke(this) }
+            this.add(iframe)
+            return iframe
+        }
+    }
+}
diff --git a/src/test/kotlin/test/pl/treksoft/kvision/html/IframeSpec.kt b/src/test/kotlin/test/pl/treksoft/kvision/html/IframeSpec.kt
new file mode 100644
index 00000000..0bd2a980
--- /dev/null
+++ b/src/test/kotlin/test/pl/treksoft/kvision/html/IframeSpec.kt
@@ -0,0 +1,37 @@
+/*
+ * Copyright (c) 2018. Robert Jaros
+ */
+package test.pl.treksoft.kvision.html
+
+import pl.treksoft.kvision.html.Iframe
+import pl.treksoft.kvision.html.Sandbox
+import pl.treksoft.kvision.panel.Root
+import test.pl.treksoft.kvision.DomSpec
+import kotlin.browser.document
+import kotlin.test.Test
+
+class IframeSpec : DomSpec {
+
+    @Test
+    fun render() {
+        run {
+            val root = Root("test", true)
+            val iframe = Iframe("https://www.google.com", null, "test", 800, 600, setOf(Sandbox.ALLOWSAMEORIGIN))
+            root.add(iframe)
+            val element = document.getElementById("test")
+            assertEqualsHtml(
+                "<iframe src=\"https://www.google.com\" name=\"test\" width=\"800\" height=\"600\" sandbox=\"allow-same-origin\"></iframe>",
+                element?.innerHTML,
+                "Should render correct iframe"
+            )
+            iframe.src = "https://www.google.pl"
+            iframe.sandbox = setOf()
+            assertEqualsHtml(
+                "<iframe src=\"https://www.google.pl\" name=\"test\" width=\"800\" height=\"600\" sandbox=\"\"></iframe>",
+                element?.innerHTML,
+                "Should render correct iframe after properties change"
+            )
+        }
+    }
+
+}
\ No newline at end of file