@@ -11,6 +11,9 @@ import Element.Font as Font
1111import Element.Input as Input
1212import Element.Keyed as Keyed
1313import Html.Attributes
14+import Html.String
15+import Html.Styled.Attributes exposing (css)
16+import Html exposing (Html, hr)
1417import Json.Decode as JD
1518import List.Extra
1619import Set exposing (Set)
@@ -22,6 +25,11 @@ import Ur.Jam exposing (isSig)
2225import Ur.Run
2326import Ur.Sub
2427import Ur.Types exposing (Noun(..))
28+import Html.String
29+import List
30+import Html.Styled.Attributes exposing (css)
31+import Html.Parser
32+import String.Extra exposing (stripTags)
2533
2634
2735url : String
@@ -61,7 +69,6 @@ type alias SearchResult =
6169 , engines : Set String
6270 }
6371
64−
6572type Msg
6673 = Noop
6774 | GotShipName String
@@ -100,7 +107,8 @@ main =
100107 [ view model
101108 |> layout
102109 [ Font.family
103− [ Font.typeface "system-ui"
110+ [ Font.typeface "monospace"
111+ , Font.typeface "system-ui"
104112 , Font.typeface "-apple-system"
105113 , Font.typeface "BlinkMacSystemFont"
106114 , Font.typeface "Segoe UI"
@@ -108,12 +116,9 @@ main =
108116 , Font.typeface "Helvetica"
109117 , Font.typeface "Arial"
110118 , Font.sansSerif
111− , Font.typeface "Apple Color Emoji"
112− , Font.typeface "Segoe UI Emoji"
113− , Font.typeface "Segoe UI Symbol"
114119 ]
115120 , clipX
116− ]
121+ ]
117122 ]
118123 }
119124 , subscriptions = \model -> Animator.toSubscription Tick model (animator model)
@@ -150,20 +155,51 @@ main =
150155 }
151156
152157
158+logoView : List (Attribute Msg) -> Element Msg
159+logoView attributes =
160+ Element.image (List.append [ Html.Attributes.id "tilt" |> htmlAttribute ] attributes)
161+ { src = "assets/img/logo.png", description = "%seax logo" }
162+
163+noSearchResultsView : Element Msg
164+noSearchResultsView = Element.el
165+ [ Html.Attributes.style "padding" "1em" |> htmlAttribute
166+ , width (px 500)
167+ , Font.size 15
168+ , Html.Attributes.class "wavy" |> htmlAttribute
169+ ]
170+ (Element.text """No results found... :)
171+We'll try and find you something.
172+Just come back later.""")
173+
174+subtleLink : String -> String -> Element Msg
175+subtleLink text href =
176+ Element.el
177+ [ Font.size 15
178+ , pointer
179+ , mouseOver
180+ [ Font.color (rgb 0.7 0.7 0.7)
181+ ]
182+ ]
183+ (Element.html (Html.a [ Html.Attributes.href href ] [ Html.text text ]))
184+
185+
153186view : Model -> Element Msg
154187view model =
155188 case model.initiatedSearch of
156189 Nothing ->
157190 column [ centerX, centerY, padding 8, spacing 16 ]
158− [ el [ centerX, Font.size 67, Font.heavy ] (text "%seax")
191+ [ logoView [ centerX, width (px 510), height (px 161) ]
159192 , searchView model
160193 ]
161194
162195 Just _ ->
163196 column [ width fill, spacing 16 ]
164− [ column [ spacing 16, width (minimum 0 fill), padding 8 ]
165− [ searchView model |> el []
197+ [ column [ spacing 16, width (minimum 0 fill), padding 8]
198+ [ row [] [ logoView [height (px 40)], searchView model |> el [] ]
166199 , row [ spacing 8, paddingEach { top = 16, bottom = 16, left = 0, right = 0 } ]
200+ (if List.isEmpty model.engines then
201+ []
202+ else
167203 [ text "Sources: "
168204 , model.engines
169205 |> List.filter (\( _, state ) -> state /= Failed)
@@ -203,12 +239,14 @@ view model =
203239 |> wrappedRow
204240 [ spacing 8
205241 , width fill
206−
207− -- , padding 16
208242 ]
209243 ]
244+ )
210245 ]
211− , Keyed.column [ width (minimum 0 fill), padding 8 ]
246+ , (if List.isEmpty model.searchResults then
247+ noSearchResultsView
248+ else
249+ Keyed.column [ width (minimum 0 fill), padding 8 ]
212250 (model.searchResults
213251 |> List.filter
214252 (\{ engines } ->
@@ -251,12 +289,13 @@ view model =
251289 ++ "px"
252290 )
253291 |> htmlAttribute
254− , Html.Attributes.style "position" "absolute" |> htmlAttribute
292+ , Html.Attributes.style "margin-bottom" "1em" |> htmlAttribute
293+ , Html.Attributes.style "padding" "0.5em" |> htmlAttribute
294+ , Html.Attributes.class "result" |> htmlAttribute
255295 ]
256− [ text title
296+ [ text (stripTags title)
257297 |> el
258298 [ Font.size 16
259− , width fill
260299 ]
261300 , text link
262301 |> el
@@ -266,14 +305,19 @@ view model =
266305 ]
267306 )
268307 )
269− )
308+ ))
309+ , Element.html (Html.hr [Html.Attributes.style "width" "95%"] [])
310+ , row [ centerX, padding 10, spacing 10]
311+ [ subtleLink "[About]" "https://vagos.github.io/seax"
312+ , subtleLink "[Code]" "https://github.com/ilyakooo0/seax"
270313 ]
314+ ]
271315
272316
273317searchView : { a | search : String } -> Element Msg
274318searchView model =
275319 row [ spacing 8 ]
276− [ Input.text [ width (px 250) ]
320+ [ Input.text [ Html.Attributes.class "shadow" |> htmlAttribute, width (px 400)]
277321 { onChange = UpdateSearch
278322 , placeholder = Nothing
279323 , text = model.search
@@ -283,23 +327,15 @@ searchView model =
283327 { label =
284328 text "search"
285329 |> el
286− [ Border.width 4
287− , padding 4
330+ [ Html.Attributes.class "search" |> htmlAttribute
331+ , Border.width 2
332+ , padding 6
288333 , Font.size 29
289− , Font.bold
290− , Border.color (rgb 0 0 0)
291− , Background.color (rgb 0 0 0)
292− , Font.color (rgb 1 1 1)
293− , mouseOver
294− [ Font.color (rgb 0 0 0)
295− , Background.color (rgb 1 1 1)
296− ]
297334 ]
298335 , onPress = Just (Search model.search)
299336 }
300337 ]
301338
302−
303339update : Msg -> Model -> ( Model, Ur.Cmd.Cmd Msg )
304340update msg model =
305341 case msg of