medvedych/harbour-tooter
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

issue #38 fix + ui-improvements

Browse source
This commit is contained in:
molan-git 2020-06-04 11:17:06 +02:00
parent eac5aac326
commit 75e4a71955
8 changed files with 234 additions and 237 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
qml/pages/MainPage.qml
View file

@ -74,11 +74,13 @@ Page {
}
Item {
id: tlSearch;
id: tlSearch
property ListModel mdl: ListModel {}
property string search
width: parent.itemWidth
height: parent.itemHeight
property ListModel mdl: ListModel {}
property string search;
onSearchChanged: {
console.log(search)
loader.sourceComponent = loading
@ -241,7 +243,7 @@ Page {
navigation.navigateTo('search')
} else {
Qt.openUrlExternally(href);
Qt.openUrlExternally(href)
}
}

96
qml/pages/ProfilePage.qml
View file

@ -1,8 +1,8 @@
import QtQuick 2.0
import Sailfish.Silica 1.0
import QtGraphicalEffects 1.0
import "../lib/API.js" as Logic
import "./components/"
import QtGraphicalEffects 1.0
Page {
@ -12,6 +12,9 @@ Page {
property string display_name: ""
property string username: ""
property string profileImage: ""
property string profileBackground: ""
property string note: ""
property string url: ""
property int user_id
property int statuses_count
property int following_count
@ -19,17 +22,14 @@ Page {
property int favourites_count
property int reblogs_count
property int count_moments
property string profileBackground: ""
property string note: ""
property string url: ""
property bool locked: false
property date created_at
property bool following: false
property bool requested: false
property bool followed_by: false
property bool blocking: false
property bool muting: false
property bool domain_blocking: false
property date created_at
WorkerScript {
id: worker
@ -106,6 +106,7 @@ Page {
}
}
}
// The effective value will be restricted by ApplicationWindow.allowedOrientations
allowedOrientations: Orientation.All
Component.onCompleted: {
@ -155,8 +156,7 @@ Page {
}
}
// ProfilePage ExpandingSection
ExpandingSectionGroup {
ExpandingSectionGroup { // ProfilePage ExpandingSection
id: profileExpander
anchors {
bottom: parent.bottom
@ -168,17 +168,16 @@ Page {
id: expandingSection1
title: qsTr("About")
content.sourceComponent: Column {
height: Math.min(txtContainer, parent.height*0.7)
spacing: Theme.paddingSmall
anchors.bottomMargin: Theme.paddingLarge
height: Math.min( txtContainer, parent.height * 0.7 )
spacing: Theme.paddingLarge
Rectangle {
Item {
id: txtContainer
width: parent.width
height: Math.min(txtNote.height, parent.height*0.5)
color: "transparent"
height: Math.min( txtNote.height, parent.height * 0.55 )
//color: "transparent"
visible: {
if ((note.text === "") || (note.text === "<p></p>") ) {
if ((note.text === "") || ( note.text === "<p></p>" )) {
false
} else {
true
@ -187,23 +186,21 @@ Page {
SilicaFlickable {
id: txtFlickable
anchors.fill: parent
contentWidth: parent.width
contentHeight: txtNote.height
anchors.topMargin: Theme.paddingMedium
anchors.bottomMargin: Theme.paddingMedium
anchors.fill: parent
clip: true
quickScroll: false
VerticalScrollDecorator {}
Text {
Label {
id: txtNote
text: note
textFormat: Text.StyledText
wrapMode: Text.Wrap
font.pixelSize: Theme.fontSizeExtraSmall
color: Theme.secondaryColor
font.pixelSize: Theme.fontSizeExtraSmall
linkColor: Theme.highlightColor
wrapMode: Text.Wrap
width: parent.width - ( 2 * Theme.horizontalPageMargin )
anchors.horizontalCenter: parent.horizontalCenter
onLinkActivated: {
@ -219,8 +216,13 @@ Page {
return check;
}));
send(link)
/* Function still missing for user accounts */
// } else if (test.length === 4 && test[3][0] === "@" ) {
} else if (test.length === 4 && test[3][0] === "@" ) {
pageStack.pop(pageStack.find(function(page) {
var check = page.isFirstPage === true;
if (check)
page.onLinkActivated(link)
return check;
}));
} else {
Qt.openUrlExternally(link);
}
@ -229,11 +231,14 @@ Page {
}
}
Item { // dummy item for spacing
height: Theme.paddingSmall
}
Row {
id: statsRow
spacing: Theme.paddingLarge
anchors.horizontalCenter: parent.horizontalCenter
anchors.topMargin: Theme.paddingMedium
anchors.leftMargin: Theme.paddingLarge
anchors.rightMargin: Theme.paddingLarge
@ -274,15 +279,8 @@ Page {
} */
}
Label {
id: separatorLabel1
x: Theme.horizontalPageMargin
width: parent.width - ( 2 * Theme.horizontalPageMargin )
font.pixelSize: Theme.fontSizeExtraSmall
wrapMode: Text.Wrap
anchors {
horizontalCenter: parent.horizontalCenter
}
Item { // dummy item for spacing
height: Theme.paddingSmall
}
ButtonLayout {
@ -350,39 +348,23 @@ Page {
}
}
Separator {
id: btnSeparator
width: parent.width
height: Theme.paddingMedium
color: Theme.primaryColor
opacity: 0.0
horizontalAlignment: Qt.AlignHCenter
}
Button {
id: btnBrowser
text: qsTr("Open in Browser")
preferredWidth: Theme.buttonWidthMedium
anchors {
horizontalCenter: parent.horizontalCenter
}
anchors.horizontalCenter: parent.horizontalCenter
onClicked: {
Qt.openUrlExternally(url);
Qt.openUrlExternally(url)
}
}
Label {
id: separatorLabel2
x: Theme.horizontalPageMargin
width: parent.width - ( 2 * Theme.horizontalPageMargin )
font.pixelSize: Theme.fontSizeExtraSmall
wrapMode: Text.Wrap
anchors {
horizontalCenter: parent.horizontalCenter
Rectangle { // dummy item for spacing
height: Theme.paddingSmall
width: parent.width
opacity: 0
}
}
}
}
}
}
}
}

39
qml/pages/SettingsPage.qml
View file

@ -25,7 +25,7 @@ Page {
title: qsTr("Settings")
}
SectionHeader { text: "Options"}
SectionHeader { text: qsTr("Options")}
IconTextSwitch {
text: qsTr("Load Images in Toots")
@ -38,7 +38,7 @@ Page {
}
}
SectionHeader { text: "Account"}
SectionHeader { text: qsTr("Account")}
Item {
id: removeAccount
@ -53,7 +53,7 @@ Page {
Icon {
id: icnRemoveAccount
color: Theme.secondaryColor
color: Theme.highlightColor
width: Theme.iconSizeMedium
fillMode: Image.PreserveAspectFit
source: Logic.conf['login'] ? "image://theme/icon-m-contact" : "image://theme/icon-m-add"
@ -96,7 +96,7 @@ Page {
text: Logic.conf['login'] ? qsTr("Deauthorize this app from using your account and remove account data from phone") : qsTr("Authorize this app to access your Mastodon account")
font.pixelSize: Theme.fontSizeExtraSmall
wrapMode: Text.Wrap
color: Theme.secondaryColor
color: Theme.highlightColor
anchors {
left: parent.left
leftMargin: Theme.paddingLarge * 1.9
@ -107,24 +107,25 @@ Page {
}
}
/* SectionHeader { text: "Support"}
IconTextSwitch {
SectionHeader {
text: qsTr("Translate")
description: qsTr("Use Transifex to help with app translation to your language")
icon.source: "image://theme/icon-m-font-size"
onCheckedChanged: {
busy = true;
checked = false;
Qt.openUrlExternally("https://www.transifex.com/dysko/tooter/");
timer2.start()
}
Timer {
id: timer2
interval: 4700
onTriggered: parent.busy = false
LinkedLabel {
text: qsTr("Use <a href='https://www.transifex.com/dysko/tooter/'>Transifex</a> to help with app translation to your language.")
textFormat: Text.StyledText
color: Theme.highlightColor
linkColor: Theme.primaryColor
font.family: Theme.fontFamilyHeading
font.pixelSize: Theme.fontSizeExtraSmall
wrapMode: Text.Wrap
anchors {
left: parent.left
leftMargin: Theme.horizontalPageMargin
right: parent.right
rightMargin: Theme.paddingLarge
}
}
} */
SectionHeader {
text: qsTr("Credits")

4
qml/pages/components/InfoBanner.qml
View file

@ -12,14 +12,14 @@ DockedPanel {
id: content
color: Theme.highlightBackgroundColor
width: root.width
height: infoLabel.height + 3*Theme.paddingMedium
height: infoLabel.height + 2 * Theme.paddingMedium
Label {
id: infoLabel
text : ""
font.family: Theme.fontFamilyHeading
font.pixelSize: Theme.fontSizeMedium
color: Theme.highlightColor
color: Theme.primaryColor
wrapMode: Text.WrapAnywhere
width: parent.width
anchors {

33
qml/pages/components/MediaFullScreen.qml
View file

@ -30,6 +30,8 @@ FullscreenContentPage {
id: videoFlickable
visible: false
anchors.fill: parent
contentWidth: imageContainer.width
contentHeight: imageContainer.height
clip: true
Image {
@ -113,6 +115,7 @@ FullscreenContentPage {
rightMargin: Theme.horizontalPageMargin + Theme.iconSizeMedium
bottomMargin: Theme.horizontalPageMargin
}
}
MouseArea {
anchors.fill: parent
@ -148,7 +151,7 @@ FullscreenContentPage {
}
}
}
Flickable {
id: imageFlickable
@ -158,7 +161,7 @@ FullscreenContentPage {
clip: true
anchors.fill: parent
onHeightChanged: if (imagePreview.status === Image.Ready) {
imagePreview.fitToScreen()
imagePreview.fitToScreen();
}
Item {
@ -190,6 +193,15 @@ FullscreenContentPage {
}
}
NumberAnimation {
id: loadedAnimation
target: imagePreview
property: "opacity"
duration: 250
from: 0; to: 1
easing.type: Easing.InOutQuad
}
onScaleChanged: {
if ((width * scale) > imageFlickable.width) {
var xoff = (imageFlickable.width / 2 + imageFlickable.contentX) * scale / prevScale;
@ -199,15 +211,7 @@ FullscreenContentPage {
var yoff = (imageFlickable.height / 2 + imageFlickable.contentY) * scale / prevScale;
imageFlickable.contentY = yoff - imageFlickable.height / 2
}
}
NumberAnimation {
id: loadedAnimation
target: imagePreview
property: "opacity"
duration: 250
from: 0; to: 1
easing.type: Easing.InOutQuad
prevScale = scale
}
}
}
@ -245,6 +249,7 @@ FullscreenContentPage {
from: imagePreview.scale
}
}
}
Loader {
anchors.centerIn: parent
@ -274,6 +279,7 @@ FullscreenContentPage {
}
}
}
}
Component {
id: failedLoading
@ -283,10 +289,6 @@ FullscreenContentPage {
color: Theme.highlightColor
}
}
}
VerticalScrollDecorator { flickable: imageFlickable }
}
IconButton {
id: dismissBtn
@ -314,5 +316,6 @@ FullscreenContentPage {
FileDownloader.downloadFile(mediaURL, filename[filename.length-1]);
}
}
VerticalScrollDecorator { flickable: imageFlickable }
}

6
qml/pages/components/MyList.qml
View file

@ -6,6 +6,7 @@ import "."
SilicaListView {
id: myList
property string type
property string title
property string vwPlaceholderText: qsTr("Loading")
@ -22,6 +23,7 @@ SilicaListView {
property variant conf
property bool notifier: false
model: mdl
signal notify (string what, int num)
onNotify: {
console.log(what + " - " + num)
@ -109,6 +111,7 @@ SilicaListView {
loadData("append")
}
}
BusyIndicator {
size: BusyIndicatorSize.Small
running: loadStarted;
@ -116,6 +119,7 @@ SilicaListView {
anchors.horizontalCenter: parent.horizontalCenter
}
}
onContentYChanged: {
if (Math.abs(contentY - scrollOffset) > Theme.itemSizeMedium) {
openDrawer(contentY - scrollOffset > 0 ? false : true )
@ -139,7 +143,6 @@ SilicaListView {
if (messageObject.fireNotification && notifier){
Logic.notifier(messageObject.data)
}
}
}
@ -154,6 +157,7 @@ SilicaListView {
loadData("prepend")
}
}
function loadData(mode){
var p = []
if (params.length)

45
qml/pages/components/Toot.qml
View file

@ -11,6 +11,7 @@ BackgroundItem {
//property string text: "0"
width: parent.width
height: lblText.paintedHeight + (lblText.text.length > 0 ? Theme.paddingLarge : 0 )+ lblName.paintedHeight + (type.length ? Theme.paddingLarge + iconRT.height : 0) + Theme.paddingLarge
Image {
id: iconRT
y: Theme.paddingLarge
@ -67,7 +68,6 @@ BackgroundItem {
})
}
}
}
Label {
@ -86,33 +86,33 @@ BackgroundItem {
Image {
id: iconVerified
visible: account_locked
y: Theme.paddingLarge
opacity: 0.8
source: "image://theme/icon-s-secure?" + (pressed
? Theme.highlightColor
: Theme.primaryColor)
width: account_locked ? Theme.iconSizeExtraSmall*0.8 : 0
height: width
anchors {
left: lblName.right
leftMargin: Theme.paddingSmall
verticalCenter: lblName.verticalCenter
}
visible: account_locked
width: account_locked ? Theme.iconSizeExtraSmall*0.8 : 0
opacity: 0.8
height: width
source: "image://theme/icon-s-secure?" + (pressed
? Theme.highlightColor
: Theme.primaryColor)
}
Label {
id: lblScreenName
truncationMode: TruncationMode.Fade
text: '@'+account_username
font.pixelSize: Theme.fontSizeExtraSmall
color: (pressed ? Theme.secondaryHighlightColor : Theme.secondaryColor)
anchors {
left: iconVerified.right
right: lblDate.left
leftMargin: Theme.paddingMedium
baseline: lblName.baseline
}
truncationMode: TruncationMode.Fade
text: '@'+account_username
font.pixelSize: Theme.fontSizeExtraSmall
color: (pressed ? Theme.secondaryHighlightColor : Theme.secondaryColor)
}
Label {
@ -122,9 +122,9 @@ BackgroundItem {
var elapsed = Format.formatDate(created_at, Formatter.DurationElapsedShort)
return (elapsed ? elapsed : txt )
}
color: (pressed ? Theme.highlightColor : Theme.primaryColor)
text: Format.formatDate(created_at, new Date() - created_at < 60*60*1000 ? Formatter.DurationElapsedShort : Formatter.TimeValueTwentyFourHours)
font.pixelSize: Theme.fontSizeExtraSmall
color: (pressed ? Theme.highlightColor : Theme.primaryColor)
horizontalAlignment: Text.AlignRight
anchors {
right: parent.right
@ -135,13 +135,6 @@ BackgroundItem {
Text {
id: lblText
anchors {
left: lblName.left
right: parent.right
top: lblScreenName.bottom
topMargin: Theme.paddingSmall
rightMargin: Theme.paddingLarge
}
height: content.length ? paintedHeight : 0
onLinkActivated: {
console.log(link)
@ -165,12 +158,20 @@ BackgroundItem {
}
text: content
textFormat: Text.RichText
font.pixelSize: Theme.fontSizeSmall
color: (pressed ? Theme.highlightColor : Theme.primaryColor)
linkColor : Theme.highlightColor
wrapMode: Text.Wrap
maximumLineCount: 6
font.pixelSize: Theme.fontSizeSmall
color: (pressed ? Theme.highlightColor : Theme.primaryColor)
anchors {
left: lblName.left
right: parent.right
top: lblScreenName.bottom
topMargin: Theme.paddingSmall
rightMargin: Theme.paddingLarge
}
}
onClicked: {
pageStack.push(Qt.resolvedUrl("../ConversationPage.qml"), {
headerTitle: "Conversation",

106
qml/pages/components/VisualContainer.qml
View file

@ -5,13 +5,16 @@ import "../../lib/API.js" as Logic
BackgroundItem {
id: delegate
signal send (string notice)
signal navigateTo(string link)
width: parent.width
height: mnu.height + miniHeader.height + (typeof attachments !== "undefined" && attachments.count ? media.height + Theme.paddingLarge + Theme.paddingMedium: Theme.paddingLarge) + lblContent.height + Theme.paddingLarge + (miniStatus.visible ? miniStatus.height : 0)
Rectangle {
x: 0;
y: 0;
x: 0
y: 0
visible: status_visibility == 'direct'
width: parent.width
height: parent.height
@ -31,20 +34,20 @@ BackgroundItem {
Image {
id: avatar
visible: true
opacity: status === Image.Ready ? 1.0 : 0.0
Behavior on opacity { FadeAnimator {} }
asynchronous: true
smooth: true
source: account_avatar
width: Theme.iconSizeMedium
height: width
anchors {
top: miniStatus.visible ? miniStatus.bottom : parent.top
topMargin: miniStatus.visible ? Theme.paddingMedium : Theme.paddingLarge
left: parent.left
leftMargin: Theme.horizontalPageMargin
}
opacity: status === Image.Ready ? 1.0 : 0.0
Behavior on opacity { FadeAnimator {} }
asynchronous: true
width: Theme.iconSizeMedium
height: width
smooth: true
source: account_avatar
visible: true
onStatusChanged: {
if (avatar.status === Image.Error)
source = "../../images/icon-m-profile.svg?" + (pressed
@ -63,20 +66,19 @@ BackgroundItem {
"profileBackground": model.account_header
})
}
}
Image {
id: iconTR
visible: typeof status_reblogged !== "undefined" && status_reblogged
width: Theme.iconSizeExtraSmall
height: width
source: "image://theme/icon-s-retweet"
anchors {
top: avatar.bottom
topMargin: Theme.paddingMedium
left: avatar.left
}
visible: typeof status_reblogged !== "undefined" && status_reblogged
width: Theme.iconSizeExtraSmall
height: width
source: "image://theme/icon-s-retweet"
}
Rectangle {
@ -90,15 +92,16 @@ BackgroundItem {
left: parent.left
leftMargin: -width/3
}
Image {
asynchronous: true
width: Theme.iconSizeSmall
height: width
smooth: true
opacity: status === Image.Ready ? 1.0 : 0.0
Behavior on opacity { FadeAnimator {} }
source: typeof reblog_account_avatar !== "undefined" ? reblog_account_avatar : ''
visible: typeof status_reblog !== "undefined" && status_reblog
width: Theme.iconSizeSmall
height: width
}
}
}
@ -114,6 +117,13 @@ BackgroundItem {
Text {
id: lblContent
text: content.replace(new RegExp("<a ", 'g'), '<a style="text-decoration: none; color:'+(pressed ? Theme.secondaryColor : Theme.highlightColor)+'" ')
textFormat: Text.RichText
font.pixelSize: Theme.fontSizeSmall
linkColor: Theme.highlightColor
wrapMode: Text.Wrap
color: (pressed ? Theme.highlightColor : (!highlight ? Theme.primaryColor : Theme.secondaryColor))
height: content.length ? (contentWarningLabel.paintedHeight > paintedHeight ? contentWarningLabel.paintedHeight : paintedHeight) : 0
anchors {
left: miniHeader.left
leftMargin: Theme.paddingMedium
@ -123,7 +133,6 @@ BackgroundItem {
topMargin: Theme.paddingSmall
bottomMargin: Theme.paddingLarge
}
height: content.length ? (contentWarningLabel.paintedHeight > paintedHeight ? contentWarningLabel.paintedHeight : paintedHeight) : 0
onLinkActivated: {
var test = link.split("/")
console.log(link)
@ -139,34 +148,32 @@ BackgroundItem {
}));
send(link)
} else if (test.length === 4 && test[3][0] === "@" ) {
tlSearch.search = decodeURIComponent("@"+test[3].substring(1)+"@"+test[2])
slideshow.positionViewAtIndex(4, ListView.SnapToItem)
navigation.navigateTo('search')
// Original component
/* pageStack.push(Qt.resolvedUrl("../Profile.qml"), {
"name": "",
"username": test[3].substring(1)+"@"+test[2],
"profileImage": ""
}) */
pageStack.pop(pageStack.find(function(page) {
var check = page.isFirstPage === true;
if (check)
page.onLinkActivated(link)
return check;
}));
} else {
Qt.openUrlExternally(link);
}
}
text: content.replace(new RegExp("<a ", 'g'), '<a style="text-decoration: none; color:'+(pressed ? Theme.secondaryColor : Theme.highlightColor)+'" ')
linkColor: Theme.highlightColor
wrapMode: Text.Wrap
textFormat: Text.RichText
font.pixelSize: Theme.fontSizeSmall
color: (pressed ? Theme.highlightColor : (!highlight ? Theme.primaryColor : Theme.secondaryColor))
Rectangle {
anchors.fill: parent
radius: 2
color: Theme.highlightDimmerColor
visible: status_spoiler_text.length > 0
anchors.fill: parent
Label {
id: contentWarningLabel
text: model.status_spoiler_text
font.pixelSize: Theme.fontSizeExtraSmall
color: Theme.highlightColor
truncationMode: TruncationMode.Fade
wrapMode: Text.Wrap
horizontalAlignment: Text.AlignHCenter
width: parent.width
anchors {
topMargin: Theme.paddingSmall
left: parent.left
@ -176,16 +183,11 @@ BackgroundItem {
rightMargin: Theme.paddingMedium
bottomMargin: Theme.paddingSmall
}
width: parent.width
truncationMode: TruncationMode.Fade
color: Theme.highlightColor
wrapMode: Text.Wrap
text: model.status_spoiler_text
}
MouseArea {
anchors.fill: parent
onClicked: parent.visible = false;
onClicked: parent.visible = false
}
}
@ -193,6 +195,8 @@ BackgroundItem {
MediaBlock {
id: media
model: typeof attachments !== "undefined" ? attachments : Qt.createQmlObject('import QtQuick 2.0; ListModel { }', Qt.application, 'InternalQmlObject');
height: Theme.iconSizeExtraLarge * 2
anchors {
left: lblContent.left
right: lblContent.right
@ -200,12 +204,11 @@ BackgroundItem {
topMargin: Theme.paddingSmall
bottomMargin: Theme.paddingLarge
}
model: typeof attachments !== "undefined" ? attachments : Qt.createQmlObject('import QtQuick 2.0; ListModel { }', Qt.application, 'InternalQmlObject');
height: Theme.iconSizeExtraLarge * 2
}
ContextMenu {
id: mnu
MenuItem {
enabled: model.type !== "follow"
text: typeof model.reblogged !== "undefined" && model.reblogged ? qsTr("Unboost") : qsTr("Boost")
@ -221,27 +224,28 @@ BackgroundItem {
model.reblogs_count = !status ? model.reblogs_count+1 : (model.reblogs_count > 0 ? model.reblogs_count-1 : model.reblogs_count);
model.reblogged = !model.reblogged
}
Image {
id: icRT
source: "image://theme/icon-s-retweet?" + (!model.reblogged ? Theme.highlightColor : Theme.primaryColor)
width: Theme.iconSizeExtraSmall
height: width
anchors {
leftMargin: Theme.horizontalPageMargin
left: parent.left
verticalCenter: parent.verticalCenter
}
width: Theme.iconSizeExtraSmall
height: width
source: "image://theme/icon-s-retweet?" + (!model.reblogged ? Theme.highlightColor : Theme.primaryColor)
}
Label {
text: reblogs_count
font.pixelSize: Theme.fontSizeExtraSmall
color: !model.reblogged ? Theme.highlightColor : Theme.primaryColor
anchors {
left: icRT.right
leftMargin: Theme.paddingMedium
verticalCenter: parent.verticalCenter
}
text: reblogs_count
font.pixelSize: Theme.fontSizeExtraSmall
color: !model.reblogged ? Theme.highlightColor : Theme.primaryColor
}
}
@ -274,14 +278,14 @@ BackgroundItem {
}
Label {
text: favourites_count
font.pixelSize: Theme.fontSizeExtraSmall
color: !model.favourited ? Theme.highlightColor : Theme.primaryColor
anchors {
left: icFA.right
leftMargin: Theme.paddingMedium
verticalCenter: parent.verticalCenter
}
text: favourites_count
font.pixelSize: Theme.fontSizeExtraSmall
color: !model.favourited ? Theme.highlightColor : Theme.primaryColor
}
}
}