WIP

reorderablegrid.elm

import Html exposing (Html)
import Html.Attributes 
import Signal exposing (Address)
import List

infixl 2 =>
(=>) = (,)

type alias Vector = 
  { x : Float , y : Float }
  
type alias Selection = 
  { index    : Int 
  , position : Vector 
  }

type alias State childState = 
  { children   : List childState 
  , gridWidth  : Float
  , numCols    : Int
  , cellHeight : Float
  , selected   : Maybe Selection
  }
  
  
indexIsSelected : Int -> State childState -> Bool 
indexIsSelected n {selected} = 
  case selected of   
    Nothing -> 
      False
      
    Just {index} -> 
      n == index

type alias Context = 
  { row      : Int 
  , column   : Int 
  , size     : Vector 
  , selected : Bool 
  }
  
  
cellSize : State childState -> Vector
cellSize state =
  { x = state.gridWidth / (toFloat state.numCols)
  , y = state.cellHeight
  }
 
 
generateContext : Bool -> Int -> State childState -> Context
generateContext selected index state =
  let
      column =
        index % state.numCols

      row =
        index // state.numCols

      size =
        cellSize state

  in
      { size      = size
      , row       = row
      , column    = column
      , selected  = selected
      }

type Action childAction 
  = ChildAction Int childAction 
  | Select Vector
  | Drag Vector
  | Drop Vector 


--getClosest : Vector -> Int

type alias CellContext = 
  { position : Vector 
  , size     : Vector 
  , index    : Int
  }
  



viewCell : (Address childAction -> childState -> Html) -> CellContext -> Address (Action childAction) -> childState -> Html 
viewCell viewChild cellContext address childState = 
  let 
      cellContainerStyle = 
          [ "position" => "absolute"
          , "left"     => toString cellContext.position.x ++ "px"
          , "top"      => toString cellContext.position.y ++ "px"
          , "width"    => toString cellContext.size.x ++ "px"
          , "height"   => toString cellContext.size.y ++ "px"
          ]
          
      childAddress = 
          Signal.forwardTo address (ChildAction cellContext.index) 
          
  in 
      Html.div 
          [ Html.Attributes.style cellContainerStyle 
          ]
          [ viewChild childAddress childState
          ]

view : (Context -> Address childAction -> childState -> Html) -> Address (Action childAction) -> State childState -> Html 
view viewChild address state = 
  let 
      containerStyle = 
          []
          
      
      viewN index childState = 
          let 
              context = 
                  generateContext (indexIsSelected index state) index state
          in 
              Html.div 
                  []
                  []
              
                  
          
  in 
      Html.div 
          []
          ( List.indexedMap viewN state.children )