✨ Site > Add landing

site/src/components/landing/index.vue

@@ -0,0 +1,3 @@
+<template src="./template.html"></template>
+<script src="./script.js"></script>
+<style src="./style.styl" lang="stylus" scoped></style>

site/src/components/landing/quotes.js

@@ -0,0 +1,46 @@
+export default
+[
+    'Keep it simple!',
+    'Keep it maintainable!',
+    'Stick to one naming convention!',
+    'Get your code reviewed by someone else!',
+    'Get your code reviewed by someone better than you!',
+    'Consistency is key!',
+    'Simplicity is key!',
+    'Use the right tools!',
+    'Don\'t repeat yourself!',
+    'Better refacter sooner than later!',
+    'Did you test your code?',
+    'Watch talks!',
+    'Learn from people better than you!',
+    'Is your code readable?',
+    'The clearer your code, the fewer comments you need!',
+    'Update your dependencies!',
+    'Document your code!',
+    'Have clear instructions in your README.md!',
+    'Have your software tested by someone else!',
+    'Be consistent in your commit messages!',
+    'Don\'t invent new standards!',
+    'Choose a styleguide and stick to it!',
+    'CSS can be documented, too!',
+    'Don\'t reinvent the wheel!',
+    'Imagine coming back to your code after a year...',
+    'Document your code for your future self!',
+    'Ask questions!',
+    'Always improve.',
+    'Take a chance!',
+    'Stay focused!',
+    'Remove all distractions!',
+    'Make good use of your time!',
+    'Remember your goals!',
+    'Know your priorities!',
+
+    'Comment you code',
+    'Don\'t forget to save',
+    'Use versionning tools',
+    'Take time to set up an environment that suits you',
+    'Automates every redundant tasks',
+    'Do not forget to thank those who helped you',
+    'Choose the coding language that suits the project, not your current knowledge',
+    'Experiment!'
+]

site/src/components/landing/script.js

@@ -0,0 +1,12 @@
+import quotes from './quotes'
+
+export default
+{
+    name: 'landing',
+
+    computed:
+    {
+        quote: () => quotes[Math.floor(quotes.length * Math.random())],
+        url: () => window.location.href
+    }
+}

site/src/components/landing/style.styl

@@ -0,0 +1,7 @@
+.landing
+    position absolute
+    top 0
+    right 0
+    width 75%
+    height 100%
+    background rgba(0, 255, 0, 0.3)

site/src/components/landing/template.html

@@ -0,0 +1,14 @@
+<div class="landing">
+    <div class="title">
+        Welcome to keppler!
+    </div>
+    <div class="sub-title">
+        Here you can browse the presenter's code in real time.
+    </div>
+    <div class="quote">
+        "{{ quote }}"
+    </div>
+    <div class="url">
+        {{ url }}
+    </div>
+</div>

site/src/components/project/script.js

@@ -1,5 +1,6 @@
 import FilesTree from '@/components/files-tree'
 import File from '@/components/file'
+import Landing from '@/components/landing'
 import Chat from '@/components/chat'
 import Alert from '@/components/alert'
 
@@ -11,6 +12,7 @@ export default
     {
         FilesTree,
         File,
+        Landing,
         Chat,
         Alert
     },

site/src/components/project/template.html

@@ -3,6 +3,7 @@
 
     <files-tree></files-tree>
     <file v-if="file" :content="file.data"></file>
+    <landing v-if="!file"></landing>
     <chat></chat>
     <alert></alert>
 </div>