harbour-nextcloudnotes/qml/pages/NotePage.qml
2018-12-07 00:30:18 +01:00

243 lines
11 KiB
QML

import "../js/showdown-1.9.0/dist/showdown.js" as ShowDown
import QtQuick 2.0
import Sailfish.Silica 1.0
Dialog {
id: noteDialog
property var note
property var showdown: ShowDown.showdown
property var converter: new showdown.Converter(
{ simplifiedAutoLink: true,
excludeTrailingPunctuationFromURLs: true,
strikethrough: true,
tables: true,
tasklists: false, // this is handled by the function parseContent() because LinkedLabel HTML support is to basic
parseImgDimensions: true,
simpleLineBreaks: true,
emoji: true } )
acceptDestination: Qt.resolvedUrl("EditPage.qml")
acceptDestinationProperties: { note: note }
Component.onCompleted: {
note = api.getNote(note.id)
reloadContent()
}
Connections {
target: api
onBusyChanged: {
if (api.busy === false) {
note = api.getNote(note.id, false)
reloadContent()
}
}
}
function reloadContent() {
acceptDestinationProperties = { note: note }
categoryRepeater.model = api.categories
parseContent()
}
function parseContent() {
//note = api.getNote(note.id, false)
var convertedText = converter.makeHtml(note.content)
var occurence = -1
convertedText = convertedText.replace(/^<li>(<p>)?\[ \] (.*)(<.*)$/gmi,
function(match, p1, p2, p3, offset) {
occurence++
return '<li class="tasklist"><a href="tasklist:checkbox_' + occurence + '">' + (p1 ? p1 : "") + '☐ ' + p2 + '</a>' + p3
} )
occurence = -1
convertedText = convertedText.replace(/^<li>(<p>)?\[[xX]\] (.*)(<.*)$/gmi,
function(match, p1, p2, p3, offset) {
occurence++
return '<li class="tasklist"><a href="tasklist:uncheckbox_' + occurence + '">' + (p1 ? p1 : "") + '☑ ' + p2 + '</a>' + p3
} )
convertedText = convertedText.replace("<table>", "<table border='1' cellpadding='" + Theme.paddingMedium + "'>")
contentLabel.text = "<style>ul,ol,table,img { margin-bottom: " + Theme.paddingLarge + "px; margin-top: " + Theme.paddingLarge + "px; }\n" +
"a:link { color: " + Theme.primaryColor + "; }\n" +
"li.tasklist { font-size:large; margin-bottom: " + Theme.paddingMedium + "px; margin-top: " + Theme.paddingMedium + "px; }\n" +
"del { text-decoration: line-through; }\n" +
"table { border-color: " + Theme.secondaryColor + "; }</style>" + convertedText
//console.log(contentLabel.text)
}
SilicaFlickable {
anchors.fill: parent
contentHeight: mainColumn.height
Column {
id: mainColumn
width: parent.width
RemorsePopup {
id: remorse
onTriggered: pageStack.pop()
}
PullDownMenu {
busy: api.busy
MenuItem {
text: qsTr("Delete")
onClicked: remorse.execute("Deleting", function() { api.deleteNote(note.id) } )
}
MenuItem {
text: enabled ? qsTr("Reload") : qsTr("Updating...")
enabled: !api.busy
onClicked: api.getNote(note.id)
}
MenuLabel {
visible: appSettings.currentAccount.length >= 0
text: qsTr("Last update") + ": " + (
new Date(api.update).valueOf() !== 0 ?
new Date(api.update).toLocaleString(Qt.locale(), Locale.ShortFormat) :
qsTr("never"))
}
}
DialogHeader {
id: dialogHeader
dialog: noteDialog
title: note.title
acceptText: qsTr("Edit")
cancelText: qsTr("Notes")
}
Column {
width: parent.width
spacing: Theme.paddingLarge
Separator {
width: parent.width
color: Theme.primaryColor
horizontalAlignment: Qt.AlignHCenter
}
LinkedLabel {
id: contentLabel
x: Theme.horizontalPageMargin
width: parent.width - 2*x
textFormat: Text.RichText
linkColor: Theme.primaryColor
defaultLinkActions: false
onLinkActivated: {
//console.log(link)
var occurence = -1
var newContent = note.content
if (/^tasklist:checkbox_(\d+)$/m.test(link)) {
newContent = newContent.replace(/- \[ \] (.*)$/gm,
function(match, p1, offset, string) {
occurence++
if (occurence === parseInt(link.split('_')[1])) {
return (appSettings.useCapitalX ? '- [X] ' : '- [x] ') + p1 }
else { return match }
} )
note.content = newContent
parseContent()
api.updateNote(note.id, { 'content': note.content } )
}
else if (/^tasklist:uncheckbox_(\d+)$/m.test(link)) {
newContent = newContent.replace(/- \[[xX]\] (.*)$/gm,
function(match, p1, offset, string) {
occurence++
if (occurence === parseInt(link.split('_')[1])) {
return '- [ ] ' + p1 }
else { return match }
} )
note.content = newContent
parseContent()
api.updateNote(note.id, { 'content': note.content } )
}
else {
Qt.openUrlExternally(link)
}
}
}
Separator {
width: parent.width
color: Theme.primaryColor
horizontalAlignment: Qt.AlignHCenter
}
Flow {
x: Theme.horizontalPageMargin
width: parent.width - 2*x
spacing: Theme.paddingMedium
visible: opacity > 0.0
opacity: categoryField.focus ? 1.0 : 0.0
Behavior on opacity { FadeAnimator { } }
Repeater {
id: categoryRepeater
model: api.categories
BackgroundItem {
id: categoryBackground
width: categoryRectangle.width
height: categoryRectangle.height
Rectangle {
id: categoryRectangle
width: categoryLabel.width + Theme.paddingLarge
height: categoryLabel.height + Theme.paddingSmall
color: "transparent"
border.color: Theme.highlightColor
radius: height / 4
Label {
id: categoryLabel
anchors.centerIn: parent
text: modelData
color: categoryBackground.highlighted ? Theme.highlightColor : Theme.primaryColor
font.pixelSize: Theme.fontSizeSmall
}
}
onClicked: categoryField.text = modelData
}
}
}
}
Row {
x: Theme.horizontalPageMargin
width: parent.width - x
IconButton {
id: favoriteButton
property bool selected: note.favorite
width: Theme.iconSizeMedium
icon.source: (selected ? "image://theme/icon-m-favorite-selected?" : "image://theme/icon-m-favorite?") +
(favoriteButton.highlighted ? Theme.secondaryHighlightColor : Theme.secondaryColor)
onClicked: {
api.updateNote(note.id, {'favorite': !note.favorite})
}
}
TextField {
id: categoryField
width: parent.width - favoriteButton.width
text: note.category
placeholderText: qsTr("No category")
label: qsTr("Category")
EnterKey.iconSource: "image://theme/icon-m-enter-accept"
EnterKey.onClicked: {
categoryField.focus = false
}
onFocusChanged: {
if (focus === false && text !== note.category) {
api.updateNote(note.id, {'content': note.content, 'category': text}) // This does not seem to work without adding the content
}
}
}
}
DetailItem {
id: modifiedDetail
label: qsTr("Modified")
value: new Date(note.modified * 1000).toLocaleString(Qt.locale(), Locale.ShortFormat)
}
}
VerticalScrollDecorator {}
}
allowedOrientations: defaultAllowedOrientations
}