Zulko · agaengel · Oct 16, 2020 · Oct 19, 2020 · Mar 18, 2021 · Mar 18, 2021
diff --git a/.github/workflows/ionos-space.yml b/.github/workflows/ionos-space.yml
@@ -0,0 +1,38 @@
+name: IONOS.space
+
+on: [push]
+
+jobs:
+  ionos-space:
+    runs-on: ubuntu-latest
+    steps:
+      - name: checkout
+        uses: actions/checkout@v2
+        with:
+          submodules: 'recursive'
+      - name: Get Ionos Project data
+        uses: buildwith-ionos/[email protected]
+        id: project
+        with:
+          api-key: ${{ secrets.IONOS_API_KEY }}
+          project: 35346700-6a3c-43f8-a074-a5b21d21b737
+          service-host: api-eu.ionos.space
+      - name: Setup Node.js 12.16.x
+        uses: actions/setup-node@v1
+        with:
+          node-version: 12.16.x
+      - name: Prepare Project build environment
+        run: npm ci
+      - name: Build Node project
+        run: npm run build
+        env:
+          SITE_URL: ${{ steps.project.outputs.site-url }}
+          CI: true
+      - name: Deploy to IONOS
+        uses: buildwith-ionos/[email protected]
+        with:
+          api-key: ${{ secrets.IONOS_API_KEY }}
+          dist-folder: dist
+          service-host: api-eu.ionos.space
+          project: 35346700-6a3c-43f8-a074-a5b21d21b737
+          remote-host: ${{ steps.project.outputs.remote-host }}
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -11,26 +11,35 @@
   "scripts": {
     "dev": "vue-cli-service serve",
     "build": "vue-cli-service build",
-    "lint": "vue-cli-service lint"
+    "lint": "vue-cli-service lint",
+    "validate_prod": "npm run build; http-server dist"
   },
   "dependencies": {
-    "animate.css": "^3.7.0",
-    "chart.js": "2.5.0",
-    "eagle.js": "^0.4.1",
-    "highlight.js": "^9.12.0",
-    "vue": "^2.1.10",
-    "vue-router": "^2.2.0"
+    "animate.css": "^4.1.1",
+    "chart.js": "2.9.4",
+    "eagle.js": "^0.6.1",
+    "highlight.js": "^10.2.1",
+    "vue": "^2.6.12",
+    "vue-router": "^3.4.7"
   },
   "devDependencies": {
-    "@vue/cli-plugin-babel": "^3.0.4",
-    "@vue/cli-plugin-eslint": "^3.0.4",
-    "@vue/cli-service": "^3.0.4",
-    "@vue/eslint-config-standard": "^3.0.4",
-    "node-sass": "^4.9.3",
-    "pug": "^2.0.3",
+    "@vue/cli-plugin-babel": "^4.5.8",
+    "@vue/cli-plugin-eslint": "^4.5.8",
+    "@vue/cli-service": "^4.5.8",
+    "@vue/eslint-config-standard": "^5.1.2",
+    "babel-eslint": "^10.1.0",
+    "eslint": "^7.11.0",
+    "eslint-plugin-import": "^2.22.1",
+    "eslint-plugin-node": "^11.1.0",
+    "eslint-plugin-promise": "^4.2.1",
+    "eslint-plugin-standard": "^4.0.1",
+    "eslint-plugin-vue": "^7.1.0",
+    "http-server": "^0.12.3",
+    "node-sass": "^4.14.1",
+    "pug": "^3.0.0",
     "pug-plain-loader": "^1.0.0",
-    "sass-loader": "^7.1.0",
-    "vue-template-compiler": "^2.5.17"
+    "sass-loader": "^10.0.3",
+    "vue-template-compiler": "^2.6.12"
   },
   "engines": {
     "node": ">= 4.0.0",

diff --git a/public/index.html b/public/index.html
@@ -3,7 +3,6 @@
   <head>
     <meta charset="utf-8">
     <link rel="shortcut icon" type="image/png" href="./static/favicon.png">
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
     <title>Eagle.js</title>
   </head>
   <body>

diff --git a/src/Home.vue b/src/Home.vue
@@ -24,7 +24,8 @@
           .embedded-slideshow-container
             component(:is="slideshow", :embedded='true',
                       :keyboardNavigation='false',
-                      :mouseNavigation='false')
+                      :mouseNavigation='false',
+                      )
         .caption
           h3 {{slideshow.infos.title}}
           p.thumbnail-description {{slideshow.infos.description}}
@@ -36,7 +37,9 @@ import slideshows from './slideshows/slideshows.js'
 export default {
   data: function () {
     return {
-      slideshows: slideshows.list
+      slideshows: slideshows.list,
+      childWindow: null,
+      parentWindow: null
     }
   },
   mounted: function () {

diff --git a/src/main.js b/src/main.js
@@ -3,9 +3,9 @@ import Router from 'vue-router'
 import App from './App'
 import Home from './Home'
 
-import Eagle, { Options } from 'eagle.js'
-import 'eagle.js/dist/eagle.css'
+import Eagle, { Options, Presenter, CodeBlock, CodeComment, Toggle, RadioButton, Timer, TriggeredMessage, Modal, ImageSlide } from 'eagle.js'
 import hljs from 'highlight.js'
+import 'animate.css/animate.compat.css'
 
 import slideshows from './slideshows/slideshows.js'
 /* eslint-disable no-new */
@@ -14,8 +14,17 @@ Vue.use(Eagle)
 Vue.use(Router)
 Vue.config.productionTip = false
 Options.hljs = hljs
+Eagle.use(Presenter)
+Eagle.use(CodeBlock)
+Eagle.use(CodeComment)
+Eagle.use(Toggle)
+Eagle.use(RadioButton)
+Eagle.use(Timer)
+Eagle.use(TriggeredMessage)
+Eagle.use(Modal)
+Eagle.use(ImageSlide)
 
-let routes = []
+const routes = []
 slideshows.list.forEach(function (slideshow) {
   routes.push({
     path: '/' + slideshow.infos.path,
@@ -24,7 +33,7 @@ slideshows.list.forEach(function (slideshow) {
 })
 routes.push({ path: '*', component: Home })
 
-let router = new Router({
+const router = new Router({
   routes
 })
 

diff --git a/src/slideshows/eagle-recipes/DemoSlideshow.vue b/src/slideshows/eagle-recipes/DemoSlideshow.vue
@@ -74,10 +74,10 @@
 </template>
 
 <script>
-import eagle from 'eagle.js'
+import { Slideshow } from 'eagle.js'
 
 export default {
-  mixins: [eagle.slideshow],
+  mixins: [Slideshow],
   infos: {
     title: 'Demo recipes',
     description: 'Demos for Eagle recipes',

diff --git a/src/slideshows/eagle-recipes/EagleRecipes.vue b/src/slideshows/eagle-recipes/EagleRecipes.vue
@@ -44,9 +44,9 @@
           The &lt;script&gt; tag loads Eagle and specifies options:
         eg-code-block(lang='html').
           &lt;script&gt;
-          import eagle from 'eagle.js'
+          import  { Slideshow } from 'eagle.js'
           export default {
-            mixins: [ eagle.slideshow ],
+            mixins: [Slideshow],
             infos: {
               title: 'Your First Slideshow',
               description: 'A boilerplate to get you started',
@@ -198,19 +198,19 @@
 </template>
 
 <script>
-import eagle from 'eagle.js'
+import { Slideshow, Slide } from 'eagle.js'
 import DemoSlideshow from './DemoSlideshow'
 
 var TransitionedSlide = {
-  mixins: [eagle.slide],
+  mixins: [Slide],
   props: {
     enter: { default: 'slideInRight' },
     leave: { default: 'slideOutLeft' }
   }
 }
 
 export default {
-  mixins: [eagle.slideshow],
+  mixins: [Slideshow],
   data: function () {
     return {
       fullPageWidth: null,

diff --git a/src/slideshows/first-slideshow/FirstSlideshow.vue b/src/slideshows/first-slideshow/FirstSlideshow.vue
@@ -18,9 +18,9 @@
 </template>
 
 <script>
-import eagle from 'eagle.js'
+import { Slideshow } from 'eagle.js'
 export default {
-  mixins: [ eagle.slideshow ],
+  mixins: [Slideshow],
   infos: {
     // These infos appear on the home page, below the slideshow's thumbnail
     title: 'Your First Slideshow',

diff --git a/src/slideshows/introducing-eagle/AwesomeEmbeddedSlideshow.vue b/src/slideshows/introducing-eagle/AwesomeEmbeddedSlideshow.vue
@@ -39,12 +39,14 @@
 </template>
 
 <script>
-import eagle from 'eagle.js'
+import { Slideshow } from 'eagle.js'
 import ExampleImageSlideshow from './ExampleImageSlideshow'
 
 export default {
-  mixins: [eagle.slideshow],
+  mixins: [Slideshow],
   props: {
+    childWindow: null,
+    parentWindow: null,
     preference: { default: 'baby bunnies' },
     username: { default: 'Tracy' }
   },

diff --git a/src/slideshows/introducing-eagle/AwesomeInsertedSlide.vue b/src/slideshows/introducing-eagle/AwesomeInsertedSlide.vue
@@ -50,7 +50,7 @@ eg-transition(:enter='enter', :leave='leave')
 
 <script>
 import AwesomeEmbeddedSlideshow from './AwesomeEmbeddedSlideshow'
-import eagle from 'eagle.js'
+import { Slide } from 'eagle.js'
 export default {
   props: {
     steps: { default: 14 },
@@ -60,7 +60,7 @@ export default {
   components: {
     'awesome-embedded-slideshow': AwesomeEmbeddedSlideshow
   },
-  mixins: [eagle.slide]
+  mixins: [Slide]
 }
 </script>
 <style lang='scss' scoped>

diff --git a/src/slideshows/introducing-eagle/ExampleImageSlideshow.vue b/src/slideshows/introducing-eagle/ExampleImageSlideshow.vue
@@ -5,10 +5,10 @@
 </template>
 
 <script>
-import eagle from 'eagle.js'
+import { Slideshow } from 'eagle.js'
 
 export default {
-  mixins: [eagle.slideshow],
+  mixins: [Slideshow],
   props: {
     preference: { default: 'funny kitties' }
   },

diff --git a/src/slideshows/introducing-eagle/FiguresSlide.vue b/src/slideshows/introducing-eagle/FiguresSlide.vue
@@ -22,7 +22,7 @@ eg-transition(:enter='enter', :leave='leave')
                   :height='250')
 </template>
 <script>
-import eagle from 'eagle.js'
+import { Slide } from 'eagle.js'
 import chart from './Chart'
 export default {
   components: { chart },
@@ -104,7 +104,7 @@ export default {
       }
     }
   },
-  mixins: [eagle.slide]
+  mixins: [Slide]
 }
 </script>
 <style lang='scss' scoped>

diff --git a/src/slideshows/introducing-eagle/IntroducingEagle.vue b/src/slideshows/introducing-eagle/IntroducingEagle.vue
@@ -217,10 +217,10 @@
 </template>
 
 <script>
-import eagle from 'eagle.js'
+import { Slideshow } from 'eagle.js'
 
 export default {
-  mixins: [eagle.slideshow],
+  mixins: [Slideshow],
   infos: {
     title: 'Introducing Eagle.js',
     description: 'Watch this first if you are new to Eagle.js',
@@ -234,6 +234,8 @@ export default {
   },
   data: function () {
     return {
+      childWindow: null,
+      parentWindow: null,
       username: 'Tracy',
       preference: 'baby bunnies',
       preferences: [
@@ -282,9 +284,9 @@ export default {
         'baby bunnies': 'Yeeeeah my favorite too !',
         'fluffy puppies': 'Wow so original.',
         'funny kitties': 'Good for you ' + this.username + '.',
-        'Theming': 'Ok ' + this.username + ', whatever.',
+        Theming: 'Ok ' + this.username + ', whatever.',
         'Slide reuse': 'Seriously ' + this.username + ' you <em>want</em> to see this.',
-        'Interactivity': 'Well that\'s this slide, ' + this.username +
+        Interactivity: 'Well that\'s this slide, ' + this.username +
                          '. <br /> A bit too late to unsee it, heh ?'
       }[name]
     }

diff --git a/src/slideshows/introducing-eagle/components/EndCredits.vue b/src/slideshows/introducing-eagle/components/EndCredits.vue
@@ -21,7 +21,7 @@ export default {
   data: function () {
     return {
       categories: {
-        'Crew': [
+        Crew: [
           {
             name: this.username,
             role: 'Internet Person'
@@ -39,7 +39,7 @@ export default {
             role: 'Author'
           }
         ],
-        'Software': [
+        Software: [
           {
             name: 'Vue.js',
             role: 'Front-end engine'
@@ -65,7 +65,7 @@ export default {
             role: '(Bad) highlighting'
           }
         ],
-        'Assets': [
+        Assets: [
           {
             name: 'Irfan iLias',
             role: 'Background Pattern'

diff --git a/src/slideshows/themes-slideshow/ThemesSlideshow.vue b/src/slideshows/themes-slideshow/ThemesSlideshow.vue
@@ -42,9 +42,9 @@
         h3 Your bad taste is the limit
 </template>
 <script>
-import eagle from 'eagle.js'
+import { Slideshow } from 'eagle.js'
 export default {
-  mixins: [eagle.slideshow],
+  mixins: [Slideshow],
   infos: {
     title: 'Themes Slideshows',
     description: 'You can change everything !',

diff --git a/test b/test
@@ -0,0 +1,4 @@
+twesed
+dfsdf
+sdfsdf
+sdfsdf
diff --git a/vue.config.js b/vue.config.js
@@ -1,4 +1,12 @@
 module.exports = {
   lintOnSave: 'error',
   // runtimeCompiler: process.env.NODE_ENV !== 'production'
+  chainWebpack: config => {
+    config.module
+      .rule('vue')
+      .use('vue-loader')
+      .tap(args => {
+        args.compilerOptions.whitespace = 'preserve'
+      })
+  }
 }
-Original file line number
+Diff line change
@@ -0,0 +1,4 @@
+    twesed
+    dfsdf
+    sdfsdf
+    sdfsdf