diva.js 6.0.2 → 7.2.4

package/src/View/Toolbar.elm

@@ -0,0 +1,189 @@
+module View.Toolbar exposing (viewToolbar)
+
+import Html exposing (Html, div, text)
+import Html.Attributes as HA exposing (classList)
+import Html.Lazy as Lazy
+import Model exposing (Model, SidebarState(..), ViewMode(..), currentManifest, getPageAt, pageViewStartIndex)
+import Msg exposing (Msg(..))
+import Utilities exposing (disabledIf, isNothing)
+import View.Helpers exposing (viewButton)
+import View.Icons as Icons
+
+
+viewToolbar : Model -> Html Msg
+viewToolbar model =
+    let
+        controlsDisabled =
+            currentManifest model |> isNothing
+
+        currentLabelText =
+            currentLabelFor model
+    in
+    div [ HA.class "canvas-toolbar-stack" ]
+        [ div [ HA.class "canvas-toolbar" ]
+            [ div [ HA.class "canvas-toolbar-section" ]
+                [ viewButton
+                    { label = "Zoom Out"
+                    , icon = Icons.zoomOut
+                    , onClickMsg = disabledIf controlsDisabled UserClickedZoomOut
+                    , isFullscreen = model.fullscreen
+                    }
+                , viewButton
+                    { label = "Zoom In"
+                    , icon = Icons.zoomIn
+                    , onClickMsg = disabledIf controlsDisabled UserClickedZoomIn
+                    , isFullscreen = model.fullscreen
+                    }
+                ]
+            , div [ HA.class "canvas-toolbar-section is-right" ]
+                [ viewButton
+                    { label = "Page View"
+                    , icon = Icons.pageViewOpen
+                    , onClickMsg = disabledIf controlsDisabled UserClickedOpenPageView
+                    , isFullscreen = model.fullscreen
+                    }
+                , viewButton
+                    { label = "Manifest Info"
+                    , icon = Icons.info
+                    , onClickMsg = disabledIf controlsDisabled UserClickedOpenManifestInfo
+                    , isFullscreen = model.fullscreen
+                    }
+                , viewButton
+                    { label =
+                        if model.viewMode == OneUp then
+                            "Two Page"
+
+                        else
+                            "One Page"
+                    , icon =
+                        if model.viewMode == OneUp then
+                            Icons.openingPageView
+
+                        else
+                            Icons.scrollingPageView
+                    , onClickMsg = disabledIf controlsDisabled UserToggledTwoUp
+                    , isFullscreen = model.fullscreen
+                    }
+                , viewButton
+                    { label = "Shift Pages"
+                    , icon =
+                        if model.shiftByOne then
+                            Icons.shiftLeft
+
+                        else
+                            Icons.shiftRight
+                    , onClickMsg = disabledIf (controlsDisabled || model.viewMode == OneUp) UserToggledShiftByOne
+                    , isFullscreen = model.fullscreen
+                    }
+                , viewButton
+                    (let
+                        sidebarVisible =
+                            if model.isMobile then
+                                model.mobileSidebarOpen
+
+                            else
+                                model.sidebarState /= SidebarHidden
+                     in
+                     { label =
+                        if sidebarVisible then
+                            "Hide Sidebar"
+
+                        else
+                            "Show Sidebar"
+                     , icon =
+                        if sidebarVisible then
+                            Icons.hideSidebar
+
+                        else
+                            Icons.showSidebar
+                     , onClickMsg = disabledIf controlsDisabled UserToggledSidebar
+                     , isFullscreen = model.fullscreen
+                     }
+                    )
+                , viewButton
+                    { label =
+                        if model.fullscreen then
+                            "Exit Full"
+
+                        else
+                            "Fullscreen"
+                    , icon =
+                        if model.fullscreen then
+                            Icons.fromFullscreen
+
+                        else
+                            Icons.toFullscreen
+                    , onClickMsg = Just UserToggledFullscreen
+                    , isFullscreen = model.fullscreen
+                    }
+                ]
+            ]
+        , Lazy.lazy2 viewCurrentLabel model.fullscreen currentLabelText
+        ]
+
+
+currentLabelFor : Model -> String
+currentLabelFor model =
+    let
+        fullLabelText =
+            case model.selectedIndex of
+                Just index ->
+                    case model.viewMode of
+                        OneUp ->
+                            getPageAt index model.pages
+                                |> Maybe.map .label
+                                |> Maybe.withDefault ""
+
+                        TwoUp ->
+                            let
+                                startIndex =
+                                    pageViewStartIndex model.viewMode model.shiftByOne index
+
+                                firstLabel =
+                                    getPageAt startIndex model.pages
+                                        |> Maybe.map .label
+
+                                secondLabel =
+                                    getPageAt (startIndex + 1) model.pages
+                                        |> Maybe.map .label
+                            in
+                            case ( firstLabel, secondLabel ) of
+                                ( Just left, _ ) ->
+                                    if model.shiftByOne && startIndex == 0 then
+                                        left
+
+                                    else
+                                        case secondLabel of
+                                            Just right ->
+                                                left ++ " / " ++ right
+
+                                            Nothing ->
+                                                left
+
+                                _ ->
+                                    ""
+
+                Nothing ->
+                    ""
+    in
+    truncateLabel 140 fullLabelText
+
+
+truncateLabel : Int -> String -> String
+truncateLabel maxLength label =
+    if String.length label > maxLength then
+        String.left (maxLength - 3) label ++ "..."
+
+    else
+        label
+
+
+viewCurrentLabel : Bool -> String -> Html Msg
+viewCurrentLabel fullscreen labelText =
+    div
+        [ classList
+            [ ( "canvas-label", True )
+            , ( "is-fullscreen", fullscreen )
+            ]
+        ]
+        [ text labelText ]

package/src/View.elm

@@ -0,0 +1,244 @@
+module View exposing (view)
+
+import Html exposing (Html, div, h1, node, text)
+import Html.Attributes as HA exposing (classList, id)
+import Html.Lazy as Lazy
+import IIIF.Language exposing (extractLabelFromLanguageMap)
+import IIIF.Presentation exposing (toLabel, toRequiredStatement)
+import Model exposing (Model, ResourceResponse(..), Response(..), currentManifest)
+import Msg exposing (Msg)
+import View.CollectionExplorer
+import View.Helpers exposing (emptyHtml, viewIf, viewMaybe)
+import View.HtmlRenderer as HtmlRenderer
+import View.ManifestInfoModal
+import View.PageViewModal
+import View.Sidebar
+import View.Toolbar exposing (viewToolbar)
+
+
+view : Model -> Html Msg
+view model =
+    let
+        maybeStatus =
+            viewerStatus model
+    in
+    div [ id model.rootElementId ]
+        [ div
+            [ classList
+                [ ( "diva-app", True )
+                , ( "is-fullscreen", model.fullscreen )
+                ]
+            ]
+            [ Lazy.lazy3 viewManifestTitle
+                model.showTitle
+                model.fullscreen
+                (manifestTitleFor model)
+            , div [ HA.class "diva-app-header" ]
+                [ viewToolbar model
+                ]
+            , div
+                [ classList
+                    [ ( "diva-app-body", True )
+                    , ( "is-fullscreen", model.fullscreen )
+                    ]
+                ]
+                [ View.CollectionExplorer.viewCollectionSidebar model
+                , View.CollectionExplorer.viewCollectionResizer model
+                , div
+                    [ classList
+                        [ ( "diva-canvas-column", True )
+                        , ( "is-fullscreen", model.fullscreen )
+                        ]
+                    ]
+                    [ Lazy.lazy5 viewCanvas
+                        model.fullscreen
+                        (isCanvasLoading model)
+                        (hasCollectionSidebar model)
+                        maybeStatus
+                        (zoomPercentageLabel model)
+                    ]
+                , View.Sidebar.viewSidebarResizer model
+                , View.Sidebar.viewSidebarPanel model
+                ]
+            , div [ HA.class "required-statement-dock" ]
+                [ viewMaybe (Lazy.lazy viewRequiredStatement) (requiredStatementTextFor model) ]
+            , View.PageViewModal.viewPageViewModal model
+            , View.ManifestInfoModal.viewManifestInfoModal model
+            ]
+        ]
+
+
+hasCollectionSidebar : Model -> Bool
+hasCollectionSidebar model =
+    case model.resourceResponse of
+        ResourceLoadedCollection _ ->
+            model.collectionSidebarVisible
+
+        _ ->
+            False
+
+
+isCanvasLoading : Model -> Bool
+isCanvasLoading model =
+    (model.isViewerLoading || model.resourceResponse == ResourceLoading) || (model.response == Loading)
+
+
+manifestTitleFor : Model -> String
+manifestTitleFor model =
+    currentManifest model
+        |> Maybe.map (\manifest -> toLabel manifest |> extractLabelFromLanguageMap model.detectedLanguage)
+        |> Maybe.withDefault ""
+
+
+requiredStatementTextFor : Model -> Maybe String
+requiredStatementTextFor model =
+    currentManifest model
+        |> Maybe.andThen toRequiredStatement
+        |> Maybe.map (\statement -> extractLabelFromLanguageMap model.detectedLanguage statement.value)
+
+
+viewCanvas : Bool -> Bool -> Bool -> Maybe ( String, String, Bool ) -> Maybe String -> Html Msg
+viewCanvas fullscreen isLoading showCollectionSidebar maybeStatus maybeZoomLabel =
+    div [ HA.class "diva-canvas-wrapper" ]
+        [ node "osd-viewer"
+            [ classList
+                [ ( "diva-canvas", True )
+                , ( "is-fullscreen", fullscreen )
+                , ( "has-collection", showCollectionSidebar )
+                ]
+            , id "main-viewer"
+            ]
+            []
+        , viewIf viewThrobber isLoading
+        , viewMaybe viewViewerStatusModal maybeStatus
+        , viewMaybe viewZoomIndicator maybeZoomLabel
+        ]
+
+
+viewManifestTitle : Bool -> Bool -> String -> Html Msg
+viewManifestTitle showTitle fullscreen title =
+    if showTitle && not (String.isEmpty title) then
+        h1
+            [ classList
+                [ ( "diva-app-title", True )
+                , ( "is-fullscreen", fullscreen )
+                ]
+            ]
+            [ text title ]
+
+    else
+        emptyHtml
+
+
+viewRequiredStatement : String -> Html Msg
+viewRequiredStatement valueText =
+    if String.isEmpty valueText then
+        emptyHtml
+
+    else
+        div
+            [ HA.class "required-statement" ]
+            (HtmlRenderer.renderHtml valueText)
+
+
+viewThrobber : Html Msg
+viewThrobber =
+    let
+        delays =
+            [ 0.2
+            , 0.3
+            , 0.4
+            , 0.1
+            , 0.2
+            , 0.3
+            , 0.0
+            , 0.1
+            , 0.2
+            ]
+    in
+    div
+        [ HA.class "throbber-overlay" ]
+        [ div
+            [ HA.class "throbber" ]
+            (List.map
+                (\delay ->
+                    div
+                        [ HA.class "throbber-cube"
+                        , HA.style "animation-delay" (String.fromFloat delay ++ "s")
+                        ]
+                        []
+                )
+                delays
+            )
+        ]
+
+
+viewViewerStatusModal : ( String, String, Bool ) -> Html Msg
+viewViewerStatusModal ( titleText, message, isError ) =
+    div
+        [ HA.class "viewer-status-overlay" ]
+        [ div
+            [ HA.class "modal is-narrow" ]
+            [ div
+                [ HA.class "modal-header" ]
+                [ div [ HA.class "modal-title" ] [ text titleText ] ]
+            , div
+                [ HA.class "modal-body is-no-sidebar" ]
+                [ div
+                    [ classList [ ( "status", True ), ( "is-error", isError ) ] ]
+                    [ text message ]
+                ]
+            ]
+        ]
+
+
+viewZoomIndicator : String -> Html Msg
+viewZoomIndicator zoomText =
+    div [ HA.class "viewer-zoom-indicator" ] [ text zoomText ]
+
+
+viewerStatus : Model -> Maybe ( String, String, Bool )
+viewerStatus model =
+    case model.resourceResponse of
+        ResourceLoadedManifest _ ->
+            if model.hasTileSources then
+                Nothing
+
+            else
+                Just ( "Unable to display manifest", "No canvases found in this manifest.", False )
+
+        ResourceLoadedCollection _ ->
+            case model.response of
+                Failed message ->
+                    Just ( "Unable to load manifest", message, True )
+
+                _ ->
+                    if model.hasTileSources then
+                        Nothing
+
+                    else
+                        Just ( "No Manifest Selected", "Select a manifest from the collection to view.", False )
+
+        ResourceFailed message ->
+            Just ( "Unable to load manifest", message, True )
+
+        _ ->
+            Nothing
+
+
+zoomPercentageLabel : Model -> Maybe String
+zoomPercentageLabel model =
+    case ( model.initialZoom, model.currentZoom ) of
+        ( Just initialZoom, Just currentZoom ) ->
+            if initialZoom > 0 then
+                let
+                    percent =
+                        (currentZoom / initialZoom) * 100
+                in
+                Just (String.fromInt (round percent) ++ "%")
+
+            else
+                Nothing
+
+        _ ->
+            Nothing