Initial commit

2021-03-09 20:32:57 +01:00
commit 0420b3efbd
56 changed files with 94426 additions and 0 deletions
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="de">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>wo-bisch.ch - LoraWAN Tracker</title>
+    <link rel="stylesheet" href="/wo-bisch-web.css">
+    <link rel="stylesheet" href="/wo-bisch-web-custom.css">
+  </head>
+  <body>
+    <div class="section px-4 py-4">
+      <div class="notification is-danger">
+        <strong>Oops, da ist was schiefgegangen!</strong>
+      </div>
+    </div>
+  </body>
+</html>
@@ -0,0 +1,88 @@
+.image.is-10by1 img, .image.is-20by3 img {
+   bottom: 0;
+   left: 0;
+   position: absolute;
+   right: 0;
+   top: 0;
+   height: 100%;
+   width: 100%;
+}
+
+.image.is-10by1 {
+   padding-top: 10%;
+}
+
+.image.is-20by3 {
+   padding-top: 15%;
+}
+
+hr {
+  margin: 0 0 15px 0;
+}
+
+hr.top {
+  margin: 0 0 0 0;
+}
+
+.signup-box {
+  margin: auto;
+  width: 300px;
+  background: rgba(255,255,255,0.05);
+  border: 1px solid rgba(255,255,255,0.3);
+  border-radius: 10px;
+}
+
+.block-link {
+    text-decoration: none !important;
+}
+
+.apexcharts-title-text {
+  font-weight: 700 !important;
+  font-size: 24px !important;
+  font-family: "Rubik", sans-serif !important;
+}
+
+.apexcharts-legend {
+  font-family: "Rubik", sans-serif;
+}
+
+/**
+ * * The CSS shown here will not be introduced in the Quickstart guide, but
+ * * shows how you can use CSS to style your Element's container.
+ * */
+input,
+.StripeElement {
+  height: 40px;
+  padding: 10px 12px;
+
+  color: #32325d;
+  background-color: white;
+  border: 1px solid transparent;
+  border-radius: 4px;
+
+  box-shadow: 0 1px 3px 0 #e6ebf1;
+  -webkit-transition: box-shadow 150ms ease;
+  transition: box-shadow 150ms ease;
+}
+
+input:focus,
+.StripeElement--focus {
+  box-shadow: 0 1px 3px 0 #cfd7df;
+}
+
+.StripeElement--invalid {
+  border-color: #fa755a;
+}
+
+.StripeElement--webkit-autofill {
+  background-color: #fefde5 !important;
+}
+
+.checkboxes input {
+  vertical-align: middle;
+}
+
+.checkboxes label span {
+  vertical-align: middle;
+  margin-left: 5px;
+}
@@ -0,0 +1,81 @@
+// Set your publishable key: remember to change this to your live publishable key in production
+// See your keys here: https://dashboard.stripe.com/account/apikeys
+var stripe = Stripe('pk_test_YkSGqH3Tk9WKK9HrlY63GhAg');
+var elements = stripe.elements();
+
+// Set up Stripe.js and Elements to use in checkout form
+var style = {
+  base: {
+    color: "#32325d",
+  }
+};
+
+var card = elements.create("card", { style: style });
+card.mount("#card-element");
+
+
+card.addEventListener('change', ({error}) => {
+  const displayError = document.getElementById('card-errors');
+  if (error) {
+    displayError.textContent = error.message;
+  } else {
+    displayError.textContent = '';
+  }
+});
+
+
+var submitButton = document.getElementById('submit');
+
+function GetClientSecret() {
+  var result = "";
+  $.ajax({
+    async: false,
+    url: "getstripepaymentintent",
+    type: "get", //send it through get method
+    dataType: "json",
+    data: { 
+      charge_data: $("#charge_data").html()
+    },
+    success: function(response) {
+      console.log('pay success');
+      console.log(response.stripesessionid);
+      console.log('rc: '+response.rc);
+      if (response.rc == 0) {
+        result = response.stripeclientsecret;
+      }
+    },
+    error: function(xhr) {
+      console.log('getstripepaymentintent error');
+      //Do Something to handle error
+    }
+  });
+
+  return result;
+}
+
+submitButton.addEventListener('click', function(ev) {
+  var clientSecret = GetClientSecret();
+  stripe.confirmCardPayment(clientSecret, {
+    payment_method: {
+      card: card,
+      billing_details: {
+        name: 'Jenny Rosen'
+      }
+    }
+  }).then(function(result) {
+    if (result.error) {
+      // Show error to your customer (e.g., insufficient funds)
+      console.log(result.error.message);
+    } else {
+      // The payment has been processed!
+      if (result.paymentIntent.status === 'succeeded') {
+        // Show a success message to your customer
+        // There's a risk of the customer closing the window before callback
+        // execution. Set up a webhook or plugin to listen for the
+        // payment_intent.succeeded event that handles any business critical
+        // post-payment actions.
+        alert("Payment succeeded!!!");
+      }
+    }
+  });
+});
@@ -0,0 +1,105 @@
+$(function() {
+
+    var start = moment({hour: 0});
+    var end = moment();
+    var s_start = start.utc().format('YYYY-MM-DDTHH:mm:ss[Z]');
+    var s_end = end.utc().format('YYYY-MM-DDTHH:mm:ss[Z]');
+
+    console.log("XXX: "+start.format());
+
+    function change_property(new_property) {
+        if (new_property != property) {
+            property = new_property;
+            
+            if (history.pushState) {
+                var newurl = window.location.href.replace(/property=[a-z]+/,'property='+new_property);
+                window.history.pushState({path:newurl},'',newurl);
+            }
+        }
+    }
+
+    function cb(start, end) {
+        $('#reportrange span').html(start.locale('de').format('D. MMM YYYY') + ' - ' + end.locale('de').format('D. MMM YYYY'));
+        console.log("A new date selection was made: " + start.format() + ' to ' + end.format());
+        s_start = start.utc().format('YYYY-MM-DDTHH:mm:ss[Z]');
+        s_end = end.utc().format('YYYY-MM-DDTHH:mm:ss[Z]');
+        console.log("Start: " + s_start + ' End: ' + s_end + ' Property: '+ property);
+        drawGraph(deveui, alias, property, s_start,s_end, false);
+    }
+
+    $('#btn_w').on("click", function() {
+      change_property('w');
+      drawGraph(deveui, alias, property, s_start, s_end, false);
+    });
+
+    $('#btn_t').on("click", function() {
+      change_property('t');
+      drawGraph(deveui, alias, property, s_start, s_end, false);
+    });
+
+    $('#btn_h').on("click", function() {
+      change_property('h');
+      drawGraph(deveui, alias, property, s_start, s_end, false);
+    });
+
+    $('#btn_p').on("click", function() {
+      change_property('p');
+      drawGraph(deveui, alias, property, s_start, s_end, false);
+    });
+
+    $('#btn_vp').on("click", function() {
+      change_property('vp');
+      drawGraph(deveui, alias, property, s_start, s_end, false);
+    });
+
+    $('#reportrange').daterangepicker({
+        startDate: start.local(),
+        endDate: end.local(),
+        regional: [ "de" ],
+        "locale": {
+            format: 'DD.MM.YYYY',
+            "separator": " - ",
+            "applyLabel": "Anwenden",
+            "cancelLabel": "Abbrechen",
+            "fromLabel": "Von",
+            "toLabel": "Bis",
+            customRangeLabel: 'Benutzerdefiniert',
+            "weekLabel": "W",
+            "daysOfWeek": [
+                "So",
+                "Mo",
+                "Di",
+                "Mi",
+                "Do",
+                "Fr",
+                "Sa"
+            ],
+            "monthNames": [
+                "Jan",
+                "Feb",
+                "M&auml;r",
+                "Apr",
+                "Mai",
+                "Jun",
+                "Jul",
+                "Aug",
+                "Sep",
+                "Okt",
+                "Nov",
+                "Dez"
+            ],
+            "firstDay": 1
+        },
+        ranges: {
+           'Heute': [moment(), moment()],
+           'Gestern': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
+           'Letzte 7 Tage': [moment().subtract(6, 'days'), moment()],
+           'Letzte 30 Tage': [moment().subtract(29, 'days'), moment()],
+           'Diesen Monat': [moment().startOf('month'), moment().endOf('month')],
+           'Letzten Monat': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
+        }
+    }, cb);
+
+    //cb(start, end);
+
+});
@@ -0,0 +1,308 @@
+function validate(what, text) {
+  if (what == 'alias') {
+    var re = /^[a-zA-Z0-9 ]{1,25}$/;
+  } else if (what == 'smsnumber') {
+    var re = /^\+[0-9]{11,11}$/;
+  }
+  return re.test(text);
+}
+
+// A $( document ).ready() block.
+$( document ).ready(function() {
+$(".show-modal").click(function() {
+  $("#alias_exclamation").hide();
+  $("#smsnumber_exclamation").hide();
+  var alias = $(this).prev().html();
+  var deveui = $(this).prev().attr('id').replace("alias_","");
+  $('#deveui').html(deveui);
+  var alarmactive = $('#alarmactive_'+deveui).html();
+  var smsnumber = $('#smsnumber_'+deveui).html();
+  
+  $("#alias").val(alias);
+  console.log(alarmactive);
+  if (alarmactive == "1") {
+    $('#checkbox').prop('checked', true);
+  } else {
+    $('#checkbox').prop('checked', false);
+  }
+  $("#smsnumber").val(smsnumber);
+  $("#modal").addClass("is-active");  
+});
+
+$("#cart-close").click(function() {
+   $("#cart").removeClass("is-active");
+});
+
+$("#payment_notifier_close").click(function() {
+   $("#payment_notifier").removeClass("is-active");
+   location.reload(true);
+});
+
+$(".abo_plus").click(function() {
+   console.log("abo_plus");
+   el = $(this).parent().find(".abo_add_years");
+   el_text = $(this).parent().parent().find(".abo_add_years_text");
+   counter = Number(el.html());
+   if (counter < 3) {
+     counter = counter + 1;
+     el.html(counter);
+     if (counter == 1) {
+       el_text.html("+" + counter + " Jahr");
+     } else {
+       el_text.html("+" + counter + " Jahre");
+     }
+   }
+});
+
+$(".abo_minus").click(function() {
+   console.log("abo_minus");
+   el = $(this).parent().find(".abo_add_years");
+   el_text = $(this).parent().parent().find(".abo_add_years_text");
+   counter = Number(el.html());
+   if (counter > 0) {
+     counter = counter - 1;
+     el.html(counter);
+     if (counter == 0) {
+       el_text.html("&nbsp;");
+     } else if (counter == 1) {
+       el_text.html("+" + counter + " Jahr");
+     } else {
+       el_text.html("+" + counter + " Jahre");
+     }
+   }
+});
+
+function add_years(dt,n) 
+{
+ return new Date(dt.setFullYear(dt.getFullYear() + n));      
+}
+
+$(".abo_pay").click(function() {
+  console.log("pay...");
+  loadStripeLibrary();
+  counter = 0; 
+  charge_data = '';
+  abo_table = '<table class="table is-bordered is-fullwidth" >';
+  abo_table += '<tr><th class="is-2">Alias</th><th>verl&auml;ngern bis</th><th class="has-text-right">Betrag</th></tr>';
+  $(".waage").each(function( index ) {
+    console.log( index + ": " + $( this ).find(".alias").html() );
+    this_count = Number($( this ).find(".abo_add_years").html());
+    if (this_count > 0) {
+      counter += this_count;
+      paid_until = $( this ).find(".paid_until").html();
+      if (moment(paid_until,'DD.MM.YYYY') < moment()) {
+        this_date = moment().format('DD.MM.YYYY');
+      } else {
+        this_date = paid_until;
+      }
+      abo_table += '<tr><td>' + $( this ).find('.alias').html() + '</td><td>' + moment(this_date,'DD.MM.YYYY').add('years', this_count).format('DD.MM.YYYY') + '</td><td class="has-text-right">' + (this_count * 24).toFixed(2) + '</td></tr>';
+      if (charge_data == '') {
+        charge_data = $( this ).find("div").first().attr('id') + ":" + this_count;
+      } else {
+        charge_data += "," + $( this ).find("div").first().attr('id') + ":" + this_count;
+      }
+    }
+    console.log( counter );
+  });
+  abo_table += '<tr><td>Total CHF</td><td></td><td class="has-text-right">' + (counter * 24).toFixed(2) + '</td></tr>';
+  console.log("Counter: "+counter);
+  abo_table += "</table>";
+  if (counter > 0) {
+    console.log(abo_table);
+    console.log("charge_data: "+charge_data);
+    $("#abos_verlaengern").html(abo_table);
+    $("#charge_data").html(charge_data);
+    $("#cart").addClass("is-active");  
+  }
+});
+
+$("#modal-close").click(function() {
+   console.log("blabla");
+   $("#modal").removeClass("is-active");
+});
+
+$("#modal-save").click(function() {
+  var alarmactive = "0";
+  if ($('#checkbox').prop('checked')) {
+    alarmactive = "1";
+  }
+
+  // Validation Code
+  var is_valid = true;
+  if (!validate('alias',$('#alias').val())) {
+     $('#alias_errormsg').html('Ung&uuml;ltige Bezeichnung; erlaubte Zeichen A-Z, 0-9 und Leerschlag');
+     $("#alias").addClass("is-danger");  
+     $("#alias_exclamation").show();
+     is_valid = false;
+  } else {
+     $('#alias_errormsg').html('');
+     $("#alias").removeClass("is-danger");  
+     $("#alias_exclamation").hide();
+  }
+
+  if (!validate('smsnumber',$('#smsnumber').val())) {
+     $('#smsnumber_errormsg').html('Beispiel einer g&uuml;ltigen SMS Nummer: +41761234567');
+     $("#smsnumber").addClass("is-danger");  
+     $("#smsnumber_exclamation").show();
+     is_valid = false;
+  } else {
+     $('#smsnumber_errormsg').html('');
+     $("#smsnumber").removeClass("is-danger");  
+     $("#smsnumber_exclamation").hide();
+  }
+
+  if (!(is_valid)) {
+    return;
+  }
+
+  $.ajax({
+    url: "save_scale_settings",
+    type: "get", //send it through get method
+    dataType: "json",
+    data: { 
+      deveui: $('#deveui').html(), 
+      alias: $('#alias').val(),
+      smsnumber: $("#smsnumber").val(), 
+      alarmactive: alarmactive
+    },
+    success: function(response) {
+      console.log('save success');
+      if (response.rc == 0) {
+         $('#alias_'+$('#deveui').html()).html($('#alias').val());
+         var alarmactive = "0";
+         if ($('#checkbox').prop('checked')) {
+           alarmactive = "1";
+         }
+         $('#alarmactive_'+$('#deveui').html()).html(alarmactive);
+         $('#smsnumber_'+$('#deveui').html()).html($('#smsnumber').val());
+      }
+    },
+    error: function(xhr) {
+      console.log('save error');
+      //Do Something to handle error
+    }
+  });
+
+  console.log("save");
+  $("#modal").removeClass("is-active");
+});
+
+});
+
+function loadStripeLibrary() {
+    $.ajax({
+        url: "https://js.stripe.com/v3/",
+        dataType: "script",
+        async: false,           // <-- This is the key
+        success: function () {
+            // all good...
+            console.log("loadStripeLibrary called...");
+            SetupStripe();
+        },
+        error: function () {
+            throw new Error("Could not load script " + script);
+        }
+    });
+}
+
+function SetupStripe() {
+  console.log("SetupStripe");
+  // Set your publishable key: remember to change this to your live publishable key in production
+  // See your keys here: https://dashboard.stripe.com/account/apikeys
+  stripe = Stripe('pk_test_YkSGqH3Tk9WKK9HrlY63GhAg');
+  elements = stripe.elements({ locale: "de" });
+  
+  // Set up Stripe.js and Elements to use in checkout form
+  style = {
+    base: {
+      color: "#32325d",
+    }
+  };
+  
+  card = elements.create("card", { style: style });
+  card.mount("#card-element");
+  $("#card-errors-article").hide();
+  
+  card.addEventListener('change', ({error}) => {
+    if (error) {
+      $("#card-errors").text(error.message);
+      $("#card-errors-article").show();
+    } else {
+      $("#card-errors").text("");
+      $("#card-errors-article").hide();
+    }
+  });
+}
+
+function ConfirmPayment(clientSecret) {
+  stripe.confirmCardPayment(clientSecret, {
+    payment_method: {
+      card: card,
+      billing_details: {
+        name: '{{ .UserName }}'
+      }
+    }
+  }).then(function(result) {
+    if (result.error) {
+      // Show error to your customer (e.g., insufficient funds)
+      console.log(result.error.message);
+      $('#card-errors').text(result.error.message);
+      $('#card-errors-article').show();
+      //Do Something to handle error
+      EndPaymentProgress();
+    } else {
+      // The payment has been processed!
+      if (result.paymentIntent.status === 'succeeded') {
+        // Show a success message to your customer
+        // There's a risk of the customer closing the window before callback
+        // execution. Set up a webhook or plugin to listen for the
+        // payment_intent.succeeded event that handles any business critical
+        // post-payment actions.
+        console.log("Payment succeeded!!!");
+        $('#card-errors').text("");
+        $('#card-errors-article').hide();
+        $("#cart").removeClass("is-active");
+        EndPaymentProgress();
+        $('#payment_notifier').addClass('is-active');
+      }
+    }
+  });
+}
+
+function StartPaymentProgress() {
+  $("#cart-pay").attr("disabled", true).addClass("is-loading");
+  $("#cart-close").attr("disabled", true);
+}
+
+function EndPaymentProgress() {
+  $("#cart-pay").attr("disabled", false).removeClass("is-loading");
+  $("#cart-close").attr("disabled", false);
+}
+
+function PayMe() {
+  $.ajax({
+    url: "getstripepaymentintent",
+    type: "get", //send it through get method
+    dataType: "json",
+    data: { 
+      charge_data: $("#charge_data").html()
+    },
+    success: function(response) {
+      console.log('pay success');
+      console.log('rc: '+response.rc);
+      if (response.rc == 0) {
+        ConfirmPayment(response.stripeclientsecret);
+      }
+    },
+    error: function(xhr) {
+      console.log('getstripepaymentintent error');
+      //Do Something to handle error
+      EndPaymentProgress();
+    }
+  });
+}
+
+$('#cart-pay').on('click', function(ev) {
+  StartPaymentProgress();
+  PayMe();
+});
@@ -0,0 +1,70 @@
+      $(document).ready(function() {
+
+        $("#email").focus();
+
+        // Check for click events on the navbar burger icon
+        $(".navbar-burger").click(function() {
+          // Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
+          $(".navbar-burger").toggleClass("is-active");
+          $(".navbar-menu").toggleClass("is-active");
+
+        });
+
+        // Login Button
+        $("#login-button").click(function(e){
+          //alert(true);
+          $("#login-form").submit();
+        });
+
+        // Login Form
+        $("#login-form-blabla").submit(function(e){
+            e.preventDefault();
+            var formData = {
+              next: $("#email").val(),
+              email: $("#email").val(),
+              password: $("#password").val(),
+              csrf_token: $("#csrf_token").val(),
+              next: $("#next").val()
+            };
+
+            //console.log(formData);
+            // send ajax
+            $.ajax({
+                url: '/login', // url where to submit the request
+                type : "POST", // type of action POST || GET
+                dataType : 'json', // data type
+                contentType: 'application/json',
+                data : JSON.stringify(formData), // post data || get data
+                success : function(result) {
+                    // you can see the result from the console
+                    // tab of the developer tools
+                    console.log('SUCCESS');
+                    console.log(result);
+                    window.location.replace("/");
+                },
+                error: function(result) {
+                    //console.log(xhr, resp, text);
+                    console.log('ERROR');
+                    console.log(result);
+                    var errortext = '<ul style="list-style-type:disc">';
+                    a = result.responseJSON.response.errors.email;
+                    if (a != undefined) {
+                      for (i=0; i < a.length; ++i) {
+                        errortext = errortext + "<li>" + a[i] + "</li>";
+                      }
+                    } 
+                    a = result.responseJSON.response.errors.password;
+                    if (a != undefined) {
+                      for (i=0; i < a.length; ++i) {
+                        errortext = errortext + "<li>" + a[i] + "</li>";
+                      }
+                    } 
+                    errortext = errortext + "</ul>";
+                    $('#errorbox').html(errortext);
+                    $('#errorbox').show();
+                }
+            })
+        });
+
+
+      });
@@ -0,0 +1,84 @@
+.image.is-10by1 img, .image.is-20by3 img {
+   bottom: 0;
+   left: 0;
+   position: absolute;
+   right: 0;
+   top: 0;
+   height: 100%;
+   width: 100%;
+}
+
+.image.is-10by1 {
+   padding-top: 10%;
+}
+
+.image.is-20by3 {
+   padding-top: 15%;
+}
+
+hr {
+  margin: 0 0 15px 0;
+}
+
+.signup-box {
+  margin: auto;
+  width: 300px;
+  background: rgba(255,255,255,0.05);
+  border: 1px solid rgba(255,255,255,0.3);
+  border-radius: 10px;
+}
+
+.block-link {
+    text-decoration: none !important;
+}
+
+.apexcharts-title-text {
+  font-weight: 700 !important;
+  font-size: 24px !important;
+  font-family: "Rubik", sans-serif !important;
+}
+
+.apexcharts-legend {
+  font-family: "Rubik", sans-serif;
+}
+
+/**
+ * * The CSS shown here will not be introduced in the Quickstart guide, but
+ * * shows how you can use CSS to style your Element's container.
+ * */
+input,
+.StripeElement {
+  height: 40px;
+  padding: 10px 12px;
+
+  color: #32325d;
+  background-color: white;
+  border: 1px solid transparent;
+  border-radius: 4px;
+
+  box-shadow: 0 1px 3px 0 #e6ebf1;
+  -webkit-transition: box-shadow 150ms ease;
+  transition: box-shadow 150ms ease;
+}
+
+input:focus,
+.StripeElement--focus {
+  box-shadow: 0 1px 3px 0 #cfd7df;
+}
+
+.StripeElement--invalid {
+  border-color: #fa755a;
+}
+
+.StripeElement--webkit-autofill {
+  background-color: #fefde5 !important;
+}
+
+.checkboxes input {
+  vertical-align: middle;
+}
+
+.checkboxes label span {
+  vertical-align: middle;
+  margin-left: 5px;
+}