github.com/simpleiot/simpleiot@v0.18.3/frontend/src/Components/NodeVariable.elm (about)

     1  module Components.NodeVariable exposing (view)
     2  
     3  import Api.Point as Point
     4  import Components.NodeOptions exposing (NodeOptions, oToInputO)
     5  import Element exposing (..)
     6  import Element.Background as Background
     7  import Element.Border as Border
     8  import Element.Font as Font
     9  import Round
    10  import UI.Icon as Icon
    11  import UI.NodeInputs as NodeInputs
    12  import UI.Style as Style
    13  import UI.ViewIf exposing (viewIf)
    14  
    15  
    16  view : NodeOptions msg -> Element msg
    17  view o =
    18      let
    19          value =
    20              Point.getValue o.node.points Point.typeValue "0"
    21  
    22          variableType =
    23              Point.getText o.node.points Point.typeVariableType "0"
    24  
    25          valueText =
    26              if variableType == Point.valueNumber then
    27                  String.fromFloat (Round.roundNum 2 value)
    28  
    29              else if variableType == Point.valueText then
    30                  Point.getText o.node.points Point.typeValue "0"
    31  
    32              else if value == 0 then
    33                  "off"
    34  
    35              else
    36                  "on"
    37  
    38          valueBackgroundColor =
    39              if valueText == "on" then
    40                  Style.colors.blue
    41  
    42              else
    43                  Style.colors.none
    44  
    45          valueTextColor =
    46              if valueText == "on" then
    47                  Style.colors.white
    48  
    49              else
    50                  Style.colors.black
    51      in
    52      column
    53          [ width fill
    54          , Border.widthEach { top = 2, bottom = 0, left = 0, right = 0 }
    55          , Border.color Style.colors.black
    56          , spacing 6
    57          ]
    58      <|
    59          wrappedRow [ spacing 10 ]
    60              [ Icon.variable
    61              , text <|
    62                  Point.getText o.node.points Point.typeDescription ""
    63              , el [ paddingXY 7 0, Background.color valueBackgroundColor, Font.color valueTextColor ] <|
    64                  text <|
    65                      valueText
    66                          ++ (if variableType == Point.valueNumber then
    67                                  " " ++ Point.getText o.node.points Point.typeUnits ""
    68  
    69                              else
    70                                  ""
    71                             )
    72              ]
    73              :: (if o.expDetail then
    74                      let
    75                          labelWidth =
    76                              150
    77  
    78                          opts =
    79                              oToInputO o labelWidth
    80  
    81                          textInput =
    82                              NodeInputs.nodeTextInput opts "0"
    83  
    84                          optionInput =
    85                              NodeInputs.nodeOptionInput opts "0"
    86  
    87                          numberInput =
    88                              NodeInputs.nodeNumberInput opts "0"
    89  
    90                          onOffInput =
    91                              NodeInputs.nodeOnOffInput opts "0"
    92                      in
    93                      [ textInput Point.typeDescription "Description" ""
    94                      , optionInput Point.typeVariableType
    95                          "Variable type"
    96                          [ ( Point.valueOnOff, "On/Off" )
    97                          , ( Point.valueNumber, "Number" )
    98                          , ( Point.valueText, "Text" )
    99                          ]
   100                      , viewIf (variableType == Point.valueOnOff) <|
   101                          onOffInput
   102                              Point.typeValue
   103                              Point.typeValue
   104                              "Value"
   105                      , viewIf (variableType == Point.valueNumber) <|
   106                          numberInput Point.typeValue "Value"
   107                      , viewIf (variableType == Point.valueNumber) <|
   108                          textInput Point.typeUnits "Units" ""
   109                      , viewIf (variableType == Point.valueText) <|
   110                          textInput Point.typeValue "Text" ""
   111                      , NodeInputs.nodeKeyValueInput opts Point.typeTag "Tags" "Add Tag"
   112                      ]
   113  
   114                  else
   115                      []
   116                 )