Commit 473fff79 authored by Joel Collins's avatar Joel Collins
Browse files

Implemented basic stream preview

parent 79f09406

src/App.vue

+7 −8
Original line number Diff line number Diff line 
<template>

  <div id="app">

    <div v-bind:class="responsiveToggleButton" id="overlay-toggle">

    <div id="overlay-toggle">

      <a href="" class="uk-icon-button" uk-icon="menu" uk-toggle="target: .toggle-hidden; animation: uk-animation-slide-left-small, uk-animation-slide-left-small" ></a>

    </div>

    <div uk-grid class="uk-height-1-1" margin=0>
@@ -11,7 +11,9 @@ 
        <panelLeft/>

      </div>

      <div class="uk-width-expand">

        <div class="uk-card uk-card-default uk-card-body uk-height-1-1">Width: {{ window.width }}</div>

        <div class="uk-card uk-card-default uk-card-body uk-height-1-1">

          <panelDisplay/>

        </div>

      </div>

    </div>

  </div>
@@ -28,13 +30,15 @@ UIkit.use(Icons); 


// Import components

import panelLeft from './components/panelLeft.vue'

import panelDisplay from './components/panelDisplay.vue'



// Export main app

export default {

  name: 'app',



  components: {

    panelLeft

    panelLeft,

    panelDisplay

  },



  data: function () {
@@ -69,11 +73,6 @@ export default { 
        //'uk-hidden': this.window.width<850,

        'overlay-panel': this.window.width<850

      }

    },

    responsiveToggleButton: function () {

      return {

        //'uk-hidden': this.window.width>=850,

      }

    }

  }

src/components/paneDisplayComponents/streamDisplay.vue

0 → 100644
+36 −0
Original line number Diff line number Diff line 
<template>

	<div class="streamDisplay">

		<div class="streamContainer" v-if="$store.state.connected">

			<img v-bind:src="streamImgUri" alt="Stream">

		</div>

	</div>

</template>



<script>

// Export main app

export default {

  name: 'streanmDisplay',



  computed: {

    // a computed getter

    streamImgUri: function () {

      // `this` points to the vm instance

      return this.$store.getters.uri + "/stream"

    }

  }



}

</script>



<style scoped lang="less">

	.streamContainer img {

		width: 100%;

		height: 100%;

		object-fit: contain

	}



	.streamContainer, .streamDisplay {

		width: 100%;

		height: 100%;

	}

</style>

src/components/panelDisplay.vue

0 → 100644
+27 −0
Original line number Diff line number Diff line 
<template>

  <div id="panelDisplay">

    <streamDisplay/>

  </div>

</template>



<script>

// Import components

import streamDisplay from './paneDisplayComponents/streamDisplay.vue'



// Export main app

export default {

  name: 'panelDisplay',



  components: {

    streamDisplay

  }



}

</script>



<style lang="less">

#panelDisplay {

	width: 100%;

	height: 100%;

}

</style>

src/components/paneConnectComponents/hostDisplay.vue

+16 −16

File changed.

Contains only whitespace changes.