Add overview

src/jsMain/kotlin/de/kif/frontend/main.kt

@@ -2,6 +2,7 @@ package de.kif.frontend
 
 import de.kif.frontend.views.calendar.initCalendar
 import de.kif.frontend.views.initTableLayout
+import de.kif.frontend.views.initWorkGroupConstraints
 import de.westermann.kwebview.components.init
 import kotlin.browser.document
 
@@ -14,4 +15,7 @@ fun main() = init {
     if (document.getElementsByClassName("table-layout").length > 0) {
         initTableLayout()
     }
+    if (document.getElementsByClassName("work-group-constraints").length > 0) {
+        initWorkGroupConstraints()
+    }
 }

src/jsMain/kotlin/de/kif/frontend/repository/ScheduleRepository.kt

@@ -1,5 +1,6 @@
 package de.kif.frontend.repository
 
+import de.kif.common.ConstraintMap
 import de.kif.common.Message
 import de.kif.common.Repository
 import de.kif.common.RepositoryType
@@ -49,4 +50,14 @@ object ScheduleRepository : Repository<Schedule> {
 
         override fun onDelete(id: Long) = onDelete.emit(id)
     }
+
+    suspend fun checkConstraints(): ConstraintMap {
+        val json = repositoryGet("/api/constraints")
+        return parser.parse(json, ConstraintMap.serializer())
+    }
+
+    suspend fun checkConstraintsFor(schedule: Schedule): ConstraintMap {
+        val json = repositoryGet("/api/constraint/${schedule.id}")
+        return parser.parse(json, ConstraintMap.serializer())
+    }
 }

src/jsMain/kotlin/de/kif/frontend/views/WorkGroupConstraints.kt

@@ -0,0 +1,118 @@
+package de.kif.frontend.views
+
+import de.kif.frontend.launch
+import de.kif.frontend.repository.WorkGroupRepository
+import de.westermann.kobserve.event.EventListener
+import de.westermann.kwebview.View
+import de.westermann.kwebview.async
+import de.westermann.kwebview.components.*
+import de.westermann.kwebview.createHtmlView
+import org.w3c.dom.*
+import kotlin.browser.document
+
+fun initWorkGroupConstraints() {
+    var index = 10000
+
+    val constraints =
+        ListView.wrap<View>(document.getElementsByClassName("work-group-constraints")[0] as HTMLElement)
+    val addButton =
+        View.wrap(document.getElementsByClassName("work-group-constraints-add")[0] as HTMLElement)
+    val addList =
+        ListView.wrap<View>(document.getElementsByClassName("work-group-constraints-add-list")[0] as HTMLElement)
+
+    console.log(constraints.html)
+    console.log(addButton.html)
+    console.log(addList.html)
+
+    addButton.onClick {
+        addList.classList += "active"
+
+        var listener: EventListener<*>? = null
+
+        async {
+            listener = Body.onClick.reference {
+                addList.classList -= "active"
+                listener?.detach()
+            }
+        }
+    }
+
+    addList.textView("Add only on day") {
+        onClick {
+            constraints.html.appendChild(View.wrap(createHtmlView<HTMLDivElement>()) {
+                classList += "input-group"
+                html.appendChild(TextView("On day").apply { classList += "form-btn" }.html)
+                html.appendChild(InputView(InputType.NUMBER).apply {
+                    classList += "form-control"
+                    html.name = "constraint-only-on-day-${index++}"
+                    min = -1337.0
+                    max = 1337.0
+                }.html)
+            }.html)
+        }
+    }
+    addList.textView("Add only after time") {
+        onClick {
+            constraints.html.appendChild(View.wrap(createHtmlView<HTMLDivElement>()) {
+                classList += "input-group"
+                html.appendChild(TextView("After time").apply { classList += "form-btn" }.html)
+                html.appendChild(InputView(InputType.NUMBER).apply {
+                    classList += "form-control"
+                    html.name = "constraint-only-after-time-${index++}"
+                    min = -1337.0
+                    max = 133700.0
+                }.html)
+            }.html)
+        }
+    }
+    addList.textView("Add not at same time") {
+        onClick {
+            constraints.html.appendChild(View.wrap(createHtmlView<HTMLDivElement>()) {
+                classList += "input-group"
+                html.appendChild(TextView("Not with").apply { classList += "form-btn" }.html)
+
+                val select = createHtmlView<HTMLSelectElement>()
+                select.classList.add("form-control")
+                select.name = "constraint-not-at-same-time-${index++}"
+
+                launch {
+                    val all = WorkGroupRepository.all()
+
+                    for (wg in all) {
+                        val option = createHtmlView<HTMLOptionElement>()
+                        option.value = wg.id.toString()
+                        option.textContent = wg.name
+                        select.appendChild(option)
+                    }
+                }
+
+                html.appendChild(select)
+            }.html)
+        }
+    }
+    addList.textView("Add only after work group") {
+        onClick {
+            constraints.html.appendChild(View.wrap(createHtmlView<HTMLDivElement>()) {
+                classList += "input-group"
+                html.appendChild(TextView("After AK").apply { classList += "form-btn" }.html)
+
+                val select = createHtmlView<HTMLSelectElement>()
+                select.classList.add("form-control")
+                select.name = "constraint-only-after-work-group-${index++}"
+
+                launch {
+                    val all = WorkGroupRepository.all()
+
+                    for (wg in all) {
+                        val option = createHtmlView<HTMLOptionElement>()
+                        option.value = wg.id.toString()
+                        option.textContent = wg.name
+                        select.appendChild(option)
+                    }
+                }
+
+                html.appendChild(select)
+            }.html)
+        }
+    }
+}

src/jsMain/kotlin/de/kif/frontend/views/calendar/Calendar.kt

@@ -4,6 +4,7 @@ import de.kif.frontend.iterator
 import de.kif.frontend.launch
 import de.kif.frontend.repository.ScheduleRepository
 import de.westermann.kwebview.View
+import de.westermann.kwebview.createHtmlView
 import org.w3c.dom.*
 import kotlin.browser.document
 
@@ -30,7 +31,7 @@ class Calendar(calendar: HTMLElement) : View(calendar) {
     }
 
     fun scrollHorizontalTo(pixel: Double) {
-        calendarTable.scrollTo (ScrollToOptions(pixel, 0.0, ScrollBehavior.SMOOTH))
+        calendarTable.scrollTo(ScrollToOptions(pixel, 0.0, ScrollBehavior.SMOOTH))
     }
 
     init {
@@ -76,6 +77,27 @@ class Calendar(calendar: HTMLElement) : View(calendar) {
                 }
             }
         }
+
+        val cont = document.getElementsByClassName("header-right")[0] as HTMLElement
+
+        val view = View.wrap(createHtmlView<HTMLAnchorElement>())
+        cont.appendChild(view.html)
+        view.html.textContent = "Check"
+        view.onClick {
+            launch {
+                val errors = ScheduleRepository.checkConstraints()
+
+                println(errors)
+
+                for ((s, l) in errors.map) {
+                    for (entry in calendarEntries) {
+                        if (entry.scheduleId == s) {
+                            entry.error = l.isNotEmpty()
+                        }
+                    }
+                }
+            }
+        }
     }
 }
 

src/jsMain/kotlin/de/kif/frontend/views/calendar/CalendarEntry.kt

@@ -31,6 +31,7 @@ class CalendarEntry(private val calendar: Calendar, view: HTMLElement) : View(vi
     private lateinit var workGroup: WorkGroup
 
     var pending by classList.property("pending")
+    var error by classList.property("error")
     private var nextScroll = 0.0
 
     var editable: Boolean = false

src/jsMain/kotlin/de/westermann/kwebview/View.kt

@@ -144,6 +144,6 @@ abstract class View(view: HTMLElement = createHtmlView()) {
     }
 
     companion object {
-        fun wrap(htmlElement: HTMLElement) = object : View(htmlElement) {}
+        fun wrap(htmlElement: HTMLElement, init: View.() -> Unit = {}) = object : View(htmlElement) {}.also(init)
     }
 }

src/jsMain/resources/style/style.scss

@@ -296,6 +296,7 @@ a {
 
     span {
       padding: 0 0.5rem;
+
       &:hover {
         background-color: rgba($text-primary-color, 0.06);
       }
@@ -321,6 +322,12 @@ a {
   }
 }
 
+textarea.form-control {
+  height: 16rem;
+  line-height: 1.1rem;
+  padding: 0.6rem 1rem;
+}
+
 select:-moz-focusring {
   color: transparent;
   text-shadow: 0 0 0 $text-primary-color;
@@ -671,6 +678,10 @@ form {
     opacity: 0.6;
   }
 
+  &.error {
+    outline: solid 0.4rem $error-color;
+  }
+
   @include no-select()
 }
 
@@ -908,4 +919,115 @@ form {
       width: 4rem;
     }
   }
+}
+
+.work-group-constraints {
+  position: relative;
+}
+
+.work-group-constraints-add {
+  position: absolute;
+  top: 0;
+  right: 0;
+}
+
+.work-group-constraints-add-list {
+  position: absolute;
+  top: 0;
+  right: 0;
+  z-index: 1;
+  display: none;
+
+  background: $background-primary-color;
+  border: solid 1px rgba($text-primary-color, 0.1);
+
+  span {
+    padding: 0 0.5rem;
+
+    &:hover {
+      background-color: rgba($text-primary-color, 0.06);
+    }
+  }
+
+  &.active {
+    display: block;
+  }
+}
+
+.overview {
+  display: flex;
+}
+
+.overview-main {
+  flex-grow: 4;
+  margin-right: 1rem;
+}
+
+.overview-side {
+  min-width: 20%;
+}
+
+.overview-shortcuts {
+  a {
+    display: block;
+  }
+}
+
+.overview-twitter {
+  height: 20rem;
+  background-color: #b3e6f9;
+}
+
+.post {
+  position: relative;
+  padding-top: 2rem;
+}
+
+.post-name {
+  position: absolute;
+  top: 0;
+  left: 0;
+  font-size: 1.2rem;
+  color: $primary-color;
+  line-height: 2rem;
+
+  &:empty::before {
+    display: block;
+    content: 'No title';
+    opacity: 0.5;
+    font-size: 1.2rem;
+    line-height: 2rem;
+    color: $text-primary-color;
+  }
+}
+.post-edit {
+  position: absolute;
+  top: 0;
+  right: 0;
+  line-height: 2rem;
+}
+
+.post-content {
+  h1, h2, h3, h4, h5, h6 {
+    margin: 0;
+    padding: 0;
+  }
+  h1 {
+    font-size: 1rem;
+  }
+  h2 {
+    font-size: 1rem;
+  }
+  h3 {
+    font-size: 1rem;
+  }
+  h4 {
+    font-size: 1rem;
+  }
+  h5 {
+    font-size: 1rem;
+  }
+  h6 {
+    font-size: 1rem;
+  }
 }