- new landing page first draft

app/Http/Controllers/Frontend/PagesController.php

@@ -52,6 +52,8 @@ class PagesController extends Controller
         // ->orderBy('link_documents_persons.sort_order', 'desc')
         // ->get();
 
-        return view('frontend.dataset.show', compact('dataset', 'authors', 'contributors', 'submitters'));
+        // return view('frontend.dataset.show', compact('dataset', 'authors', 'contributors', 'submitters'));
+
+        return view('frontend.dataset.show', compact('id'));
     }
 }

composer.lock

@@ -1054,25 +1054,25 @@
         },
         {
             "name": "mcamara/laravel-localization",
-            "version": "1.4.8",
+            "version": "1.5.0",
             "source": {
                 "type": "git",
                 "url": "https://github.com/mcamara/laravel-localization.git",
-                "reference": "046a3d48286a41b4f6656c6c5606450e6bf657b6"
+                "reference": "13a51715f8e066b0bfb637fd9065d7496c3579ec"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/mcamara/laravel-localization/zipball/046a3d48286a41b4f6656c6c5606450e6bf657b6",
+                "url": "https://api.github.com/repos/mcamara/laravel-localization/zipball/13a51715f8e066b0bfb637fd9065d7496c3579ec",
-                "reference": "046a3d48286a41b4f6656c6c5606450e6bf657b6",
+                "reference": "13a51715f8e066b0bfb637fd9065d7496c3579ec",
                 "shasum": ""
             },
             "require": {
-                "laravel/framework": "~5.2.0||~5.3.0||~5.4.0||~5.5.0||~5.6.0||~5.7.0||~5.8.0||^6.0",
+                "laravel/framework": "~5.2.0||~5.3.0||~5.4.0||~5.5.0||~5.6.0||~5.7.0||~5.8.0||^6.0||^7.0",
                 "php": ">=7.1.0"
             },
             "require-dev": {
                 "orchestra/testbench-browser-kit": "~3.4|~3.8|~4.0",
-                "phpunit/phpunit": "6.0.*|8.0.*"
+                "phpunit/phpunit": "6.0.*|^8.0"
             },
             "suggest": {
                 "ext-intl": "*"
@@ -1112,7 +1112,7 @@
                 "localization",
                 "php"
             ],
-            "time": "2020-01-03T16:27:15+00:00"
+            "time": "2020-03-05T15:19:05+00:00"
         },
         {
             "name": "monolog/monolog",
@@ -3934,16 +3934,16 @@
         },
         {
             "name": "phpspec/prophecy",
-            "version": "v1.10.2",
+            "version": "v1.10.3",
             "source": {
                 "type": "git",
                 "url": "https://github.com/phpspec/prophecy.git",
-                "reference": "b4400efc9d206e83138e2bb97ed7f5b14b831cd9"
+                "reference": "451c3cd1418cf640de218914901e51b064abb093"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/phpspec/prophecy/zipball/b4400efc9d206e83138e2bb97ed7f5b14b831cd9",
+                "url": "https://api.github.com/repos/phpspec/prophecy/zipball/451c3cd1418cf640de218914901e51b064abb093",
-                "reference": "b4400efc9d206e83138e2bb97ed7f5b14b831cd9",
+                "reference": "451c3cd1418cf640de218914901e51b064abb093",
                 "shasum": ""
             },
             "require": {
@@ -3993,7 +3993,7 @@
                 "spy",
                 "stub"
             ],
-            "time": "2020-01-20T15:57:02+00:00"
+            "time": "2020-03-05T15:02:03+00:00"
         },
         {
             "name": "phpunit/php-code-coverage",

public/mix-manifest.json

@@ -7,6 +7,7 @@
     "/backend/publish/mainEditDataset.js": "/backend/publish/mainEditDataset.js",
     "/backend/publish/releaseDataset.js": "/backend/publish/releaseDataset.js",
     "/js/app.js": "/js/app.js",
+    "/js/landingpage/main.js": "/js/landingpage/main.js",
     "/js/lib.js": "/js/lib.js",
     "/js/scripts.js": "/js/scripts.js",
     "/js/search/main.js": "/js/search/main.js",

resources/js/landingpage/App.vue

@@ -0,0 +1,129 @@
+<template>
+<div id="app">
+    
+  
+    <main>
+   
+      <div class="content">
+      <dataset v-bind:id="id"></dataset>
+      </div>
+    </main>
+</div>
+</template>
+
+<script lang="js">
+import { Component, Vue } from 'vue-property-decorator';
+import axios from "axios";
+import Dataset from './components/dataset.vue';
+
+
+@Component({
+  components: {
+   Dataset
+  }
+})
+export default class App extends Vue {  
+  posts = [];
+  endpoint = "https://jsonplaceholder.typicode.com/posts/";
+  msg = "Welcome to Your Vue.js App";
+ 
+  created() {
+    //this.getAllPosts();
+  }
+
+  beforeMount() {
+        // this.form = window.Laravel.form;
+       
+        this.id = window.Laravel.id;
+
+
+    }
+
+ 
+  getAllPosts() {
+    axios
+      .get(this.endpoint)
+      .then(response => {
+        this.posts = response.data;
+      })
+      .catch(error => {
+        console.log("-----error-------");
+        console.log(error);
+      });
+  }  
+}
+</script>
+
+
+<style lang="scss">
+body {
+  margin: 0;
+  padding: 0;
+}
+#app {
+  font-family: "Avenir", Helvetica, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  color: #2c3e50;
+}
+h1,
+h2 {
+  font-weight: normal;
+}
+ul {
+  list-style-type: none;
+  padding: 0;
+}
+li {
+  display: inline-block;
+  margin: 0 10px;
+}
+// header {
+//   position: fixed;
+//   top: 0;
+//   width: 100%;
+//   min-height: 90px;
+//   border-bottom: 1px solid #42b983;
+//   text-align: center;
+//   background: #ffffff;
+// }
+main {
+  display: flex;
+  height: calc(100vh - 90px);
+  max-width: 1200px;
+  margin-top: 90px;
+  margin-left: auto;
+  margin-right: auto;
+  overflow: hidden;
+}
+aside {
+  flex: 1 0 30%;
+  height: 100%;
+  overflow-y: auto;
+  width: 30%;
+  padding: 50px 30px;
+  box-sizing: border-box;
+  border-right: 1px solid #42b983;
+}
+.content {
+  // flex: 1 1 80%;
+  // display: flex;
+  align-items: center;
+  justify-content: center;
+  
+}
+.link {
+  display: block;
+  text-decoration: none;
+  margin-bottom: 10px;
+  color: #2c3e50;
+  &--home {
+    text-transform: uppercase;
+    margin-bottom: 30px;
+  }
+  &.is-active {
+    color: #42b983;
+  }
+}
+</style>
+      

resources/js/landingpage/components/dataset.vue

@@ -0,0 +1,132 @@
+<template>
+  <div class="box" v-if="post">
+    <div class="dataset_heaader">
+      <div class="dataset__blog-meta">published: {{ toDayDateTimeString(post.server_date_published) }}</div>
+      <h1 class="dataset__title">{{ post.title_output }}</h1>
+    
+      <p class="dataset__id">{{ post.id }}</p>
+    </div>
+    <div class="dataset">
+        <p class="dataset__abstract">{{ post.abstract_output }}</p>
+    
+
+    <p class="dataset__abstract" v-if="post.subject && post.subject.length > 0">keywords: {{ post.subject.join(', ') }}</p>
+    <p class="dataset__abstract">creating corporation: {{ post.creating_corporation }}</p>
+   <p class="dataset__abstract">publisher: {{ post.publisher_name }}</p>
+
+    </div>
+  </div>
+</template>
+
+<script>
+import axios from "axios";
+import { Component, Vue, Prop } from "vue-property-decorator";
+
+@Component
+export default class Dataset extends Vue {
+  // props: ['id'];
+  name = "dataset";
+
+  @Prop()
+  id;
+
+  metaInfo() {
+    return {
+      title: this.post && this.post.title
+    };
+  }
+
+  toDayDateTimeString(UNIX_timestamp) {
+    var a = new Date(UNIX_timestamp * 1000);
+    var months = [
+      "Jan",
+      "Feb",
+      "Mar",
+      "Apr",
+      "May",
+      "Jun",
+      "Jul",
+      "Aug",
+      "Sep",
+      "Oct",
+      "Nov",
+      "Dec"
+    ];
+    var year = a.getFullYear();
+    var month = months[a.getMonth()];
+    var date = a.getDate();
+    var hour = a.getHours();
+    var min = a.getMinutes();
+    var sec = a.getSeconds();
+    var time =
+      date + " " + month + " " + year + " " + hour + ":" + min + ":" + sec;
+    return time;
+  }
+
+  post = null;
+  host = "https://repository.geologie.ac.at/";
+  path = "solr/rdr_data/select?";
+  endpoint = this.host + this.path;
+  // endpoint = "https://jsonplaceholder.typicode.com/posts/";
+
+  getPost(id) {
+    axios(this.endpoint + "&q=id:" + id)
+      .then(response => {
+        this.post = response.data.response.docs[0];
+        // this.post.title_output = "Ein etwas längerer Titel zum Testen!!! Test";
+      })
+      .catch(error => {
+        console.log("-----error-------");
+        console.log(error);
+      });
+  }
+
+  created() {
+    this.getPost(this.id);
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.box {
+  margin: 0 auto;
+  padding: 115px 20px 70px;
+  // background-color: salmon;
+  
+   
+}
+.dataset_heaader {
+//  background-color: lightgray;
+ position: relative;
+}
+.dataset {  
+  // max-width: 500px;
+  
+  &__title {
+    position: relative;
+    text-transform: uppercase;
+    z-index: 1;
+  }
+  &__abstract {
+    position: relative;
+    z-index: 1;
+  }
+  &__id {
+    position: absolute;
+    font-size: 280px;
+    bottom: -50px;
+    margin: 0;
+    color: #eeeeee;
+    right: -20px;
+    line-height: 1;
+    font-weight: 900;
+    z-index: 0;
+  }
+  &__blog-meta {
+    padding: 10px 0 20px;
+    color: #c2c2c2;
+    // font-size: 0.8em;
+    margin-top: -1.7em;
+  }
+}
+</style>

resources/js/landingpage/main.ts

@@ -0,0 +1,7 @@
+import Vue from 'vue';
+import App from './App.vue';
+
+new Vue({
+  el: '#app',
+  render: h => h(App)
+});

resources/js/search/App.vue

@@ -87,4 +87,11 @@ export default App;
 #app {
   color: #56b983;
 }
+
+.content {
+    flex: 1 1 70%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
 </style>

resources/js/search/main.ts

@@ -2,6 +2,6 @@ import Vue from 'vue';
 import App from './App.vue';
 
 new Vue({
-  el: '#test',
+  el: '#app',
   render: h => h(App)
 });

resources/js/search/search-results/show-dataset-class.ts

@@ -1,12 +0,0 @@
-import { Component, Vue, Prop } from 'vue-property-decorator';
-
-@Component
-export default class ShowDataset extends Vue {
-
-    @Prop()
-    dataset;
-
-    get results() {
-        return this.dataset;
-    };
-}

resources/js/search/search-results/show-dataset.vue

@@ -1,7 +0,0 @@
-<template>
-  <div class="search-detail">
-    <div>
-      <em>Author: {{ document.id }}</em>
-    </div>
-  </div>
-</template>

resources/views/frontend/dataset/show.blade.php

@@ -1,63 +1,21 @@
 @extends('layouts.app') 
 @section('content')
 
+
 <section class="normal dataset u-full-width">
-    <div class="container">
+<div id="app"></div>
-        <div class="blog-meta">
-            created: <?= $dataset->created_at->toDayDateTimeString()  ?>
-        </div>
-        <div class="post-description">
-            {{-- @foreach ($dataset->authors as $author)
-            <em>Author: {{ $author->full_name }}</em>
-            <br /> 
-            @endforeach  --}}
-            @foreach ($dataset->titles as $title)
-            <em>Main Title: {{ $title->value }}</em>
-            <br /> 
-            @endforeach
-            @foreach ($dataset->abstracts as $abstract)
-            <em>Abstract: {{ $abstract->value }}</em>
-            <br /> 
-            @endforeach
-            @foreach ($authors as $author)
-            <em>Author: {{ $author->full_name }}</em>
-            <br /> 
-            @endforeach
-            @foreach ($contributors as $contributor)
-            <em>Contributor: {{ $contributor->full_name }}</em>
-            <br /> 
-            @endforeach
-            @foreach ($submitters as $submitter)
-            <em>Submitter: {{ $submitter->full_name }}</em>
-            <br /> 
-            @endforeach
-
-            <table id="items" class="pure-table pure-table-horizontal">
-                <thead>
-                    <tr>
-                        <th>Path Name</th>
-                        <th>Label</th>
-                    </tr>
-                </thead>    
-                <tbody>
-                    @foreach($dataset->files as $key => $file)
-                    <tr>
-                        <td>
-                            @if($file->exists() === true)
-                            <a href="{{ route('file.download', ['id' => $file->id]) }}"> {{ $file->path_name }} </a> 
-                            @else
-                            <span class="alert">missing file: {{ $file->path_name }}</span> 
-                            @endif
-                        </td>
-                        <td> {{ $file->label }} </td>
-                    </tr>
-                    @endforeach
-                </tbody>
-            </table>
-
-        </div>
-    </div>
-
 </section>
 
+
+
+@stop
+
+@section('after-scripts')
+<script>
+    window.Laravel = <?php echo json_encode([
+            'csrf_token' => csrf_token(),
+            'id' => $id,           
+        ]); ?>        
+</script>
+<script src="{{  asset('js/landingpage/main.js') }}"></script>
 @stop

resources/views/frontend/search/index.blade.php

@@ -9,7 +9,7 @@
 
     
     <!-- SEARCH RESULTS GO HERE, EXACTLY AS BEFORE -->
-    <div id="test" class="search-container row">
+    <div id="app" class="search-container row">
 
         {{-- <div class="four columns left-bar">
             <div id="left-bar" class="sidebar left-bar">             

resources/views/settings/layouts/app.blade.php

@@ -53,9 +53,9 @@
                 <li class="treeview">
                     <h2 class="pure-menu-heading">Settings  <span class="fas fa-angle-down"></h2>
                     <ul class="pure-menu-list treeview-menu {{ Route::is('settings.*') ? 'menu-open' : '' }} style="display: none; {{ Route::is('settings.*') ? 'display: block;' : '' }}">				
-                        <li class="pure-menu-item {{ Route::is('settings.document*') ? 'active' : '' }}">
+                        {{-- <li class="pure-menu-item {{ Route::is('settings.document*') ? 'active' : '' }}">
                             <a class="pure-menu-link" href="{{ route('settings.document') }}"><i class="fa fa-database"></i> Datasets</a>
-                        </li>
+                        </li> --}}
                         {{-- <li class="pure-menu-item {{ Route::is('settings.collection*') ? 'active' : '' }}">
                             <a class="pure-menu-link" href="{{ route('settings.collection') }}"><i class="fa fa-archive"></i> Collections</a>
                         </li> --}}

webpack.mix.js

@@ -16,6 +16,7 @@ let mix = require('laravel-mix');
 
 mix.js('resources/js/datasetPublish.js', 'public/backend/publish')
     .js('resources/js/search/main.ts', 'public/js/search')
+    .js('resources/js/landingpage/main.ts', 'public/js/landingpage')
     .js('resources/js/app.js', 'public/js')
     .js('resources/js/lib.js', 'public/js')
     .js('resources/js/releaseDataset.js', 'public/backend/publish')