From 948eaae79b8dbb38fcb66a486f21954b7066d4d2 Mon Sep 17 00:00:00 2001 From: Edward <sabinusedward@yahoo.de> Date: Wed, 8 Jul 2020 12:05:54 +0200 Subject: [PATCH] Merge EncodeDecodeUrl to newDevelop --- index.html | 83 ++++++++++++----- src/Manager/UpdateManager.elm | 166 +++++++++++++++++++--------------- src/ShapePicture_Editor.elm | 2 +- src/TypeHolder.elm | 9 +- src/Util/ShapeManager.elm | 15 +-- src/Util/ViewParts.elm | 7 +- 6 files changed, 171 insertions(+), 111 deletions(-) diff --git a/index.html b/index.html index d87b867..097673b 100644 --- a/index.html +++ b/index.html @@ -7097,6 +7097,9 @@ var $author$project$Util$ViewParts$viewImage = function (model) { ])) ])); }; +var $author$project$TypeHolder$GotJson = function (a) { + return {$: 'GotJson', a: a}; +}; var $elm$html$Html$pre = _VirtualDom_node('pre'); var $elm$json$Json$Encode$object = function (pairs) { return _Json_wrap( @@ -7111,22 +7114,6 @@ var $elm$json$Json$Encode$object = function (pairs) { _Json_emptyObject(_Utils_Tuple0), pairs)); }; -var $author$project$Util$ShapeManager$pictureInfoToJson = function (url) { - var jsonObj = $elm$json$Json$Encode$object( - _List_fromArray( - [ - _Utils_Tuple2( - 'pictureInfo', - $elm$json$Json$Encode$object( - _List_fromArray( - [ - _Utils_Tuple2( - 'url', - $elm$json$Json$Encode$string(url)) - ]))) - ])); - return jsonObj; -}; var $elm$json$Json$Encode$list = F2( function (func, entries) { return _Json_wrap( @@ -7352,8 +7339,8 @@ var $author$project$Util$ShapeManager$writeAlltoJson = F2( _List_fromArray( [ _Utils_Tuple2( - 'Url', - $author$project$Util$ShapeManager$pictureInfoToJson(picUrl)), + 'pictureUrl', + $elm$json$Json$Encode$string(picUrl)), _Utils_Tuple2( 'shapes', $author$project$Util$ShapeManager$writeShapeToJson(shapeWithProperties)) @@ -7369,6 +7356,20 @@ var $author$project$Util$ViewParts$viewJsonModal = function (model) { _List_fromArray( [ A2( + $elm$html$Html$button, + _List_fromArray( + [ + $elm$html$Html$Events$onClick( + $author$project$TypeHolder$GotJson(model.stringToShapes)), + $elm$html$Html$Attributes$class('button is-success is-pulled-left is-size-6'), + A2($elm$html$Html$Attributes$style, 'margin-right', '15px'), + A2($elm$html$Html$Attributes$style, 'margin-bottom', '15px') + ]), + _List_fromArray( + [ + $elm$html$Html$text('string to shapes') + ])), + A2( $elm$html$Html$div, _List_Nil, _List_fromArray( @@ -9374,7 +9375,7 @@ var $author$project$ShapePicture_Editor$init = F3( saved: _List_Nil, shapesLoadResult: $elm$core$Result$Ok(' Init'), state: $author$project$Manager$StateManager$Standby, - stringToShapes: '[{\"shape\": {\"circle\": {\"cx\": \"589\",\"cy\": \"108\",\"r\": \"79\"}},\"shapeprop\": {\"hFC\": \"white\",\"hFO\": \"0.5\", \"hSC\": \"red\", \"hSW\": \"3\", \"hSO\": \"1.0\", \"uFC\": \"white\",\"uFO\": \"0.0\", \"uSC\": \"red\", \"uSW\": \"3\", \"uSO\": \"1.0\", \"title\": \"default\", \"body\": \"default\" }}, { \"shape\": { \"rect\": { \"x\": \"265\", \"y\": \"64\", \"width\": \"64\", \"height\": \"54\" } }, \"shapeprop\": { \"hFC\": \"white\", \"hFO\": \"0.5\", \"hSC\": \"red\", \"hSW\": \"3\", \"hSO\": \"1.0\", \"uFC\": \"white\", \"uFO\": \"0.0\", \"uSC\": \"red\", \"uSW\": \"3\", \"uSO\": \"1.0\", \"title\": \"default\", \"body\": \"default\" } }, { \"shape\": { \"ellipse\": { \"cx\": \"380\", \"cy\": \"296\", \"rx\": \"68\", \"ry\": \"61\" } }, \"shapeprop\": { \"hFC\": \"white\", \"hFO\": \"0.5\", \"hSC\": \"red\", \"hSW\": \"3\", \"hSO\": \"1.0\", \"uFC\": \"white\", \"uFO\": \"0.0\", \"uSC\": \"red\", \"uSW\": \"3\", \"uSO\": \"1.0\", \"title\": \"default\", \"body\": \"default\" } }, { \"shape\": { \"polygon\": [ { \"x\": \"269\", \"y\": \"150\" }, { \"x\": \"301\", \"y\": \"192\" }, { \"x\": \"365\", \"y\": \"216\" }, { \"x\": \"265\", \"y\": \"220\" } ] }, \"shapeprop\": { \"hFC\": \"white\", \"hFO\": \"0.5\", \"hSC\": \"red\", \"hSW\": \"3\", \"hSO\": \"1.0\", \"uFC\": \"white\", \"uFO\": \"0.0\", \"uSC\": \"red\", \"uSW\": \"3\", \"uSO\": \"1.0\", \"title\": \"default\", \"body\": \"default\" } } ]', + stringToShapes: '{\"pictureUrl\":\"https://i2-prod.mirror.co.uk/incoming/article9690209.ece/ALTERNATES/s1200/Namibia.jpg\",\"shapes\":[{\"shape\":{\"circle\":{\"cx\":\"50\",\"cy\":\"50\",\"r\":\"40\"}},\"shapeprop\":{\"hFC\":\"white\",\"hFO\":\"0.5\",\"hSC\":\"red\",\"hSW\":\"3\",\"hSO\":\"1.0\",\"uFC\":\"white\",\"uFO\":\"0.0\",\"uSC\":\"red\",\"uSW\":\"3\",\"uSO\":\"1.0\",\"title\":\"default\",\"body\":\"default\"}},{\"shape\":{\"rect\":{\"x\":\"100\",\"y\":\"100\",\"width\":\"50\",\"height\":\"60\"}},\"shapeprop\":{\"hFC\":\"white\",\"hFO\":\"0.5\",\"hSC\":\"red\",\"hSW\":\"3\",\"hSO\":\"1.0\",\"uFC\":\"white\",\"uFO\":\"0.0\",\"uSC\":\"red\",\"uSW\":\"3\",\"uSO\":\"1.0\",\"title\":\"default\",\"body\":\"default\"}},{\"shape\":{\"polygon\":[{\"x\":\"200\",\"y\":\"150\"},{\"x\":\"250\",\"y\":\"400\"},{\"x\":\"120\",\"y\":\"340\"},{\"x\":\"160\",\"y\":\"250\"},{\"x\":\"180\",\"y\":\"170\"}]},\"shapeprop\":{\"hFC\":\"white\",\"hFO\":\"0.5\",\"hSC\":\"red\",\"hSW\":\"3\",\"hSO\":\"1.0\",\"uFC\":\"white\",\"uFO\":\"0.0\",\"uSC\":\"red\",\"uSW\":\"3\",\"uSO\":\"1.0\",\"title\":\"default\",\"body\":\"default\"}}]}', svgShapeHover: 0, url: url }, @@ -9761,6 +9762,10 @@ var $author$project$Manager$StateManager$DrawShape = F2( function (a, b) { return {$: 'DrawShape', a: a, b: b}; }); +var $author$project$TypeHolder$ErweitertertesBild = F2( + function (picture, shapes) { + return {picture: picture, shapes: shapes}; + }); var $author$project$Manager$ModalManager$ResetShowInput = {$: 'ResetShowInput'}; var $author$project$Manager$ModalManager$modalNameToString = function (modal) { switch (modal.$) { @@ -9792,6 +9797,16 @@ var $author$project$Manager$StateManager$manageState = function (state) { 'NoModal', $author$project$Manager$StateManager$getModalFromState(state))) ? $author$project$Manager$StateManager$Standby : state; }; +var $elm$core$Maybe$map = F2( + function (f, maybe) { + if (maybe.$ === 'Just') { + var value = maybe.a; + return $elm$core$Maybe$Just( + f(value)); + } else { + return $elm$core$Maybe$Nothing; + } + }); var $elm$json$Json$Decode$map3 = _Json_map3; var $elm$json$Json$Decode$oneOf = _Json_oneOf; var $elm$core$Tuple$pair = F2( @@ -10950,7 +10965,22 @@ var $author$project$Manager$UpdateManager$updateModel = F2( A2($elm$json$Json$Decode$field, 'uSO', $elm$json$Json$Decode$string), A2($elm$json$Json$Decode$field, 'title', $elm$json$Json$Decode$string), A2($elm$json$Json$Decode$field, 'body', $elm$json$Json$Decode$string)))))); - var resultDecode = A2($elm$json$Json$Decode$decodeString, myDecoder, jsonString); + var erweitertesBildDecoder = A3( + $elm$json$Json$Decode$map2, + F2( + function (a, b) { + var maybeUrl = $elm$url$Url$fromString(a); + var maybePicture = A2( + $elm$core$Maybe$map, + function (u) { + return A3($author$project$Util$Util$Picture, u, 0, 0); + }, + maybeUrl); + return A2($author$project$TypeHolder$ErweitertertesBild, maybePicture, b); + }), + A2($elm$json$Json$Decode$field, 'pictureUrl', $elm$json$Json$Decode$string), + A2($elm$json$Json$Decode$field, 'shapes', myDecoder)); + var resultDecode = A2($elm$json$Json$Decode$decodeString, erweitertesBildDecoder, jsonString); if (resultDecode.$ === 'Err') { var jsonError = resultDecode.a; return _Utils_update( @@ -10962,7 +10992,18 @@ var $author$project$Manager$UpdateManager$updateModel = F2( var pl = resultDecode.a; return _Utils_update( model, - {errorString: '', saved: pl}); + { + errorString: '', + picture: A2( + $elm$core$Maybe$withDefault, + { + h: 0, + url: A6($elm$url$Url$Url, $elm$url$Url$Http, 'www.informatik.uni-halle.de', $elm$core$Maybe$Nothing, '/im/1285058520_1381_00_800.jpg', $elm$core$Maybe$Nothing, $elm$core$Maybe$Nothing), + w: 0 + }, + pl.picture), + saved: pl.shapes + }); } } } diff --git a/src/Manager/UpdateManager.elm b/src/Manager/UpdateManager.elm index c9d5cda..741c9d5 100644 --- a/src/Manager/UpdateManager.elm +++ b/src/Manager/UpdateManager.elm @@ -9,7 +9,7 @@ import Url -- Json import Json.Decode -- Own -import TypeHolder exposing (Model, Msg(..)) +import TypeHolder exposing (Model, ErweitertertesBild, Msg(..)) import Manager.StateManager exposing (..) import Manager.ModalManager exposing (..) import Util.ShapeManager exposing (..) @@ -134,93 +134,113 @@ updateModel msg model = let myDecoder : Json.Decode.Decoder (List (Shape, ShapeStyle)) myDecoder = - Json.Decode.list - (Json.Decode.map2 (\a b -> (a, b)) - (Json.Decode.field ("shape") - (Json.Decode.oneOf [ + (Json.Decode.list + (Json.Decode.map2 (\a b -> (a, b)) + (Json.Decode.field ("shape") + (Json.Decode.oneOf [ - (Json.Decode.field ( "circle") - (Json.Decode.map3 - (\a b c -> Circle a b c) - (Json.Decode.field "cx" Json.Decode.string) - (Json.Decode.field "cy" Json.Decode.string) - (Json.Decode.field "r" Json.Decode.string) - ) - ), - (Json.Decode.field ( "rect") - (Json.Decode.map4 - (\a b c d -> Rectangle a b c d) - (Json.Decode.field "x" Json.Decode.string) - (Json.Decode.field "y" Json.Decode.string) - (Json.Decode.field "width" Json.Decode.string) - (Json.Decode.field "height" Json.Decode.string) - ) - ), - (Json.Decode.field ( "ellipse") - (Json.Decode.map4 - (\a b c d -> Rectangle a b c d) - (Json.Decode.field "cx" Json.Decode.string) - (Json.Decode.field "cy" Json.Decode.string) - (Json.Decode.field "rx" Json.Decode.string) - (Json.Decode.field "ry" Json.Decode.string) - ) - ), + (Json.Decode.field ( "circle") + (Json.Decode.map3 + (\a b c -> Circle a b c) + (Json.Decode.field "cx" Json.Decode.string) + (Json.Decode.field "cy" Json.Decode.string) + (Json.Decode.field "r" Json.Decode.string) + ) + ), + (Json.Decode.field ( "rect") + (Json.Decode.map4 + (\a b c d -> Rectangle a b c d) + (Json.Decode.field "x" Json.Decode.string) + (Json.Decode.field "y" Json.Decode.string) + (Json.Decode.field "width" Json.Decode.string) + (Json.Decode.field "height" Json.Decode.string) + ) + ), + (Json.Decode.field ( "ellipse") + (Json.Decode.map4 + (\a b c d -> Rectangle a b c d) + (Json.Decode.field "cx" Json.Decode.string) + (Json.Decode.field "cy" Json.Decode.string) + (Json.Decode.field "rx" Json.Decode.string) + (Json.Decode.field "ry" Json.Decode.string) + ) + ), - (Json.Decode.map (\l -> Polygon l) ( - (Json.Decode.field ( "polygon") - (Json.Decode.list - (Json.Decode.map2 - (\a b -> ( a, b )) - (Json.Decode.field "x" Json.Decode.string) - (Json.Decode.field "y" Json.Decode.string) + (Json.Decode.map (\l -> Polygon l) ( + (Json.Decode.field ( "polygon") + (Json.Decode.list + (Json.Decode.map2 + (\a b -> ( a, b )) + (Json.Decode.field "x" Json.Decode.string) + (Json.Decode.field "y" Json.Decode.string) + ) ) ) + ) + ) + ] + ) ) - ) - ) - ] - ) - ) - ((Json.Decode.field ("shapeprop") ( - Json.Decode.map4 (\( a, b, c ) ( d, e, f ) - ( g, h, i ) ( j, k, l ) - -> ShapeStyle a b c d e f g h i j k l) - (Json.Decode.map3 - (\a b c -> ( a, b, c )) - (Json.Decode.field "hFC" Json.Decode.string) - (Json.Decode.field "hFO" Json.Decode.string) - (Json.Decode.field "hSC" Json.Decode.string) - ) - (Json.Decode.map3 (\a b c -> ( a, b, c )) - (Json.Decode.field "hSW" Json.Decode.string) - (Json.Decode.field "hSO" Json.Decode.string) - (Json.Decode.field "uFC" Json.Decode.string) - ) - (Json.Decode.map3 (\a b c -> ( a, b, c )) - (Json.Decode.field "uFO" Json.Decode.string) - (Json.Decode.field "uSC" Json.Decode.string) - (Json.Decode.field "uSW" Json.Decode.string) - ) - (Json.Decode.map3 (\a b c -> ( a, b, c )) - (Json.Decode.field "uSO" Json.Decode.string) - (Json.Decode.field "title" Json.Decode.string) - (Json.Decode.field "body" Json.Decode.string) + ((Json.Decode.field ("shapeprop") ( + Json.Decode.map4 (\( a, b, c ) ( d, e, f ) + ( g, h, i ) ( j, k, l ) + -> ShapeStyle a b c d e f g h i j k l) + (Json.Decode.map3 + (\a b c -> ( a, b, c )) + (Json.Decode.field "hFC" Json.Decode.string) + (Json.Decode.field "hFO" Json.Decode.string) + (Json.Decode.field "hSC" Json.Decode.string) + ) + (Json.Decode.map3 (\a b c -> ( a, b, c )) + (Json.Decode.field "hSW" Json.Decode.string) + (Json.Decode.field "hSO" Json.Decode.string) + (Json.Decode.field "uFC" Json.Decode.string) + ) + (Json.Decode.map3 (\a b c -> ( a, b, c )) + (Json.Decode.field "uFO" Json.Decode.string) + (Json.Decode.field "uSC" Json.Decode.string) + (Json.Decode.field "uSW" Json.Decode.string) + ) + (Json.Decode.map3 (\a b c -> ( a, b, c )) + (Json.Decode.field "uSO" Json.Decode.string) + (Json.Decode.field "title" Json.Decode.string) + (Json.Decode.field "body" Json.Decode.string) + ) + )) + ) + ) ) - )) - ) - ) + erweitertesBildDecoder : Json.Decode.Decoder ErweitertertesBild + erweitertesBildDecoder = Json.Decode.map2 + (\a b -> + let + maybeUrl = (Url.fromString a) + maybePicture = Maybe.map (\u -> Picture u 0 0) maybeUrl + in + ErweitertertesBild maybePicture b + ) + ( Json.Decode.field ("pictureUrl") Json.Decode.string) + (Json.Decode.field ( "shapes") myDecoder) - resultDecode : Result Json.Decode.Error (List (Shape, ShapeStyle)) + resultDecode : Result Json.Decode.Error ErweitertertesBild resultDecode = - Json.Decode.decodeString myDecoder jsonString + Json.Decode.decodeString erweitertesBildDecoder jsonString in case resultDecode of Err jsonError -> { model | errorString = Json.Decode.errorToString jsonError } Ok pl -> - { model | saved = pl, errorString = "" } + { model | saved = pl.shapes, errorString = "", + picture = Maybe.withDefault { url= ( Url.Url Url.Http + "www.informatik.uni-halle.de" + Nothing + "/im/1285058520_1381_00_800.jpg" + Nothing + Nothing + ) + , w = 0 , h = 0} pl.picture} updateCmdMsg : Msg -> Model -> Cmd Msg updateCmdMsg msg model = diff --git a/src/ShapePicture_Editor.elm b/src/ShapePicture_Editor.elm index a23a786..3114c46 100644 --- a/src/ShapePicture_Editor.elm +++ b/src/ShapePicture_Editor.elm @@ -41,7 +41,7 @@ init _ url key = , url = url , key = key , errorString = "" - , stringToShapes = "[{\"shape\": {\"circle\": {\"cx\": \"589\",\"cy\": \"108\",\"r\": \"79\"}},\"shapeprop\": {\"hFC\": \"white\",\"hFO\": \"0.5\", \"hSC\": \"red\", \"hSW\": \"3\", \"hSO\": \"1.0\", \"uFC\": \"white\",\"uFO\": \"0.0\", \"uSC\": \"red\", \"uSW\": \"3\", \"uSO\": \"1.0\", \"title\": \"default\", \"body\": \"default\" }}, { \"shape\": { \"rect\": { \"x\": \"265\", \"y\": \"64\", \"width\": \"64\", \"height\": \"54\" } }, \"shapeprop\": { \"hFC\": \"white\", \"hFO\": \"0.5\", \"hSC\": \"red\", \"hSW\": \"3\", \"hSO\": \"1.0\", \"uFC\": \"white\", \"uFO\": \"0.0\", \"uSC\": \"red\", \"uSW\": \"3\", \"uSO\": \"1.0\", \"title\": \"default\", \"body\": \"default\" } }, { \"shape\": { \"ellipse\": { \"cx\": \"380\", \"cy\": \"296\", \"rx\": \"68\", \"ry\": \"61\" } }, \"shapeprop\": { \"hFC\": \"white\", \"hFO\": \"0.5\", \"hSC\": \"red\", \"hSW\": \"3\", \"hSO\": \"1.0\", \"uFC\": \"white\", \"uFO\": \"0.0\", \"uSC\": \"red\", \"uSW\": \"3\", \"uSO\": \"1.0\", \"title\": \"default\", \"body\": \"default\" } }, { \"shape\": { \"polygon\": [ { \"x\": \"269\", \"y\": \"150\" }, { \"x\": \"301\", \"y\": \"192\" }, { \"x\": \"365\", \"y\": \"216\" }, { \"x\": \"265\", \"y\": \"220\" } ] }, \"shapeprop\": { \"hFC\": \"white\", \"hFO\": \"0.5\", \"hSC\": \"red\", \"hSW\": \"3\", \"hSO\": \"1.0\", \"uFC\": \"white\", \"uFO\": \"0.0\", \"uSC\": \"red\", \"uSW\": \"3\", \"uSO\": \"1.0\", \"title\": \"default\", \"body\": \"default\" } } ]" + , stringToShapes = "{\"pictureUrl\":\"https://i2-prod.mirror.co.uk/incoming/article9690209.ece/ALTERNATES/s1200/Namibia.jpg\",\"shapes\":[{\"shape\":{\"circle\":{\"cx\":\"50\",\"cy\":\"50\",\"r\":\"40\"}},\"shapeprop\":{\"hFC\":\"white\",\"hFO\":\"0.5\",\"hSC\":\"red\",\"hSW\":\"3\",\"hSO\":\"1.0\",\"uFC\":\"white\",\"uFO\":\"0.0\",\"uSC\":\"red\",\"uSW\":\"3\",\"uSO\":\"1.0\",\"title\":\"default\",\"body\":\"default\"}},{\"shape\":{\"rect\":{\"x\":\"100\",\"y\":\"100\",\"width\":\"50\",\"height\":\"60\"}},\"shapeprop\":{\"hFC\":\"white\",\"hFO\":\"0.5\",\"hSC\":\"red\",\"hSW\":\"3\",\"hSO\":\"1.0\",\"uFC\":\"white\",\"uFO\":\"0.0\",\"uSC\":\"red\",\"uSW\":\"3\",\"uSO\":\"1.0\",\"title\":\"default\",\"body\":\"default\"}},{\"shape\":{\"polygon\":[{\"x\":\"200\",\"y\":\"150\"},{\"x\":\"250\",\"y\":\"400\"},{\"x\":\"120\",\"y\":\"340\"},{\"x\":\"160\",\"y\":\"250\"},{\"x\":\"180\",\"y\":\"170\"}]},\"shapeprop\":{\"hFC\":\"white\",\"hFO\":\"0.5\",\"hSC\":\"red\",\"hSW\":\"3\",\"hSO\":\"1.0\",\"uFC\":\"white\",\"uFO\":\"0.0\",\"uSC\":\"red\",\"uSW\":\"3\",\"uSO\":\"1.0\",\"title\":\"default\",\"body\":\"default\"}}]}" } , Cmd.none ) diff --git a/src/TypeHolder.elm b/src/TypeHolder.elm index 894028b..01d82a6 100644 --- a/src/TypeHolder.elm +++ b/src/TypeHolder.elm @@ -1,4 +1,4 @@ -module TypeHolder exposing (Model, Msg(..)) +module TypeHolder exposing (Model, ErweitertertesBild, Msg(..)) -- Http import Http -- Browser @@ -24,6 +24,13 @@ type alias Model = , errorString : String , stringToShapes : String } + +type alias ErweitertertesBild = + { + picture : Maybe Picture + ,shapes : List (Shape, ShapeStyle) + } + type Msg -- Manage Objects = ManageModal ModalMsg String diff --git a/src/Util/ShapeManager.elm b/src/Util/ShapeManager.elm index 124d107..560bd8f 100644 --- a/src/Util/ShapeManager.elm +++ b/src/Util/ShapeManager.elm @@ -230,7 +230,7 @@ writeAlltoJson shapeWithProperties picUrl = let jsonObj = Json.Encode.object - ( [ ("Url", pictureInfoToJson picUrl), ("shapes", writeShapeToJson shapeWithProperties )]) + ( [( "pictureUrl", Json.Encode.string picUrl ), ("shapes", writeShapeToJson shapeWithProperties )]) in jsonObj writeShapeToJson : List ( Shape, ShapeStyle ) -> Json.Encode.Value @@ -330,16 +330,3 @@ rectToJson a b c d = ) ] in jsonObj - -pictureInfoToJson : String -> Json.Encode.Value -pictureInfoToJson url = - let - jsonObj = - Json.Encode.object - [ - ( - "pictureInfo" - ,Json.Encode.object ([ ( "url", Json.Encode.string url ) ]) - ) - ] - in jsonObj diff --git a/src/Util/ViewParts.elm b/src/Util/ViewParts.elm index c1b0209..d4cf803 100644 --- a/src/Util/ViewParts.elm +++ b/src/Util/ViewParts.elm @@ -435,7 +435,12 @@ viewManagePictureModal s mayUrl currentUrl w h= viewJsonModal : Model -> Html Msg viewJsonModal model = modalCard [ modalHeader "Json Datei" - , modalCardBody [ div [] [ Html.pre [] [Html.text <| Json.Encode.encode 3 <| (writeAlltoJson model.saved (Url.toString model.picture.url))] ] + , modalCardBody [ button [ onClick (GotJson model.stringToShapes) + , class "button is-success is-pulled-left is-size-6" + , style "margin-right" "15px" + , style "margin-bottom" "15px" + ] [ text "string to shapes" ] + , div [] [ Html.pre [] [Html.text <| Json.Encode.encode 3 <| (writeAlltoJson model.saved (Url.toString model.picture.url))] ] , Html.p [] [text <| model.errorString] ] , modalFooter [] 0.0 -- GitLab