import QtQuick 2.7
import QtQuick.Dialogs 1.2
import QtQuick.Controls 1.2
import "qrc:/js/service.js" as Service
import "qrc:/js/layout.js" as Layoutjs
import "qrc:/js/helper.js" as Helperjs
import "qrc:/qml/configqml"
import "qrc:/qml/genericqml"

StackView{
   id: configStack
   anchors.fill:parent
   initialItem: Flickable{
    width:root.width-5*mm
    height:root.height-12*mm
    contentHeight: configBackground.height
    boundsBehavior: Flickable.StopAtBounds
   
    Rectangle{
        id:configBackground
        color: "white"
        width:parent.width
        height:Math.max(90*mm,root.height-12*mm)
        property var users:[]
        function setServericon(server){
           try {Helperjs.friendicaWebRequest(server+"/api/statusnet/config",configBackground, function (obj){
                         var serverdata = JSON.parse(obj);
                         servericon.source=serverdata.site.logo})} catch(e){print(e)}
        }
        BlueButton{
            id:userButton
            text:qsTr("User")
            y:mm
            width: root.width/2
            onClicked:{
                var useritems="";
                for (var i=0;i<configBackground.users.length;i++){

                    useritems=useritems+"MenuItem{text:'"+configBackground.users[i].username+
                        "'; onTriggered: {Service.readConfig(db,function(obj){
                        userButton.text=obj.username;
                        servername.text=obj.server;
                        configBackground.setServericon(obj.server);
                        username.text= obj.username;
                        password.text=Qt.atob(obj.password);
                        imagestore.text=obj.imagestore;
                        maxNews.value=obj.maxnews;
                        newsTypeField.text=obj.newsViewType;
                        if( obj.isActive==0){userButton.fontColor='black'} else {userButton.fontColor='grey'}
                        },'username','"+configBackground.users[i].username+"')}}"
                    }
                var menuString="import QtQuick.Controls 1.4;import 'qrc:/js/service.js' as Service; Menu {"+useritems+"}";
                var userlistObject=Qt.createQmlObject(menuString,configBackground,"usermenuOutput")
                userlistObject.popup()  }
            }

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

    Text {
        text: qsTr("Password")
       x: 4*mm; y: 30*mm
      }
    Text {
       text: qsTr("Image dir.")
      x: 4*mm; y: 40*mm
     }

   Text {
       text: qsTr("Max. News")
      x: 4*mm; y: 50*mm
     }
   Text {
       text: qsTr("News as")
      x: 4*mm; y: 60*mm
     }
    Text {
        text: qsTr("Interval (0=None)")
        visible: false
        x: 4*mm; y: 70*mm; width:20*mm;wrapMode: Text.Wrap
      }

        Image{
            id:servericon
            x:19*mm;y:10*mm
            width:5*mm; height: 5*mm
            source:""
            MouseArea{
                anchors.fill:parent
                onClicked:{
                    Service.showServerConfig(servername.text, configBackground, function(configString){
                    var serverconfigObject=Qt.createQmlObject(configString,configBackground,"serverconfigOutput");})
                }
            }
        }

        Rectangle{color: "light grey";  x: 25*mm; y: 10*mm; width: root.width/2; height: 5*mm;}
         Flickable {
         id: servernameFlickable
         x: 25*mm; y: 10*mm; width: root.width/2; height: 5*mm;
          contentWidth: servername.paintedWidth
         contentHeight: servername.paintedHeight
         clip: true
         TextEdit {
             id: servername
             width: servernameFlickable.width
             height: servernameFlickable.height
             focus: true
             text:"https://..."
             onEditingFinished:{
                 if((servername.text).substring(0,14) =="https://...http"){
                     serverstring.text= (serverstring.text).substring(11)
                 }

               configBackground.setServericon(servername.text)
             }
            onCursorRectangleChanged: Layoutjs.ensureVisibility(cursorRectangle,servernameFlickable)
         }
     }

    Rectangle{
        color: "light grey"
         x: 25*mm; y: 20*mm; width: root.width/2; height: 5*mm;
         TextInput {
         id: username
         anchors.fill: parent
         selectByMouse: true
    }
     }
    Rectangle{
        color: "light grey"
         x: 25*mm; y: 30*mm; width: root.width/2; height: 5*mm;
         TextInput {
         id: password
         anchors.fill: parent
         selectByMouse: true
         echoMode: TextInput.PasswordEchoOnEdit
    }
 }

    Rectangle{color: "light grey"; x: 25*mm; y: 40*mm; width: root.width/2-9*mm; height: 5*mm;}
    Flickable {
         id: imagestoreFlickable
          x: 25*mm; y: 40*mm; width: root.width/2-9*mm; height: 5*mm;
         clip: true
         TextInput {
             id: imagestore
             width: imagestoreFlickable.width
             height: imagestoreFlickable.height
             wrapMode: TextEdit.NoWrap
             onCursorRectangleChanged: Layoutjs.ensureVisibility(cursorRectangle,imagestoreFlickable)
         }
     }
    Slider{ id: maxNews
        x:34*mm; y: 50*mm;width: root.width/3;height:5*mm
        minimumValue: 0;maximumValue:2000; stepSize: 100
    }


    Rectangle{color: "light grey"; x: 25*mm; y: 50*mm; width: 9*mm; height: 5*mm;
        TextEdit{id:maxNewsText;
            anchors.fill: parent
            verticalAlignment:TextEdit.AlignRight
            text:maxNews.value
            focus: true
            selectByMouse: true
        }
    }

    Rectangle{
         x: 25*mm; y: 60*mm; width: root.width/2; height: 5*mm;
         color:"light grey"
         Text{
         id: newsTypeField
         anchors.fill: parent
         text:"Timeline"
        }
        MouseArea{
        anchors.fill:parent
        onClicked:newstypemenu.popup()
        }
    }
    Slider{ id: messageIntervalSlider
        visible: false
        x:37*mm; y: 70*mm;width: root.width/3;height:5*mm
        minimumValue: 0;maximumValue:24; stepSize: 0.5
    }
    Rectangle{
        visible:false
         x: 25*mm; y: 70*mm; width: 9*mm; height: 5*mm;
         TextEdit{
         id: messageIntervalField
         anchors.fill: parent
         verticalAlignment:TextEdit.AlignRight
         text:messageIntervalSlider.value
         focus: true
         selectByMouse: true
        }
    }

    FileDialog {
        id: imagestoreDialog
        title: "Please choose a directory"
        folder: shortcuts.pictures
        selectFolder: true
        onAccepted: {
            var imagestoreString=imagestoreDialog.folder.toString();
            imagestoreString=imagestoreString.replace(/^(file:\/{2})/,"")+"/"
            imagestore.text=imagestoreString
        }
 }

     BlueButton {
            x: root.width/2+18*mm; y: 40*mm; width: 7*mm; height: 5*mm;
            text: "..."
            onClicked:
         {imagestoreDialog.open()}
     }


    BlueButton {
    x: 25*mm; y: 78*mm
    text: qsTr("Confirm")
    onClicked:{
         var userconfig={server: servername.text, username: username.text, password:Qt.btoa(password.text), imagestore:imagestore.text,maxnews:maxNewsText.text,interval:  messageIntervalField.text, newsViewType:newsTypeField.text};
         var errormessage="";
         if (servername.text==""){errormessage=qsTr("No server given! ")}
         else if (username.text==""){errormessage+=qsTr("No username given! ")}
         else if (password.text=="") {errormessage+=qsTr("No password given! ")}
         else if (imagestore.text=="") {errormessage+=qsTr("No image directory given!")}
         else if (maxNewsText.text=="") {errormessage+=qsTr("No maximum news number given!")}
         else {errormessage=""}
         if (errormessage=="") {
             filesystem.Directory=userconfig.imagestore;
             filesystem.makeDir("contacts");
             filesystem.makeDir("albums");
             Service.storeConfig(db,userconfig);
             Service.readConfig(db,function(userconfig){
               Service.getServerConfig(db,userconfig,root, function(obj){
               var serverString=obj;
               var serverconfigObject=Qt.createQmlObject(serverString,configBackground,"serverconfigOutput");
               Helperjs.readData(db,"config","",function(storedUsers){
                storedUsers.sort(function(obj1, obj2) {
                    return obj1.isActive - obj2.isActive;
                });
                configBackground.users=storedUsers});
             userButton.color="black"
             //reset values
             root.login=userconfig;
             newstab.newstabstatus=userconfig.newsViewType;
             root.currentIndex=0;
             newstab.active=true;
             })},"isActive",0);
        }
         else {Helperjs.show("Error", errormessage,root)}
    }}

    BlueButton {
    x: root.width/2+2*mm; y: mm; width: 5*mm; height: 5*mm;
    text: "-"
    onClicked:{
        var userconfig={server: servername.text, username: username.text, password: Qt.btoa(password.text)};
        Service.deleteConfig(db,userconfig,function(){
           filesystem.Directory=imagestore.text+"contacts";
           filesystem.rmDir();
           filesystem.Directory=imagestore.text+"albums";
           filesystem.rmDir();
           servername.text="https://...";
           servericon.source="";
           username.text="";
           password.text="";
           imagestore.text="";
           maxNews.value=0;
           newsTypeField.text="Timeline";
           messageIntervalSlider.value=0;
           userButton.text=qsTr("User");
           Helperjs.readData(db,"config","",function(storedUsers){
             storedUsers.sort(function(obj1, obj2) {
                 return obj1.isActive - obj2.isActive;
             })
             configBackground.users=storedUsers;})
       })
    }}

    BlueButton {
    x: root.width/2+8*mm; y: mm; width: 5*mm; height: 5*mm;
    text: "+"
    onClicked:{
        servername.text="https://..."
        servericon.source="";
        username.text=""
        password.text=""
        imagestore.text=""
        maxNews.value=0
        newsTypeField.text="Timeline"
        messageIntervalSlider.value=0
        userButton.text=qsTr("User")
       }
     }

    BlueButton {
        x: root.width/2+14*mm; y: mm; width: 5*mm; height: 5*mm;
        text: "?"
        onClicked:{
                    configStack.push({item:"qrc:/qml/configqml/InfoBox.qml"});
           }
         }

    Menu {
        id:newstypemenu
        MenuItem {
            text: qsTr("Timeline")
            onTriggered: {newsTypeField.text="Timeline"}
            }
        MenuItem {
            text: qsTr("Conversations")
            onTriggered: {newsTypeField.text="Conversations"}
            }
    }

   Component.onCompleted: {
      try{Helperjs.readData(db,"config","",function(storedUsers){
          storedUsers.sort(function(obj1, obj2) {
              return obj1.isActive - obj2.isActive;
          })
          configBackground.users=storedUsers;
          Service.readConfig(db,function(obj){
            userButton.text=obj.username;
            servername.text=obj.server;
            configBackground.setServericon(obj.server);
            username.text= obj.username;
            password.text=Qt.atob(obj.password);
            imagestore.text=obj.imagestore;
            maxNews.value=obj.maxnews;
            newsTypeField.text=obj.newsViewType;
            messageIntervalSlider.value=obj.timerInterval;
            if( obj.isActive==0){userButton.fontColor='black'} else {userButton.fontColor='grey'}},"isActive",0
            )
          })}
      catch (e){print(e)}
    }
}
}
}