diff --git a/harbour-fernschreiber.pro b/harbour-fernschreiber.pro index 5bc9469..d0b1d97 100644 --- a/harbour-fernschreiber.pro +++ b/harbour-fernschreiber.pro @@ -34,6 +34,7 @@ SOURCES += src/harbour-fernschreiber.cpp \ DISTFILES += qml/harbour-fernschreiber.qml \ qml/components/AudioPreview.qml \ + qml/components/BackgroundImage.qml \ qml/components/ChatListViewItem.qml \ qml/components/DocumentPreview.qml \ qml/components/ImagePreview.qml \ diff --git a/images/background-black-small.png b/images/background-black-small.png deleted file mode 100644 index 5593eed..0000000 Binary files a/images/background-black-small.png and /dev/null differ diff --git a/images/background-black.png b/images/background-black.png deleted file mode 100644 index e5279a6..0000000 Binary files a/images/background-black.png and /dev/null differ diff --git a/images/background-black.svg b/images/background-black.svg new file mode 100644 index 0000000..dc462ba --- /dev/null +++ b/images/background-black.svg @@ -0,0 +1,64 @@ + + + + + + image/svg+xml + + + + + + + + + + + + + + + + + diff --git a/images/background-white-small.png b/images/background-white-small.png deleted file mode 100644 index f8fb318..0000000 Binary files a/images/background-white-small.png and /dev/null differ diff --git a/images/background-white.png b/images/background-white.png deleted file mode 100644 index b44a78e..0000000 Binary files a/images/background-white.png and /dev/null differ diff --git a/images/background-white.svg b/images/background-white.svg new file mode 100644 index 0000000..19a370b --- /dev/null +++ b/images/background-white.svg @@ -0,0 +1,64 @@ + + + + + + image/svg+xml + + + + + + + + + + + + + + + + + diff --git a/images/fernschreiber-notification.png b/images/fernschreiber-notification.png index b072150..f7054d7 100644 Binary files a/images/fernschreiber-notification.png and b/images/fernschreiber-notification.png differ diff --git a/images/fernschreiber.png b/images/fernschreiber.png deleted file mode 100644 index 62f2c50..0000000 Binary files a/images/fernschreiber.png and /dev/null differ diff --git a/images/fernschreiber.svg b/images/fernschreiber.svg new file mode 100644 index 0000000..53f2d5d --- /dev/null +++ b/images/fernschreiber.svg @@ -0,0 +1,66 @@ + + + + + + image/svg+xml + + + + + + + + + + + + + + + + + diff --git a/images/icon-l-fullscreen.png b/images/icon-l-fullscreen.png deleted file mode 100644 index 841af69..0000000 Binary files a/images/icon-l-fullscreen.png and /dev/null differ diff --git a/images/icon-l-fullscreen.svg b/images/icon-l-fullscreen.svg new file mode 100644 index 0000000..00a8ce0 --- /dev/null +++ b/images/icon-l-fullscreen.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/images/icon-m-sticker.png b/images/icon-m-sticker.png deleted file mode 100644 index 189dab3..0000000 Binary files a/images/icon-m-sticker.png and /dev/null differ diff --git a/images/icon-m-sticker.svg b/images/icon-m-sticker.svg new file mode 100644 index 0000000..67f172d --- /dev/null +++ b/images/icon-m-sticker.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/qml/components/AudioPreview.qml b/qml/components/AudioPreview.qml index 831a17c..3b37e55 100644 --- a/qml/components/AudioPreview.qml +++ b/qml/components/AudioPreview.qml @@ -112,19 +112,8 @@ Item { visible: status === Image.Ready ? true : false } - Image { - id: imageLoadingBackgroundImage - source: "../../images/background-" + ( Theme.colorScheme ? "black" : "white" ) + "-small.png" - anchors { - centerIn: parent - } - width: parent.width - Theme.paddingSmall - height: parent.height - Theme.paddingSmall + BackgroundImage { visible: placeholderImage.status !== Image.Ready - asynchronous: true - - fillMode: Image.PreserveAspectFit - opacity: 0.15 } Rectangle { diff --git a/qml/components/BackgroundImage.qml b/qml/components/BackgroundImage.qml new file mode 100644 index 0000000..d5bbd5c --- /dev/null +++ b/qml/components/BackgroundImage.qml @@ -0,0 +1,38 @@ +/* + Copyright (C) 2020 Sebastian J. Wolf and other contributors + + This file is part of Fernschreiber. + + Fernschreiber is free software: you can redistribute it and/or modify + it under the terms of the GNU General Public License as published by + the Free Software Foundation, either version 3 of the License, or + (at your option) any later version. + + Fernschreiber is distributed in the hope that it will be useful, + but WITHOUT ANY WARRANTY; without even the implied warranty of + MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + GNU General Public License for more details. + + You should have received a copy of the GNU General Public License + along with Fernschreiber. If not, see . +*/ +import QtQuick 2.0 +import Sailfish.Silica 1.0 + +Image { + id: imageLoadingBackgroundImage + asynchronous: true + fillMode: Image.PreserveAspectFit + width: sourceDimension + height: sourceDimension + opacity: 0.15 + source: "../../images/background-" + ( Theme.colorScheme ? "black" : "white" ) + ".svg" + property int sourceDimension: Math.min(parent.width, parent.height) - Theme.paddingMedium + anchors { + centerIn: parent + } + sourceSize { + width: sourceDimension + height: sourceDimension + } +} diff --git a/qml/components/ImagePreview.qml b/qml/components/ImagePreview.qml index 395629c..ea8571d 100644 --- a/qml/components/ImagePreview.qml +++ b/qml/components/ImagePreview.qml @@ -81,19 +81,7 @@ Item { } } - Image { - id: imageLoadingBackgroundImage - source: "../../images/background-" + ( Theme.colorScheme ? "black" : "white" ) + "-small.png" - anchors { - centerIn: parent - } - width: parent.width - Theme.paddingMedium - height: parent.height - Theme.paddingMedium + BackgroundImage { visible: singleImage.status !== Image.Ready - asynchronous: true - - fillMode: Image.PreserveAspectFit - opacity: 0.15 } - } diff --git a/qml/components/LocationPreview.qml b/qml/components/LocationPreview.qml index b160072..6964340 100644 --- a/qml/components/LocationPreview.qml +++ b/qml/components/LocationPreview.qml @@ -103,19 +103,8 @@ Item { } } - Image { - id: imageLoadingBackgroundImage - source: "../../images/background-" + ( Theme.colorScheme ? "black" : "white" ) + "-small.png" - anchors { - centerIn: parent - } - width: parent.width - Theme.paddingMedium - height: parent.height - Theme.paddingMedium + BackgroundImage { visible: singleImage.status !== Image.Ready - asynchronous: true - - fillMode: Image.PreserveAspectFit - opacity: 0.15 } } diff --git a/qml/components/StickerPreview.qml b/qml/components/StickerPreview.qml index af22328..070f668 100644 --- a/qml/components/StickerPreview.qml +++ b/qml/components/StickerPreview.qml @@ -78,12 +78,7 @@ Item { Loader { anchors.fill: parent sourceComponent: Component { - Image { - source: "../../images/background-" + ( Theme.colorScheme ? "black" : "white" ) + "-small.png" - asynchronous: true - - fillMode: Image.PreserveAspectFit - } + BackgroundImage {} } active: opacity > 0 diff --git a/qml/components/VideoPreview.qml b/qml/components/VideoPreview.qml index 458550c..6646d8e 100644 --- a/qml/components/VideoPreview.qml +++ b/qml/components/VideoPreview.qml @@ -134,19 +134,8 @@ Item { visible: status === Image.Ready ? true : false } - Image { - id: imageLoadingBackgroundImage - source: "../../images/background-" + ( Theme.colorScheme ? "black" : "white" ) + "-small.png" - anchors { - centerIn: parent - } - width: parent.width - Theme.paddingSmall - height: parent.height - Theme.paddingSmall + BackgroundImage { visible: placeholderImage.status !== Image.Ready - asynchronous: true - - fillMode: Image.PreserveAspectFit - opacity: 0.15 } Rectangle { @@ -193,20 +182,23 @@ Item { height: parent.height width: parent.width / 2 visible: !videoMessageComponent.fullscreen - Image { + IconButton { id: fullscreenButton anchors.centerIn: parent width: Theme.iconSizeLarge height: Theme.iconSizeLarge - asynchronous: true - source: "../../images/icon-l-fullscreen.png" - visible: ( placeholderImage.status === Image.Ready && !videoMessageComponent.fullscreen ) ? true : false - MouseArea { - anchors.fill: parent - onClicked: { - pageStack.push(Qt.resolvedUrl("../pages/VideoPage.qml"), {"videoData": videoData}); + icon { + asynchronous: true + source: "../../images/icon-l-fullscreen.svg" + sourceSize { + width: Theme.iconSizeLarge + height: Theme.iconSizeLarge } } + visible: ( placeholderImage.status === Image.Ready && !videoMessageComponent.fullscreen ) ? true : false + onClicked: { + pageStack.push(Qt.resolvedUrl("../pages/VideoPage.qml"), {"videoData": videoData}); + } } } } @@ -424,20 +416,23 @@ Item { height: parent.height width: parent.width / 2 visible: !videoMessageComponent.fullscreen - Image { + IconButton { id: pausedFullscreenButton anchors.centerIn: parent width: Theme.iconSizeLarge height: Theme.iconSizeLarge - asynchronous: true - source: "../../images/icon-l-fullscreen.png" - visible: ( videoComponentLoader.active && messageVideo.playbackState === MediaPlayer.PausedState ) ? true : false - MouseArea { - anchors.fill: parent - onClicked: { - pageStack.push(Qt.resolvedUrl("../pages/VideoPage.qml"), {"videoData": videoData}); + icon { + asynchronous: true + source: "../../images/icon-l-fullscreen.svg" + sourceSize { + width: Theme.iconSizeLarge + height: Theme.iconSizeLarge } } + visible: ( videoComponentLoader.active && messageVideo.playbackState === MediaPlayer.PausedState ) ? true : false + onClicked: { + pageStack.push(Qt.resolvedUrl("../pages/VideoPage.qml"), {"videoData": videoData}); + } } } } diff --git a/qml/components/WebPagePreview.qml b/qml/components/WebPagePreview.qml index 260fb61..cdf9b0c 100644 --- a/qml/components/WebPagePreview.qml +++ b/qml/components/WebPagePreview.qml @@ -138,19 +138,8 @@ Column { } } - Image { - id: imageLoadingBackgroundImage - source: "../../images/background-" + ( Theme.colorScheme ? "black" : "white" ) + "-small.png" - anchors { - centerIn: parent - } - width: parent.width - Theme.paddingMedium - height: parent.height - Theme.paddingMedium + BackgroundImage { visible: hasImage && singleImage.status !== Image.Ready - asynchronous: true - - fillMode: Image.PreserveAspectFit - opacity: 0.15 } } diff --git a/qml/pages/AboutPage.qml b/qml/pages/AboutPage.qml index 3d92a16..45d6d2c 100644 --- a/qml/pages/AboutPage.qml +++ b/qml/pages/AboutPage.qml @@ -44,14 +44,18 @@ Page { Image { id: wunderfitzImage - source: "../../images/fernschreiber.png" + source: "../../images/fernschreiber.svg" anchors { horizontalCenter: parent.horizontalCenter } - + sourceSize { + width: width + height: height + } fillMode: Image.PreserveAspectFit asynchronous: true width: Math.min(2 * Theme.itemSizeHuge, Math.min(aboutPage.width, aboutPage.height) / 2) + height: width } Label { diff --git a/qml/pages/ChatPage.qml b/qml/pages/ChatPage.qml index 6350048..bc9d48b 100644 --- a/qml/pages/ChatPage.qml +++ b/qml/pages/ChatPage.qml @@ -1146,18 +1146,17 @@ Page { pageStack.push(documentPickerPage); } } - HighlightImage { - source: "../../images/icon-m-sticker.png" - width: Theme.itemSizeSmall - height: Theme.itemSizeSmall - color: Theme.primaryColor - highlightColor: Theme.highlightColor - highlighted: stickerPickerLoader.active - MouseArea { - anchors.fill: parent - onClicked: { - stickerPickerLoader.active = !stickerPickerLoader.active; - } + + IconButton { + icon.source: "../../images/icon-m-sticker.svg" + icon.sourceSize { + width: Theme.iconSizeMedium + height: Theme.iconSizeMedium + } + + highlighted: down || stickerPickerLoader.active + onClicked: { + stickerPickerLoader.active = !stickerPickerLoader.active; } } } diff --git a/qml/pages/CoverPage.qml b/qml/pages/CoverPage.qml index 633779f..ed64141 100644 --- a/qml/pages/CoverPage.qml +++ b/qml/pages/CoverPage.qml @@ -19,6 +19,7 @@ import QtQuick 2.5 import Sailfish.Silica 1.0 import WerkWolf.Fernschreiber 1.0 +import "../components" import "../js/functions.js" as Functions CoverBackground { @@ -90,21 +91,19 @@ CoverBackground { } } - Image { + BackgroundImage { id: backgroundImage - source: "../../images/background-" + ( Theme.colorScheme ? "black" : "white" ) + ".png" + width: parent.height - Theme.paddingLarge + height: width + sourceDimension: width anchors { verticalCenter: parent.verticalCenter - + centerIn: undefined bottom: parent.bottom bottomMargin: Theme.paddingMedium - right: parent.right rightMargin: Theme.paddingMedium } - - fillMode: Image.PreserveAspectFit - opacity: 0.15 } Column { diff --git a/qml/pages/ImagePage.qml b/qml/pages/ImagePage.qml index 2072e0f..06edac7 100644 --- a/qml/pages/ImagePage.qml +++ b/qml/pages/ImagePage.qml @@ -179,19 +179,8 @@ Page { } - Image { - id: imageLoadingBackgroundImage - source: "../../images/background-" + ( Theme.colorScheme ? "black" : "white" ) + "-small.png" - anchors { - centerIn: parent - } - width: parent.width - Theme.paddingMedium - height: parent.height - Theme.paddingMedium + BackgroundImage { visible: singleImage.status !== Image.Ready - asynchronous: true - - fillMode: Image.PreserveAspectFit - opacity: 0.15 } } diff --git a/qml/pages/InitializationPage.qml b/qml/pages/InitializationPage.qml index 9493792..86eccf5 100644 --- a/qml/pages/InitializationPage.qml +++ b/qml/pages/InitializationPage.qml @@ -116,14 +116,18 @@ Page { } Image { - source: "../../images/fernschreiber.png" + source: "../../images/fernschreiber.svg" anchors { horizontalCenter: parent.horizontalCenter } - + sourceSize { + width: width + height: height + } fillMode: Image.PreserveAspectFit asynchronous: true width: Math.min(2 * Theme.itemSizeHuge, Math.min(Screen.width, Screen.height) / 2) + height: width } BusyLabel {