Skip to content

Commit

Permalink
Merge pull request #64 from priyanshu0405/master
Browse files Browse the repository at this point in the history
  • Loading branch information
razzeee authored Jun 9, 2021
2 parents b1c2d46 + f8a0d45 commit 3b7202b
Show file tree
Hide file tree
Showing 9 changed files with 1,782 additions and 3,979 deletions.
6 changes: 3 additions & 3 deletions elm.json
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
"dependencies": {
"direct": {
"NoRedInk/elm-json-decode-pipeline": "1.0.0",
"PaackEng/elm-ui-dialog": "1.0.0",
"PaackEng/elm-ui-dialog": "1.0.1",
"avh4/elm-color": "1.0.0",
"carwow/elm-slider": "11.1.6",
"elm/browser": "1.0.2",
Expand All @@ -18,7 +18,7 @@
"elm/svg": "1.0.1",
"elm/time": "1.0.0",
"elm/url": "1.0.0",
"elm-community/list-extra": "8.3.0",
"elm-community/list-extra": "8.3.1",
"icidasset/elm-material-icons": "7.0.0",
"mdgriffith/elm-ui": "1.1.8"
},
Expand All @@ -32,7 +32,7 @@
},
"test-dependencies": {
"direct": {
"avh4/elm-program-test": "3.4.0",
"avh4/elm-program-test": "3.5.0",
"elm-explorations/test": "1.2.2"
},
"indirect": {
Expand Down
5,446 changes: 1,550 additions & 3,896 deletions package-lock.json

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions src/Components/Frame.elm
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@ layout layoutType =
}
, header = Header.view layoutType.searchChanged
, playerBar = PlayerRow.view layoutType
, rightSidebar = RightSidebar.view layoutType.rightSidebarExtended layoutType.rightSidebarMsg (layoutType.windowHeight - PlayerRow.playerHeight) layoutType.connection
, leftSidebar = LeftSidebar.view
, rightSidebar = RightSidebar.view layoutType.showRightSidebarMenu layoutType.rightSidebarExtended layoutType.rightSidebarMsg (layoutType.windowHeight - PlayerRow.playerHeight) layoutType.connection
, leftSidebar = LeftSidebar.view layoutType.leftSidebarControl
, dialogBox = (Dialog.view dialogConfig)
}
25 changes: 22 additions & 3 deletions src/Components/LayoutType.elm
Original file line number Diff line number Diff line change
@@ -1,12 +1,14 @@
module Components.LayoutType exposing (DialogType(..), ControlMenu, CurrentlyPlaying, LayoutType, PlayerControl, VolumeAndControls)
module Components.LayoutType exposing (DialogType(..), LeftSidebarControl, ShowRightSidebarMenu, ControlMenu, CurrentlyPlaying, LayoutType, PlayerControl, VolumeAndControls)

import Element exposing (Element)
import Spa.Document exposing (Document)
import WSDecoder exposing (Connection, ItemDetails)
import WSDecoder exposing (LeftSidebarMenuHover, Connection, ItemDetails)

type alias LayoutType msg =
{ page : Document msg
, controlMenu : ControlMenu msg
, leftSidebarControl : LeftSidebarControl msg
, showRightSidebarMenu : ShowRightSidebarMenu msg
, playerControl : PlayerControl msg
, currentlyPlaying : CurrentlyPlaying msg
, volumeAndControls : VolumeAndControls msg
Expand Down Expand Up @@ -40,6 +42,19 @@ type alias VolumeAndControls msg =
, volumeSlider : Element msg
}

type alias LeftSidebarControl msg =
{ leftSidebarMenuHover : LeftSidebarMenuHover
, leftSidebarMusicHoverMsg : msg
, leftSidebarMoviesHoverMsg : msg
, leftSidebarTVShowHoverMsg : msg
, leftSidebarAddonsHoverMsg : msg
, leftSidebarPlaylistHoverMsg : msg
, leftSidebarBrowserHoverMsg : msg
, leftSidebarSettingsHoverMsg : msg
, leftSidebarThumbsUpHoverMsg : msg
, leftSidebarHelpHoverMsg : msg
, leftSidebarNotHoverMsg : msg
}

type alias ControlMenu msg =
{ controlMenu : Bool
Expand All @@ -49,6 +64,11 @@ type alias ControlMenu msg =
, scanMusicLibraryMsg : msg
}

type alias ShowRightSidebarMenu msg =
{ showRightSidebarMenu : Bool
, showRightSidebarMenuMsg : msg
}

type alias DialogBox msg =
{ showDialog : DialogType
, attemptReconnectionMsg : msg
Expand All @@ -58,4 +78,3 @@ type alias DialogBox msg =
}

type DialogType = ConnectionDialog | TextInputDialog | None

123 changes: 72 additions & 51 deletions src/Components/LeftSidebar.elm
Original file line number Diff line number Diff line change
Expand Up @@ -3,86 +3,107 @@ module Components.LeftSidebar exposing (view)
import Colors
import Element exposing (..)
import Element.Background as Background
import Element.Font as Font
import Element.Events as Events
import Html.Attributes
import Material.Icons as Filled
import Material.Icons.Types as MITypes exposing (Coloring(..), Icon)
import Spa.Generated.Route as Route exposing (Route)
import Components.LayoutType exposing (LeftSidebarControl)
import WSDecoder exposing (LeftSidebarMenuHover(..))


view : LeftSidebarControl msg -> Element msg
view leftSidebarControl =
column [ height fill, centerX, alignLeft, htmlAttribute <| Html.Attributes.style "pointer-events" "all" ]
[ el [height (px 20)] (text "" )
, musicButton leftSidebarControl
, movieButton leftSidebarControl
, tvshowButton leftSidebarControl
, browserButton leftSidebarControl
, addonsButton leftSidebarControl
, thumbsupButton leftSidebarControl
, playlistButton leftSidebarControl
, settingsButton leftSidebarControl
, helpButton leftSidebarControl
]


view : Element msg
view =
column [ height fill, centerX, spacing 20, padding 15, alignLeft, htmlAttribute <| Html.Attributes.style "pointer-events" "all" ]
[ musicButton
, movieButton
, tvshowButton
, browserButton
, addonsButton
, thumbsupButton
, playlistButton
, settingsButton
, helpButton
]
materialIconLink : LeftSidebarMenuHover -> msg -> msg -> LeftSidebarMenuHover -> String -> Icon msg -> Route -> Element msg
materialIconLink elementHover elementHoverMsg elementLeaveMsg iconHoverName name icon route =
let
leftSidebarIcon =
if elementHover == iconHoverName then
row[]
[el [paddingXY 7 0] (Element.html (icon 20 Inherit))
, el [paddingXY 5 0, Font.size 14] (text name)
]

else
el [paddingXY 7 0] (Element.html (icon 20 Inherit))

materialIconLink : ( Icon msg, Route ) -> Element msg
materialIconLink ( icon, route ) =
el
[ Element.mouseOver
[ scale 1.1
, Background.color Colors.brandPrimary
]
]
<|
Element.link []
leftSidebarIconStyle =
if elementHover == iconHoverName then
[Background.color Colors.brandPrimary, Font.color (rgb255 255 255 255), padding 8]

else
[Font.color (rgb255 0 0 0), padding 8]
in
el []

(Element.link (Events.onMouseEnter elementHoverMsg
:: Events.onMouseLeave elementLeaveMsg
:: leftSidebarIconStyle)
{ url = Route.toString route
, label = Element.html (icon 20 (MITypes.Color <| (Colors.fromElementColorToColor <| Colors.greyscaleOuterSpace)))
, label = leftSidebarIcon
}
)



-- buttons


musicButton : Element msg
musicButton =
materialIconLink ( Filled.library_music, Route.Music )
musicButton : LeftSidebarControl msg -> Element msg
musicButton leftSidebarControl =
materialIconLink leftSidebarControl.leftSidebarMenuHover leftSidebarControl.leftSidebarMusicHoverMsg leftSidebarControl.leftSidebarNotHoverMsg Music "Music" Filled.library_music Route.Music


movieButton : Element msg
movieButton =
materialIconLink ( Filled.movie, Route.Movies__Recent )
movieButton : LeftSidebarControl msg -> Element msg
movieButton leftSidebarControl =
materialIconLink leftSidebarControl.leftSidebarMenuHover leftSidebarControl.leftSidebarMoviesHoverMsg leftSidebarControl.leftSidebarNotHoverMsg Movies "Movies" Filled.movie Route.Movies__Recent


tvshowButton : Element msg
tvshowButton =
materialIconLink ( Filled.tv, Route.Tvshows__Recent )
tvshowButton : LeftSidebarControl msg -> Element msg
tvshowButton leftSidebarControl =
materialIconLink leftSidebarControl.leftSidebarMenuHover leftSidebarControl.leftSidebarTVShowHoverMsg leftSidebarControl.leftSidebarNotHoverMsg TVShow "TV shows" Filled.tv Route.Tvshows__Recent


browserButton : Element msg
browserButton =
materialIconLink ( Filled.list, Route.Browser )
browserButton : LeftSidebarControl msg -> Element msg
browserButton leftSidebarControl =
materialIconLink leftSidebarControl.leftSidebarMenuHover leftSidebarControl.leftSidebarBrowserHoverMsg leftSidebarControl.leftSidebarNotHoverMsg Browser "Browser" Filled.list Route.Browser


addonsButton : Element msg
addonsButton =
materialIconLink ( Filled.extension, Route.Addons )
addonsButton : LeftSidebarControl msg -> Element msg
addonsButton leftSidebarControl =
materialIconLink leftSidebarControl.leftSidebarMenuHover leftSidebarControl.leftSidebarAddonsHoverMsg leftSidebarControl.leftSidebarNotHoverMsg Addons "Add-ons" Filled.extension Route.Addons


thumbsupButton : Element msg
thumbsupButton =
materialIconLink ( Filled.thumb_up, Route.Thumbsup )
thumbsupButton : LeftSidebarControl msg -> Element msg
thumbsupButton leftSidebarControl =
materialIconLink leftSidebarControl.leftSidebarMenuHover leftSidebarControl.leftSidebarThumbsUpHoverMsg leftSidebarControl.leftSidebarNotHoverMsg ThumbsUp "Thumbs up" Filled.thumb_up Route.Thumbsup


playlistButton : Element msg
playlistButton =
materialIconLink ( Filled.assignment, Route.Playlists )
playlistButton : LeftSidebarControl msg -> Element msg
playlistButton leftSidebarControl =
materialIconLink leftSidebarControl.leftSidebarMenuHover leftSidebarControl.leftSidebarPlaylistHoverMsg leftSidebarControl.leftSidebarNotHoverMsg Playlist "Playlists" Filled.assignment Route.Playlists


settingsButton : Element msg
settingsButton =
materialIconLink ( Filled.settings, Route.Settings__Web )
settingsButton : LeftSidebarControl msg -> Element msg
settingsButton leftSidebarControl =
materialIconLink leftSidebarControl.leftSidebarMenuHover leftSidebarControl.leftSidebarSettingsHoverMsg leftSidebarControl.leftSidebarNotHoverMsg Settings "Settings" Filled.settings Route.Settings__Web


helpButton : Element msg
helpButton =
materialIconLink ( Filled.help, Route.Help )
helpButton : LeftSidebarControl msg -> Element msg
helpButton leftSidebarControl =
materialIconLink leftSidebarControl.leftSidebarMenuHover leftSidebarControl.leftSidebarHelpHoverMsg leftSidebarControl.leftSidebarNotHoverMsg Help "Help" Filled.help Route.Help
31 changes: 25 additions & 6 deletions src/Components/RightSidebar.elm
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
module Components.RightSidebar exposing (view)

import Colors exposing (greyIcon)
import Element exposing (Element, alignRight, centerX, column, el, fill, height, htmlAttribute, padding, paddingXY, px, rgb, row, spacing, text, width)
import Components.LayoutType exposing (ShowRightSidebarMenu)
import Element exposing (Attribute, Element, alignRight, centerX, centerY, column, el, fill, height, htmlAttribute, padding, paddingXY, px, rgb, row, spacing, text, width)
import Element.Background as Background
import Element.Input as Input
import Html.Attributes
Expand All @@ -10,15 +11,15 @@ import Material.Icons.Types as MITypes
import WSDecoder exposing (Connection(..))


view : Bool -> msg -> Int -> Connection -> Element msg
view rightSidebarExtended rightSidebarMsg panelHeight connection =
view : ShowRightSidebarMenu msg -> Bool -> msg -> Int -> Connection -> Element msg
view { showRightSidebarMenu, showRightSidebarMenuMsg } rightSidebarExtended rightSidebarMsg panelHeight connection =
if rightSidebarExtended then
column
[ height (px panelHeight), width (px 400), Background.color Colors.playlistHeaderBackground, alignRight, htmlAttribute <| Html.Attributes.style "pointer-events" "all" ]
[ row [ width fill ]
[ Input.button [ Background.color Colors.backgroundKodi, height (px 50), width (px 100), padding 8 ] { onPress = Just rightSidebarMsg, label = Element.text "Kodi" }
, Input.button [ Background.color Colors.backgroundLocal, height (px 50), width (px 100), padding 8 ] { onPress = Just rightSidebarMsg, label = Element.text "Local" }
, el []
, el (rightSidebarMenuDropDown showRightSidebarMenu)
(case connection of
Connected ->
Element.text "Connected"
Expand All @@ -29,8 +30,8 @@ view rightSidebarExtended rightSidebarMsg panelHeight connection =
NotAsked ->
Element.text "Not asked"
)
, Input.button [ Background.color Colors.playlistHeaderBackground, height (px 50), width (px 50), centerX, alignRight ]
{ onPress = Just rightSidebarMsg
, Input.button ( [ Background.color Colors.playlistHeaderBackground, height (px 50), width (px 50), centerX, alignRight, centerY ])
{ onPress = Just showRightSidebarMenuMsg
, label =
Element.html
(Filled.more_vert 32 (MITypes.Color <| greyIcon))
Expand All @@ -45,3 +46,21 @@ view rightSidebarExtended rightSidebarMsg panelHeight connection =
[ height (px panelHeight), width (px 50), Background.color Colors.playlistBackground, alignRight, htmlAttribute <| Html.Attributes.style "pointer-events" "all" ]
[ Input.button [ centerX, height (px 50) ] { onPress = Just rightSidebarMsg, label = Element.text "<" }
]

rightSidebarMenuDropDown : Bool -> List (Attribute msg)
rightSidebarMenuDropDown showRightSidebarMenu =
if showRightSidebarMenu then
[ Element.below
(Element.column [ width (px 150), Background.color Colors.white ]
[ Input.button [ width fill, Element.mouseOver [ Background.color Colors.playerControl ], Element.padding 7 ] {onPress = Nothing, label = el [] (text "Current playlist") }
, Input.button [ width fill, Element.mouseOver [ Background.color Colors.playerControl ], Element.padding 7 ] {onPress = Nothing, label = el [] (text "Clear playlist") }
, Input.button [ width fill, Element.mouseOver [ Background.color Colors.playerControl ], Element.padding 7 ] {onPress = Nothing, label = el [] (text "Refresh playlist") }
, Input.button [ width fill, Element.mouseOver [ Background.color Colors.playerControl ], Element.padding 7 ] {onPress = Nothing, label = el [] (text "Party mode") }
, Input.button [ width fill, Element.mouseOver [ Background.color Colors.playerControl ], Element.padding 7 ] {onPress = Nothing, label = el [] (text "Kodi") }
, Input.button [ width fill, Element.mouseOver [ Background.color Colors.playerControl ], Element.padding 7 ] {onPress = Nothing, label = el [] (text "Save Kodi playlist") }
]
)
]

else
[]
Loading

0 comments on commit 3b7202b

Please sign in to comment.