Merge pull request #970 from ciderapp/feature/aptest

Some casting fixes

src/renderer/less/helpers.less

@@ -70,10 +70,11 @@
 
 .spatialproperties-panel {
   .modal-window {
+    &:not(.airplay-modal){
     height    : 700px;
     max-height: 700px;
     width     : 800px;
-    max-width : 800px;
+    max-width : 800px;}
     overflow  : hidden;
 
     .info-header {

src/renderer/main/vueapp.js

@@ -207,6 +207,7 @@ const app = new Vue({
             showPlaylist: false,
             castMenu: false,
             moreInfo: false,
+            airplayPW: false,
         },
         socialBadges: {
             badgeMap: {},
@@ -3830,6 +3831,12 @@ const app = new Vue({
 
             // tracks are found in relationship.data
         },
+        setAirPlayCodeUI() {
+            this.modals.airplayPW = true
+        },
+        sendAirPlaySuccess(){
+            notyf.success('Device paired successfully!');
+        },
         windowFocus(val) {
             if (val) {
                 document.querySelectorAll(".animated-artwork-video").forEach(el => {

src/renderer/views/app/panels.ejs

@@ -28,6 +28,9 @@
 <transition name="modal">
     <castmenu v-if="modals.castMenu"></castmenu>
 </transition>
+<transition name="modal">
+    <airplay-modal v-if="modals.airplayPW"></airplay-modal>
+</transition>
 <transition name="modal">
     <plugin-menu v-if="modals.pluginMenu"></plugin-menu>
 </transition>

src/renderer/views/components/airplay-modal.ejs

@@ -0,0 +1,42 @@
+<script type="text/x-template" id="airplay-modal">
+<div class="spatialproperties-panel castmenu modal-fullscreen airplay-modal" @click.self="close()" @contextmenu.self="close()">
+    <div class="modal-window airplay-modal">
+        <div class="modal-header">
+            <div class="modal-title">{{'Enter password'}}</div>
+            <button class="close-btn" @click="close()"></button>
+        </div>
+    <div class="modal-content" style="overflow-y: overlay; padding: 3%">
+        <input type="text" v-model="passcode"/>
+    </div>
+    <div class="md-footer">
+        <div class="row">
+            <div class="col" >
+                <button style="width:100%" @click="enterPassword()" class="md-btn md-btn-block md-btn-primary">{{'OK'}}</button>
+            </div>
+        </div>
+    </div>
+</div>
+</div>
+</script>
+<script>
+    Vue.component('airplay-modal', {
+        template: '#airplay-modal',
+        data: function () {
+            return {
+                passcode: '',
+            }
+        },
+        mounted() {
+        },
+        methods: {
+            close() {
+                this.$root.modals.airplayPW = false
+            },
+            enterPassword() {
+                console.log('Entered passCode: ', this.passcode)
+                ipcRenderer.send("setAirPlayPasscode",this.passcode)
+                this.close()
+            }
+        }
+    });
+</script>