- Table of Disciplines #101

- Insert Facebook bar to the Site #97

src/components/CFacebookFrame/CFacebookFrame.ts

@@ -0,0 +1,25 @@
+import Vue from 'vue'
+import { Component, Prop, Watch } from 'vue-property-decorator'
+import { tools } from '@src/store/Modules/tools'
+import { toolsext } from '@src/store/Modules/toolsext'
+
+import { date } from 'quasar'
+import { CalendarStore } from '../../store/Modules'
+import MixinBase from '../../mixins/mixin-base'
+
+@Component({
+  name: 'CFacebookFrame',
+  mixins: [MixinBase]
+})
+
+export default class CFacebookFrame extends Vue {
+  public $q
+  public $t
+  @Prop({ required: true }) public urlfbpage: string
+  @Prop({ required: true }) public title: string
+  @Prop({ required: false, default: '' }) public myclass: string
+
+  public geturlfbpageEncoded() {
+    return encodeURIComponent(this.urlfbpage)
+  }
+}

src/components/CFacebookFrame/CFacebookFrame.vue

@@ -0,0 +1,22 @@
+<template>
+    <div v-if="urlfbpage" :class="myclass">
+        <!--<div class="fb-page" :data-href="urlfbpage" data-tabs="timeline"-->
+        <!--data-width="" data-height="" data-small-header="false" data-adapt-container-width="true"-->
+        <!--data-hide-cover="false" data-show-facepile="true">-->
+        <!--<blockquote :cite="urlfbpage" class="fb-xfbml-parse-ignore"><a-->
+        <!--:href="urlfbpage">{{title}}</a>-->
+        <!--</blockquote>-->
+        <!--</div>-->
+
+        <iframe :src="`https://www.facebook.com/plugins/page.php?href=`+geturlfbpageEncoded()+`&tabs=timeline&width=340&height=500&small_header=false&adapt_container_width=true&hide_cover=false&show_facepile=true&appId=164292303671962`"
+                width="340" height="500" style="border:none;overflow:hidden" scrolling="no" frameborder="0"
+                allowTransparency="true" allow="encrypted-media"></iframe>
+    </div>
+</template>
+
+<script lang="ts" src="./CFacebookFrame.ts">
+</script>
+
+<style lang="scss" scoped>
+    @import './CFacebookFrame.scss';
+</style>

src/components/CFacebookFrame/index.ts

@@ -0,0 +1 @@
+export {default as CFacebookFrame} from './CFacebookFrame.vue'