hiding constructor, renaming and start to implement Legend

src/Charts/Color.purs

-module Charts.Color where
+module Charts.Color
+       (
+         ChartColor(),
+         chartColor
+       )where
 
 import Prelude ((<<<))
 import CSS (Color, toHexString)
 
 newtype ChartColor = ChartColor String
 
-renderChartColor :: Color -> ChartColor
-renderChartColor = ChartColor <<< toHexString
+chartColor :: Color -> ChartColor
+chartColor = ChartColor <<< toHexString

src/Charts/ECharts.js

@@ -3,4 +3,3 @@
 var ReactEcharts = require("echarts-for-react");
 
 exports.eChartsClass = ReactEcharts.default;
-exports.eChartsClass2 = ReactEcharts.default;

src/Charts/ECharts.purs

 module Charts.ECharts where
 
+import CSS (black, blue, white, yellow)
+import CSS.Common (normal)
+import Charts.Color (chartColor)
+import Charts.Font (chartFontStyle, chartFontWeight)
+import Charts.Legend (legendType, LegendType, PlainOrScroll(..))
+import Charts.Position (Align(..), LeftRelativePosition(..), TopRelativePosition(..), numberPosition, percentPosition, relativePosition)
+import Charts.Type (Data, DataZoom, Echarts, Legend, Option, Series, TextStyle, Title, Tooltip, XAxis, YAxis)
 import Data.Either (Either(..))
 import Data.Maybe (Maybe(..))
 import Prelude (($))
-
-import Charts.Type (Data, DataZoom, Echarts, Legend, Option, Series, TextStyle, Title, Tooltip, XAxis, YAxis)
-import Charts.Color (renderChartColor)
-import Charts.Font (renderChartFontStyle, renderChartFontWeight)
-import Charts.Position (Align(..), LeftRelativePosition(..), TopRelativePosition(..), numberPosition, percentPosition, relativePosition)
-
-import CSS (black, blue, white, yellow)
-import CSS.Common (normal)
 import React as R
 import React.DOM (p)
 
-foreign import eChartsClass :: forall props. R.ReactClass props
-foreign import eChartsClass2 :: R.ReactClass Echarts
+foreign import eChartsClass :: R.ReactClass Echarts
 
-echarts' :: forall eff. Echarts -> R.ReactElement
-echarts' chart = R.createElementDynamic eChartsClass2 chart []
+echarts :: forall eff. Echarts -> R.ReactElement
+echarts chart = R.createElementDynamic eChartsClass chart []
 
 legend' :: Legend
 legend' =
   {
-    "type": "plain"
+    id: ""
+   ,"type": legendType Plain
    , show: true
-   , zlevel: Nothing
-   , z: Nothing
-   , left: Nothing
-   , top: Nothing
-   , right: Nothing
-   , bottom: Nothing
-   , width: Nothing
-   , height: Nothing
+   , zlevel: 40.0
+   , z: 40.0
+   , left: percentPosition 40.0
+   , top:  percentPosition 40.0
+   , right:  percentPosition 40.0
+   , bottom:  percentPosition 40.0
+   , width: percentPosition 40.0
+   , height: percentPosition 40.0
    , orient: Nothing
    , align: Nothing
    , padding: Nothing
@@ -132,12 +131,12 @@ title =
    ,top: relativePosition (Relative Middle)
    ,right: numberPosition 60.0
    ,bottom: percentPosition 40.0
-   ,backgroundColor: renderChartColor black
-   ,borderColor: renderChartColor black
+   ,backgroundColor: chartColor black
+   ,borderColor: chartColor black
    ,borderWidth: 0.0
    ,borderRadius: 20.0
    ,shadowBlur: 0.0
-   ,shadowColor: renderChartColor black
+   ,shadowColor: chartColor black
    ,shadowOffsetX: 0.0
    ,shadowOffsetY: 0.0
   }
@@ -145,9 +144,9 @@ title =
 textStyle2 :: TextStyle
 textStyle2 =
   {
-    color: renderChartColor yellow
-    ,fontStyle: renderChartFontStyle normal
-    ,fontWeight: renderChartFontWeight normal
+    color: chartColor yellow
+    ,fontStyle: chartFontStyle normal
+    ,fontWeight: chartFontWeight normal
     ,fontFamily: "sans-serif"
     ,fontSize: 12
     ,align: relativePosition $ Relative RightPos
@@ -155,10 +154,10 @@ textStyle2 =
     ,lineHeight: percentPosition 0.0
     ,width: percentPosition 100.0
     ,height: percentPosition 100.0
-    ,textBorderColor: renderChartColor blue
+    ,textBorderColor: chartColor blue
     ,textBorderWidth: 5.0
-    ,textShadowColor: renderChartColor black
-    ,textShadowBlur: renderChartColor black
+    ,textShadowColor: chartColor black
+    ,textShadowBlur: chartColor black
     ,textShadowOffsetX: 0.0
     ,textShadowOffsetY: 0.0
   }
@@ -167,9 +166,9 @@ textStyle2 =
 textStyle :: TextStyle
 textStyle =
   {
-    color: renderChartColor white
-    ,fontStyle: renderChartFontStyle normal
-    ,fontWeight: renderChartFontWeight normal
+    color: chartColor white
+    ,fontStyle: chartFontStyle normal
+    ,fontWeight: chartFontWeight normal
     ,fontFamily: "sans-serif"
     ,fontSize: 12
     ,align: relativePosition $ Relative LeftPos
@@ -177,10 +176,10 @@ textStyle =
     ,lineHeight: percentPosition 0.0
     ,width: percentPosition 100.0
     ,height: percentPosition 100.0
-    ,textBorderColor: renderChartColor blue
+    ,textBorderColor: chartColor blue
     ,textBorderWidth: 5.0
-    ,textShadowColor: renderChartColor black
-    ,textShadowBlur: renderChartColor black
+    ,textShadowColor: chartColor black
+    ,textShadowBlur: chartColor black
     ,textShadowOffsetX: 0.0
     ,textShadowOffsetY: 0.0
   }
@@ -204,7 +203,7 @@ charts =
   }
 
 histogram2 :: R.ReactElement
-histogram2 = echarts' charts
+histogram2 = echarts charts
 
 {-
 histogram :: R.ReactElement

src/Charts/Font.purs

-module Charts.Font where
+module Charts.Font
+       (
+         ChartFontStyle(),
+         chartFontStyle,
+         ChartFontWeight(),
+         chartFontWeight
+       ) where
 
 import CSS (FontStyle(..), FontWeight(..), Prefixed(..), Value(..))
 
 newtype ChartFontStyle = ChartFontStyle String
 
-renderChartFontStyle :: FontStyle -> ChartFontStyle
-renderChartFontStyle (FontStyle (Value (Plain "italic"))) = ChartFontStyle "italic"
-renderChartFontStyle (FontStyle (Value (Plain "oblique"))) = ChartFontStyle "oblique"
-renderChartFontStyle _ = ChartFontStyle "normal"
+chartFontStyle :: FontStyle -> ChartFontStyle
+chartFontStyle (FontStyle (Value (Plain "italic"))) = ChartFontStyle "italic"
+chartFontStyle (FontStyle (Value (Plain "oblique"))) = ChartFontStyle "oblique"
+chartFontStyle _ = ChartFontStyle "normal"
 
 newtype ChartFontWeight = ChartFontWeight String
 
-renderChartFontWeight :: FontWeight -> ChartFontWeight
-renderChartFontWeight (FontWeight (Value (Plain "bold"))) = ChartFontWeight "bold"
-renderChartFontWeight (FontWeight (Value (Plain "bolder"))) = ChartFontWeight "bolder"
-renderChartFontWeight (FontWeight (Value (Plain "lighter"))) = ChartFontWeight "lighter"
-renderChartFontWeight  _ = ChartFontWeight "normal"
+chartFontWeight :: FontWeight -> ChartFontWeight
+chartFontWeight (FontWeight (Value (Plain "bold"))) = ChartFontWeight "bold"
+chartFontWeight (FontWeight (Value (Plain "bolder"))) = ChartFontWeight "bolder"
+chartFontWeight (FontWeight (Value (Plain "lighter"))) = ChartFontWeight "lighter"
+chartFontWeight  _ = ChartFontWeight "normal"

src/Charts/Legend.purs

+module Charts.Legend
+       (
+         LegendType(),
+         PlainOrScroll(..),
+         legendType,
+         Orient(),
+         Orientation(..),
+         orient
+       ) where
+
+import Data.Generic (class Generic, gShow)
+import Data.String (toLower)
+import Prelude ((<<<))
+
+newtype LegendType = LegendType String
+
+data PlainOrScroll = Plain | Scroll
+derive instance genericPlainOrScroll :: Generic PlainOrScroll
+
+legendType :: PlainOrScroll -> LegendType
+legendType = LegendType <<< toLower <<< gShow
+
+
+newtype Orient = Orient String
+
+data Orientation = Horizontal | Vertical
+derive instance genericOrientation :: Generic Orientation
+
+orient :: Orientation -> Orient
+orient = Orient <<< toLower <<< gShow

src/Charts/Position.purs

-module Charts.Position where
-
+module Charts.Position
+       (
+         Position(),
+         numberPosition,
+         percentPosition,
+         relativePosition,
+         Align(..),
+         TopRelativePosition(..),
+         LeftRelativePosition(..)
+       ) where
 import Prelude (class Show, show, ($), (<>))
 import Unsafe.Coerce (unsafeCoerce)
 

src/Charts/Type.purs

 module Charts.Type where
 
-import Charts.Position (LeftRelativePosition, Position, TopRelativePosition)
 import Charts.Font
-import Charts.Color (ChartColor)
+
 import CSS (Color)
+import Charts.Color (ChartColor)
+import Charts.Legend (LegendType)
+import Charts.Position (LeftRelativePosition, Position, TopRelativePosition)
 import Data.Either (Either)
 import Data.Maybe (Maybe)
 import Prelude (Unit, (<<<))
@@ -89,27 +91,29 @@ type Grid =
   }
 
 type Legend =
-  {"type"  :: String
-  , show   :: Boolean
-  , zlevel :: Maybe Number
-  , z      :: Maybe Number
-  , left   :: Maybe Number
-  , top    :: Maybe Number
-  , right  :: Maybe Number
-  , bottom :: Maybe Number
-  , width  :: Maybe Number
-  , height :: Maybe Number
+  {
+    id :: String
+  , "type" :: LegendType
+  , show :: Boolean
+  , zlevel :: Number
+  , z :: Number
+  , left :: Position LeftRelativePosition -- default 'auto
+  , top :: Position TopRelativePosition
+  , right :: Position Unit
+  , bottom :: Position Unit
+  , width :: Position Unit
+  , height :: Position Unit
   , orient :: Maybe String
-  , align  :: Maybe String
-  , padding       :: Maybe Number
-  , itemGap       :: Maybe Number
-  , itemWidth     :: Maybe Number
-  , itemHeight    :: Maybe Number
-  , formatter     :: Maybe String
-  , selectedMode  :: Maybe Boolean
+  , align :: Maybe String
+  , padding :: Maybe Number
+  , itemGap :: Maybe Number
+  , itemWidth :: Maybe Number
+  , itemHeight :: Maybe Number
+  , formatter :: Maybe String
+  , selectedMode :: Maybe Boolean
   , inactiveColor :: Maybe Color
-  , selected      :: Maybe String -- object
-  , "data"        :: Maybe (Array Data)
+  , selected :: Maybe String -- object
+  , "data" :: Maybe (Array Data)
   }
 
 type Data =