Commit 299fb8d1 authored by Alexandre Delanoë's avatar Alexandre Delanoë

[MERGE] dashboard, thx @mudada.

parents 7019ca64 84bcea27
{ {
"name": "purescript-gargantext", "name": "purescript-gargantext",
"ignore": [ "ignore": [
"**/.*", "**/.*",
"node_modules", "node_modules",
"bower_components", "bower_components",
"output" "output"
], ],
"dependencies": { "dependencies": {
"purescript-prelude": "^3.1.0", "purescript-prelude": "^3.1.0",
"purescript-console": "^3.0.0", "purescript-console": "^3.0.0",
"purescript-thermite": "^5.0.0", "purescript-thermite": "^5.0.0",
"purescript-affjax": "^5.0.0", "purescript-affjax": "^5.0.0",
"purescript-routing": "^6.1.2", "purescript-routing": "^6.1.2",
"purescript-argonaut-codecs": "^2.0.0", "purescript-argonaut-codecs": "^2.0.0",
"purescript-argonaut-traversals": "^2.0.0", "purescript-argonaut-traversals": "^2.0.0",
"purescript-argonaut": "^3.1.0", "purescript-argonaut": "^3.1.0",
"purescript-random": "^3.0.0", "purescript-random": "^3.0.0",
"purescript-css": "^3.4.0" "purescript-css": "^3.4.0"
}, },
"devDependencies": { "devDependencies": {
"purescript-psci-support": "^3.0.0" "purescript-psci-support": "^3.0.0"
}, },
"resolutions": { "resolutions": {
"purescript-maybe": "^3.0.0", "purescript-maybe": "^3.0.0",
"purescript-monoid": "^3.0.0", "purescript-monoid": "^3.0.0",
"purescript-invariant": "^3.0.0", "purescript-invariant": "^3.0.0",
"purescript-functions": "^3.0.0", "purescript-functions": "^3.0.0",
"purescript-functors": "^2.0.0", "purescript-functors": "^2.0.0",
"purescript-const": "^3.0.0", "purescript-const": "^3.0.0",
"purescript-contravariant": "^3.0.0", "purescript-contravariant": "^3.0.0",
"purescript-tuples": "^4.0.0", "purescript-tuples": "^4.0.0",
"purescript-distributive": "^3.0.0", "purescript-distributive": "^3.0.0",
"purescript-identity": "^3.0.0", "purescript-identity": "^3.0.0",
"purescript-transformers": "^3.0.0", "purescript-transformers": "^3.0.0",
"purescript-arrays": "^4.0.1", "purescript-arrays": "^4.0.1",
"purescript-nonempty": "^4.0.0", "purescript-nonempty": "^4.0.0",
"purescript-unfoldable": "^3.0.0", "purescript-unfoldable": "^3.0.0",
"purescript-lazy": "^3.0.0", "purescript-lazy": "^3.0.0",
"purescript-unsafe-coerce": "^3.0.0", "purescript-unsafe-coerce": "^3.0.0",
"purescript-strings": "^3.0.0", "purescript-strings": "^3.0.0",
"purescript-generics": "^4.0.0", "purescript-generics": "^4.0.0",
"purescript-tailrec": "^3.0.0", "purescript-tailrec": "^3.0.0",
"purescript-proxy": "^2.0.0", "purescript-proxy": "^2.0.0",
"purescript-integers": "^3.0.0", "purescript-integers": "^3.0.0",
"purescript-globals": "^3.0.0", "purescript-globals": "^3.0.0",
"purescript-maps": "^3.0.0", "purescript-maps": "^3.0.0",
"purescript-st": "^3.0.0", "purescript-st": "^3.0.0",
"purescript-eff": "^3.0.0", "purescript-eff": "^3.0.0",
"purescript-profunctor": "^3.0.0", "purescript-profunctor": "^3.0.0",
"purescript-enums": "^3.1.0", "purescript-enums": "^3.1.0",
"purescript-profunctor-lenses": "^3.0.0", "purescript-profunctor-lenses": "^3.0.0",
"purescript-sets": "^3.0.0", "purescript-sets": "^3.0.0",
"purescript-argonaut-core": "^3.1.0", "purescript-argonaut-core": "^3.1.0",
"purescript-lists": "^4.0.0", "purescript-lists": "^4.0.0",
"purescript-argonaut-codecs": "^3.0.0", "purescript-argonaut-codecs": "^3.0.0",
"purescript-argonaut-traversals": "^3.0.0", "purescript-argonaut-traversals": "^3.0.0",
"purescript-argonaut": "^3.1.0", "purescript-argonaut": "^3.1.0",
"purescript-prelude": "^3.1.0", "purescript-prelude": "^3.1.0",
"purescript-either": "^3.1.0", "purescript-either": "^3.1.0",
"purescript-foldable-traversable": "^3.6.1", "purescript-foldable-traversable": "^3.6.1",
"purescript-control": "^3.0.0", "purescript-control": "^3.0.0",
"purescript-bifunctors": "^3.0.0", "purescript-bifunctors": "^3.0.0",
"purescript-newtype": "^2.0.0" "purescript-newtype": "^2.0.0"
} }
} }
...@@ -3,3 +3,4 @@ ...@@ -3,3 +3,4 @@
var ReactEcharts = require("echarts-for-react"); var ReactEcharts = require("echarts-for-react");
exports.eChartsClass = ReactEcharts.default; exports.eChartsClass = ReactEcharts.default;
exports.eChartsClass2 = ReactEcharts.default;
module Chart where module Chart where
import Prelude import Prelude (($), (<<<), (<$>))
import CSS (Color, white) import CSS (Color, white)
import React (ReactClass, ReactElement, createElementDynamic) import Data.Maybe (Maybe(..))
import React.DOM.Props (Props, unsafeFromPropsArray, unsafeMkProps)
import Control.Monad.Eff (Eff)
import DOM (DOM)
import DOM.HTML (window) as DOM
import DOM.HTML.Types (htmlDocumentToParentNode) as DOM
import DOM.HTML.Window (document) as DOM
import DOM.Node.ParentNode (QuerySelector(..))
import DOM.Node.ParentNode (querySelector) as DOM
import Data.Maybe (fromJust)
import Partial.Unsafe (unsafePartial)
import React (ReactElement)
import React as R import React as R
import React.DOM (p) import React.DOM (p)
import React.DOM.Props (Props, className, unsafeFromPropsArray) import React.DOM.Props (Props, unsafeFromPropsArray, unsafeMkProps)
import ReactDOM as RDOM
import Thermite (Render, Spec, createReactSpec, defaultPerformAction, simpleSpec)
-- eCharts Props -- eCharts Props
...@@ -45,7 +32,7 @@ group = unsafeMkProps "group" ...@@ -45,7 +32,7 @@ group = unsafeMkProps "group"
type EchartsProps eff = type EchartsProps eff =
{ className :: String, { className :: String,
style :: String, -- object, style :: String, -- objealect-black-altdarkmincnaquadahherry-blossomect,
theme :: String, theme :: String,
group :: String, group :: String,
option :: Option, -- PropTypes.object.isRequired, option :: Option, -- PropTypes.object.isRequired,
...@@ -67,13 +54,16 @@ type OptsLoading = ...@@ -67,13 +54,16 @@ type OptsLoading =
zlevel :: Int zlevel :: Int
} }
type OpTest =
{option :: Option}
type Option = type Option =
{ title :: Title { title :: Maybe Title
, legend :: Legend , legend :: Maybe Legend
, tooltip :: Tooltip , tooltip :: Tooltip
, grid :: Grid , grid :: Grid
, xAxis :: Array XAxis , xAxis :: XAxis
, yAxis :: Array YAxis , yAxis :: YAxis
, series :: Array Series , series :: Array Series
, dataZoom :: Array DataZoom , dataZoom :: Array DataZoom
} }
...@@ -94,35 +84,33 @@ type Grid = ...@@ -94,35 +84,33 @@ type Grid =
type Legend = type Legend =
{"type" :: String {"type" :: String
, show :: Boolean , show :: Boolean
, zlevel :: Number , zlevel :: Maybe Number
, z :: Number , z :: Maybe Number
, left :: Number , left :: Maybe Number
, top :: Number , top :: Maybe Number
, right :: Number , right :: Maybe Number
, bottom :: Number , bottom :: Maybe Number
, width :: Number , width :: Maybe Number
, height :: Number , height :: Maybe Number
, orient :: String , orient :: Maybe String
, align :: String , align :: Maybe String
, padding :: Number , padding :: Maybe Number
, itemGap :: Number , itemGap :: Maybe Number
, itemWidth :: Number , itemWidth :: Maybe Number
, itemHeight :: Number , itemHeight :: Maybe Number
, formatter :: String , formatter :: Maybe String
, selectedMode :: Boolean , selectedMode :: Maybe Boolean
, inactiveColor :: Color , inactiveColor :: Maybe Color
, selected :: String -- object , selected :: Maybe String -- object
, "data" :: Array Data , "data" :: Maybe (Array Data)
} }
type Data = type Data =
{ name :: String { name :: String
, icon :: String , icon :: Maybe String
, textStyle :: {} , textStyle :: Maybe {}
} }
type SubtextStyle = type SubtextStyle =
{ color :: Color { color :: Color
, fontStyle :: String , fontStyle :: String
...@@ -146,14 +134,15 @@ type SubtextStyle = ...@@ -146,14 +134,15 @@ type SubtextStyle =
type Tooltip = type Tooltip =
{ trigger :: String { trigger :: String
, formatter :: String -- TODO function , formatter :: Maybe String -- TODO function
} }
type XAxis = type XAxis =
{ "data" :: Array String { "data" :: Array Data
, "type" :: String , "type" :: String
, axisTick :: AxisTick , axisTick :: AxisTick
} }
type AxisTick = type AxisTick =
{ {
alignWithLabel :: Boolean alignWithLabel :: Boolean
...@@ -213,10 +202,14 @@ type Title = ...@@ -213,10 +202,14 @@ type Title =
type Rich = {} type Rich = {}
foreign import eChartsClass :: forall props. ReactClass props foreign import eChartsClass :: forall props. R.ReactClass props
foreign import eChartsClass2 :: R.ReactClass OpTest
echarts :: forall eff. Array Props -> ReactElement echarts :: forall eff. Array Props -> R.ReactElement
echarts p = createElementDynamic eChartsClass (unsafeFromPropsArray p) [] echarts p = R.createElementDynamic eChartsClass (unsafeFromPropsArray p) []
echarts' :: forall eff. Option -> R.ReactElement
echarts' chart = R.createElementDynamic eChartsClass2 {option: chart} []
-- Props -- Props
...@@ -373,12 +366,106 @@ yAxisIndex = unsafeMkProps "yAxisIndex" ...@@ -373,12 +366,106 @@ yAxisIndex = unsafeMkProps "yAxisIndex"
-- , p'' -- , p''
-- ] -- ]
histogram :: ReactElement legend' :: Legend
legend' =
{
"type": "plain"
, show: true
, zlevel: Nothing
, z: Nothing
, left: Nothing
, top: Nothing
, right: Nothing
, bottom: Nothing
, width: Nothing
, height: Nothing
, orient: Nothing
, align: Nothing
, padding: Nothing
, itemGap: Nothing
, itemWidth: Nothing
, itemHeight: Nothing
, formatter: Nothing
, selectedMode: Nothing
, inactiveColor: Nothing
, selected: Nothing
, "data": Nothing
}
data1 :: Data
data1 = {name: "Map terms coverage", icon: Nothing, textStyle: Nothing}
data2 :: Data
data2 = {name: "Favorites", icon: Nothing, textStyle: Nothing}
data3 :: Data
data3 = {name: "All", icon: Nothing, textStyle: Nothing}
xAxis' :: XAxis
xAxis' =
{
"data": [xData1, xData2, xData3]
, "type": "category"
, axisTick: {alignWithLabel: true}
}
xData1 :: Data
xData1 = {name: "Jan", icon: Nothing, textStyle: Nothing}
xData2 :: Data
xData2 = {name: "Feb", icon: Nothing, textStyle: Nothing}
xData3 :: Data
xData3 = {name: "Mar", icon: Nothing, textStyle: Nothing}
yData1 :: YAxis
yData1 =
{
"type": "value"
, name: "Score metric"
, min: 0
, position: "right"
, axisLabel: {formatter: "{value}"}
}
tooltip' :: Tooltip
tooltip' =
{
trigger: "axis"
, formatter: Nothing
}
series' :: Series
series' =
{
name: "All"
, "type": "bar"
, "data": [201, 777, 879]
}
opt :: Option
opt =
{
title: Nothing
,legend: Nothing
,tooltip: tooltip'
,grid: {containLabel: true}
,xAxis: xAxis'
,yAxis: yData1
,series: [series']
,dataZoom: [dz1', dz1', dz2', dz2']
}
histogram2 :: R.ReactElement
histogram2 = echarts' opt
histogram :: R.ReactElement
histogram = echarts histogram = echarts
[ option [ option
[ tooltip [trigger "axis"] [ tooltip [trigger "axis"]
, grid [containLabel true] , grid [containLabel true]
, legend [data' ["Map terms coverage", "Favorites", "All"]] , legend [data' ["TEST MUDADA", "Favorites", "All"]]
-- , legend [data' ["Map Terms coverage", "Favorites", "All"]] -- , legend [data' ["Map Terms coverage", "Favorites", "All"]]
, xAxis , xAxis
[ type' "category" [ type' "category"
...@@ -388,12 +475,41 @@ histogram = echarts ...@@ -388,12 +475,41 @@ histogram = echarts
, "Sep", "Oct", "Nov" , "Dec" , "Sep", "Oct", "Nov" , "Dec"
] ]
] ]
, dataZoom [dz1,dz1,dz2,dz2] , dataZoom' [dz1', dz1', dz2', dz2']
, yAxis [ya1, ya2] , yAxis [ya1, ya2]
, series [sd1, sd2, sd3] , series [sd1, sd2, sd3]
] ]
] ]
{-
type DataZoom =
{"type" :: String
, xAxisIndex :: Int
, filterMode :: String
, start :: Int
, end :: Int
}
-}
dz1' :: DataZoom
dz1' = {
"type": "slider"
,xAxisIndex: 0
,filterMode: "empty"
,start: 0
,end: 100
}
dz2' :: DataZoom
dz2' = {
"type": "inside"
,xAxisIndex: 0
,filterMode: "empty"
,start: 0
,end: 100
}
dz1 :: forall props. props
dz1 = unsafeFromPropsArray dz1 = unsafeFromPropsArray
[ type' "slider" [ type' "slider"
, xAxisIndex 0 , xAxisIndex 0
...@@ -402,6 +518,7 @@ dz1 = unsafeFromPropsArray ...@@ -402,6 +518,7 @@ dz1 = unsafeFromPropsArray
, end 100 , end 100
] ]
dz2 :: forall props. props
dz2 = unsafeFromPropsArray dz2 = unsafeFromPropsArray
[ type' "inside" [ type' "inside"
, xAxisIndex 0 , xAxisIndex 0
...@@ -410,6 +527,7 @@ dz2 = unsafeFromPropsArray ...@@ -410,6 +527,7 @@ dz2 = unsafeFromPropsArray
, end 100 , end 100
] ]
ya1 :: forall props. props
ya1 = unsafeFromPropsArray ya1 = unsafeFromPropsArray
[ type' "value" [ type' "value"
, name "Score metric" , name "Score metric"
...@@ -417,7 +535,7 @@ ya1 = unsafeFromPropsArray ...@@ -417,7 +535,7 @@ ya1 = unsafeFromPropsArray
, position "right" , position "right"
, axisLabel [formatter "{value}"] , axisLabel [formatter "{value}"]
] ]
ya2 :: forall props. props
ya2 = unsafeFromPropsArray ya2 = unsafeFromPropsArray
[ type' "value" [ type' "value"
, name "Publications (by year)" , name "Publications (by year)"
...@@ -426,6 +544,7 @@ ya2 = unsafeFromPropsArray ...@@ -426,6 +544,7 @@ ya2 = unsafeFromPropsArray
, axisLabel [formatter "{value}"] , axisLabel [formatter "{value}"]
] ]
sd1 :: forall props. props
sd1 = unsafeFromPropsArray sd1 = unsafeFromPropsArray
[ name "Map terms coverage" [ name "Map terms coverage"
, type' "line" , type' "line"
...@@ -439,6 +558,7 @@ sd1 = unsafeFromPropsArray ...@@ -439,6 +558,7 @@ sd1 = unsafeFromPropsArray
, data' [95, 80, 75, 35, 30, 50, 70, 80, 95, 95, 95, 99] , data' [95, 80, 75, 35, 30, 50, 70, 80, 95, 95, 95, 99]
] ]
sd3 :: forall props. props
sd3 = unsafeFromPropsArray sd3 = unsafeFromPropsArray
[ name "All" [ name "All"
, type' "bar" , type' "bar"
...@@ -447,7 +567,21 @@ sd3 = unsafeFromPropsArray ...@@ -447,7 +567,21 @@ sd3 = unsafeFromPropsArray
, data' [201, 222, 223, 777, 244, 255, 555, 879, 938, 1364, 1806, 2324] , data' [201, 222, 223, 777, 244, 255, 555, 879, 938, 1364, 1806, 2324]
] ]
dataZoom' :: Array DataZoom -> Props
dataZoom' dzs = unsafeMkProps "dataZoom" $ dzToProps <$> dzs
dzToProps :: forall props. DataZoom -> props
dzToProps dz = unsafeFromPropsArray
[ type' dz."type"
, xAxisIndex dz.xAxisIndex
, filterMode dz.filterMode
, start dz.start
, end dz.end
]
sd2 :: forall props. props
sd2 = unsafeFromPropsArray sd2 = unsafeFromPropsArray
[ name "Favorites" [ name "Favorites"
, type' "bar" , type' "bar"
...@@ -457,5 +591,5 @@ sd2 = unsafeFromPropsArray ...@@ -457,5 +591,5 @@ sd2 = unsafeFromPropsArray
] ]
p'' :: ReactElement p'' :: R.ReactElement
p'' = p [] [] p'' = p [] []
module Charts.Color
(
ChartColor(),
chartColor
) where
import Prelude ((<<<))
import CSS (Color, toHexString)
newtype ChartColor = ChartColor String
chartColor :: Color -> ChartColor
chartColor = ChartColor <<< toHexString
module Charts.Data where
import Charts.Font (TextStyle, Icon)
import Prelude ((<<<))
import Unsafe.Coerce (unsafeCoerce)
type DataN =
{ name :: String
, icon :: Icon
, textStyle :: TextStyle
}
type DataV =
{ value :: String
, textStyle :: TextStyle
}
type DataS =
{ name :: String
, value :: Number
}
"use strict";
var ReactEcharts = require("echarts-for-react");
exports.eChartsClass = ReactEcharts.default;
This diff is collapsed.
module Charts.Font
(
TextStyle,
ChartFontStyle(),
chartFontStyle,
ChartFontWeight(),
chartFontWeight,
Icon(),
ImageURL(..),
Shape(..),
IconOptions(..),
icon
) where
import CSS (FontStyle(..), FontWeight(..), Prefixed(..), Value(..))
import Charts.Color (ChartColor)
import Charts.Position (LeftRelativePosition, Position, TopRelativePosition)
import Data.Generic (class Generic, gShow)
import Data.String (toLower)
import Prelude (Unit, ($), (<<<), (<>))
type TextStyle =
{ color :: ChartColor
, fontStyle :: ChartFontStyle
, fontWeight :: ChartFontWeight
, fontFamily :: String
, fontSize :: Int
, align :: Position LeftRelativePosition
, verticalAlign :: Position TopRelativePosition
, lineHeight :: Position Unit
, width :: Position Unit
, height :: Position Unit
, textBorderColor :: ChartColor
, textBorderWidth :: Number
, textShadowColor :: ChartColor
, textShadowBlur :: ChartColor
, textShadowOffsetX :: Number
, textShadowOffsetY :: Number
}
newtype ChartFontStyle = ChartFontStyle String
chartFontStyle :: FontStyle -> ChartFontStyle
chartFontStyle (FontStyle (Value (Plain "italic"))) = ChartFontStyle "italic"
chartFontStyle (FontStyle (Value (Plain "oblique"))) = ChartFontStyle "oblique"
chartFontStyle _ = ChartFontStyle "normal"
newtype ChartFontWeight = ChartFontWeight String
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"
newtype Icon = Icon String
newtype ImageURL = ImageURL String
data Shape = Circle | Rect | RoundRect | Triangle | Diamond | Pin | Arrow
derive instance genericShape :: Generic Shape
data IconOptions = Shape Shape | Image ImageURL
icon :: IconOptions -> Icon
icon (Shape s) = Icon <<< toLower $ gShow s
icon (Image (ImageURL url)) = Icon $ "image://" <> url
module Charts.Legend
(
LegendType(..),
PlainOrScroll(..),
legendType,
Orient(),
Orientation(..),
orient,
SelectedMode(),
LegendMode(..),
selectedMode
) where
import Data.Generic (class Generic, gShow)
import Data.String (toLower)
import Prelude (class Show, show, (<<<))
import Unsafe.Coerce (unsafeCoerce)
newtype LegendType = LegendType String
data PlainOrScroll = Plain | Scroll
instance showPlainOrScroll :: Show PlainOrScroll where
show (Plain) = "plain"
show (Scroll) = "scroll"
legendType :: PlainOrScroll -> LegendType
legendType = LegendType <<< toLower <<< show
newtype Orient = Orient String
data Orientation = Horizontal | Vertical
derive instance genericOrientation :: Generic Orientation
orient :: Orientation -> Orient
orient = Orient <<< toLower <<< gShow
foreign import data SelectedMode :: Type
data LegendMode = Bool Boolean | Single | Multiple
derive instance genericLegendMode :: Generic LegendMode
selectedMode :: LegendMode -> SelectedMode
selectedMode (Bool b) = unsafeCoerce b
selectedMode (Single) = unsafeCoerce "single"
selectedMode (Multiple) = unsafeCoerce "multiple"
module Charts.Position
(
Position(),
numberPosition,
percentPosition,
relativePosition,
Align(..),
TopRelativePosition(..),
LeftRelativePosition(..)
) where
import Prelude (class Show, show, ($), (<>))
import Unsafe.Coerce (unsafeCoerce)
-- | The type `Position` is made to render a css position.
-- | It should be either a `Number`, a `"Number%"` or a `Position` type (`TopRelativePosition` for exemple)
-- | To construct such a type you will have to use one of the smart constructor
foreign import data Position :: Type -> Type
-- | Smart constructor to build a JS Number
numberPosition :: forall r. Number -> Position r
numberPosition = unsafeCoerce
-- | Smart constructor to build a JS Percent
percentPosition :: forall r. Number -> Position r
percentPosition n = unsafeCoerce $ (show n) <> "%"
-- | Smart constructor to build a JS String giving position's detail ("top", "left", ...)
relativePosition :: forall a. Show a => Align a -> Position a
relativePosition (Auto) = unsafeCoerce "auto"
relativePosition (Relative r) = unsafeCoerce $ show r
data Align p = Auto | Relative p
data TopRelativePosition = Top | Middle | Bottom
instance showTopRelativePosition :: Show TopRelativePosition
where show (Top) = "top"
show (Middle) = "middle"
show (Bottom) = "bottom"
data LeftRelativePosition = LeftPos | Center | RightPos
instance showLeftRelativePosition :: Show LeftRelativePosition
where show (LeftPos) = "left"
show (Center) = "center"
show (RightPos) = "right"
module Charts.Series where
import Charts.Data (DataS)
import Prelude (class Show, show, (<<<))
newtype SeriesType = SeriesType String
data SeriesShape = Line
| Bar | PictorialBar
| Pie
| Scatter | EffectScater
| Radar
| Tree | TreeMap
| Sunburst
| Boxplot
| Candlestick
| Heatmap
| Map
| Parallel
| Lines
| Graph
| Sankey
| Funnel
| Gauge
| ThemeRiver
instance showSeriesShape :: Show SeriesShape where
show Line = "line"
show Bar = "bar"
show Pie = "pie"
show Sunburst = "sunburst"
show Funnel = "funnel"
show Heatmap = "heatmap"
show _ = ""
seriesType :: SeriesShape -> SeriesType
seriesType = SeriesType <<< show
type Series =
{ name :: String
, "type" :: SeriesType
, "data" :: Array DataS
}
module Charts.Type where
import Charts.Font
import CSS (Color)
import Charts.Series
import Charts.Data
import Charts.Color (ChartColor(..))
import Charts.Font (Icon, icon, TextStyle)
import Charts.Legend (LegendType, SelectedMode, selectedMode, Orient)
import Charts.Position (LeftRelativePosition, Position, TopRelativePosition)
import Data.Either (Either)
import Data.Maybe (Maybe)
import Prelude (Unit, (<<<))
newtype ChartAlign = ChartAlign String
type Echarts =
{ className :: Maybe String,
style :: Maybe String, -- objealect-black-altdarkmincnaquadahherry-blossomect,
theme :: Maybe String,
group :: Maybe String,
option :: Option, -- PropTypes.object.isRequired,
initOpts :: Maybe String, -- PropTypes.object,
notMerge :: Maybe Boolean,
lazyUpdate :: Maybe Boolean,
loading :: Maybe Boolean,
optsLoading :: Maybe OptsLoading, -- PropTypes.object,
onReady :: Maybe String, -- PropTypes.func,
resizable :: Maybe Boolean, -- PropTypes.bool,
onEvents :: Maybe String -- PropTypes.object
}
type Option =
{ title :: Title
, legend :: Legend
, tooltip :: Tooltip
, grid :: Grid
, xAxis :: XAxis
, yAxis :: YAxis
, series :: Array Series
, dataZoom :: Array DataZoom
}
type Title =
{
id :: String -- None by default
, show :: Boolean -- default True
, text :: String -- default ''
, link :: String -- default ''
, target :: String -- default 'blank'
, textStyle :: TextStyle
, subtext :: String -- default ''
, sublink :: String -- default ''
, subtarget :: String -- default 'blank'
, subtextStyle :: TextStyle
, padding :: Number -- default '5'
, itemGap :: Number -- default '10'
, zlevel :: Number -- default '0'
, z :: Number -- default '2'
, left :: Position LeftRelativePosition -- default 'auto'
, top :: Position TopRelativePosition -- default 'auto'
, right :: Position Unit -- default 'auto'
, bottom :: Position Unit -- default 'auto'
, backgroundColor :: ChartColor -- default 'transparent''
, borderColor :: ChartColor -- default '#ccc'
, borderWidth :: Number -- default '1'
, borderRadius :: Number -- default 0; data NumberOrArray = Number | Array Number
, shadowBlur :: Number
, shadowColor :: ChartColor
, shadowOffsetX :: Number
, shadowOffsetY :: Number
}
type OptsLoading =
{ text :: String,
color :: Color, --- color
textColor :: Color, --color
maskColor :: Color, --color
zlevel :: Int
}
type DataZoom =
{"type" :: String
, xAxisIndex :: Int
, filterMode :: String
, start :: Int
, end :: Int
}
type Grid =
{containLabel :: Boolean
}
type Legend =
{
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 :: Orient
, align :: Position LeftRelativePosition
, padding :: Number
, itemGap :: Number
, itemWidth :: Number
, itemHeight :: Number
, formatter :: Maybe String
, selectedMode :: SelectedMode
, inactiveColor :: ChartColor
, selected :: Maybe String -- object
, textStyle :: TextStyle
, "data" :: Array DataN
}
type Tooltip =
{ trigger :: String
, formatter :: Maybe String -- TODO function
}
type XAxis =
{ "data" :: Array DataV
, "type" :: String
, axisTick :: AxisTick
, show :: Boolean
}
type AxisTick =
{
alignWithLabel :: Boolean
}
type YAxis =
{ "type" :: String
, name :: String
, min :: Int
, position :: String
, axisLabel :: AxisLabel
, show :: Boolean
}
type AxisLabel =
{ formatter :: String -- string or function
}
type Rich = {}
module Dashboard where
import Charts.ECharts
import DOM (DOM)
import Data.Unit (Unit)
import Prelude (pure, unit)
import React.DOM (div, h1, text, title)
import React.DOM.Props (className)
import Thermite (PerformAction, Render, Spec, simpleSpec)
type State = Unit
data Action = None
initialState :: State
initialState = unit
performAction :: forall eff props. PerformAction (dom :: DOM | eff) State props Action
performAction _ _ _ = pure unit
render :: forall props. Render State props Action
render dispatch _ state _ = [
h1 [] [text "IMT DashBoard"]
, histogram1
, div [className "row"] [
div [className "col-md-4 content"] [histogram2]
, div [className "col-md-4 content"] [histogram3]
, div [className "col-md-4 content"] [histogram4]
]
]
layoutDashboard :: forall props eff. Spec (dom :: DOM | eff) State props Action
layoutDashboard = simpleSpec performAction render
...@@ -2,7 +2,7 @@ module DocView where ...@@ -2,7 +2,7 @@ module DocView where
import Data.Argonaut import Data.Argonaut
import Chart (histogram, p'') import Chart (histogram2, p'')
import Control.Monad.Aff (Aff, attempt) import Control.Monad.Aff (Aff, attempt)
import Control.Monad.Aff.Class (liftAff) import Control.Monad.Aff.Class (liftAff)
import Control.Monad.Cont.Trans (lift) import Control.Monad.Cont.Trans (lift)
...@@ -113,7 +113,7 @@ layoutDocview = simpleSpec performAction render ...@@ -113,7 +113,7 @@ layoutDocview = simpleSpec performAction render
[ p'' [ p''
, div [] [ text " Filter ", input [] []] , div [] [ text " Filter ", input [] []]
, h3 [] [text "Chart Title"] , h3 [] [text "Chart Title"]
, histogram , histogram2
, p'' , p''
, br' [] , br' []
, div [] [ b [] [text d.title] , div [] [ b [] [text d.title]
......
...@@ -41,8 +41,8 @@ toggleNode sid a = a ...@@ -41,8 +41,8 @@ toggleNode sid a = a
myCorpus :: Int -> String -> NTree (Tuple String String) myCorpus :: Int -> String -> NTree (Tuple String String)
myCorpus n name = NNode n false name myCorpus n name = NNode n false name
[ NLeaf (Tuple "Facets" "#/corpus") [ NLeaf (Tuple "Facets" "#/corpus")
, NLeaf (Tuple "Graph" "#/corpus") , NLeaf (Tuple "Graph" "#/docView")
, NLeaf (Tuple "Dashboard" "#/userPage") , NLeaf (Tuple "Dashboard" "#/dashboard")
] ]
exampleTree :: NTree (Tuple String String) exampleTree :: NTree (Tuple String String)
......
...@@ -36,6 +36,7 @@ import Unsafe.Coerce (unsafeCoerce) ...@@ -36,6 +36,7 @@ import Unsafe.Coerce (unsafeCoerce)
import UserPage as UP import UserPage as UP
import GraphExplorer as GE import GraphExplorer as GE
import NgramsTable as NG import NgramsTable as NG
import Dashboard as Dsh
type E e = (dom :: DOM, ajax :: AJAX, console :: CONSOLE | e) type E e = (dom :: DOM, ajax :: AJAX, console :: CONSOLE | e)
...@@ -56,6 +57,7 @@ type AppState = ...@@ -56,6 +57,7 @@ type AppState =
, showCorpus :: Boolean , showCorpus :: Boolean
, graphExplorer :: GE.State , graphExplorer :: GE.State
, ngState :: NG.State , ngState :: NG.State
, dashboard :: Dsh.State
} }
initAppState :: AppState initAppState :: AppState
...@@ -76,6 +78,7 @@ initAppState = ...@@ -76,6 +78,7 @@ initAppState =
, showCorpus : false , showCorpus : false
, graphExplorer : GE.initialState , graphExplorer : GE.initialState
, ngState : NG.initialState , ngState : NG.initialState
, dashboard : Dsh.initialState
} }
data Action data Action
...@@ -91,6 +94,7 @@ data Action ...@@ -91,6 +94,7 @@ data Action
| TreeViewA NT.Action | TreeViewA NT.Action
| TabViewA TV.Action | TabViewA TV.Action
| GraphExplorerA GE.Action | GraphExplorerA GE.Action
| DashboardA Dsh.Action
| Search String | Search String
| Go | Go
| CorpusAnalysisA CA.Action | CorpusAnalysisA CA.Action
...@@ -105,7 +109,6 @@ performAction :: forall eff props. PerformAction ( dom :: DOM ...@@ -105,7 +109,6 @@ performAction :: forall eff props. PerformAction ( dom :: DOM
) AppState props Action ) AppState props Action
performAction (SetRoute route) _ _ = void do performAction (SetRoute route) _ _ = void do
modifyState $ _ {currentRoute = pure route} modifyState $ _ {currentRoute = pure route}
performAction (Search s) _ _ = void do performAction (Search s) _ _ = void do
modifyState $ _ {search = s} modifyState $ _ {search = s}
...@@ -126,6 +129,10 @@ performAction Go _ _ = void do ...@@ -126,6 +129,10 @@ performAction Go _ _ = void do
--modifyState id --modifyState id
performAction Go _ _ = void do
_ <- lift $ setHash "/addCorpus"
modifyState id
performAction _ _ _ = void do performAction _ _ _ = void do
modifyState id modifyState id
...@@ -194,6 +201,11 @@ _userPageAction = prism UserPageA \action -> ...@@ -194,6 +201,11 @@ _userPageAction = prism UserPageA \action ->
UserPageA caction -> Right caction UserPageA caction -> Right caction
_-> Left action _-> Left action
_dashBoardAction :: Prism' Action Dsh.Action
_dashBoardAction = prism DashboardA \action ->
case action of
DashboardA caction -> Right caction
_ -> Left action
_docAnnotationViewState :: Lens' AppState D.State _docAnnotationViewState :: Lens' AppState D.State
_docAnnotationViewState = lens (\s -> s.docAnnotationView) (\s ss -> s{docAnnotationView = ss}) _docAnnotationViewState = lens (\s -> s.docAnnotationView) (\s ss -> s{docAnnotationView = ss})
...@@ -227,18 +239,17 @@ _tabviewAction = prism TabViewA \action -> ...@@ -227,18 +239,17 @@ _tabviewAction = prism TabViewA \action ->
TabViewA caction -> Right caction TabViewA caction -> Right caction
_-> Left action _-> Left action
_corpusState :: Lens' AppState CA.State _corpusState :: Lens' AppState CA.State
_corpusState = lens (\s -> s.corpusAnalysis) (\s ss -> s {corpusAnalysis = ss}) _corpusState = lens (\s -> s.corpusAnalysis) (\s ss -> s {corpusAnalysis = ss})
_corpusAction :: Prism' Action CA.Action _corpusAction :: Prism' Action CA.Action
_corpusAction = prism CorpusAnalysisA \action -> _corpusAction = prism CorpusAnalysisA \action ->
case action of case action of
CorpusAnalysisA caction -> Right caction CorpusAnalysisA caction -> Right caction
_-> Left action _-> Left action
_dashBoardSate :: Lens' AppState Dsh.State
_dashBoardSate = lens (\s -> s.dashboard) (\s ss -> s {dashboard = ss})
_graphExplorerState :: Lens' AppState GE.State _graphExplorerState :: Lens' AppState GE.State
_graphExplorerState = lens (\s -> s.graphExplorer) (\s ss -> s{graphExplorer = ss}) _graphExplorerState = lens (\s -> s.graphExplorer) (\s ss -> s{graphExplorer = ss})
...@@ -275,9 +286,9 @@ pagesComponent s = ...@@ -275,9 +286,9 @@ pagesComponent s =
| eff | eff
) AppState props Action ) AppState props Action
selectSpec CorpusAnalysis = layout0 $ focus _corpusState _corpusAction CA.spec' selectSpec CorpusAnalysis = layout0 $ focus _corpusState _corpusAction CA.spec'
-- selectSpec Login = focus _loginState _loginAction LN.renderSpec selectSpec Login = focus _loginState _loginAction LN.renderSpec
selectSpec Home = layout0 $ focus _landingState _landingAction (L.layoutLanding EN) selectSpec Home = layout0 $ focus _landingState _landingAction (L.layoutLanding EN)
-- selectSpec AddCorpus = layout0 $ focus _addCorpusState _addCorpusAction AC.layoutAddcorpus selectSpec AddCorpus = layout0 $ focus _addCorpusState _addCorpusAction AC.layoutAddcorpus
selectSpec DocView = layout0 $ focus _docViewState _docViewAction DV.layoutDocview selectSpec DocView = layout0 $ focus _docViewState _docViewAction DV.layoutDocview
selectSpec UserPage = layout0 $ focus _userPageState _userPageAction UP.layoutUser selectSpec UserPage = layout0 $ focus _userPageState _userPageAction UP.layoutUser
selectSpec (DocAnnotation i) = layout0 $ focus _docAnnotationViewState _docAnnotationViewAction D.docview selectSpec (DocAnnotation i) = layout0 $ focus _docAnnotationViewState _docAnnotationViewAction D.docview
...@@ -286,6 +297,7 @@ pagesComponent s = ...@@ -286,6 +297,7 @@ pagesComponent s =
selectSpec SearchView = layout0 $ focus _searchState _searchAction S.searchSpec selectSpec SearchView = layout0 $ focus _searchState _searchAction S.searchSpec
selectSpec NGramsTable = layout0 $ focus _ngState _ngAction NG.ngramsTableSpec selectSpec NGramsTable = layout0 $ focus _ngState _ngAction NG.ngramsTableSpec
selectSpec PGraphExplorer = focus _graphExplorerState _graphExplorerAction GE.spec selectSpec PGraphExplorer = focus _graphExplorerState _graphExplorerAction GE.spec
selectSpec Dashboard = layout0 $ focus _dashBoardSate _dashBoardAction Dsh.layoutDashboard
selectSpec _ = simpleSpec defaultPerformAction defaultRender selectSpec _ = simpleSpec defaultPerformAction defaultRender
...@@ -564,6 +576,7 @@ layoutSpec = ...@@ -564,6 +576,7 @@ layoutSpec =
dispatchAction :: forall t115 t445 t447. dispatchAction :: forall t115 t445 t447.
Bind t445 => Applicative t445 => Bind t445 => Applicative t445 =>
(Action -> t445 t447) -> t115 -> Routes -> t445 Unit (Action -> t445 t447) -> t115 -> Routes -> t445 Unit
dispatchAction dispatcher _ Home = do dispatchAction dispatcher _ Home = do
_ <- dispatcher $ SetRoute $ Home _ <- dispatcher $ SetRoute $ Home
_ <- dispatcher $ LandingA $ L.NoOp _ <- dispatcher $ LandingA $ L.NoOp
...@@ -599,13 +612,11 @@ dispatchAction dispatcher _ (DocAnnotation i) = do ...@@ -599,13 +612,11 @@ dispatchAction dispatcher _ (DocAnnotation i) = do
_ <- dispatcher $ DocAnnotationViewA $ D.NoOp _ <- dispatcher $ DocAnnotationViewA $ D.NoOp
pure unit pure unit
dispatchAction dispatcher _ Tabview = do dispatchAction dispatcher _ Tabview = do
_ <- dispatcher $ SetRoute $ Tabview _ <- dispatcher $ SetRoute $ Tabview
_ <- dispatcher $ TabViewA $ TV.NoOp _ <- dispatcher $ TabViewA $ TV.NoOp
pure unit pure unit
dispatchAction dispatcher _ CorpusAnalysis = do dispatchAction dispatcher _ CorpusAnalysis = do
_ <- dispatcher $ SetRoute $ CorpusAnalysis _ <- dispatcher $ SetRoute $ CorpusAnalysis
--_ <- dispatcher $ CorpusAnalysisA $ CA.NoOp --_ <- dispatcher $ CorpusAnalysisA $ CA.NoOp
...@@ -620,3 +631,7 @@ dispatchAction dispatcher _ NGramsTable = do ...@@ -620,3 +631,7 @@ dispatchAction dispatcher _ NGramsTable = do
_ <- dispatcher $ SetRoute $ NGramsTable _ <- dispatcher $ SetRoute $ NGramsTable
_ <- dispatcher $ NgramsA $ NG.NoOp _ <- dispatcher $ NgramsA $ NG.NoOp
pure unit pure unit
dispatchAction dispatcher _ Dashboard = do
_ <- dispatcher $ SetRoute $ Dashboard
pure unit
...@@ -27,9 +27,10 @@ data Routes ...@@ -27,9 +27,10 @@ data Routes
| CorpusAnalysis | CorpusAnalysis
| PGraphExplorer | PGraphExplorer
| NGramsTable | NGramsTable
| Dashboard
instance showRoutes :: Show Routes where instance showRoutes :: Show Routes where
show Home = "Home"
show Login = "Login" show Login = "Login"
show AddCorpus = "AddCorpus" show AddCorpus = "AddCorpus"
show DocView = "DocView" show DocView = "DocView"
...@@ -40,6 +41,8 @@ instance showRoutes :: Show Routes where ...@@ -40,6 +41,8 @@ instance showRoutes :: Show Routes where
show CorpusAnalysis = "corpus" show CorpusAnalysis = "corpus"
show PGraphExplorer = "graphExplorer" show PGraphExplorer = "graphExplorer"
show NGramsTable = "NGramsTable" show NGramsTable = "NGramsTable"
show Dashboard = "Dashboard"
show Home = "Home"
int :: Match Int int :: Match Int
int = floor <$> num int = floor <$> num
...@@ -56,6 +59,7 @@ routing = ...@@ -56,6 +59,7 @@ routing =
<|> CorpusAnalysis <$ route "corpus" <|> CorpusAnalysis <$ route "corpus"
<|> PGraphExplorer <$ route "graphExplorer" <|> PGraphExplorer <$ route "graphExplorer"
<|> NGramsTable <$ route "ngrams" <|> NGramsTable <$ route "ngrams"
<|> Dashboard <$ route "dashboard"
<|> Home <$ lit "" <|> Home <$ lit ""
where where
route str = lit "" *> lit str route str = lit "" *> lit str
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment