diff --git a/index.html b/index.html index 01be493..32a574b 100644 --- a/index.html +++ b/index.html @@ -17,72 +17,78 @@ Ternary Graph Generator
-
-

Axis 1

-
-

Title:

- -
-
-

Start value:

- E - - +
+
+
+

Axis 1

+
+

Title:

+ +
+
+

Start value:

+ E + + +
+
+
+

Axis 2

+
+

Title:

+ +
+
+

Start value:

+ E + + +
+
+
+

Axis 3

+
+

Title:

+ +
+
+

Start value:

+ E + + +
+
+ +
+

Axis title text size (px):

+ + + +
+
+

Tick label text size (px):

+ + + +
+
+

Ticks:

+ + + +
+
+

Tick size (px):

+ + + +
+ + +
+
-
-

Axis 2

-
-

Title:

- -
-
-

Start value:

- E - - -
-
-
-

Axis 3

-
-

Title:

- -
-
-

Start value:

- E - - -
-
- -
-

Axis title text size (px):

- - - -
-
-

Tick label text size (px):

- - - -
-
-

Ticks:

- - - -
-
-

Tick size (px):

- - - -
- -
\ No newline at end of file diff --git a/spago.dhall b/spago.dhall index a331c25..7393622 100644 --- a/spago.dhall +++ b/spago.dhall @@ -19,6 +19,7 @@ to generate this file without the comments in this block. , "exceptions" , "foldable-traversable" , "integers" + , "js-uri" , "lists" , "maybe" , "numbers" diff --git a/src/Main.purs b/src/Main.purs index 724d8b9..e55f97e 100644 --- a/src/Main.purs +++ b/src/Main.purs @@ -15,6 +15,7 @@ import Effect (Effect) import Effect.Console (log) import Effect.Class (liftEffect) import Effect.Exception (throw) +import JSURI (encodeURIComponent) import TernaryGraph (Dimension, svgTextID, ternaryGraph, ternaryGraphSvg, TextStyle, tickLabelStrings) import TernaryGraph as TernaryGraph import Web.DOM.Document (contentType @@ -228,6 +229,15 @@ update = do newNode <- importNode svgNode true document appendChild newNode svgContainer + -- Set SVG content to download button + downloadButtonEl <- myGetElementById document "download-button" + encodedSVG <- case encodeURIComponent mySVG of + Nothing -> throw "Failed to encode SVG" + Just encoded -> pure encoded + let downloadText = "data:xml/svg;charset=utf-8," <> encodedSVG + Element.setAttribute "href" downloadText downloadButtonEl + Element.setAttribute "download" "ternary-graph.svg" downloadButtonEl + addUpdateListener :: Document -> String -> Effect Unit addUpdateListener doc id = do listener <- eventListener updateEvent @@ -251,8 +261,6 @@ registerInputIncButton doc inputID buttonID inc = do element <- myGetElementById doc buttonID addEventListener (EventType "click") listener true (Element.toEventTarget element) - - main :: Effect Unit main = do w <- window diff --git a/ternary-graph.css b/ternary-graph.css index 6e9feb8..3523226 100644 --- a/ternary-graph.css +++ b/ternary-graph.css @@ -6,6 +6,11 @@ button { border-top-color: #E3E3E3; } +#controls { + display: flex; + flex-direction: column; +} + .group { display: flex; flex-direction: column; @@ -28,10 +33,16 @@ input[type="number"] { } .input { + display: flex; + flex-direction: row; height: 1.5em; margin-bottom: 0.4em; } +#main-content { + flex-direction: row; +} + p { margin: auto; margin-right: 0.5em;