import QtQuick 2.7
import QtQuick.Layouts 1.2
import QtQuick.Controls 2.0
import "." // To load styles
import "./components"
import "URI.js" as UriJs

Item
{

	id: chatBubbleDelegate
	height: bubble.height
	width: mainWindow.width - (styles.aditionalBubbleWidth - 10)

	property var styles: StyleChat.bubble


	Rectangle
	{
		id: rootBubble
		anchors.fill: parent
		width: parent.width
		height: parent.height
		color: "transparent"

		Rectangle
		{
			id: bubble
			width: Math.min (
					   rootBubble.width * styles.bubbleMaxWidth,
					    Math.max(mesageText.implicitWidth, sendersName.implicitWidth )
					   )  + timeText.implicitWidth + styles.aditionalBubbleWidth
			height: mesageText.height + sendersName.height  + styles.aditionalBubbleHeight


			anchors.left: (model.incoming)?  parent.left : undefined
			anchors.right: (!model.incoming)?  parent.right : undefined


			color: (!model.incoming)? styles.colorOutgoing : styles.colorIncoming
			radius:  styles.radius


			Text
			{
				id: sendersName
				visible: model.incoming
				text: (model.incoming)? model.author_name + ":" : ""
				color: styles.colorSenderName
				font.bold: true

				anchors.leftMargin: styles.lMarginBubble
				anchors.rightMargin: styles.rMarginBubble
				anchors.topMargin: styles.tMarginBubble
				anchors.top: bubble.top

				anchors.left: (model.incoming)?  parent.left : undefined
				anchors.right:(!model.incoming)?  parent.right : undefined

				// Used for give minimum heigh to time when the message is bigger than the bubble in sended messages
				height: (model.incoming || !model.incoming &&
						 mesageText.implicitWidth >= (rootBubble.width * styles.bubbleMaxWidth) )? implicitHeight : 0
			}

			Text
			{
				id: timeText
				text: getMessageTime()
				color: styles.colorMessageTime

				anchors.left: (!model.incoming)?  parent.left : undefined
				anchors.right:(model.incoming)?  parent.right : undefined

				anchors.top:  bubble.top
				anchors.leftMargin: styles.lMarginBubble
				anchors.rightMargin: styles.rMarginBubble
				anchors.topMargin: styles.tMarginBubble

			}


			Text
			{
				id: mesageText
				text: UriJs.URI.withinString(model.msg, function(url)
				{
					return "<a href=\""+ url + "\">" + url + "</a>";
				})

				width: rootBubble.width * styles.bubbleMaxWidth + timeText.width
				anchors.left: (model.incoming)?  parent.left : undefined
				anchors.right:(!model.incoming)?  parent.right : undefined

				anchors.top: sendersName.bottom
				anchors.leftMargin: styles.lMarginBubble
				anchors.rightMargin: styles.rMarginBubble


				textFormat: Text.RichText
				onLinkActivated: Qt.openUrlExternally(link)

				// Used for the correct alineation when the message must be on right
				horizontalAlignment:(!model.incoming &&
									     mesageText.implicitWidth <= (rootBubble.width * styles.bubbleMaxWidth)
									                       )? Text.AlignRight : Text.AlignLeft

				wrapMode: Text.Wrap
				font.pixelSize: styles.messageTextSize

			}

		}

	}

	function getMessageTime()
	{
		var timeFormat = "hh:mm";
		var recvDate = new Date(model.recv_time*1000)

		var timeString = Qt.formatDateTime(recvDate, timeFormat)
		return timeString
	}

 }