Proyectos y parte de Proyecto

resources/views/proyectos/proyecto/galeria.blade.php

@@ -0,0 +1,38 @@
+<div id="galeria">
+  <div class="ui image" data-id="0">
+    <img src="{{$urls->images}}/{{mb_strtolower($proyecto->edificio)}}/{{$proyecto->imagen}}" />
+  </div>
+  <div class="ui grid">
+    @foreach ($proyecto->images as $i => $image)
+      @if ($i == 0)
+        @continue
+      @endif
+      <div class="three wide column">
+        <div class="ui image" data-id="{{$i}}">
+          <img src="{{$urls->images}}/{{mb_strtolower($proyecto->edificio)}}/{{$image}}" />
+        </div>
+      </div>
+    @endforeach
+  </div>
+</div>
+
+@push('scripts')
+  <script type="text/javascript">
+    var images = [
+      @foreach ($proyecto->images as $image)
+        '{{$urls->images}}/{{mb_strtolower($proyecto->edificio)}}/{{$image}}',
+      @endforeach
+    ]
+    $(document).ready(() => {
+      $('#galeria').find('.grid .image').click(function(e) {
+        var id = $(this).attr('data-id')
+        var big = $('#galeria>.image')
+        var big_id = big.attr('data-id')
+        big.find('img').attr('src', images[id])
+        big.attr('data-id', id)
+        $(this).find('img').attr('src', images[big_id])
+        $(this).attr('data-id', big_id)
+      })
+    })
+  </script>
+@endpush