github.com/pf-qiu/concourse/v6@v6.7.3-0.20201207032516-1f455d73275f/web/elm/src/Views/TopBar.elm (about) 1 module Views.TopBar exposing 2 ( breadcrumbs 3 , concourseLogo 4 ) 5 6 import Assets 7 import Concourse 8 import Html exposing (Html) 9 import Html.Attributes 10 exposing 11 ( class 12 , href 13 , id 14 ) 15 import Message.Message exposing (DomID(..), Message(..)) 16 import Routes 17 import Url 18 import Views.Styles as Styles 19 20 21 concourseLogo : Html Message 22 concourseLogo = 23 Html.a (href "/" :: Styles.concourseLogo) [] 24 25 26 breadcrumbs : Routes.Route -> Html Message 27 breadcrumbs route = 28 Html.div 29 (id "breadcrumbs" :: Styles.breadcrumbContainer) 30 <| 31 case route of 32 Routes.Pipeline { id } -> 33 [ pipelineBreadcumb 34 { teamName = id.teamName 35 , pipelineName = id.pipelineName 36 } 37 ] 38 39 Routes.Build { id } -> 40 [ pipelineBreadcumb 41 { teamName = id.teamName 42 , pipelineName = id.pipelineName 43 } 44 , breadcrumbSeparator 45 , jobBreadcrumb id.jobName 46 ] 47 48 Routes.Resource { id } -> 49 [ pipelineBreadcumb 50 { teamName = id.teamName 51 , pipelineName = id.pipelineName 52 } 53 , breadcrumbSeparator 54 , resourceBreadcrumb id.resourceName 55 ] 56 57 Routes.Job { id } -> 58 [ pipelineBreadcumb 59 { teamName = id.teamName 60 , pipelineName = id.pipelineName 61 } 62 , breadcrumbSeparator 63 , jobBreadcrumb id.jobName 64 ] 65 66 _ -> 67 [] 68 69 70 breadcrumbComponent : 71 { icon : 72 { component : Assets.ComponentType 73 , widthPx : Float 74 , heightPx : Float 75 } 76 , name : String 77 } 78 -> List (Html Message) 79 breadcrumbComponent { name, icon } = 80 [ Html.div 81 (Styles.breadcrumbComponent icon) 82 [] 83 , Html.text <| decodeName name 84 ] 85 86 87 breadcrumbSeparator : Html Message 88 breadcrumbSeparator = 89 Html.li 90 (class "breadcrumb-separator" :: Styles.breadcrumbItem False) 91 [ Html.text "/" ] 92 93 94 pipelineBreadcumb : Concourse.PipelineIdentifier -> Html Message 95 pipelineBreadcumb pipelineId = 96 Html.a 97 ([ id "breadcrumb-pipeline" 98 , href <| 99 Routes.toString <| 100 Routes.Pipeline { id = pipelineId, groups = [] } 101 ] 102 ++ Styles.breadcrumbItem True 103 ) 104 (breadcrumbComponent 105 { icon = 106 { component = Assets.PipelineComponent 107 , widthPx = 28 108 , heightPx = 16 109 } 110 , name = pipelineId.pipelineName 111 } 112 ) 113 114 115 jobBreadcrumb : String -> Html Message 116 jobBreadcrumb jobName = 117 Html.li 118 (id "breadcrumb-job" :: Styles.breadcrumbItem False) 119 (breadcrumbComponent 120 { icon = 121 { component = Assets.JobComponent 122 , widthPx = 32 123 , heightPx = 17 124 } 125 , name = jobName 126 } 127 ) 128 129 130 resourceBreadcrumb : String -> Html Message 131 resourceBreadcrumb resourceName = 132 Html.li 133 (id "breadcrumb-resource" :: Styles.breadcrumbItem False) 134 (breadcrumbComponent 135 { icon = 136 { component = Assets.ResourceComponent 137 , widthPx = 32 138 , heightPx = 17 139 } 140 , name = resourceName 141 } 142 ) 143 144 145 decodeName : String -> String 146 decodeName name = 147 Maybe.withDefault name (Url.percentDecode name)