84 lines
		
	
	
		
			3.5 KiB
		
	
	
	
		
			Handlebars
		
	
	
	
			
		
		
	
	
			84 lines
		
	
	
		
			3.5 KiB
		
	
	
	
		
			Handlebars
		
	
	
	
| {{ $imagePathOld := printf "%s/%s" .root.BeforeRawPath (EscapePound .file.OldName)  }}
 | |
| {{ $imagePathNew := printf "%s/%s" .root.RawPath (EscapePound .file.Name)  }}
 | |
| {{if or .blobBase .blobHead}}
 | |
| <tr>
 | |
| 	<td colspan="2">
 | |
| 		<div class="image-diff" data-path-before="{{$imagePathOld}}" data-path-after="{{$imagePathNew}}">
 | |
| 			<div class="ui secondary pointing tabular top attached borderless menu stackable new-menu">
 | |
| 				<div class="new-menu-inner">
 | |
| 					<a class="item active" data-tab="diff-side-by-side-{{ .file.Index }}">{{.root.i18n.Tr "repo.diff.image.side_by_side"}}</a>
 | |
| 					{{if and .blobBase .blobHead}}
 | |
| 					<a class="item" data-tab="diff-swipe-{{ .file.Index }}">{{.root.i18n.Tr "repo.diff.image.swipe"}}</a>
 | |
| 					<a class="item" data-tab="diff-overlay-{{ .file.Index }}">{{.root.i18n.Tr "repo.diff.image.overlay"}}</a>
 | |
| 					{{end}}
 | |
| 				</div>
 | |
| 			</div>
 | |
| 			<div class="hide">
 | |
| 				<div class="ui bottom attached tab image-diff-container active" data-tab="diff-side-by-side-{{ .file.Index }}">
 | |
| 					<div class="diff-side-by-side">
 | |
| 						{{if .blobBase }}
 | |
| 						<span class="side">
 | |
| 							<p class="side-header">{{.root.i18n.Tr "repo.diff.file_before"}}</p>
 | |
| 							<span class="before-container"><img class="image-before" /></span>
 | |
| 							<p>
 | |
| 								<span class="bounds-info-before">
 | |
| 									{{.root.i18n.Tr "repo.diff.file_image_width"}}: <span class="text bounds-info-width"></span>
 | |
| 									 | 
 | |
| 									{{.root.i18n.Tr "repo.diff.file_image_height"}}: <span class="text bounds-info-height"></span>
 | |
| 									 | 
 | |
| 								</span>
 | |
| 								{{.root.i18n.Tr "repo.diff.file_byte_size"}}: <span class="text">{{FileSize .blobBase.Size}}</span>
 | |
| 							</p>
 | |
| 						</span>
 | |
| 						{{end}}
 | |
| 						{{if .blobHead }}
 | |
| 						<span class="side">
 | |
| 							<p class="side-header">{{.root.i18n.Tr "repo.diff.file_after"}}</p>
 | |
| 							<span class="after-container"><img class="image-after" /></span>
 | |
| 							<p>
 | |
| 								<span class="bounds-info-after">
 | |
| 									{{.root.i18n.Tr "repo.diff.file_image_width"}}: <span class="text bounds-info-width"></span>
 | |
| 									 | 
 | |
| 									{{.root.i18n.Tr "repo.diff.file_image_height"}}: <span class="text bounds-info-height"></span>
 | |
| 									 | 
 | |
| 								</span>
 | |
| 								{{.root.i18n.Tr "repo.diff.file_byte_size"}}: <span class="text">{{FileSize .blobHead.Size}}</span>
 | |
| 							</p>
 | |
| 						</span>
 | |
| 						{{end}}
 | |
| 					</div>
 | |
| 				</div>
 | |
| 				{{if and .blobBase .blobHead}}
 | |
| 				<div class="ui bottom attached tab image-diff-container" data-tab="diff-swipe-{{ .file.Index }}">
 | |
| 					<div class="diff-swipe">
 | |
| 						<div class="swipe-frame">
 | |
| 							<span class="before-container"><img class="image-before" /></span>
 | |
| 							<span class="swipe-container">
 | |
| 								<span class="after-container"><img class="image-after" /></span>
 | |
| 							</span>
 | |
| 							<span class="swipe-bar">
 | |
| 								<span class="handle top-handle"></span>
 | |
| 								<span class="handle bottom-handle"></span>
 | |
| 							</span>
 | |
| 						</div>
 | |
| 					</div>
 | |
| 				</div>
 | |
| 				<div class="ui bottom attached tab image-diff-container" data-tab="diff-overlay-{{ .file.Index }}">
 | |
| 					<div class="diff-overlay">
 | |
| 						<div class="overlay-frame">
 | |
| 							<div class="ui centered">
 | |
| 								<input type="range" min="0" max="100" value="50" />
 | |
| 							</div>
 | |
| 							<span class="before-container"><img class="image-before"/></span>
 | |
| 							<span class="after-container"><img class="image-after" /></span>
 | |
| 						</div>
 | |
| 					</div>
 | |
| 				</div>
 | |
| 				{{end}}
 | |
| 			</div>
 | |
| 			<div class="ui active centered inline loader mb-4"></div>
 | |
| 		</div>
 | |
| 	</td>
 | |
| </tr>
 | |
| {{end}}
 |