Show mixed content warning

Fixes homieiot/homie-esp8266/issues/447
/cc @stritti

src/components/steps/Connection.vue

@@ -1,5 +1,11 @@
 <template>
   <p>
+  <span v-if="!isHttp">
+    <div class="notification is-warning" >
+      This site is served via secure TSL/SSL. Unfortunately this prevents your browser from detecting your device.
+      Please use the following link to setup your device: <br/> <a v-bind:href="httpUrl"> {{ httpUrl }}</a>
+    </div>
+  </span>
     Connect to your device Wi-Fi AP. It should be named something like <strong>Homie-123456abcdef</strong>.
     Note this configurator is only for Homie for ESP8266 v2. The v1 configurator is available <a href="https://github.com/marvinroger/homie-esp8266/releases/download/v1.5.0/homie-esp8266-v1-setup.zip">here</a>.
   </p>
@@ -13,14 +19,27 @@ export default {
   data () {
     return {
       requestOnGoing: false,
-      interval: null
+      interval: null,
+      isHttp: this.isHttp(),
+      httpUrl: this.getHttpUrl()
     }
   },
   mounted () {
     this.$emit('loading', 'Waiting for the device...')
     this.interval = setInterval(this.sendRequest, HEARTBEAT_ATTEMPT_INTERVAL)
+    this.isHttp = this.isHttp();
   },
   methods: {
+    isHttp: function() {
+      return window.location.protocol === 'http:';
+    },
+    getHttpUrl: function() {
+      var url = document.createElement('a');
+      url.href = window.location.href;
+      url.protocol = 'http:';
+      return url.href;
+    },
+
     sendRequest: function () {
       if (this.requestOnGoing) return