More properties

This commit is contained in:
2020-02-10 20:28:57 +01:00
parent 1b83f88c8f
commit 1c3ac8f0d0
14 changed files with 229 additions and 27 deletions

View File

@@ -10,6 +10,8 @@ repositories {
mavenCentral()
}
apply(plugin = "kotlin-dce-js")
kotlin {
/* Targets configuration omitted.
* To find out how to configure the targets, please follow the link:
@@ -27,7 +29,7 @@ kotlin {
val commonTest by getting {
dependencies {
implementation(kotlin("test-common"))
implementation(kotlin("test-annotations-common"))
//implementation(kotlin("test-annotations-common"))
}
}
val jsMain by getting {
@@ -38,7 +40,7 @@ kotlin {
val jsTest by getting {
dependencies {
implementation(kotlin("test-js"))
implementation(kotlin("test-annotations-js"))
//implementation(kotlin("test-annotations-js"))
}
}
val jvmMain by getting {

View File

@@ -0,0 +1,17 @@
package nl.astraeus.css
enum class AlignContent(
val value: String
) : CssProperty {
STRETCH("stretch"),
CENTER("center"),
FLEX_START("flex-start"),
FLEX_END("flex-end"),
SPACE_BETWEEN("space-between"),
SPACE_AROUND("space-around"),
INITIAL("initial"),
INHERIT("inherit"),
;
override fun css(): String = value
}

View File

@@ -0,0 +1,16 @@
package nl.astraeus.css
enum class AlignItems(
val value: String
) : CssProperty {
STRETCH("stretch"),
CENTER("center"),
FLEX_START("flex-start"),
FLEX_END("flex-end"),
BASELINE("baseline"),
INITIAL("initial"),
INHERIT("inherit"),
;
override fun css(): String = value
}

View File

@@ -0,0 +1,17 @@
package nl.astraeus.css
enum class AlignSelf(
val value: String
) : CssProperty {
AUTO("auto"),
STRETCH("stretch"),
CENTER("center"),
FLEX_START("flex-start"),
FLEX_END("flex-end"),
BASELINE("baseline"),
INITIAL("initial"),
INHERIT("inherit"),
;
override fun css(): String = value
}

View File

@@ -0,0 +1,12 @@
package nl.astraeus.css
enum class All(
val value: String
) : CssProperty {
INITIAL("initial"),
INHERIT("inherit"),
UNSET("unset"),
;
override fun css(): String = value
}

View File

@@ -0,0 +1,29 @@
package nl.astraeus.css
enum class AnimationDirection(
val value: String
) : CssProperty {
NORMAL("normal"),
REVERSE("reverse"),
ALTERNATE("alternate"),
ALTERNATE_REVERSE("alternate-reverse"),
INITIAL("initial"),
INHERIT("inherit"),
;
override fun css(): String = value
}
enum class AnimationFillMode(
val value: String
) : CssProperty {
NONE("none"),
FORWARDS("forwards"),
BACKWARDS("backwards"),
BOTH("both"),
INITIAL("initial"),
INHERIT("inherit"),
;
override fun css(): String = value
}

View File

@@ -1,16 +1,25 @@
package nl.astraeus.css
fun hex(hex: String): Color = HexColor(hex)
fun rgb(red: Int, green: Int, blue: Int): Color = RGBColor(red, green, blue)
fun rgba(red: Int, green: Int, blue: Int, alpha: Double): Color = RGBAColor(red, green, blue, alpha)
fun hsl(hue: Int, saturation: Int, lightness: Int): Color = HSLColor(hue, saturation, lightness)
fun hsla(hue: Int, saturation: Int, lightness: Int, alpha: Double): Color = HSLAColor(hue, saturation, lightness, alpha)
open class Color : CssProperty() {
open class Color : CssProperty {
override fun css(): String = "#xxxxxx"
}
class HexColor(
val hex: String
) : Color() {
override fun css(): String = "#$hex"
}
class RGBColor(
val red: Int,
val green: Int,

View File

@@ -0,0 +1,30 @@
package nl.astraeus.css
enum class CountType {
NUMBER,
INFINITE,
INITIAL,
INHERIT
}
class Count(
val type: CountType,
val number: Int
) : CssProperty {
override fun css(): String = when(type) {
CountType.NUMBER -> "$number"
CountType.INFINITE -> "infinite"
CountType.INITIAL -> "initial"
CountType.INHERIT -> "inherit"
}
companion object {
fun count(number: Int): Count = Count(CountType.NUMBER, number)
fun infinite(): Count = Count(CountType.INFINITE, 0)
fun initial(): Count = Count(CountType.INITIAL, 0)
fun inherit(): Count = Count(CountType.INHERIT, 0)
}
}

View File

@@ -5,25 +5,49 @@ annotation class CssTagMarker
@CssTagMarker
open class Style(
var color: Color? = null,
var alignContent: AlignContent? = null,
var alignItems: AlignItems? = null,
var alignSelf: AlignSelf? = null,
var all: All? = null,
var animation: TextProperty? = null,
var animationDelay: DelayDuration? = null,
var animationDirection: AnimationDirection? = null,
var animationDuration: DelayDuration? = null,
var animationFillMode: AnimationFillMode? = null,
var animationIterationCount: Count? = null,
var backgroundColor: Color? = null,
var color: Color? = null,
var fontFamily: TextProperty? = null,
var fontSize: FontSize? = null,
var height: Measurement? = null,
var left: Measurement? = null,
var top: Measurement? = null,
var width: Measurement? = null,
var height: Measurement? = null,
var fontFamily: PlainProperty? = null,
var fontSize: FontSize? = null
var transitionDelay: DelayDuration? = null,
var transitionDuration: DelayDuration? = null,
var width: Measurement? = null
) {
fun getMapping() = mapOf(
"color" to color,
"align-content" to alignContent,
"align-items" to alignItems,
"align-self" to alignSelf,
"all" to all,
"animation" to animation,
"animation-delay" to animationDelay,
"animation-direction" to animationDirection,
"animation-duration" to animationDuration,
"animation-fill-mode" to animationFillMode,
"animation-iteration-count" to animationIterationCount,
"background-color" to backgroundColor,
"color" to color,
"font-family" to fontFamily,
"font-size" to fontSize,
"height" to height,
"left" to left,
"top" to top,
"width" to width,
"height" to height,
"font-family" to fontFamily,
"font-size" to fontSize
"transition-delay" to transitionDelay,
"transition-duration" to transitionDuration,
"width" to width
)
fun propertyCss(indent: String, name: String, prop: CssProperty?): String = if (prop != null) {
@@ -85,8 +109,8 @@ open class StyleDefinition : Style() {
}
fun css(definition: Style.() -> Unit): Style {
val css = Style()
fun css(definition: StyleDefinition.() -> Unit): StyleDefinition {
val css = StyleDefinition()
definition(css)

View File

@@ -1,16 +1,16 @@
package nl.astraeus.css
abstract class CssProperty {
interface CssProperty {
abstract fun css(): String
fun css(): String
}
fun plain(value: String) = PlainProperty(value)
fun text(value: String) = TextProperty(value)
class PlainProperty(
class TextProperty(
val value: String
): CssProperty() {
): CssProperty {
override fun css(): String = value

View File

@@ -0,0 +1,25 @@
package nl.astraeus.css
enum class DelayDurationType {
TIME,
INITIAL,
INHERIT
}
class DelayDuration(
val type: DelayDurationType,
val seconds: Int
) : CssProperty {
override fun css(): String = when(type) {
DelayDurationType.TIME -> "${seconds}s"
DelayDurationType.INITIAL -> "initial"
DelayDurationType.INHERIT -> "inherit"
}
}
fun seconds(seconds: Int): DelayDuration = DelayDuration(DelayDurationType.TIME, seconds)
fun initial(): DelayDuration = DelayDuration(DelayDurationType.INITIAL, 0)
fun inherit(): DelayDuration = DelayDuration(DelayDurationType.INHERIT, 0)

View File

@@ -3,11 +3,13 @@ package nl.astraeus.css
fun px(nr: Int): Measurement = Measurement(MeasurementType.PX, nr)
fun em(nr: Int): Measurement = Measurement(MeasurementType.EM, nr)
fun perc(nr: Int): Measurement = Measurement(MeasurementType.PERCENTAGE, nr)
fun pc(nr: Int): Measurement = Measurement(MeasurementType.PICAS, nr)
enum class MeasurementType {
PX,
EM,
PERCENTAGE,
PICAS,
OTHER
}
@@ -15,7 +17,7 @@ open class Measurement(
val type: MeasurementType,
val intValue: Int = 0,
val stringValue: String = ""
) : CssProperty() {
) : CssProperty {
override fun css(): String = when(type) {
MeasurementType.PX -> {
@@ -27,6 +29,9 @@ open class Measurement(
MeasurementType.PERCENTAGE -> {
"${stringValue}%"
}
MeasurementType.PICAS -> {
"${stringValue}pc"
}
else -> {
error("Unhandled type $type")
}
@@ -38,7 +43,6 @@ enum class FontSizeType {
PX,
EM,
PERCENTAGE,
}
class FontSize(

View File

@@ -1,10 +1,10 @@
package nl.astraeus.css
import kotlin.test.Test
//import kotlin.test.Test
object TestCssBuilder {
@Test
//@Test
fun testBuilder() {
val css = CssBuilder()
@@ -15,7 +15,7 @@ object TestCssBuilder {
left = em(5)
backgroundColor = rgba(255, 255, 255, 0.75)
sel("> a") {
css("> a") {
color = hsl(200, 50, 50)
}
}

View File

@@ -3,7 +3,7 @@ package nl.astraeus.css
class StyleBase(
val mainColor: Color = hsl(128, 50, 50),
val mainBackgroundColor: Color = hsl(64, 50, 50),
val mainFont: PlainProperty = plain("Arial")
val mainFont: TextProperty = text("Arial")
)
private fun StyleDefinition.sizePX(
@@ -64,9 +64,26 @@ fun main() {
val css2 = generateCss(StyleBase(
hsl(32, 40, 50),
hsl(64, 60, 35),
plain("Courier")
text("Courier")
))
println(css1)
println(css2)
val sd = css {
css("#pipo") {
backgroundColor = hex("eeeeee")
fontFamily = text("Arial, Courier")
animationDelay = initial()
css("div") {
color = hex("1b1b1b1")
alignContent = AlignContent.FLEX_START
animationIterationCount = Count.count(3)
}
}
}
println("======")
println(sd.generateCss())
}