aligns, margins, elm format

This commit is contained in:
DieMyst 2020-12-02 12:10:59 +03:00
parent d547838e82
commit 8c12811303
7 changed files with 110 additions and 77 deletions

View File

@ -23,18 +23,19 @@ view model id =
case blueprintInfo of case blueprintInfo of
Just bi -> Just bi ->
let let
(instanceNum, instanceView) = Instances.View.view model (\service -> service.blueprint_id == id) ( instanceNum, instanceView ) =
Instances.View.view model (\service -> service.blueprint_id == id)
in in
div [ classes "fl w-100 cf ph2-ns" ] div [ classes "fl w-100 cf ph2-ns" ]
[ div [ classes "fl w-100 mb2 pt2" ] [ div [ classes "fl w-100 mb2 pt2" ]
[ span [ classes "fl w-100 f1 lh-title dark-red" ] [ text ("Blueprint: " ++ bi.name) ] [ span [ classes "fl w-100 f1 lh-title dark-red" ] [ text ("Blueprint: " ++ bi.name) ]
, span [ classes "fl w-100 light-red" ] [ text bi.id ] , span [ classes "fl w-100 light-red" ] [ text bi.id ]
]
, div [ classes "fl w-100 bg-white mt2 mh2 ph4 pt3 mb4 pb2" ] [ viewInfo bi ]
, h3 [ classes "pt3" ] [ text ("Instances (" ++ (String.fromInt instanceNum) ++ ")") ]
, div [ classes "mt2 bg-white" ]
[ instanceView ]
] ]
, div [ classes "fl w-100 bg-white mt2 mh2 ph4 pt3 mb4 pb2" ] [ viewInfo bi ]
, h3 [ classes "pt3" ] [ text ("Instances (" ++ String.fromInt instanceNum ++ ")") ]
, div [ classes "mt2 bg-white" ]
[ instanceView ]
]
Nothing -> Nothing ->
div [ classes "cf ph2-ns" ] div [ classes "cf ph2-ns" ]
@ -44,55 +45,71 @@ view model id =
blueprintToInfo : Model -> String -> Maybe BlueprintViewInfo blueprintToInfo : Model -> String -> Maybe BlueprintViewInfo
blueprintToInfo model id = blueprintToInfo model id =
case (Dict.get id model.blueprints) of case Dict.get id model.blueprints of
Just bp -> Just bp ->
let let
modules = bp.dependencies |> List.map (\d -> Dict.get d model.modules) |> List.filterMap identity modules =
in bp.dependencies |> List.map (\d -> Dict.get d model.modules) |> List.filterMap identity
Just { name = bp.name in
, id = id Just
, author = "Fluence Labs" { name = bp.name
, authorPeerId = "fluence_labs_peer_id" , id = id
, description = "Excelent blueprint" , author = "Fluence Labs"
, website = "https://github.com/fluencelabs/" , authorPeerId = "fluence_labs_peer_id"
, blueprint = bp , description = "Excelent blueprint"
, modules = modules , website = "https://github.com/fluencelabs/"
, openedModule = model.toggledInterface , blueprint = bp
} , modules = modules
, openedModule = model.toggledInterface
Nothing -> }
Nothing
Nothing ->
Nothing
viewInfo : BlueprintViewInfo -> Html Msg viewInfo : BlueprintViewInfo -> Html Msg
viewInfo blueprintInfo = viewInfo blueprintInfo =
let let
checkToggle = (\id -> blueprintInfo.openedModule |> Maybe.map (\om -> om == id) |> Maybe.withDefault False) checkToggle =
\id -> blueprintInfo.openedModule |> Maybe.map (\om -> om == id) |> Maybe.withDefault False
in in
article [ classes "cf" ] article [ classes "cf" ]
[ div [ classes "fl w-30 gray mv1" ] [ text "AUTHOR" ] [ div [ classes "fl w-30 gray mv1" ] [ text "AUTHOR" ]
, div [ classes "fl w-70 mv1" ] , div [ classes "fl w-70 mv1" ]
[ span [ classes "fl w-100 black b" ] [ text blueprintInfo.author ] [ span [ classes "fl w-100 black b" ] [ text blueprintInfo.author ]
, span [ classes "fl w-100 black" ] [ text blueprintInfo.authorPeerId ] ] , span [ classes "fl w-100 black" ] [ text blueprintInfo.authorPeerId ]
, div [ classes "fl w-30 gray mv1" ] [ text "DESCRIPTION" ]
, div [ classes "fl w-70 mv1" ] [ span [ classes "fl w-100 black" ] [ text blueprintInfo.description ] ]
, div [ classes "fl w-30 gray mv1" ] [ text "INTERFACE" ]
, div [ classes "fl w-70 mv1" ]
(blueprintInfo.modules |>
List.map (\m -> viewToggledInterface (checkToggle m.name) m.name m.interface))
] ]
, div [ classes "fl w-30 gray mv1" ] [ text "DESCRIPTION" ]
, div [ classes "fl w-70 mv1" ] [ span [ classes "fl w-100 black" ] [ text blueprintInfo.description ] ]
, div [ classes "fl w-30 gray mv1" ] [ text "INTERFACE" ]
, div [ classes "fl w-70 mv1" ]
(blueprintInfo.modules
|> List.map (\m -> viewToggledInterface (checkToggle m.name) m.name m.interface)
)
]
viewToggledInterface : Bool -> String -> Interface -> Html Msg viewToggledInterface : Bool -> String -> Interface -> Html Msg
viewToggledInterface isOpen name interface = viewToggledInterface isOpen name interface =
let let
interfaceView = if (isOpen) then [(div [classes "fl w-100 ph4"] (instanceView interface))] else [] interfaceView =
if isOpen then
[ div [ classes "fl w-100 ph4" ] (instanceView interface) ]
else
[]
in in
div [] div []
([ div [classes "fl w-100 shadow-2 bg-near-white pa2 mv2 pointer", onClick (ToggleInterface name)] ([ div [ classes "fl w-100 shadow-2 bg-near-white pa2 mv2 pointer", onClick (ToggleInterface name) ]
[ span [ classes "fl mh2 pv1 tl" ] [text name] [ span [ classes "fl mh2 pv1 tl" ] [ text name ]
, div [ classes "o-40 f4 tr pr3" ] [if (isOpen) then text "" else text ""]] ] , div [ classes "o-40 f4 tr pr3" ]
++ interfaceView) [ if isOpen then
text ""
else
text ""
]
]
]
++ interfaceView
)

View File

@ -12,5 +12,5 @@ type alias BlueprintInfo =
{ name : String { name : String
, author : String , author : String
, instanceNumber : Int , instanceNumber : Int
, id: String , id : String
} }

View File

@ -17,13 +17,15 @@ view model =
getBlueprintsToServices model.blueprints model.discoveredPeers getBlueprintsToServices model.blueprints model.discoveredPeers
info = info =
Dict.values allBps |> List.map (\( bp, servicesByPeers ) -> Dict.values allBps
{ name = bp.name |> List.map
, id = bp.id (\( bp, servicesByPeers ) ->
, author = "Fluence Labs" { name = bp.name
, instanceNumber = List.length (servicesByPeers |> List.map (\( _, s ) -> s) |> List.concat) , id = bp.id
} , author = "Fluence Labs"
) , instanceNumber = List.length (servicesByPeers |> List.map (\( _, s ) -> s) |> List.concat)
}
)
servicesView = servicesView =
List.map viewService info List.map viewService info

View File

@ -23,7 +23,7 @@ toInstance peerId identify blueprints service =
{ name = name, instance = service.service_id, peerId = peerId, ip = ip } { name = name, instance = service.service_id, peerId = peerId, ip = ip }
view : Model -> (Service -> Bool) -> (Int, Html msg) view : Model -> (Service -> Bool) -> ( Int, Html msg )
view model filter = view model filter =
let let
instances = instances =
@ -36,7 +36,7 @@ view model filter =
) )
|> List.concat |> List.concat
in in
(List.length instances, viewTable instances) ( List.length instances, viewTable instances )
viewTable : List Instance -> Html msg viewTable : List Instance -> Html msg

View File

@ -19,18 +19,23 @@ view model id =
case moduleInfo of case moduleInfo of
Just mi -> Just mi ->
let let
check = Maybe.map (\bp -> bp.dependencies |> List.member id ) check =
filter = (\s -> model.blueprints |> Dict.get s.blueprint_id |> check |> Maybe.withDefault False) Maybe.map (\bp -> bp.dependencies |> List.member id)
(instanceNum, instanceView) = Instances.View.view model filter
filter =
\s -> model.blueprints |> Dict.get s.blueprint_id |> check |> Maybe.withDefault False
( instanceNum, instanceView ) =
Instances.View.view model filter
in in
div [ classes "fl w-100 cf ph2-ns" ] div [ classes "fl w-100 cf ph2-ns" ]
[ div [ classes "fl w-100 mb2 pt2"] [ div [ classes "fl w-100 mb2 pt2" ]
[ span [ classes "fl w-100 f1 lh-title dark-red" ] [ text ("Module: " ++ mi.name) ] [ span [ classes "fl w-100 f1 lh-title dark-red" ] [ text ("Module: " ++ mi.name) ]
]
, div [ classes "fl w-100 bg-white mt2 mh2 ph4 pt3" ] [ viewInfo mi ]
, h3 [ classes "pt3" ] [ text ("Instances (" ++ (String.fromInt instanceNum) ++ ")") ]
, div [ classes "fl w-100 mt2 bg-white" ] [ instanceView ]
] ]
, div [ classes "fl w-100 bg-white mt2 mh2 ph4 pt3" ] [ viewInfo mi ]
, h3 [ classes "pt3" ] [ text ("Instances (" ++ String.fromInt instanceNum ++ ")") ]
, div [ classes "fl w-100 mt2 bg-white" ] [ instanceView ]
]
Nothing -> Nothing ->
div [ classes "cf ph2-ns" ] div [ classes "cf ph2-ns" ]

View File

@ -96,11 +96,20 @@ update msg model =
ToggleInterface id -> ToggleInterface id ->
case model.toggledInterface of case model.toggledInterface of
Just ti -> Just ti ->
( { model | toggledInterface = if (id == ti) then Nothing else Just id }, Cmd.none ) ( { model
| toggledInterface =
if id == ti then
Nothing
else
Just id
}
, Cmd.none
)
Nothing -> Nothing ->
( { model | toggledInterface = Just id }, Cmd.none ) ( { model | toggledInterface = Just id }, Cmd.none )
RelayChanged relayId -> RelayChanged relayId ->
( { model | relayId = relayId }, Cmd.none ) ( { model | relayId = relayId }, Cmd.none )

View File

@ -40,17 +40,17 @@ body model =
layout <| layout <|
List.concat List.concat
[ [ header [ classes "w-100" ] [ [ header [ classes "w-100" ]
[ div [ classes "fl pa2 pb1 bg-white w-100" ] [ div [ classes "fl pa2 pb1 bg-white w-100" ]
[ div [ classes "fl mv1 pl3", style "max-width" "96px"] [ div [ classes "fl mv1 pl3", style "max-width" "96px" ]
[ a [ attribute "href" "/"] [ a [ attribute "href" "/" ]
[ img [ classes "v-mid dib mw-100 h-auto", attribute "src" "/images/logo_new.svg"] [] [ img [ classes "v-mid dib mw-100 h-auto", attribute "src" "/images/logo_new.svg" ] []
]
] ]
, div [ classes "fl pl5 h-100" ] [ p [ classes "mv2" ] [ text "Developer Hub" ] ]
] ]
, div [ classes "fl pl5 h-100" ] [p [classes "mv2"] [text "Developer Hub"]]
] ]
]
] ]
, [div [ classes "w-100 pa4 pt2 mt2"] [routeView model model.page]] , [ div [ classes "w-100 pa4 pt2 mt2" ] [ routeView model model.page ] ]
] ]