import QtQuick 2.7
import QtQuick.Controls 1.4
import "qrc:/js/service.js" as Service
import "qrc:/js/helper.js" as Helperjs
import "qrc:/qml/genericqml"

Rectangle{
    id:imageDialog
    property var attachImageURLs: []
    property var contacts: []
    property var groups: []
    property var contact_allow:login.permissions[0]
    property var contact_deny:login.permissions[1]
    property var group_allow:login.permissions[2]
    property var group_deny:login.permissions[3]
    property int imageNo: 0

    function attachImage(url){
        var attachIndex=attachImageURLs.indexOf(url);
        if(attachIndex>-1){
            imageUploadModel.append({"imageUrl":url.toString(),"description":""})
        }
        else{imageUploadModel.remove(attachImage)}
    }

    function uploadSelectedImage(inumber){
        xhr.url= login.server + "/api/friendica/photo/create.json";
        xhr.setLogin(login.username+":"+Qt.atob(login.password));
        xhr.clearParams();
        xhr.setParam("desc",imageUploadModel.get(inumber).description);
        xhr.setParam("album", album.currentText);
        if (group_allow.length>0) {xhr.setParam("group_allow", Helperjs.cleanArray(group_allow))};
        if (group_deny.length>0) {xhr.setParam("group_deny",  Helperjs.cleanArray(group_deny))};
        if (contact_allow.length>0) {xhr.setParam("contact_allow", Helperjs.cleanArray(contact_allow))};
        if (contact_deny.length>0) {xhr.setParam("contact_deny",  Helperjs.cleanArray(contact_deny))};
        xhr.setImageFileParam("media", imageUploadModel.get(inumber).imageUrl );
        xhr.post();
     }

    z:2
    border.color: "grey"
    width: parent.width-4*mm
    height:parent.height-12*mm
    x:2*mm
    y:10*mm
    property string directory: ""

    Connections{
        target:xhr
        onError:{print(data)}//if (data=="image"){Helperjs.showMessage()}}
        onSuccess:{//print("Bild hochgeladen "+data+" aktuelleBild "+imageNo);
            print(imageNo+" "+imageUploadModel.count);
            imageNo=imageNo+1;
            if(imageNo<imageUploadModel.count){
                uploadSelectedImage(imageNo);
            }else{
                Service.requestList(root.login,root.db, fotostab,function(obj){
                    fotorectangle.newimages=obj;
                    imageDialog.destroy()
                })

            }
        }
    }

    Row{
        id:buttonRow
        anchors.top: parent.top
        anchors.topMargin: 1*mm
        anchors.right: parent.right
        anchors.rightMargin: 1*mm
        spacing:mm

        BlueButton{
            id:permButton
            text: ((contact_allow.length==0)&&(contact_deny.length==0)&&(group_allow.length==0)&&(group_deny.length==0))?"\uf09c":"\uf023"
            onClicked: {
                var component = Qt.createComponent("qrc:/qml/genericqml/PermissionDialog.qml");
                var permissions = component.createObject(imageDialog,{"x":mm,"y":7*mm});
            }
        }
        
        BlueButton{
            id:closeButton
            text:   "\uf057"
            onClicked:{imageDialog.destroy()}
        }
    }

    Text {
      text: qsTr("Album")
     x: 4*mm; y: 10*mm
    }

    Text {
      text: qsTr("Image")
     x: 4*mm; y: 17*mm
    }

    Text {
      text: qsTr("Description")
     x: 4*mm; y: 33*mm
    }

    ListView{
        id: imageUploadView
        x:23*mm
        y:17*mm
        width: imageDialog.width-2*mm
        height: 25*mm
        model: imageUploadModel
        delegate: imageDelegate
        footer: imageFooter
        orientation: ListView.Horizontal
        spacing: mm
    }

    ListModel{
        id: imageUploadModel
    }

    Component{
        id: imageDelegate
        Rectangle{
            width:Math.max(20*mm,descriptionInput.contentWidth)
            height:20*mm
            Image{
                id: uploadImage
                width: 20*mm
                height: 14*mm
                fillMode: Image.PreserveAspectFit
                source:imageUrl
                MouseArea{
                    anchors.fill: parent
                    onClicked:{
                        attachImageURLs.splice(attachImageURLs.indexOf(imageUrl,1))
                        attachImage(imageUrl)}
                }
            }

            Rectangle{
                color: "light grey"
                border.color: "grey"
                 x: mm; y: 15*mm; width:Math.max(20*mm, descriptionInput.contentWidth);
                 height: 5*mm;
                 TextInput {
                     id: descriptionInput
                     anchors.fill: parent
                     selectByMouse: true
                     text:description
                     onTextChanged: imageUploadModel.set(index,{"description":descriptionInput.text});
                }
            }
        }
    }
    Component{
        id: imageFooter
        Image{
            id: footerImage
            width: 15*mm
            height: 15*mm
            fillMode: Image.PreserveAspectFit
            source:"qrc:/images/addImage.png"
            MouseArea{
                anchors.fill: parent
                onClicked:{
                    var defaultDirectory="file://"+osSettings.attachImageDir;
                    var component = Qt.createComponent("qrc:/qml/genericqml/ImageDialog.qml");
                    var imagedialog = component.createObject(imageDialog,{"directory": defaultDirectory, "multiSelection": true});}
            }
        }
    }
    ComboBox{
        id: album
        x: 23*mm
        y: 10*mm
        width: root.width/2;
        height: 5*mm;
        editable:true
        model: albumModel
        onAccepted: {
            if (find(currentText) === -1) {
                albumModel.append({text: editText})
                currentIndex = find(editText)
            }
        }
    }

    ListModel{id:albumModel}

    BlueButton{
        id:uploadButton
        x:4*mm; y:40*mm
        text:   qsTr("Upload")
        onClicked:{
            //imageBusy.running=true;
            if(album.currentText==""){Helperjs.showMessage(qsTr("Error"),qsTr(" No album name given"), imageDialog)}
            else{newimageProgress.visible=true;
            if (attachImageURLs.length>0){
                uploadSelectedImage(0)
            }}
        }
    }
    ProgressBar{
        id: newimageProgress
        width: 15*mm
        height: buttonRow.height
        anchors.top: parent.top
        anchors.right:buttonRow.left
        anchors.rightMargin:mm
        visible: false
        value: imageNo/attachImageURLs.length
    }

    Component.onCompleted:{
        albumModel.append({"text":""});
        try{Helperjs.readField("album",db,"imageData",login.username,function(storedAlbums){
            //print(JSON.stringify(storedAlbums))
          for (var n in storedAlbums){
              albumModel.append({"text":storedAlbums[n]})}
        })}
        catch (e){print(e)}
    }
//    BusyIndicator{
//        id: imageBusy
//        anchors.horizontalCenter: imageUploadView.horizontalCenter
//        anchors.top:imageUploadView.top
//        anchors.topMargin: 2*mm
//        width:10*mm
//        height: 10*mm
//        running:false
//     }
}