initial pass
parent
e20c9b4f5a
commit
7e2db6d8c7
|
@ -0,0 +1,2 @@
|
|||
/elm-stuff
|
||||
/index.html
|
|
@ -0,0 +1,24 @@
|
|||
{
|
||||
"type": "application",
|
||||
"source-directories": [
|
||||
"src"
|
||||
],
|
||||
"elm-version": "0.19.1",
|
||||
"dependencies": {
|
||||
"direct": {
|
||||
"elm/browser": "1.0.2",
|
||||
"elm/core": "1.0.5",
|
||||
"elm/html": "1.0.0"
|
||||
},
|
||||
"indirect": {
|
||||
"elm/json": "1.1.3",
|
||||
"elm/time": "1.0.0",
|
||||
"elm/url": "1.0.0",
|
||||
"elm/virtual-dom": "1.0.2"
|
||||
}
|
||||
},
|
||||
"test-dependencies": {
|
||||
"direct": {},
|
||||
"indirect": {}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,31 @@
|
|||
module Attachment exposing (Attachment, init, view)
|
||||
|
||||
import Html exposing (Html)
|
||||
import Html.Attributes as Attrs
|
||||
|
||||
|
||||
type alias Attachment =
|
||||
{ top : Int }
|
||||
|
||||
|
||||
init : Int -> Attachment
|
||||
init =
|
||||
Attachment << abs
|
||||
|
||||
|
||||
view : Int -> Attachment -> Html msg
|
||||
view left { top } =
|
||||
Html.div
|
||||
[ Attrs.style "width" "15px"
|
||||
, Attrs.style "height" "15px"
|
||||
, Attrs.style "border" "1px solid blue"
|
||||
, Attrs.style "border-radius" "100%"
|
||||
, Attrs.style "background-color" "white"
|
||||
, Attrs.style "cursor" "pointer"
|
||||
|
||||
-- position
|
||||
, Attrs.style "position" "absolute"
|
||||
, Attrs.style "left" (String.fromInt left ++ "px")
|
||||
, Attrs.style "top" (String.fromInt top ++ "px")
|
||||
]
|
||||
[]
|
|
@ -0,0 +1,25 @@
|
|||
module Comment exposing (Comment, init, view)
|
||||
|
||||
import Html exposing (Html)
|
||||
import Html.Attributes as Attrs
|
||||
|
||||
|
||||
type alias Comment =
|
||||
{ height : Int }
|
||||
|
||||
|
||||
init : Int -> Comment
|
||||
init =
|
||||
Comment << abs
|
||||
|
||||
|
||||
view : Comment -> Html msg
|
||||
view { height } =
|
||||
Html.div
|
||||
[ Attrs.style "width" "150px"
|
||||
, Attrs.style "height" (String.fromInt height ++ "px")
|
||||
, Attrs.style "border" "1px solid blue"
|
||||
, Attrs.style "border-radius" "10px"
|
||||
, Attrs.style "background-color" "white"
|
||||
]
|
||||
[]
|
|
@ -0,0 +1,75 @@
|
|||
module Main exposing (..)
|
||||
|
||||
import Attachment exposing (Attachment)
|
||||
import Browser
|
||||
import Comment exposing (Comment)
|
||||
import Html exposing (Html)
|
||||
import Html.Attributes as Attrs
|
||||
|
||||
|
||||
type alias Model =
|
||||
{ attachments : List Attachment
|
||||
, comments : List Comment
|
||||
}
|
||||
|
||||
|
||||
type Msg
|
||||
= AddNewCommentAndAttachment
|
||||
|
||||
|
||||
init : () -> ( Model, Cmd Msg )
|
||||
init _ =
|
||||
( { attachments = []
|
||||
, comments = []
|
||||
}
|
||||
, Cmd.none
|
||||
)
|
||||
|
||||
|
||||
update : Msg -> Model -> ( Model, Cmd Msg )
|
||||
update _ _ =
|
||||
Debug.todo "update"
|
||||
|
||||
|
||||
view : Model -> Browser.Document Msg
|
||||
view model =
|
||||
{ title = "Comment Constraint Experiment"
|
||||
, body =
|
||||
[ Html.node "style" [] [ Html.text "body { user-select: none; }" ]
|
||||
, Html.main_
|
||||
[ Attrs.style "width" "100%"
|
||||
, Attrs.style "height" "100vh"
|
||||
, Attrs.style "background-color" "aliceblue"
|
||||
]
|
||||
(let
|
||||
horizMargin =
|
||||
50
|
||||
in
|
||||
-- line
|
||||
[ Html.div
|
||||
[ Attrs.style "width" "1px"
|
||||
, Attrs.style "height" "94vh"
|
||||
, Attrs.style "position" "absolute"
|
||||
, Attrs.style "left" (String.fromInt horizMargin ++ "px")
|
||||
, Attrs.style "top" "3vh"
|
||||
, Attrs.style "background-color" "blue"
|
||||
]
|
||||
[]
|
||||
]
|
||||
-- attachments
|
||||
++ List.map (Attachment.view horizMargin) model.attachments
|
||||
-- comments
|
||||
++ List.map Comment.view model.comments
|
||||
)
|
||||
]
|
||||
}
|
||||
|
||||
|
||||
main : Program () Model Msg
|
||||
main =
|
||||
Browser.document
|
||||
{ init = init
|
||||
, update = update
|
||||
, view = view
|
||||
, subscriptions = \_ -> Sub.none
|
||||
}
|
Loading…
Reference in New Issue