Initial Application With Travel Photos

app/Http/Controllers/MainController.php

@@ -0,0 +1,33 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use App\Place;
+use App\Photo;
+
+class MainController extends Controller
+{
+    public function main()
+    {
+
+        $visited = Place::where('visited', 1)->get();
+        $togo = Place::where('visited', 0)->get();
+
+        $photos = Photo::all();
+
+        return view('travel_list', [
+            'visited' => $visited,
+            'togo' => $togo,
+            'photos' => $photos
+        ]);
+    }
+
+    public function uploadForm()
+    {
+        $places = Place::all();
+
+        return view('upload_photo', [
+            'places' => $places
+        ]);
+    }
+}

app/Http/Controllers/PhotoController.php

@@ -0,0 +1,33 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use Illuminate\Http\Request;
+use App\Photo;
+use App\Place;
+
+class PhotoController extends Controller
+{
+    public function uploadPhoto(Request $request)
+    {
+        $photo = new Photo();
+        $place = Place::find($request->input('place'));
+
+        if (!$place) {
+            //add new place
+            $place = new Place();
+            $place->name = $request->input('place_name');
+            $place->lat = $request->input('place_lat');
+            $place->lng = $request->input('place_lng');
+        }
+
+        $place->visited = 1;
+        $place->save();
+
+        $photo->place()->associate($place);
+        $photo->image = $request->image->store('photos', 'public');
+        $photo->save();
+
+        return redirect()->route('Main');
+    }
+}

app/Photo.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace App;
+
+use Illuminate\Database\Eloquent\Model;
+
+class Photo extends Model
+{
+    public function place()
+    {
+        return $this->belongsTo('App\Place');
+    }
+}

app/Place.php

@@ -6,5 +6,8 @@
 
 class Place extends Model
 {
-    //
+    public function photos()
+    {
+        return $this->hasMany('App\Photo');
+    }
 }

database/migrations/2019_10_14_124700_create_photos_table.php

@@ -0,0 +1,34 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+class CreatePhotosTable extends Migration
+{
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        Schema::create('photos', function (Blueprint $table) {
+            $table->bigIncrements('id');
+            $table->unsignedBigInteger('place_id');
+            $table->string('image');
+            $table->foreign('place_id')->references('id')->on('places');
+            $table->timestamps();
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        Schema::dropIfExists('photos');
+    }
+}

database/seeds/PlacesTableSeeder.php

@@ -2,6 +2,9 @@
 
 use Illuminate\Database\Seeder;
 use Illuminate\Support\Facades\DB;
+use Illuminate\Support\Facades\Storage;
+use App\Photo;
+use App\Place;
 
 class PlacesTableSeeder extends Seeder
 {
@@ -17,6 +20,9 @@ class PlacesTableSeeder extends Seeder
         'Oslo'      => [ 59.9139, 10.7522 ],
         'Rio'       => [ -22.9068, -43.1729 ],
         'Tokyo'     => [ 35.6895, 139.692 ],
+        'Bermudas'  => [ 32.307800, -64.750504 ],
+        'Grindavik' => [ 63.840672, -22.429350 ],
+        'Japan'     => [ 36.204823, 138.252930 ],
     ];
 
     /**
@@ -38,13 +44,27 @@ public function run()
 
     protected function insertDefaultPlaces()
     {
-        foreach (self::$places as $place => $coords) {
-            DB::table('places')->insert([
-                'name' => $place,
-                'lat'  => $coords[0],
-                'lng'  => $coords[1],
-                'visited' => rand(0,1) == 1
-            ]);
+         foreach (self::$places as $name => $coords) {
+            $place = new Place();
+            $place->name = $name;
+            $place->lat = $coords[0];
+            $place->lng = $coords[1];
+            $place->visited = 0;
+
+            $place->save();
+
+            $sample_photo = '/photos/' . strtolower($name) . '.jpg';
+
+            if (Storage::disk('public')->exists($sample_photo)) {
+                //add sample photo
+                $photo = new Photo();
+                $photo->image = $sample_photo;
+
+                $place->update(['visited' => 1]);
+
+                $photo->place()->associate($place);
+                $photo->save();
+            }
         }
     }
 }

public/css/global.css

@@ -34,7 +34,7 @@ h2 {
     color: #FFF;
 }
 
-.map_container {
+.map_container, .form_container {
     background-color: #3d4852;
     margin-bottom: 60px;
     padding: 20px;
@@ -88,13 +88,33 @@ h2 {
 }
 
 .photo {
-    background-color: #3d4852;
+    background-color: #F5F5F5;
     padding: 20px;
     float: left;
     margin: 10px;
     width: 300px;
+    text-align: center;
+    color: #333333;
+    border: 1px solid #1b1e21;
 }
 
 .photo img {
     width: 100%;
+    border: 1px solid #c4c4c4;
+}
+
+.form_container {
+    color: #FFFFFF;
 }
+
+input.text {
+    border: 1px solid #3d4852;
+    background-color: #F0F0F0;
+    font-size: medium;
+    padding: 6px;
+    margin: 2px;
+}
+
+h2 a {
+    color: #d3d9df;
+}

public/js/map.js

@@ -0,0 +1,18 @@
+function add_map_point(lat, lng, icon) {
+    var vectorLayer = new ol.layer.Vector({
+        source:new ol.source.Vector({
+            features: [new ol.Feature({
+                geometry: new ol.geom.Point(ol.proj.transform([parseFloat(lng), parseFloat(lat)], 'EPSG:4326', 'EPSG:3857')),
+            })]
+        }),
+        style: new ol.style.Style({
+            image: new ol.style.Icon({
+                anchor: [0.5, 1],
+                anchorXUnits: "fraction",
+                anchorYUnits: "fraction",
+                src: icon
+            })
+        })
+    });
+    map.addLayer(vectorLayer);
+}

resources/views/main.blade.php

@@ -0,0 +1,33 @@
+<html>
+<head>
+    <link rel="stylesheet" href="/css/global.css" type="text/css">
+    <link rel="stylesheet" href="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/css/ol.css" type="text/css">
+    <link href="https://fonts.googleapis.com/css?family=Anton&display=swap" rel="stylesheet">
+    <link href="https://fonts.googleapis.com/css?family=Hind&display=swap" rel="stylesheet">
+
+    <script src="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/build/ol.js"></script>
+    <script src="/js/map.js"></script>
+
+    <title>Sammy's Travels</title>
+</head>
+
+<body class="container">
+
+<header>
+    <h1>Sammy's Travels</h1>
+</header>
+
+<div class="main">
+    @yield('content')
+</div>
+
+<div class="footer clearfix">
+    @yield('footer')
+</div>
+
+
+@yield('script')
+
+
+</body>
+</html>