Template system: Laravel Blade

The my_gallery_pics  DIV contains the pics. First the script  collected to array, then show first item.

<script>

function addImageTodiv(current_pic) {
$(‘#picture_place’).prepend($(‘<img>’, {
id: current_pic,
src: “{{ URL::to(‘/uploads/pics’) }}” + ‘/’ + current_pic,
width: 360,
height: 425,
class: “img-responsive”}));
}

$(document).ready(function() {
picArr = new Array();
$(“#my_gallery_pics img”).each(function() {
//console.log(‘id:’ + $(this).attr(“id”));
picArr.push($(this).attr(“id”));
});
curr_pic = picArr[0];
$(‘#picture_place’).prepend($(‘<img>’, {id: picArr[0], src: “{{ URL::to(‘/uploads/profile_images/resized/medium’) }}” + ‘/’ + picArr[0]}));

arr_index = 0;
$(‘#gallery_arrow_right_box, #gallery_arrow_right’).click(function() {

$(‘#gallery_arrow_left’).show();

if (picArr.length – 1 > arr_index) {
arr_index++;
}
if (picArr.length – 1 == arr_index) {
$(‘#gallery_arrow_right’).hide();
}

//console.log(picArr.length + ‘ current_index: ‘ + arr_index);
addImageTodiv(picArr[arr_index]);

});

$(‘#gallery_arrow_left_box, #gallery_arrow_left’).click(function() {
$(‘#gallery_arrow_right’).show();
if (arr_index > 0) {
arr_index–;
}
if (arr_index == 0) {
$(‘#gallery_arrow_left’).hide();
}

// console.log(picArr.length + ‘ current_index: ‘ + arr_index);
addImageTodiv(picArr[arr_index]);

});

});
</script>

<div class=”pic” >
<div class=’left_box’  id=’gallery_arrow_left_box’ ></div>
<div class=’right_box’ id=’gallery_arrow_right_box’></div>
<a class=”arrow left”  id=’gallery_arrow_left’ ></a>
<a class=”arrow right”  id=’gallery_arrow_right’></a>
<div id=’picture_place’></div>
<div class=”text”>Lorem Ipsum</div>
<i class=”triangle”></i>
</div>

<div id=”my_gallery_pics” style=’display:none;’ >

@foreach ($pictures as $item)
@if($item->filename !=”)
{{ HTML::image(‘/uploads/pics/’.$item->filename, ‘profile picture’, array(‘style’ => ‘height:50px;’, ‘id’=> $item->filename)) }}
@endif
@endforeach
</div>