adds source link to each image

src/Site/BlockLayout/SmartGallery.php

@@ -91,11 +91,13 @@ class SmartGallery extends AbstractBlockLayout
 				$mediaType = $media->mediaType();
 				$mediaRenderer = $media->renderer();
 				if (strpos($mediaType, 'image/') !== false) {
-          $new_url = $media->originalUrl();
-          // original files size may be very large. /large/<name>.jpg is smaller
-          $new_url = substr_replace($new_url, 'jpg', strrpos($new_url, '.') +1);
-          $new_url = str_replace("original", "large", $new_url);
-					array_push($images, ["media_url" => $new_url,
+          $thumbs = $media->thumbnailUrls();
+          if (isset($thumbs['large'])) {
+            $media_url = $thumbs['large'];
+          } else {
+            $media_url = $media->originalUrl();
+          }
+					array_push($images, ["media_url" => $media_url,
                                "item_url" => $attachment->item()->url(),
                                "image_title" => $media->title(),
                                "img_id" => 'gi_' . $gallery_id . '_' . $img_id,

view/common/block-layout/smartGallery.phtml

@@ -6,21 +6,16 @@ $this->headLink()->appendStylesheet($this->assetUrl('css/style.css',
 
 ?>
 
-<!--
-<script>
-console.log(<?= json_encode($images, JSON_UNESCAPED_SLASHES) ?>)
-</script>
--->
+<style>
+.sg_src_link {
+	font-size: 0.70em;
+}
+</style>
 
 <?php $image_id = 0; ?>
 
-<div class="archive-item-block smart-gallery">
-
-  <?php if ($renderSourceLink) { ?>
-  	<div class="source-link">
-  		<a href="<?= $item_url ?>">Source</a>
-  	</div>
-  <?php } ?>
+<div id="<?= $gallery_id ?>_wrap"
+		 class="archive-item-block smart-gallery">
 
   <div class="wrapper">
     <div class="masonry">
@@ -59,16 +54,20 @@ echo $this->inlineScript()
 
 <script>
 jQuery(document).ready(function() {
-  $(function(){
   $(".<?= $gallery_id ?>").SmartPhoto({
     resizeStyle: 'fit',
   });
-  });
+	<?php if ($renderSourceLink) { ?>
+	var images_<?= $gallery_id ?> = <?= json_encode($images, JSON_UNESCAPED_SLASHES) ?>;
+	for (let i in images_<?= $gallery_id ?>) {
+		var image = images_<?= $gallery_id ?>[i]
+		var src_link = '<div class="sg_src_link"><a href="'+image['item_url']+'">Source</a></div>';
+		var gallery_image = $('#<?= $gallery_id ?>_wrap').find('img[src="'+image['media_url']+'"]')
+		if ( !($(gallery_image).next().attr('src') == image['media_url']) ){
+			$(gallery_image).closest('.brick').append(src_link)
+			console.log(image['media_url'])
+		}
+	}
+	<?php } ?>
 });
-
-function updateSourceURL(thumbnail){
-	$(thumbnail).closest(".archive-gallery")
-							.find('.source-link')
-							.find('a').prop('href', $(thumbnail).attr('item_url'));
-}
 </script>