dynamically loads item url in source link

closes #2

src/Site/BlockLayout/Carousel.php

@@ -76,7 +76,8 @@ class Carousel extends AbstractBlockLayout
             return '';
 		}
 
-		$urls = [];
+    static $id = 0;
+		$images = [];
 
 		foreach ($attachments as $attachment)
 		{
@@ -85,26 +86,27 @@ class Carousel extends AbstractBlockLayout
 				$mediaType = $media->mediaType();
 				$mediaRenderer = $media->renderer();
 				if ((strpos($mediaType, 'image/') !== false) || (strpos($mediaRenderer, 'youtube') !== false)) {
-					array_push($urls, $media->thumbnailUrl('large'));
+					array_push($images, ["media_url" => $media->originalUrl(),
+                               "item_url" => $attachment->item()->url()
+                              ]);
 				}
 			}
 		}
 
 		return $view->partial('common/block-layout/simple-carousel', [
+      'carousel_id' => 'ic_' . ++$id,
 			'height' => $block->dataValue('height'),
 			'duration' => $block->dataValue('duration'),
 			'perPage' => $block->dataValue('perPage'),
 			'loop' => $block->dataValue('loop'),
 			'draggable' => $block->dataValue('draggable'),
 			'subTitle' => $block->dataValue('subTitle'),
-			'urls' => $urls,
+      'images' => $images,
 			'autoSlide' => $block->dataValue('autoSlide'),
 			'autoSlideInt' => $block->dataValue('autoSlideInt'),
 			'wrapStyle' => $block->dataValue('wrapStyle'),
 			'imgStyle' => $block->dataValue('imgStyle'),
 			'ui_background' => $block->dataValue('ui_background'),
-      'item_url' => $attachments[0]->item()->url(),
-      //'item_title' => $attachments[0]->item()->title(),
       'renderSourceLink' => $block->dataValue('renderSourceLink'),
 		]);
 	}

view/common/block-layout/simple-carousel.phtml

@@ -20,22 +20,21 @@
 
 <div class="archive-carousel">
 
-
 	<?php if ($renderSourceLink) { ?>
 		<div class="source-link">
-			<a href="<?= $item_url ?>">Source</a>
+			<a href="">Source</a>
 		</div>
 	<?php } ?>
 
 	<div style="position:relative;">
-		<div class="siema">
-			<?php foreach ($urls as $url) { ?>
+		<div class="siema_<?= $carousel_id ?> siema">
+			<?php foreach ($images as $image) { ?>
 					<div class="siema-wrap"
 							 style="<?= $wrapStyle ?>"
 					>
 						<img class="siema-img"
 								 style="<?= $imgStyle ?>"
-								 src="<?= $url ?>"
+								 src="<?= $image['media_url'] ?>"
 						/>
 					</div>
 			<?php } ?>
@@ -50,14 +49,22 @@
 </div>
 
 <script>
+
+var sourceURLs = [];
+<?php foreach ($images as $image) { ?>
+	sourceURLs.push("<?= $image['item_url'] ?>")
+<?php } ?>
+
 $(document).ready(function() {
 	let siema = new Siema({
-		selector: '.siema',
+		selector: '.siema_<?= $carousel_id ?>',
 		easing: 'ease-out',
 		duration: <?php echo $duration ?>,
 		perPage: <?php echo $perPage ?>,
 		loop: <?php echo $loop ?>,
-		draggable: <?php echo $draggable ?>
+		draggable: <?php echo $draggable ?>,
+		onInit: changeSourceURL,
+		onChange: changeSourceURL,
 	});
 
 	let caret = '<?php echo $caret;?>';
@@ -78,4 +85,20 @@ $(document).ready(function() {
 	}, <?php echo $autoSlideInt; ?>);
 <?php endif ?>
 });
+
+function changeSourceURL(){
+	var slide_idx = this.currentSlide
+	if (slide_idx < 0) {
+		slide_idx = sourceURLs.length -1;
+	}
+	var source_link = $(".siema_<?= $carousel_id ?>")
+										.closest(".archive-carousel")
+										.find(".source-link")
+										.find('a');
+	if (source_link.length != 0) {
+		$(source_link).attr("href", sourceURLs[slide_idx])
+	}
+
+}
+
 </script>