You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@isis.apache.org by jo...@apache.org on 2021/01/14 17:41:39 UTC

[isis] 03/04: ISIS-2465 EventChart amended, index.html changed to show favicon & license note moved down (charset has to be within the first 1024 bytes).

This is an automated email from the ASF dual-hosted git repository.

joergrade pushed a commit to branch ISIS-2465_Kroviz-Demo_Menu_Actions_Show_No_Output
in repository https://gitbox.apache.org/repos/asf/isis.git

commit 58a5ffd1a7f571e4da9f83e58676a8e6bb602cb8
Author: Jörg Rade <jo...@kuehne-nagel.com>
AuthorDate: Thu Jan 14 18:26:53 2021 +0100

    ISIS-2465 EventChart amended, index.html changed to show favicon & license note moved down (charset has to be within the first 1024 bytes).
---
 .../isis/client/kroviz/core/event/EventStore.kt    |  8 +-
 .../isis/client/kroviz/ui/EventExportDialog.kt     | 23 +++---
 .../isis/client/kroviz/ui/kv/ChartFactory.kt       |  3 +-
 .../apache/isis/client/kroviz/ui/kv/ChartModel.kt  | 50 ++----------
 .../apache/isis/client/kroviz/ui/kv/EventChart.kt  | 41 +++++-----
 .../isis/client/kroviz/ui/kv/EventChartModel.kt    | 88 ++++++++++++++++++++++
 .../isis/client/kroviz/ui/kv/EventLogTableMgr.kt   |  7 ++
 .../apache/isis/client/kroviz/ui/kv/RoMenuBar.kt   |  2 +-
 .../ui/kv/{ChartModel.kt => SampleChartModel.kt}   | 17 +++--
 incubator/clients/kroviz/src/main/web/index.html   | 20 ++---
 10 files changed, 160 insertions(+), 99 deletions(-)

diff --git a/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/core/event/EventStore.kt b/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/core/event/EventStore.kt
index ecb8d6e..60414c9 100644
--- a/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/core/event/EventStore.kt
+++ b/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/core/event/EventStore.kt
@@ -35,12 +35,12 @@ import pl.treksoft.kvision.state.observableListOf
  */
 object EventStore {
     var log = observableListOf<LogEntry>()
-    private var logStartTime: Int = 0
+    var logStartTime: Int = 0
 
     private fun log(logEntry: LogEntry) {
         log.add(logEntry)
         if (log.size == 1) {
-            logStartTime = logEntry.createdAt.getMilliseconds()
+            logStartTime = logEntry.createdAt.getTime().toInt()
         }
     }
 
@@ -58,13 +58,13 @@ object EventStore {
     }
 
     fun add(reSpec: ResourceSpecification) {
-        val entry = LogEntry(url = reSpec.url)
+        val entry = LogEntry(reSpec.url)
         log(entry)
         updateStatus(entry)
     }
 
     fun addView(title: String, aggregator: BaseAggregator, panel: SimplePanel) {
-        val entry = LogEntry(title = title, aggregator = aggregator)
+        val entry = LogEntry(title = title, aggregator)
         entry.obj = panel
         log(entry)
         updateStatus(entry)
diff --git a/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/EventExportDialog.kt b/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/EventExportDialog.kt
index d4ca991..55cbfac 100644
--- a/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/EventExportDialog.kt
+++ b/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/EventExportDialog.kt
@@ -47,7 +47,7 @@ class EventExportDialog() : Command() {
     }
 
     override fun execute() {
-        val filter = extractUserInput("Filter");
+        val filter = extractUserInput("Filter")
         var fileName = ""
         when (filter) {
             "NONE" -> {
@@ -65,7 +65,7 @@ class EventExportDialog() : Command() {
             else -> {
             }
         }
-        val format = extractUserInput("Format");
+        val format = extractUserInput("Format")
         when (format) {
             "CSV" -> {
                 output = asCsv(events)
@@ -120,7 +120,6 @@ class EventExportDialog() : Command() {
     }
 
     fun open() {
-        console.log("[ExportDialog.open]")
         val format = mutableListOf<StringPair>()
         format.add(StringPair("CSV", "CSV"))
         format.add(StringPair("JSON", "JSON"))
@@ -136,16 +135,16 @@ class EventExportDialog() : Command() {
     }
 
     private fun asCsv(events: MutableList<ReplayEvent>): String {
-        val DEL = ";"
-        val NL = "\n"
-        var csv = "URL$DEL STATE$DEL METHOD$DEL REQUEST$DEL START$DEL DURATION$NL"
+        val del = ";"
+        val nl = "\n"
+        var csv = "URL$del STATE$del METHOD$del REQUEST$del START$del DURATION$nl"
         events.forEach { e ->
-            csv += e.url + DEL
-            csv += e.state + DEL
-            csv += e.method + DEL
-            csv += e.request + DEL
-            csv += e.start + DEL
-            csv += e.duration.toString() + NL
+            csv += e.url + del
+            csv += e.state + del
+            csv += e.method + del
+            csv += e.request + del
+            csv += e.start + del
+            csv += e.duration.toString() + nl
         }
         return csv
     }
diff --git a/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/ChartFactory.kt b/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/ChartFactory.kt
index f16ec45..aa01ab2 100644
--- a/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/ChartFactory.kt
+++ b/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/ChartFactory.kt
@@ -23,6 +23,7 @@ import org.apache.isis.client.kroviz.core.event.LogEntry
 class ChartFactory {
 
     fun build(logEventList: MutableList<LogEntry> = mutableListOf<LogEntry>()): EventChart {
-        return EventChart(ChartModel())
+        val model = EventChartModel(logEventList)
+        return EventChart(model)
     }
 }
diff --git a/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/ChartModel.kt b/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/ChartModel.kt
index 96d020b..9bfd4e9 100644
--- a/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/ChartModel.kt
+++ b/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/ChartModel.kt
@@ -20,52 +20,16 @@ package org.apache.isis.client.kroviz.ui.kv
 
 import pl.treksoft.kvision.chart.DataSets
 import pl.treksoft.kvision.core.Color
-import pl.treksoft.kvision.i18n.I18n
 
-class ChartModel() {
+interface ChartModel {
 
-    private val bgColorList = listOf(
-            Color.hex(0xC0504D),
-            Color.hex(0xF79646),
-            Color.hex(0x9BBB59),
-            Color.hex(0x4BACC6),
-            Color.hex(0x4F81BD),
-            Color.hex(0x8064A2)
-    )
+    var bgColorList: MutableList<Color>
+    var bgColorList2: MutableList<Color>
+    var labelList: MutableList<String>
 
-    private val bgColorList2 = listOf(
-            Color.hex(0xC0504D.or(0x303030)),
-            Color.hex(0xF79646.or(0x303030)),
-            Color.hex(0x9BBB59.or(0x203030)),
-            Color.hex(0x4BACC6.or(0x301010)),
-            Color.hex(0x4F81BD.or(0x101010)),
-            Color.hex(0x8064A2.or(0x303030))
-    )
+    var datasetList : MutableList<DataSets>
 
-    val labelList = listOf<String>(
-            I18n.tr("BU 6"),
-            I18n.tr("BU 5"),
-            I18n.tr("BU 4"),
-            I18n.tr("BU 3"),
-            I18n.tr("BU 2"),
-            I18n.tr("BU 1")
-    )
+    var ds1: DataSets
+    var ds2: DataSets
 
-    val datasetList = mutableListOf<DataSets>()
-
-    private val ds1 = DataSets(
-            data = listOf(300, 727, 589, 537, 543, 574),
-            backgroundColor = bgColorList,
-            label = "initial"
-    )
-    private val ds2 = DataSets(
-            data = listOf(400, 238, 553, 746, 884, 903),
-            backgroundColor = bgColorList2,
-            label = "duplicates"
-    )
-
-    init {
-        datasetList.add(ds1)
-        datasetList.add(ds2)
-    }
 }
diff --git a/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/EventChart.kt b/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/EventChart.kt
index 06e989e..19c6880 100644
--- a/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/EventChart.kt
+++ b/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/EventChart.kt
@@ -19,39 +19,36 @@
 package org.apache.isis.client.kroviz.ui.kv
 
 import pl.treksoft.kvision.chart.*
-import pl.treksoft.kvision.core.Color
 import pl.treksoft.kvision.panel.SimplePanel
 import pl.treksoft.kvision.utils.obj
 import pl.treksoft.kvision.utils.px
 
-external fun rgba(r: Int, g: Int, b: Int, a: Int): String
-
 //IMPROVE https://github.com/datavisyn/chartjs-chart-box-and-violin-plot
-class EventChart(model:ChartModel) : SimplePanel() {
+class EventChart(model: ChartModel) : SimplePanel() {
+
+    private val font = "'Open Sans Bold', sans-serif"
 
     private val yAxes = listOf(obj {
-        gridLines = {
-            display = Display.FLEX
-            color = Color.hex(0xffffff)
-            zeroLineColor = Color.hex(0xffffff)
-//            zeroLineWidth = 1
-        }
+        scaleLabel = { ScaleTitleOptions(display = true, labelString = "duration (ms)") }
+        gridLines = { GridLineOptions(visible = true) }
         ticks = obj {
-            fontFamily = "'Open Sans Bold', sans-serif"
-            fontSize = 11.px
+            fontFamily = font
+            fontSize =  11.px
         }
-        stacked = true
     })
 
+    private val tickFormatter = "function(tick) {return tick.split('\\n')[1]}"
+
     private val xAxes = listOf(obj {
-        barThickness = 20
+        scaleLabel = { ScaleTitleOptions(display = true, labelString = "start offset (ms)") }
+        gridLines = { GridLineOptions(visible = true) }
         ticks = obj {
             beginAtZero = true
-            fontFamily = "'Open Sans Bold', sans-serif"
+            fontFamily = font
             fontSize = 11.px
+            //WHAT A HACK
+            callback = js(tickFormatter)
         }
-        gridLines = { GridLineOptions(visible = true) }
-        stacked = true
     })
 
     private val options = ChartOptions(
@@ -60,7 +57,9 @@ class EventChart(model:ChartModel) : SimplePanel() {
             legend = LegendOptions(display = true),
             scales = ChartScales(
                     yAxes = yAxes,
-                    xAxes = xAxes),
+                    xAxes = xAxes,
+                    display = true,
+                    type = ScalesType.TIME),
             showLines = true,
             title = TitleOptions(display = true))
 
@@ -68,13 +67,13 @@ class EventChart(model:ChartModel) : SimplePanel() {
         this.marginTop = 10.px
         chart(
                 configuration = Configuration(
-                        type = ChartType.HORIZONTALBAR,
+                        type = ChartType.BAR,
                         dataSets = model.datasetList,
                         labels = model.labelList,
                         options = options
                 ),
-                chartHeight = 600,
-                chartWidth = 1000
+                chartHeight = 1000,
+                chartWidth = 3000
         )
     }
 
diff --git a/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/EventChartModel.kt b/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/EventChartModel.kt
new file mode 100644
index 0000000..5f76dcd
--- /dev/null
+++ b/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/EventChartModel.kt
@@ -0,0 +1,88 @@
+/*
+ *  Licensed to the Apache Software Foundation (ASF) under one
+ *  or more contributor license agreements.  See the NOTICE file
+ *  distributed with this work for additional information
+ *  regarding copyright ownership.  The ASF licenses this file
+ *  to you under the Apache License, Version 2.0 (the
+ *  "License"); you may not use this file except in compliance
+ *  with the License.  You may obtain a copy of the License at
+ *
+ *        http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *  Unless required by applicable law or agreed to in writing,
+ *  software distributed under the License is distributed on an
+ *  "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ *  KIND, either express or implied.  See the License for the
+ *  specific language governing permissions and limitations
+ *  under the License.
+ */
+package org.apache.isis.client.kroviz.ui.kv
+
+import org.apache.isis.client.kroviz.core.event.EventStore
+import org.apache.isis.client.kroviz.core.event.LogEntry
+import pl.treksoft.kvision.chart.DataSets
+import pl.treksoft.kvision.core.Color
+import kotlin.math.max
+import kotlin.js.Date
+
+class EventChartModel(log: List<LogEntry>) : ChartModel {
+
+    override var bgColorList = mutableListOf<Color>()
+    override var bgColorList2 = mutableListOf<Color>()
+    override var datasetList = mutableListOf<DataSets>()
+    override var labelList = mutableListOf<String>()
+    val dataList = mutableListOf<Int>()
+    override var ds1 = DataSets()
+    override var ds2 = DataSets()
+
+    private val violett = Color.hex(0x8064A2)
+    private val red = Color.hex(0xC0504D)
+    private val yellow = Color.hex(0xF79646)
+    private val green = Color.hex(0x9BBB59)
+    private val blue = Color.hex(0x4F81BD)
+
+    private var startTime = Date()
+
+    init {
+        val maxResponseLength = EventStore.maxResponseLength()
+        var i = 0
+        log.forEach { le ->
+            i += 1
+            if (i == 1) startTime = le.createdAt
+            val q = le.responseLength.div(maxResponseLength)
+            when {
+                (q >= 0) && (q <= 0.2) -> bgColorList.add(blue)
+                (q > 0.2) && (q <= 0.4) -> bgColorList.add(green)
+                (q > 0.4) && (q <= 0.6) -> bgColorList.add(yellow)
+                (q > 0.6) && (q <= 0.8) -> bgColorList.add(red)
+                else -> bgColorList.add(violett)
+            }
+            labelList.add(le.toLabel(i))
+            dataList.add(le.duration)
+        }
+        ds1 = DataSets(
+                data = dataList,
+                backgroundColor = bgColorList,
+                label = "duration"
+        )
+
+        datasetList.add(ds1)
+    }
+
+    fun LogEntry.toLabel(index: Int): String {
+        return index.toString() + "\n" +
+                (this.createdAt.getTime() - startTime.getTime()).toString() + "\n" +
+                this.title + "\n" +
+                "start: " + this.createdAt.toISOString() + "\n" +
+                "rsp.len: " + this.responseLength
+    }
+
+    fun EventStore.maxResponseLength(): Int {
+        var maxRL = 0
+        log.forEach { le ->
+            maxRL = max(maxRL, le.responseLength)
+        }
+        return maxRL
+    }
+
+}
diff --git a/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/EventLogTableMgr.kt b/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/EventLogTableMgr.kt
index 07ea78a..95cd5d7 100644
--- a/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/EventLogTableMgr.kt
+++ b/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/EventLogTableMgr.kt
@@ -46,6 +46,13 @@ class EventLogTableMgr {
         })
         menu.add(a3)
 
+        val title = "Chart"
+        val a4 = UIAction(buildLabel(title, title), {
+            UiManager.add(title, ChartFactory().build(EventStore.log))
+        })
+        menu.add(a4)
+
+
         return menu.toTypedArray().asDynamic()
     }
 
diff --git a/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/RoMenuBar.kt b/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/RoMenuBar.kt
index 0f6253d..ed089d3 100644
--- a/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/RoMenuBar.kt
+++ b/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/RoMenuBar.kt
@@ -89,7 +89,7 @@ object RoMenuBar : SimplePanel() {
             ddLink(chartTitle,
                     icon = IconManager.find("Chart")
             ).onClick {
-                UiManager.add(chartTitle, ChartFactory().build())
+                UiManager.add(chartTitle, EventChart(SampleChartModel()))
             }
 
             val geoMapTitle = "Sample Geo Map"
diff --git a/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/ChartModel.kt b/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/SampleChartModel.kt
similarity index 85%
copy from incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/ChartModel.kt
copy to incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/SampleChartModel.kt
index 96d020b..0a6ee54 100644
--- a/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/ChartModel.kt
+++ b/incubator/clients/kroviz/src/main/kotlin/org/apache/isis/client/kroviz/ui/kv/SampleChartModel.kt
@@ -22,9 +22,10 @@ import pl.treksoft.kvision.chart.DataSets
 import pl.treksoft.kvision.core.Color
 import pl.treksoft.kvision.i18n.I18n
 
-class ChartModel() {
+@Deprecated("simple sample")
+class SampleChartModel() : ChartModel {
 
-    private val bgColorList = listOf(
+    override var bgColorList = mutableListOf(
             Color.hex(0xC0504D),
             Color.hex(0xF79646),
             Color.hex(0x9BBB59),
@@ -33,7 +34,7 @@ class ChartModel() {
             Color.hex(0x8064A2)
     )
 
-    private val bgColorList2 = listOf(
+    override var bgColorList2 = mutableListOf(
             Color.hex(0xC0504D.or(0x303030)),
             Color.hex(0xF79646.or(0x303030)),
             Color.hex(0x9BBB59.or(0x203030)),
@@ -42,7 +43,7 @@ class ChartModel() {
             Color.hex(0x8064A2.or(0x303030))
     )
 
-    val labelList = listOf<String>(
+    override var labelList = mutableListOf<String>(
             I18n.tr("BU 6"),
             I18n.tr("BU 5"),
             I18n.tr("BU 4"),
@@ -51,14 +52,15 @@ class ChartModel() {
             I18n.tr("BU 1")
     )
 
-    val datasetList = mutableListOf<DataSets>()
+    override var datasetList = mutableListOf<DataSets>()
 
-    private val ds1 = DataSets(
+    override var ds1 = DataSets(
             data = listOf(300, 727, 589, 537, 543, 574),
             backgroundColor = bgColorList,
             label = "initial"
     )
-    private val ds2 = DataSets(
+
+    override var ds2 = DataSets(
             data = listOf(400, 238, 553, 746, 884, 903),
             backgroundColor = bgColorList2,
             label = "duplicates"
@@ -68,4 +70,5 @@ class ChartModel() {
         datasetList.add(ds1)
         datasetList.add(ds2)
     }
+
 }
diff --git a/incubator/clients/kroviz/src/main/web/index.html b/incubator/clients/kroviz/src/main/web/index.html
index e579ae8..da606f7 100644
--- a/incubator/clients/kroviz/src/main/web/index.html
+++ b/incubator/clients/kroviz/src/main/web/index.html
@@ -1,4 +1,14 @@
 <!DOCTYPE html>
+<html lang="en">
+<head>
+    <link rel="icon" type="image/svg+xml" href="img/kroviz-logo.svg" sizes="any">
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>kroViz</title>
+    <script type="text/javascript" src="main.bundle.js"></script>
+</head>
+<body>
 <!-- Licensed to the Apache Software Foundation (ASF) under one or more contributor
 	license agreements. See the NOTICE file distributed with this work for additional
 	information regarding copyright ownership. The ASF licenses this file to
@@ -9,16 +19,6 @@
 	License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS
 	OF ANY KIND, either express or implied. See the License for the specific
 	language governing permissions and limitations under the License. -->
-<html lang="en">
-<head>
-    <link rel="icon" type="image/x-icon" href="../resources/img/2-2-clapperboard-png-thumb.png">
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>kroViz</title>
-    <script type="text/javascript" src="main.bundle.js"></script>
-</head>
-<body>
 <div id="kroviz"></div>
 </body>
 </html>