Add projects feature

index.html

@@ -8,6 +8,7 @@
     <title>TeamFND</title>
   </head>
   <body>
+    <noscript>This website requires JavaScript.</noscript>
     <div id="app"></div>
     <!-- built files will be auto injected -->
   </body>

package.json

@@ -11,16 +11,19 @@
   },
   "dependencies": {
     "@kazupon/vue-i18n-loader": "^0.2.1",
+    "axios": "^0.18.0",
     "bootstrap": "^4.0.0-beta.2",
     "bootstrap-vue": "latest",
     "coffeescript": "^2.2.2",
     "coffeescript-loader": "0.0.11",
-    "node-sass": "^4.7.2",
+    "node-sass": "^4.9.3",
     "popper.js": "^1.12.9",
     "pug": "^2.0.0-rc.4",
     "sass-loader": "^6.0.6",
     "vue": "^2.5.2",
     "vue-i18n": "^7.4.2",
+    "vue-markdown": "^2.2.4",
+    "vue-meta": "^1.5.2",
     "vue-recaptcha": "^1.1.0",
     "vue-router": "^3.0.1",
     "yaml-loader": "^0.5.0"
@@ -45,18 +48,18 @@
     "friendly-errors-webpack-plugin": "^1.1.3",
     "html-webpack-plugin": "^2.28.0",
     "http-proxy-middleware": "^0.17.3",
-    "webpack-bundle-analyzer": "^2.2.1",
-    "semver": "^5.3.0",
-    "shelljs": "^0.7.6",
     "opn": "^5.1.0",
     "optimize-css-assets-webpack-plugin": "^2.0.0",
     "ora": "^1.2.0",
     "rimraf": "^2.6.0",
-    "url-loader": "^0.5.8",
+    "semver": "^5.3.0",
+    "shelljs": "^0.7.6",
+    "url-loader": "^1.0.1",
     "vue-loader": "^13.0.4",
     "vue-style-loader": "^3.0.1",
     "vue-template-compiler": "^2.4.2",
     "webpack": "^2.6.1",
+    "webpack-bundle-analyzer": "^2.2.1",
     "webpack-dev-middleware": "^1.10.0",
     "webpack-hot-middleware": "^2.18.0",
     "webpack-merge": "^4.1.0"

src/App.vue

@@ -9,39 +9,6 @@
           b-nav-item(:to="{name:'About'}") {{$t('about_us')}}
         b-navbar-nav(class="ml-auto")
           b-nav-item(@click="modalShow = !modalShow") {{$t('contact_us')}}
-          b-modal(id="contactus" hide-footer :title="$t('contact_us')" v-model="modalShow")
-            b-form(action="/contact.php" method="post")
-              b-form-group(id="EmailInputGroup"
-                            :label="$t('email_address')"
-                            label-for="EmailInput"
-                            :description="$t('email_disclaimer')")
-                b-form-input(id="EmailInput"
-                              type="email"
-                              v-model="form.email"
-                              name="email"
-                              required
-                              :placeholder="$t('email_placeholder')")
-              b-form-group(id="NameInputGroup"
-                            :label="$t('your_name')"
-                            label-for="NameInput")
-                b-form-input(id="NameInput"
-                              type="text"
-                              v-model="form.name"
-                              name="name"
-                              required
-                              :placeholder="$t('name_placeholder')")
-              b-form-group(id="TextInputGroup"
-                            :label="$t('your_message')"
-                            label-for="TextInput")
-                b-form-textarea(id="TextInput"
-                                v-model="form.text"
-                                name="body"
-                                required
-                                placeholder=""
-                                :rows="3")
-              vue-recaptcha(:sitekey="sitekey" @verify="captchaPass" @expired="captchaFailed")
-              p
-              b-button(type="submit" variant="primary" :disabled="!allowsend") {{$t('submit')}}
           b-nav-form
             label(for="locale" style="margin: 5px") {{$t('language')}}:
             b-form-select(v-model="locale")
@@ -53,6 +20,39 @@
       hr
       footer
         p &copy; 2018 TeamFND <a href="mailto:info@teamfnd.ru">info@teamfnd.ru</a>
+      b-modal(id="contactus" hide-footer :title="$t('contact_us')" v-model="modalShow")
+         b-form(action="/contact.php" method="post")
+          b-form-group(id="EmailInputGroup"
+                            :label="$t('email_address')"
+                            label-for="EmailInput"
+                            :description="$t('email_disclaimer')")
+            b-form-input(id="EmailInput"
+                              type="email"
+                              v-model="form.email"
+                              name="email"
+                              required
+                              :placeholder="$t('email_placeholder')")
+          b-form-group(id="NameInputGroup"
+                            :label="$t('your_name')"
+                            label-for="NameInput")
+            b-form-input(id="NameInput"
+                              type="text"
+                              v-model="form.name"
+                              name="name"
+                              required
+                              :placeholder="$t('name_placeholder')")
+          b-form-group(id="TextInputGroup"
+                            :label="$t('your_message')"
+                            label-for="TextInput")
+            b-form-textarea(id="TextInput"
+                                v-model="form.text"
+                                name="body"
+                                required
+                                placeholder=""
+                                :rows="3")
+          vue-recaptcha(:sitekey="sitekey" @verify="captchaPass" @expired="captchaFailed")
+          p
+          b-button(type="submit" variant="primary" :disabled="!allowsend") {{$t('submit')}}
 </template>
 
 <script lang="coffeescript">
@@ -80,6 +80,11 @@ export default
     captchaFailed: () ->
       @allowsend = false
   components: { VueRecaptcha }
+  metaInfo: () ->
+    title: 'App'
+    titleTemplate: '%s - TeamFND'
+    htmlAttrs:
+      lang: this.$root.$i18n.locale
 </script>
 
 <i18n src='@/translations/App.yaml'></i18n>

src/components/About.vue

@@ -18,12 +18,14 @@
               li E-mail: vlad@teamfnd.ru
               li Telegram: @viad00
               li VK: <a href="https://vk.com/viad2">vk.com/viad2</a>
-              li Jabber: vlad@teamfnd.ru
+              //li Jabber: vlad@teamfnd.ru
 </template>
 
 <script lang="coffeescript">
 export default
   name: "about"
+  metaInfo:
+    title: 'About Us'
 </script>
 
 <i18n src='@/translations/About.yaml'></i18n>

src/components/Home.vue

@@ -7,6 +7,8 @@
 <script lang="coffeescript">
 export default
   name: 'home'
+  metaInfo:
+    title: 'Landing'
 </script>
 
 <i18n src='@/translations/Home.yaml'></i18n>

src/components/Projects.vue

@@ -5,18 +5,18 @@
         b-col(sm="12" md="12" lg="6" xl="6")
           b-card(title="Fasm4Delphi" class="mb-3")
             p(class="card-text") {{$t('fasm4delphi_description')}}
-            b-button(href="http://fasm4delphi.teamfnd.ru" target="_blank") {{$t('project_site')}}
-            span http://fasm4delphi.teamfnd.ru
+            b-button(:to="{name:'View Project', params: {project_name: 'fasm4delphi'}}") {{$t('project_site')}}
+            //span https://teamfnd.ru/#/viewproject/fasm4delphi
         b-col(sm="12" md="12" lg="6" xl="6")
-          b-card(title="TeamFND")
+          b-card(title="TeamFND" class="mb-3")
             p(class="card-text") {{$t('teamfind_description')}}
             b-button(href="https://find.teamfnd.ru" target="_blank") {{$t('project_site')}}
             span https://find.teamfnd.ru
         b-col(sm="12" md="12" lg="6" xl="6")
           b-card(title="FasmOnDelphi" class="mb-3")
             p(class="card-text") {{$t('fasmondelphi_description')}}
-            b-button(href="http://fasmondelphi.teamfnd.ru" target="_blank") {{$t('project_site')}}
-            span http://fasmondelphi.teamfnd.ru
+            b-button(:to="{name:'View Project', params: {project_name: 'fasmondelphi'}}") {{$t('project_site')}}
+            //span https://teamfnd.ru/#/viewproject/fasmondelphi
       //
         b-col(sm="12" md="12" lg="6" xl="6")
           b-card(title="Name")
@@ -27,6 +27,8 @@
 <script lang="coffeescript">
 export default
   name: "projects"
+  metaInfo:
+    title: 'Our projects'
 </script>
 
 <i18n src='@/translations/Projects.yaml'></i18n>
@@ -35,4 +37,5 @@ export default
   span
     margin-left: 20px
     color: #b0b0b0
+    overflow: auto
 </style>

src/components/VIewDocumentation.vue

@@ -0,0 +1,43 @@
+<template lang="pug">
+  #viewdoccontainer
+    #viewdoc_head
+      router-link(:to="{name:'View Project', params: {project_name: $route.params.project_name}}") {{ $t('app_name_' + this.$route.params.project_name) }}
+    #viewdoc
+      vue-markdown(:source="this.markdown_data")
+</template>
+
+<script lang="coffeescript">
+import VueMarkdown from 'vue-markdown'
+import Axios from 'axios'
+export default
+  name: "viewdoc"
+  data: () ->
+    markdown_data: 'Please wait...'
+  metaInfo: () ->
+    title: this.$t('app_name_' + this.$route.params.project_name) + ' Documentation'
+  components: { VueMarkdown }
+  methods: 
+    getMarkdown: () ->
+      Axios.get('https://raw.githubusercontent.com/' + @$t('github_link_' + this.$route.params.project_name) + '/master/DOC_' + this.$root.$i18n.locale.toUpperCase() + '.MD')
+        .then((response) => (this.markdown_data = response.data))
+        .catch((error) => (this.markdown_data = 'Sorry, but there was an error while loading documentation: </br></br>' + error.message))
+  created: () ->
+    this.getMarkdown()
+  watch:
+    '$root.$i18n.locale': (val, oldVal) ->
+      this.markdown_data = 'Locale changed, please wait...'
+      this.getMarkdown()
+</script>
+
+<i18n src='@/translations/ViewProject.yaml'></i18n>
+
+<style scoped lang="sass">
+#viewdoc
+    padding: 5px
+    max-width: 800px
+    margin: auto
+    overflow: auto
+#viewdoc_head
+    text-align: center
+    font-size: 40px
+</style>

src/components/ViewProject.vue

@@ -0,0 +1,64 @@
+<template lang="html">
+<div class="viewproject">
+<h1>{{ $t('app_name_' + this.$route.params.project_name) }}</h1>
+<hr />
+<div class="main">
+    <h2>{{ $t('description_word') }}</h2>
+    {{ $t('main_' + this.$route.params.project_name) }}
+    <h2>{{ $t('download_word') }}</h2>
+    <ul>
+    <li><a :href="'https://github.com/'+$t('github_link_' + this.$route.params.project_name)+'/archive/master.zip'">{{ $t('latest_version') }}</a></li>
+    </ul>
+    <h2>{{ $t('documentation') }}</h2>
+    <ul>
+    <li><router-link :to="{name:'ViewDoc', params: {project_name: $route.params.project_name}}">{{ $t('read_online') }}</router-link></li>
+    <li><a :href="'https://github.com/'+$t('github_link_' + this.$route.params.project_name)+'/blob/master/DOC_'+this.$root.$i18n.locale.toUpperCase()+'.MD'">{{ $t('view_on_github') }}</a></li>
+    </ul>
+    <h2>GitHub</h2>
+    <ul>
+    <li>GitHub Link: <a :href="'https://github.com/' + $t('github_link_' + this.$route.params.project_name)" target="_blank">https://github.com/{{$t('github_link_' + this.$route.params.project_name)}}</a> or</li>
+    </ul>
+    <b-form-input type="text" disabled :value="'git clone https://github.com/' + $t('github_link_' + this.$route.params.project_name) + '.git'"></b-form-input>
+    <h2>{{ $t('donate') }}:</h2>
+    <div style="overflow:auto">
+    <iframe src="https://money.yandex.ru/quickpay/shop-widget?writer=seller&targets=%D0%9D%D0%B0%20%D1%80%D0%B0%D0%B7%D0%B2%D0%B8%D1%82%D0%B8%D0%B5%20%D1%8D%D1%82%D0%BE%D0%B3%D0%BE%20%D0%B8%20%D0%B4%D1%80%D1%83%D0%B3%D0%B8%D1%85%20%D0%BF%D1%80%D0%BE%D0%B5%D0%BA%D1%82%D0%BE%D0%B2&targets-hint=&default-sum=30&button-text=14&payment-type-choice=on&hint=&successURL=fasm4delphi.teamfnd.ru&quickpay=shop&account=410014959153552" width="450" height="213" frameborder="0" allowtransparency="true" scrolling="no"></iframe>
+    </div>
+</div>
+</div>
+</template>
+
+<script lang="coffeescript">
+export default
+  name: "viewproject"
+  metaInfo: () ->
+    title: this.$t('app_name_' + this.$route.params.project_name)
+    meta: [
+      { vmid: 'description', name: 'description', content: this.$t('description_' + this.$route.params.project_name) }
+      { vmid: 'keywords', name: 'keywords', content: this.$t('keywords_' + this.$route.params.project_name) }
+    ]
+</script>
+
+<i18n src='@/translations/ViewProject.yaml'></i18n>
+
+<style scoped lang="css">
+        .viewproject {
+            padding: 5px;
+            color: black;
+            max-width: 800px;
+            margin: auto;
+            text-align: center;
+        }
+        .main {
+            text-align: left;
+        }
+        .lang-span {
+            text-align: right;
+        }
+        .error {
+            color: red;
+            font-family: monospace;
+        }
+        h2 {
+          padding: 5px;
+        }
+</style>

src/main.js

@@ -36,16 +36,6 @@ const i18n = new VueI18n({
   fallbackLocale: 'en', // fallbackLocale
 })
 
-const PAGE_TITLE = {
-    "Home": "Landing",
-    "About": "About Us",
-    "Projects": "Our projects"
-}
-
-router.afterEach((toRoute, fromRoute) => {
-    window.document.title = PAGE_TITLE[toRoute.name] + ' - TeamFND'
-})
-
 /* eslint-disable no-new */
 new Vue({
   el: '#app',

src/router/index.js

@@ -1,10 +1,14 @@
 import Vue from 'vue'
 import Router from 'vue-router'
+import Meta from 'vue-meta'
 import Home from '@/components/Home'
 import Projects from '@/components/Projects'
 import About from '@/components/About'
+import ViewProject from '@/components/ViewProject'
+import ViewDocumentation from '@/components/ViewDocumentation'
 
 Vue.use(Router)
+Vue.use(Meta)
 
 export default new Router({
   routes: [
@@ -22,6 +26,16 @@ export default new Router({
       path: '/about',
       name: 'About',
       component: About
+    },
+    {
+      path: '/viewproject/:project_name',
+      name: 'View Project',
+      component: ViewProject
+    },
+    {
+      path: '/viewdoc/:project_name',
+      name: 'ViewDoc',
+      component: ViewDocumentation
     }
   ]
 })

src/translations/ViewProject.yaml

@@ -0,0 +1,69 @@
+en:
+  description_word: "About:"
+  download_word: "Download:"
+  download: "Links for nightly versions provided below"
+  donate: "Donate"
+  documentation: "Documentation"
+  latest_version: "Latest version"
+  all_downloads: "All downloads"
+  auto: "Auto"
+  read_online: "Read online"
+  view_on_github: "View on GitHub"
+
+  app_name_fasm4delphi: "Fasm4Delphi"
+  description_fasm4delphi: "A simple library for compiling FASM assembly code to Delphi and FreePascal"
+  main_fasm4delphi: "A simple FASM library bindings for Delphi. FreePascal compatibility."
+  keywords_fasm4delphi: "FASM Delphi FPC FreePascal library Fasm4Delphi"
+  github_link_fasm4delphi: "TeamFND/Fasm4Delphi"
+
+  app_name_sample: "Sample Project"
+  description_sample: "Sample Project description"
+  main_sample: "Sample Project main text description"
+  keywords_sample: "Sample Project keywords"
+  github_link_sample: "TeamFND"
+
+  app_name_fasmondelphi: "FasmOnDelphi"
+  description_fasmondelphi: "A simple library for using FASM assembly code on Delphi and FreePascal"
+  keywords_fasmondelphi: "FASM Delphi FPC FreePascal library FasmOnDelphi"
+  main_fasmondelphi: "A library for using in Delphi FlatAssembler, in contrast to Fasm4Delphi not depend on operating system and bit type. Connects to the compiler from the command line. Win32 can connect to fasm.dll via Fasm4Delphi. Also, its Api is easier to use."
+  github_link_fasmondelphi: "TeamFND/FasmOnDelphi"
+
+ru:
+  description_word: "Описание:"
+  download_word: "Загрузки:"
+  download: "Ссылки на снапшоты исходного кода"
+  donate: "Донат"
+  documentation: "Документация"
+  latest_version: "Последняя версия"
+  all_downloads: "Все загрузки"
+  auto: "Автоматически"
+
+  main_fasm4delphi: "Библиотека, реализующая биндинги flat ассемблера для Delphi. Совместима с FreePascal"
+  app_name_fasm4delphi: "Fasm4Delphi"
+  description_fasm4delphi: "Библиотека FASM ассемблер для Delphi и FreePascal"
+  keywords_fasm4delphi: "FASM Delphi FPC FreePascal library Fasm4Delphi"
+
+  app_name_fasmondelphi: "FasmOnDelphi"
+  description_fasmondelphi: "Библиотека FASM ассемблер для Delphi и FreePascal"
+  keywords_fasmondelphi: "FASM Delphi FPC FreePascal library Fasm4Delphi"
+  main_fasmondelphi: "Библиотека для использования Flat Assembler на Delphi, в отличии от Fasm4Delphi не зависит от оперционной системы и её разрядности. Подключается к компилятору из командной строки. В win32 может подключить fasm.dll через Fasm4Delphi. Также её Api проще в использовании."
+
+jp:
+  description_word: "説明:"
+  download_word: "ダウンロード:"
+  download: "ソースのリンク:"
+  donate: "Donate"
+  documentation: "ヘルプ"
+  latest_version: "最新版"
+  all_downloads: "すべてのダウンロード"
+  auto: "オート"
+
+  app_name_fasm4delphi: "Fasm4Delphi"
+  description_fasm4delphi: "DelphiのFASMのライブラリ"
+  keywords_fasm4delphi: "FASM assembler Delphi FPC FreePascal library Fasm4Delphi"
+  main_fasm4delphi: "このライブラリはアセンブラのヘッダーです。 FreePascalの互換性てす。"
+
+  app_name_fasmondelphi: "FasmOnDelphi"
+  description_fasmondelphi: "DelphiのFASMのライブラリ"
+  keywords_fasmondelphi: "FASM, Delphi, FASM library for Delphi, Fasm4Delphi, FASM library for FPC, FASM library for FreePascal"
+  main_fasmondelphi: "このライブラリはアセンブラのヘッダーです。 FreePascalの互換性てす。"