Resize testing

This commit is contained in:
2017-05-10 17:01:52 +02:00
parent 91126380f2
commit 6483aa5c06
8 changed files with 64 additions and 5 deletions

View File

@@ -1,5 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?>
<module external.linked.project.id="komp" external.linked.project.path="$MODULE_DIR$/../.." external.root.project.path="$MODULE_DIR$/../.." external.system.id="GRADLE" external.system.module.group="nl.astraeus" external.system.module.version="0.0.1-SNAPSHOT" type="JAVA_MODULE" version="4">
<module external.linked.project.id="komp" external.linked.project.path="$MODULE_DIR$/../.." external.root.project.path="$MODULE_DIR$/../.." external.system.id="GRADLE" external.system.module.group="nl.astraeus" external.system.module.version="0.0.2-SNAPSHOT" type="JAVA_MODULE" version="4">
<component name="NewModuleRootManager" inherit-compiler-output="true">
<exclude-output />
<content url="file://$MODULE_DIR$/../..">

View File

@@ -1,5 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?>
<module external.linked.project.id="komp:main" external.linked.project.path="$MODULE_DIR$/../.." external.root.project.path="$MODULE_DIR$/../.." external.system.id="GRADLE" external.system.module.group="nl.astraeus" external.system.module.type="sourceSet" external.system.module.version="0.0.1-SNAPSHOT" type="JAVA_MODULE" version="4">
<module external.linked.project.id="komp:main" external.linked.project.path="$MODULE_DIR$/../.." external.root.project.path="$MODULE_DIR$/../.." external.system.id="GRADLE" external.system.module.group="nl.astraeus" external.system.module.type="sourceSet" external.system.module.version="0.0.2-SNAPSHOT" type="JAVA_MODULE" version="4">
<component name="FacetManager">
<facet type="kotlin-language" name="Kotlin">
<configuration version="2" platform="JavaScript " useProjectSettings="false">

View File

@@ -1,5 +1,5 @@
<?xml version="1.0" encoding="UTF-8"?>
<module external.linked.project.id="komp:test" external.linked.project.path="$MODULE_DIR$/../.." external.root.project.path="$MODULE_DIR$/../.." external.system.id="GRADLE" external.system.module.group="nl.astraeus" external.system.module.type="sourceSet" external.system.module.version="0.0.1-SNAPSHOT" type="JAVA_MODULE" version="4">
<module external.linked.project.id="komp:test" external.linked.project.path="$MODULE_DIR$/../.." external.root.project.path="$MODULE_DIR$/../.." external.system.id="GRADLE" external.system.module.group="nl.astraeus" external.system.module.type="sourceSet" external.system.module.version="0.0.2-SNAPSHOT" type="JAVA_MODULE" version="4">
<component name="FacetManager">
<facet type="kotlin-language" name="Kotlin">
<configuration version="2" platform="JavaScript " useProjectSettings="false">

View File

@@ -1,5 +1,5 @@
group 'nl.astraeus'
version '0.0.1-SNAPSHOT'
version '0.0.2-SNAPSHOT'
apply plugin: 'kotlin2js'
apply plugin: 'idea'

View File

@@ -1,4 +1,4 @@
#Sun Apr 02 22:05:18 CEST 2017
#Wed May 10 15:59:40 CEST 2017
distributionBase=GRADLE_USER_HOME
distributionPath=wrapper/dists
zipStoreBase=GRADLE_USER_HOME

View File

@@ -0,0 +1,24 @@
package nl.astraeus.komp
/**
* User: rnentjes
* Date: 10-5-17
* Time: 16:48
*/
enum class SizeType {
NONE,
ABSOLUTE,
PERCENTAGE,
FLEX,
FILL
}
open class ComponentSize(
val xType: SizeType,
val yType: SizeType,
val xValue: Float,
val yValue: Float
)
class NotSized : ComponentSize(SizeType.NONE, SizeType.NONE, 0f, 0f)

View File

@@ -36,4 +36,6 @@ abstract class HtmlComponent {
open fun refresh() {
Komp.refresh(element)
}
open fun getSize(): ComponentSize? = null
}

View File

@@ -52,10 +52,43 @@ object Komp {
if (element is HTMLElement && comp != null) {
val parent = element.parentElement
val newElement = comp.create()
val size = comp.getSize()
if (size != null) {
sizeElement(newElement, size)
}
parent?.replaceChild(newElement, element)
}
}
}
fun sizeElement(element: HTMLElement, size: ComponentSize) {
var width = ""
var height = ""
val parent = element.parentElement as HTMLElement
when(size.xType) {
SizeType.ABSOLUTE -> {
width = "${size.xValue.toInt()}px"
}
SizeType.PERCENTAGE -> {
width = "${(parent.clientWidth * size.xValue / 100f).toInt()}px"
}
SizeType.FILL -> {
}
SizeType.FLEX -> {
}
}
if (width.isNotBlank()) {
element.style.width = width
}
if (height.isNotBlank()) {
element.style.height = height
}
}
}