import QtQuick 2.0 import Sailfish.Silica 1.0 import harbour.tooterb.Uploader 1.0 import "../lib/API.js" as Logic import "./components/" Page { id: conversationPage property ListModel suggestedModel property ListModel mdl property int tootMaxChar: 500 property bool bot: false //otherwise ReferenceError ProfileHeader.qml property bool followed_by: false //otherwise ReferenceError ProfileHeader.qml property bool locked: false //otherwise ReferenceError ProfileHeader.qml property bool group: false //otherwise ReferenceError ProfileHeader.qml property string type property string username: "" property string headerTitle: "" property string suggestedUser: "" property string status_id: "" property string status_url: "" property string status_uri: "" property string status_link: if (status_url === "") { var test = status_uri.split("/") console.log(status_uri) console.log(JSON.stringify(test)) console.log(JSON.stringify(test.length)) if (test.length === 8 && (test[7] === "activity")) { var urialt = status_uri.replace("activity", "") status_link = urialt } else status_link = status_uri } else status_link = status_url allowedOrientations: Orientation.All onSuggestedUserChanged: { console.log(suggestedUser) suggestedModel = Qt.createQmlObject( 'import QtQuick 2.0; ListModel { }', Qt.application, 'InternalQmlObject' ) predictionList.visible = false if (suggestedUser.length > 0) { var msg = { "action": 'accounts/search', "method": 'GET', "model": suggestedModel, "mode": "append", "params": [{ "name": "q", "data": suggestedUser }], "conf": Logic.conf } worker.sendMessage(msg) predictionList.visible = true } } ListModel { id: mediaModel onCountChanged: { btnAddImage.enabled = mediaModel.count < 4 } } WorkerScript { id: worker source: "../lib/Worker.js" onMessage: { console.log(JSON.stringify(messageObject)) } } SilicaListView { id: myList header: PageHeader { title: headerTitle // pageTitle pushed from MainPage.qml or VisualContainer.qml } clip: true anchors.top: parent.top anchors.left: parent.left anchors.right: parent.right anchors.bottom: if (panel.open == true) { panel.top } else { hiddenPanel.top } model: mdl section { property: 'section' delegate: SectionHeader { height: Theme.itemSizeExtraSmall text: Format.formatDate(section, Formatter.DateMedium) } } delegate: VisualContainer {} onCountChanged: { if (mdl) for (var i = 0; i < mdl.count; i++) { if (mdl.get(i).status_id === status_id) { console.log(mdl.get(i).status_id) positionViewAtIndex(i, ListView.Center) } } } PullDownMenu { id: pulleyConversation visible: type === "reply" MenuItem { text: qsTr("Open in Browser") onClicked: { Qt.openUrlExternally(status_link) } } MenuItem { //: Use the translation of "Copy Link" for a shorter PullDownMenu label text: qsTr("Copy Link to Clipboard") onClicked: Clipboard.text = status_link } MenuItem { //: "Reply" will show the Toot text entry Panel. "Hide Reply" closes it. Alternative: Use "Close Reply" text: !panel.open ? qsTr("Reply") : qsTr("Hide Reply") visible: type == "reply" onClicked: !panel.open ? panel.open = true : panel.open = false } } } Rectangle { id: predictionList visible: false color: Theme.highlightDimmerColor height: parent.height - panel.height - (Theme.paddingLarge * 4.5) anchors { left: panel.left right: panel.right bottom: panel.open == true ? panel.top : hiddenPanel.top } SilicaListView { id: predictionResults rotation: 180 // shows best matching result on the bottom anchors.fill: parent model: suggestedModel clip: true quickScroll: false delegate: ItemUser { rotation: 180 onClicked: { var start = toot.cursorPosition while (toot.text[start] !== "@" && start > 0) { start-- } textOperations.text = toot.text textOperations.cursorPosition = toot.cursorPosition textOperations.moveCursorSelection(start - 1, TextInput.SelectWords) toot.text = textOperations.text.substring(0, textOperations.selectionStart) + ' @' + model.account_acct + ' ' + textOperations.text.substring(textOperations.selectionEnd).trim() toot.cursorPosition = toot.text.indexOf('@' + model.account_acct) } } onCountChanged: { if (count > 0) { positionViewAtBeginning(suggestedModel.count - 1, ListView.Beginning) } } VerticalScrollDecorator {} } } DockedPanel { id: panel width: parent.width height: progressBar.height + toot.height + (mediaModel.count ? uploadedImages.height : 0) + btnContentWarning.height + Theme.paddingMedium + (warningContent.visible ? warningContent.height : 0) dock: Dock.Bottom open: true Rectangle { id: progressBarBg width: parent.width height: progressBar.height color: Theme.highlightBackgroundColor opacity: 0.2 anchors { left: parent.left right: parent.right top: parent.top } } Rectangle { id: progressBar width: toot.text.length ? panel.width * (toot.text.length / tootMaxChar) : 0 height: Theme.itemSizeSmall * 0.05 color: Theme.highlightBackgroundColor opacity: 0.7 anchors { left: parent.left top: parent.top } } TextField { id: warningContent visible: false height: visible ? implicitHeight : 0 autoScrollEnabled: true labelVisible: false font.pixelSize: Theme.fontSizeSmall //: placeholderText in Toot content warning panel placeholderText: qsTr("Write your warning here") placeholderColor: palette.highlightColor color: palette.highlightColor horizontalAlignment: Text.AlignLeft EnterKey.onClicked: {} anchors { top: parent.top topMargin: Theme.paddingMedium left: parent.left right: parent.right } } TextInput { id: textOperations visible: false } TextArea { id: toot autoScrollEnabled: true labelVisible: false //: placeholderText in Toot text panel placeholderText: qsTr("What's on your mind?") font.pixelSize: Theme.fontSizeSmall text: username !== "" && (username.charAt(0) === '@' || username.charAt( 0) === '#') ? username + ' ' : '' height: if (type !== "reply") { isPortrait ? Math.max(conversationPage.height / 3, Math.min(conversationPage.height * 0.65, implicitHeight)) : Math.max(conversationPage.height / 2, Math.min(conversationPage.height * 0.65, implicitHeight)) } else { isPortrait ? Math.max(conversationPage.height / 4, Math.min(conversationPage.height * 0.65, implicitHeight)) : Math.max(conversationPage.height / 2.5, Math.min(conversationPage.height * 0.65, implicitHeight)) } horizontalAlignment: Text.AlignLeft anchors { top: warningContent.bottom topMargin: Theme.paddingMedium left: parent.left right: parent.right rightMargin: Theme.paddingLarge * 2 } EnterKey.onClicked: {} onTextChanged: { textOperations.text = toot.text textOperations.cursorPosition = toot.cursorPosition textOperations.selectWord() textOperations.select( textOperations.selectionStart ? textOperations.selectionStart - 1 : 0, textOperations.selectionEnd) console.log(toot.text.length) suggestedUser = "" if (textOperations.selectedText.charAt(0) === "@") { suggestedUser = textOperations.selectedText.trim().substring(1) } } } IconButton { id: btnSmileys property string selection opacity: 0.7 icon { source: "../../qml/images/icon-m-emoji.svg?" color: Theme.secondaryColor width: Theme.iconSizeSmallPlus fillMode: Image.PreserveAspectFit } anchors { top: warningContent.bottom bottom: bottom.top right: parent.right rightMargin: Theme.paddingSmall } onSelectionChanged: { console.log(selection) } onClicked: pageStack.push(emojiDialog) } SilicaGridView { id: uploadedImages width: parent.width anchors.top: bottom.toot anchors.bottom: parent.bottom height: mediaModel.count ? Theme.itemSizeExtraLarge : 0 model: mediaModel cellWidth: uploadedImages.width / 4 cellHeight: isPortrait ? cellWidth : Theme.itemSizeExtraLarge delegate: BackgroundItem { id: myDelegate width: uploadedImages.cellWidth height: uploadedImages.cellHeight RemorseItem { id: remorse cancelText: "" } Image { anchors.fill: parent fillMode: Image.PreserveAspectCrop source: model.preview_url } onClicked: { var idx = index console.log(idx) //mediaModel.remove(idx) remorse.execute(myDelegate, "", function () { mediaModel.remove(idx) }) } } add: Transition { NumberAnimation { property: "opacity" from: 0 to: 1.0 duration: 800 } } remove: Transition { NumberAnimation { property: "opacity" from: 1.0 to: 0 duration: 800 } } displaced: Transition { NumberAnimation { properties: "x,y" duration: 800 easing.type: Easing.InOutBack } } } IconButton { id: btnContentWarning icon.source: "image://theme/icon-s-warning?" + ( pressed ? Theme.highlightColor : (warningContent.visible ? Theme.secondaryHighlightColor : Theme.primaryColor) ) onClicked: warningContent.visible = !warningContent.visible anchors { top: toot.bottom topMargin: -Theme.paddingSmall * 1.5 left: parent.left leftMargin: Theme.paddingMedium } } IconButton { id: btnAddImage enabled: mediaModel.count < 4 icon.source: "image://theme/icon-s-attach?" + ( pressed ? Theme.highlightColor : (warningContent.visible ? Theme.secondaryHighlightColor : Theme.primaryColor) ) anchors { top: toot.bottom topMargin: -Theme.paddingSmall * 1.5 left: btnContentWarning.right leftMargin: Theme.paddingSmall } onClicked: { btnAddImage.enabled = false var once = true var imagePicker = pageStack.push("Sailfish.Pickers.ImagePickerPage", { "allowedOrientations": Orientation.All }) imagePicker.selectedContentChanged.connect(function () { var imagePath = imagePicker.selectedContent console.log(imagePath) imageUploader.setUploadUrl(Logic.conf.instance + "/api/v1/media") imageUploader.setFile(imagePath) imageUploader.setAuthorizationHeader(Logic.conf.api_user_token) imageUploader.upload() }) } } ImageUploader { id: imageUploader onProgressChanged: { console.log("progress " + progress) uploadProgress.width = parent.width * progress } onSuccess: { uploadProgress.width = 0 console.log(replyData) mediaModel.append(JSON.parse(replyData)) } onFailure: { uploadProgress.width = 0 btnAddImage.enabled = true console.log(status) console.log(statusText) } } ComboBox { id: privacy menu: ContextMenu { MenuItem { text: qsTr("Public") } MenuItem { text: qsTr("Unlisted") } MenuItem { text: qsTr("Followers-only") } MenuItem { text: qsTr("Direct") } } anchors { top: toot.bottom topMargin: -Theme.paddingSmall * 1.5 left: btnAddImage.right right: btnSend.left } } IconButton { id: btnSend icon.source: "image://theme/icon-m-send?" + (pressed ? Theme.highlightColor : Theme.primaryColor) enabled: toot.text !== "" && toot.text.length < tootMaxChar && uploadProgress.width == 0 anchors { top: toot.bottom topMargin: -Theme.paddingSmall * 1.5 right: parent.right rightMargin: Theme.paddingSmall } onClicked: { var visibility = ["public", "unlisted", "private", "direct"] var media_ids = [] for (var k = 0; k < mediaModel.count; k++) { console.log(mediaModel.get(k).id) media_ids.push(mediaModel.get(k).id) } var msg = { "action": 'statuses', "method": 'POST', "model": mdl, "mode": "append", "params": { "status": toot.text, "visibility": visibility[privacy.currentIndex], "media_ids": media_ids }, "conf": Logic.conf } if (status_id) msg.params['in_reply_to_id'] = (status_id) + "" if (warningContent.visible && warningContent.text.length > 0) { msg.params['sensitive'] = 1 msg.params['spoiler_text'] = warningContent.text } worker.sendMessage(msg) warningContent.text = "" toot.text = "" mediaModel.clear() sentBanner.showText(qsTr("Toot sent!")) } } Rectangle { id: uploadProgress color: Theme.highlightBackgroundColor height: Theme.itemSizeSmall * 0.05 anchors { bottom: parent.bottom left: parent.left } } } Component.onCompleted: { toot.cursorPosition = toot.text.length if (mdl.count > 0) { var setIndex = 0 switch (mdl.get(0).status_visibility) { case "unlisted": setIndex = 1 break case "private": setIndex = 2 break case "direct": privacy.enabled = false setIndex = 3 break default: privacy.enabled = true setIndex = 0 } privacy.currentIndex = setIndex } console.log(JSON.stringify()) worker.sendMessage({ "action": 'statuses/' + mdl.get(0).status_id + '/context', "method": 'GET', "model": mdl, "params": { }, "conf": Logic.conf }) } BackgroundItem { id: hiddenPanel visible: !panel.open height: Theme.paddingLarge * 0.7 width: parent.width opacity: enabled ? 0.6 : 0.0 Behavior on opacity { FadeAnimator { duration: 400 } } anchors { horizontalCenter: parent.horizontalCenter bottom: parent.bottom } MouseArea { anchors.fill: parent onClicked: panel.open = !panel.open } Rectangle { id: hiddenPanelBackground width: parent.width height: parent.height color: Theme.highlightBackgroundColor opacity: 0.4 anchors.fill: parent } Rectangle { id: progressBarBackground width: parent.width height: progressBarHiddenPanel.height color: Theme.highlightBackgroundColor opacity: 0.2 anchors { top: parent.top left: parent.left right: parent.right } } Rectangle { id: progressBarHiddenPanel width: toot.text.length ? panel.width * (toot.text.length / tootMaxChar) : 0 height: Theme.itemSizeSmall * 0.05 color: Theme.highlightBackgroundColor opacity: 0.7 anchors { top: parent.top left: parent.left } } } EmojiSelect { id: emojiDialog } InfoBanner { id: sentBanner } }