//  This file is part of Friendiqa
//  https://git.friendi.ca/lubuwest/Friendiqa
//  Copyright (C) 2020 Marco R. <thomasschmidt45@gmx.net>
//
//  This program is free software: you can redistribute it and/or modify
//  it under the terms of the GNU General Public License as published by
//  the Free Software Foundation, either version 3 of the License, or
//  (at your option) any later version.
//
//  In addition, as a special exception, the copyright holders give
//  permission to link the code of portions of this program with the
//  OpenSSL library under certain conditions as described in each
//  individual source file, and distribute linked combinations including
//  the two.
//
//  You must obey the GNU General Public License in all respects for all
//  of the code used other than OpenSSL. If you modify file(s) with this
//  exception, you may extend this exception to your version of the
//  file(s), but you are not obligated to do so. If you do not wish to do
//  so, delete this exception statement from your version. If you delete
//  this exception statement from all source files in the program, then
//  also delete it here.
//
//  This program is distributed in the hope that it will be useful,
//  but WITHOUT ANY WARRANTY; without even the implied warranty of
//  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
//  GNU General Public License for more details.
//
//  You should have received a copy of the GNU General Public License
//  along with this program.  If not, see <http://www.gnu.org/licenses/>.

import QtQuick 2.11
import QtQuick.Controls 2.12
import "qrc:/js/helper.js" as Helperjs
import "qrc:/js/news.js" as Newsjs
import "qrc:/qml/genericqml"

Item {
    id: groupComponent
    property var groupmembers:[]
    //property bool newGroup: false
    function groupModelAppend(groupcontacts,callback){
       for (var n in groupcontacts){
        groupModel.append({"groupmember":groupcontacts[n]});}
        callback()
    }

    Rectangle {
        id: wrapper
        width: 16*mm
        height: 15*mm
        border.color:  "grey"
        color:"white"

        Image {
            id: photoImage
            x:1
            y:1
            width: 10*mm
            height:10*mm
            source:"qrc:/images/defaultcontact.jpg"
        }
        Rectangle{
            id:namelabelRect
            x: 1
            width: wrapper.width-2
            height: 3.5*mm
            anchors.top: photoImage.bottom
            border.color: "light grey"
            TextInput {
                id: namelabel
                anchors.fill: parent
                readOnly: true
                text: group.new?"":group.groupname
                color: "#303030"
                font.pixelSize: 3*mm

            }
        }
        
       MButton{
            id: closeButton
            visible: false
            width: 8*mm
            height: 6*mm
            anchors.left: infobutton.right
            anchors.margins: mm
            anchors.top: parent.top
            
            text: "\uf057"
            font.pixelSize: 3*mm
                    onClicked:{groupComponent.state="";
                        if (group.new){groupsModel.remove(index)}
                    }
        }
        
        MButton{
            id:infobutton
            width: 4*mm
            height: 6*mm

            //color:"transparent"
            text:"?"
            font.pixelSize: 3*mm
            anchors.left: photoImage.right
            anchors.leftMargin: mm
            anchors.topMargin: mm
            anchors.top: parent.top
            onClicked:{
                //if(group.new){
                    Helperjs.readField("members",root.db,"groups",root.login.username,function(groups){
                    try {groupModel.clear()}catch (e){print(e)}
                    groupmembers=JSON.parse(groups);
                    for (var user in groupmembers){
                        Helperjs.readData(root.db,"contacts",root.login.username,function(userdata){
                            if (userdata[0]){
                                userdata[0].name=Qt.atob(userdata[0].name);
                                userdata[0].description=Qt.atob(userdata[0].description)
                                //groupModel.append({"groupmember":userdata[0]
                                groupModel.append({"contact":userdata[0]
                            })}
                        },"id",groupmembers[user])
                    } //catch(e){}
                },"groupname",group.groupname);
                //}
                groupComponent.state="large"
            }
        }

        Rectangle{
            id: detailsrectangle
            anchors.top: namelabelRect.bottom
            anchors.topMargin: mm
            opacity: 0

//            Component {
//                id:groupMember
//                Rectangle{
//                    width:parent.width
//                    height:6*mm
//                    Rectangle{id:memberrectangle
//                        border.color: "#EEEEEE"
//                        border.width: 1
//                        width:parent.width-12*mm
//                        height:6*mm
//                        Image {
//                            id: memberImage
//                            x:1
//                            y:1
//                            width: 5*mm
//                            height:5*mm
//                            source:(groupmember.isFriend==1)? "file://"+groupmember.profile_image :groupmember.profile_image_url
//                            onStatusChanged: if (photoImage.status == Image.Error) {source="qrc:/images/defaultcontact.jpg"}
//                            }
//                        Text{
//                            font.pixelSize: 3*mm
//                            anchors.left: memberImage.right
//                            anchors.margins: 1*mm
//                            width:parent.width-1
//                            text:groupmember.name
//                        }
//                        MouseArea{
//                            anchors.fill: parent
//                            onClicked:{
////                                root.currentIndex=1;
////                                friendstab.active=true;
////                                root.contactdetailsSignal(groupmember)
//                                root.currentIndex=0;
//                                root.contactdetailsSignal(groupmember)
//                            }
//                        }
//                       // BlueButton{
//                       //     anchors.left: memberrectangle.right
//                       //     anchors.margins: 1*mm
//                       //     text: "\uf056"
//                       //     onClicked:{
//                       //         groupModel.remove(index)
//                       //     }
//                       // }
//                    }
//                }
//            }

            ListView{
                id: groupListView
                x:1
                //anchors.top: parent.top
                width: root.width-10*mm
                height:groupsView.height - 24*mm
                clip: true
                spacing: 2
                model: groupModel
                delegate: ContactComponent { }// groupMember
                function processContactSelection(contactobject){showContactdetails(contactobject)}
            }

            ListModel{id: groupModel}

            Row{
                anchors.top: groupListView.bottom
                anchors.topMargin: mm
                spacing: mm
 
                }

//                BlueButton{
//                    id:  addMembers
//                    text:"\uf234"
//                    onClicked: {
//                        Newsjs.listFriends(root.login,root.db,function(userdata){
//                            var newlistcontacts=[];
//                            for (var n in userdata){
//                                if (groupmembers.indexOf(userdata[n].id)==-1){
//                                    newlistcontacts.push(userdata[n])
//                                }
//                            }
//                            var component = Qt.createComponent("qrc:/qml/contactqml/Contactlist.qml");
//                            var contactlistobject = component.createObject(groupListView,{"possibleUsers":newlistcontacts});

//                        })
//                    }
//                }

//                BlueButton{
//                    id: updateButton
//                    text: "\uf0ee"
//                    onClicked:{
//                        var groupobject={};
//                        var groupmembers=[];
//                        for (var i=0;i<groupModel.count;i++){groupmembers.push(groupModel.get(i).groupmember)}
//                        try{ groupobject.id=group.gid} catch(e){};
//                        try{ groupobject.new=group.new} catch(e){};
//                        if (namelabel.text==""){
//                            Helperjs.showMessage(qsTr("Error"),qsTr("No name given"),root)}
//                        else {
//                            groupobject.name=namelabel.text;
//                            groupobject.user=groupmembers;
//                            updateGroup(login,db,groupobject)
//                            groupComponent.state="";
//                        }
//                    }
//                }
//                BlueButton{
//                    id: deleteButton
//                    text: "\uf056"
//                    onClicked:{
//                        Newsjs.deleteGroup(root.login,root.db,root,group,function(){
//                            groupComponent.state="";
//                            groupsModel.remove(index)})
//                    }
//                }

        }
    Component.onCompleted:{if(group.new){groupComponent.state="large"}}
    }

    states: [
        State {
            name: "large"
            PropertyChanges { target: namelabel; font.pixelSize: 4*mm; width:groupsView.width; readOnly:false}
            PropertyChanges { target: namelabelRect; height: 4.5*mm}
            PropertyChanges { target: closeButton; visible: true}
            PropertyChanges { target: groupComponent; z: 2  }
            PropertyChanges { target: wrapper; width:groupsView.width;height:groupsView.height -2*mm-1}
            PropertyChanges { target: photoImage; width:15*mm;height:15*mm }
            PropertyChanges { target:groupComponent.GridView.view ;contentY:groupComponent.y;contentX:groupComponent.x;interactive:false}
            PropertyChanges { target: detailsrectangle; opacity:1  }
            PropertyChanges { target: infobutton; visible: false}
            }
    ]
}