From dbce7b0b62b84b41528c34e986c3880f55c2c86d Mon Sep 17 00:00:00 2001
From: Tom Schindler <tom.schindler@student.uni-halle.de>
Date: Mon, 24 Jun 2024 18:33:23 +0200
Subject: [PATCH] Html.select ausgetestet
---
public/main.js | 124 +++++++++++++++++++++++++++++++++++++++-----
src/Main.elm | 15 ++++++
src/Scatterplot.elm | 11 +++-
3 files changed, 134 insertions(+), 16 deletions(-)
diff --git a/public/main.js b/public/main.js
index 19a28d3..7eb45c1 100644
--- a/public/main.js
+++ b/public/main.js
@@ -7487,20 +7487,30 @@ var $author$project$Main$update = F2(
$elm$core$Platform$Cmd$none);
}
default:
- if (msg.a.$ === 'ChangeText1') {
- var _v2 = msg.a;
- return _Utils_Tuple2(
- _Utils_update(
- model,
- {csvdata: 'Text1'}),
- $elm$core$Platform$Cmd$none);
- } else {
- var _v3 = msg.a;
- return _Utils_Tuple2(
- _Utils_update(
- model,
- {csvdata: 'Text2'}),
- $elm$core$Platform$Cmd$none);
+ switch (msg.a.$) {
+ case 'ChangeText1':
+ var _v2 = msg.a;
+ return _Utils_Tuple2(
+ _Utils_update(
+ model,
+ {csvdata: 'Text1'}),
+ $elm$core$Platform$Cmd$none);
+ case 'ChangeText2':
+ var _v3 = msg.a;
+ return _Utils_Tuple2(
+ _Utils_update(
+ model,
+ {csvdata: 'Text2'}),
+ $elm$core$Platform$Cmd$none);
+ default:
+ var value = msg.a.a;
+ return _Utils_Tuple2(
+ _Utils_update(
+ model,
+ {
+ csvdata: (value === 'Text1') ? 'Text1' : ((value === 'Text2') ? 'Text2' : '')
+ }),
+ $elm$core$Platform$Cmd$none);
}
}
});
@@ -7510,6 +7520,9 @@ var $author$project$Main$ScatterplotMsg = function (a) {
var $elm$html$Html$div = _VirtualDom_node('div');
var $elm$virtual_dom$VirtualDom$map = _VirtualDom_map;
var $elm$html$Html$map = $elm$virtual_dom$VirtualDom$map;
+var $author$project$Scatterplot$ChangeText = function (a) {
+ return {$: 'ChangeText', a: a};
+};
var $author$project$Scatterplot$ChangeText1 = {$: 'ChangeText1'};
var $author$project$Scatterplot$ChangeText2 = {$: 'ChangeText2'};
var $elm$html$Html$button = _VirtualDom_node('button');
@@ -7574,6 +7587,40 @@ var $elm$html$Html$Events$onClick = function (msg) {
'click',
$elm$json$Json$Decode$succeed(msg));
};
+var $elm$html$Html$Events$alwaysStop = function (x) {
+ return _Utils_Tuple2(x, true);
+};
+var $elm$virtual_dom$VirtualDom$MayStopPropagation = function (a) {
+ return {$: 'MayStopPropagation', a: a};
+};
+var $elm$html$Html$Events$stopPropagationOn = F2(
+ function (event, decoder) {
+ return A2(
+ $elm$virtual_dom$VirtualDom$on,
+ event,
+ $elm$virtual_dom$VirtualDom$MayStopPropagation(decoder));
+ });
+var $elm$json$Json$Decode$field = _Json_decodeField;
+var $elm$json$Json$Decode$at = F2(
+ function (fields, decoder) {
+ return A3($elm$core$List$foldr, $elm$json$Json$Decode$field, decoder, fields);
+ });
+var $elm$json$Json$Decode$string = _Json_decodeString;
+var $elm$html$Html$Events$targetValue = A2(
+ $elm$json$Json$Decode$at,
+ _List_fromArray(
+ ['target', 'value']),
+ $elm$json$Json$Decode$string);
+var $elm$html$Html$Events$onInput = function (tagger) {
+ return A2(
+ $elm$html$Html$Events$stopPropagationOn,
+ 'input',
+ A2(
+ $elm$json$Json$Decode$map,
+ $elm$html$Html$Events$alwaysStop,
+ A2($elm$json$Json$Decode$map, tagger, $elm$html$Html$Events$targetValue)));
+};
+var $elm$html$Html$option = _VirtualDom_node('option');
var $elm_community$typed_svg$TypedSvg$Types$AnchorMiddle = {$: 'AnchorMiddle'};
var $elm_community$typed_svg$TypedSvg$Types$Percent = function (a) {
return {$: 'Percent', a: a};
@@ -8683,6 +8730,16 @@ var $author$project$Scatterplot$scatterplot = function (model) {
model.data))
]));
};
+var $elm$html$Html$select = _VirtualDom_node('select');
+var $elm$json$Json$Encode$string = _Json_wrap;
+var $elm$html$Html$Attributes$stringProperty = F2(
+ function (key, string) {
+ return A2(
+ _VirtualDom_property,
+ key,
+ $elm$json$Json$Encode$string(string));
+ });
+var $elm$html$Html$Attributes$value = $elm$html$Html$Attributes$stringProperty('value');
var $author$project$Scatterplot$viewScatterplot = function (model) {
var filteredSmartphoneData = $author$project$Scatterplot$filterSmartphones(model.data);
return A2(
@@ -8710,6 +8767,45 @@ var $author$project$Scatterplot$viewScatterplot = function (model) {
[
$elm$html$Html$text('Text2')
])),
+ A2(
+ $elm$html$Html$select,
+ _List_fromArray(
+ [
+ $elm$html$Html$Events$onInput($author$project$Scatterplot$ChangeText)
+ ]),
+ _List_fromArray(
+ [
+ A2(
+ $elm$html$Html$option,
+ _List_fromArray(
+ [
+ $elm$html$Html$Attributes$value('')
+ ]),
+ _List_fromArray(
+ [
+ $elm$html$Html$text('')
+ ])),
+ A2(
+ $elm$html$Html$option,
+ _List_fromArray(
+ [
+ $elm$html$Html$Attributes$value('Text1')
+ ]),
+ _List_fromArray(
+ [
+ $elm$html$Html$text('Text1')
+ ])),
+ A2(
+ $elm$html$Html$option,
+ _List_fromArray(
+ [
+ $elm$html$Html$Attributes$value('Text2')
+ ]),
+ _List_fromArray(
+ [
+ $elm$html$Html$text('Text2')
+ ]))
+ ])),
$author$project$Scatterplot$scatterplot(filteredSmartphoneData),
$elm$html$Html$text(model.csvdata)
]));
diff --git a/src/Main.elm b/src/Main.elm
index 22d238e..8ce5209 100644
--- a/src/Main.elm
+++ b/src/Main.elm
@@ -96,6 +96,21 @@ update msg model =
ScatterplotMsg Scatterplot.ChangeText2 ->
( { model | csvdata = "Text2" }, Cmd.none )
+ ScatterplotMsg (Scatterplot.ChangeText value) ->
+ ( { model
+ | csvdata =
+ if value == "Text1" then
+ "Text1"
+
+ else if value == "Text2" then
+ "Text2"
+
+ else
+ ""
+ }
+ , Cmd.none
+ )
+
-- VIEW
diff --git a/src/Scatterplot.elm b/src/Scatterplot.elm
index e44d4e1..0332953 100644
--- a/src/Scatterplot.elm
+++ b/src/Scatterplot.elm
@@ -1,8 +1,9 @@
module Scatterplot exposing (..)
import Axis exposing (..)
-import Html exposing (Html)
-import Html.Events exposing (onClick)
+import Html exposing (Html, option)
+import Html.Attributes exposing (disabled, value)
+import Html.Events exposing (onClick, onInput)
import Scale exposing (ContinuousScale)
import Statistics
import TypedSvg exposing (circle, g, style, svg, text_)
@@ -239,6 +240,11 @@ viewScatterplot model =
Html.div []
[ Html.button [ onClick ChangeText1 ] [ Html.text "Text1" ]
, Html.button [ onClick ChangeText2 ] [ Html.text "Text2" ]
+ , Html.select [ onInput ChangeText ]
+ [ option [ value "" ] [ Html.text "" ]
+ , option [ value "Text1" ] [ Html.text "Text1" ]
+ , option [ value "Text2" ] [ Html.text "Text2" ]
+ ]
, scatterplot filteredSmartphoneData
, Html.text model.csvdata
]
@@ -247,3 +253,4 @@ viewScatterplot model =
type Msg
= ChangeText1
| ChangeText2
+ | ChangeText String
--
GitLab