import $$ from 'dom7';
import Framework7 from 'framework7/framework7.esm.bundle.js';

// Import F7 Styles
import 'framework7/css/framework7.bundle.css';

// Import Icons and App Custom Styles
import '../css/icons.css';
import '../css/app.css';
// Import Cordova APIs
import cordovaApp from './cordova-app.js';
// Import Routes
import routes from './routes.js';

var app = new Framework7({
  root: '#app', // App root element
  id: 'io.framework7.myapp', // App bundle ID
  name: 'test', // App name
  theme: 'auto', // Automatic theme detection
  // App root data
  data: function () {
    return {
      user: {
        firstName: 'John',
        lastName: 'Doe',
      },

    };
  },
  // App root methods
  methods: {
    helloWorld: function () {
      app.dialog.alert('Hello World!');
    },
  },
  // App routes
  routes: routes,
  // Enable panel left visibility breakpoint
  panel: {
    leftBreakpoint: 960,
  },


  // Input settings
  input: {
    scrollIntoViewOnFocus: Framework7.device.cordova && !Framework7.device.electron,
    scrollIntoViewCentered: Framework7.device.cordova && !Framework7.device.electron,
  },
  // Cordova Statusbar settings
  statusbar: {
    overlay: Framework7.device.cordova && Framework7.device.ios || 'auto',
    iosOverlaysWebView: true,
    androidOverlaysWebView: false,
  },
  on: {
    init: function () {
      var f7 = this;
      if (f7.device.cordova) {
        // Init cordova APIs (see cordova-app.js)
        cordovaApp.init(f7);
      }
        init();
    },
  },
});

// Login Screen Demo
$$('#my-login-screen .login-button').on('click', function () {
  var username = $$('#my-login-screen [name="username"]').val();
  var password = $$('#my-login-screen [name="password"]').val();

  // Close login screen
  app.loginScreen.close('#my-login-screen');

  // Alert username and password
  app.dialog.alert('Username: ' + username + '<br>Password: ' + password);
});

var db;
var shortName = 'BazaFX';
var version = '1.0';
var displayName = 'BazaFX';
var maxSize = 65535;

// wywoływana kiedy pojawi się błąd w połączeniu do bazy:
function errorHandler(transaction, error) {
   alert('Błąd: ' + error.message + ' kod błędu: ' + error.code);
}

// Funkcja wywoływana po udanej transakcji z bazą
function successCallBack() {
   alert("Debuger: sukces!");
}

function nullHandler(){};

//Funkcja wywoływana po starcie apki
function init(){
    if (!window.openDatabase) {
       alert('Twoje urządzenie nie obsługuje SQLite!');
       return;
    }
    db = openDatabase(shortName, version, displayName,maxSize); //tworzy połączenie z bazą
    db.transaction(function(tx){ //wykonuje SQL
// tx.executeSql( 'DROP TABLE Userr',nullHandler,nullHandler);
    tx.executeSql( 'CREATE TABLE IF NOT EXISTS Userr(UserId INTEGER NOT NULL PRIMARY KEY, Marka TEXT NOT NULL, Rok TEXT NOT NULL, Silnik TEXT NOT NULL, Pojemnosc TEXT NOT NULL, Imie TEXT NOT NULL,Nazwisko TEXT NOT NULL,Adres TEXT NOT NULL,Pesel TEXT NOT NULL )',[],nullHandler,errorHandler);},errorHandler,successCallBack);

};

function ListDBValues() {
 if (!window.openDatabase) {
  alert('To urządzenie nie obsługuje SQLite!');
  return;
 }
 $$('#lbUsers').html(''); //wyczyszczenie wcześniejszej zawartości
 db.transaction(function(transaction) {
   transaction.executeSql('SELECT * FROM Userr;', [],
    function(transaction, result) {
    if (result != null && result.rows != null) {
    for (var i = 0; i < result.rows.length; i++) {
    var row = result.rows.item(i);
    $$('#lbUsers').append('<br>' + row.UserId + '. ' + row.Marka+ ', ' + row.Rok+ ', ' + row.Silnik+ ', ' + row.Pojemnosc+ ' | ' + row.Imie+ ', '+ row.Nazwisko+ ', ' + row.Adres+ ', ' + row.Pesel+ ' ');

    }
    }
    },errorHandler);
 },errorHandler,nullHandler);
 return
}

$$(document).on("page:init",'.page[data-name="about"]',function(e){
    $$('#odswiezanie').on('click', () => {
        console.log("click")
      ListDBValues();

    });

$$('#dodawanie').on('click', () => {
        console.log("click")
      AddValueToDB();

    });
});



function AddValueToDB() {
 if (!window.openDatabase) {
   alert('To urządzenie nie obsługuje SQLite!');
   return;
 }

 db.transaction(function(transaction) {
   transaction.executeSql('INSERT INTO Userr(Marka, Rok, Silnik, Pojemnosc, Imie, Nazwisko, Adres, Pesel) VALUES (?,?,?,?,?,?,?,?)',[$$('#Marka').val(), $$('#Rok').val(),$$('#Silnik').val(),$$('#Pojemnosc').val(),$$('#Imie').val() ,$$('#Nazwisko').val() ,$$('#Adres').val(),$$('#Pesel').val()],
     nullHandler,errorHandler);
   });

 return false;
}