photo/resources/views/catalog/duplicatereview.blade.php

@extends('adminlte::layouts.app')

@section('htmlheader_title')
	Duplicates
@endsection

@section('contentheader_title')
	Review Duplicate Items
@endsection
@section('contentheader_description')
	{{ $catalog->count() }} to review
@endsection
@section('page_title')
	Duplicates
@endsection

@section('main-content')
	<div class="col-12">
		@if ($catalog->count())
			<span class="pagination justify-content-center">
				{{ $catalog->links() }}
			</span>

			<form action="{{ $return }}" method="POST">
				@csrf

				<input type="hidden" name="type" value="{{ $type }}">
				<input type="hidden" name="list" value="{{ request()->get('list') }}">

				@include('catalog.widgets.list')

				<div class="pb-2">
					<button class="btn btn-sm btn-outline-primary" name="page" value="{{ $catalog->hasMorePages() ? $catalog->currentPage() : NULL }}">Update <small>[Same]</small></button>
					<button class="btn btn-sm btn-primary" name="page" value="{{ $catalog->hasMorePages() ? $catalog->currentPage()+1 : NULL }}">Update <small>[Advance]</small></button>
					<button class="btn btn-sm btn-outline-primary" name="page" value="{{ $catalog->hasMorePages() ? 1 : NULL }}">Update <small>[1st]</small></button>
				</div>
			</form>
		@else
			NONE!
		@endif
	</div>
@endsection

@section('page-scripts')
	<script type="text/javascript">
		function swap(item) {
			var tr = item.closest('tr');

			try {
				['duplicate','remove'].forEach(function(item) {
					var items = tr.find('input[name^="'+item+'\["]');

					if (items.length !== 2) {
						alert('cannot swap');
						throw new Error('CANNOT SWAP');
					}

					var rotate = items[0].checked;
					$(items[0]).prop('checked',items[1].checked);
					$(items[1]).prop('checked',rotate);
				});

			} catch (e) {
				// NOOP
			}
		}

		function scroll(item) {
			var next = item.closest('div.card').closest('tr').next();

			if (next.length)
				$('html,body').animate({scrollTop: next.offset().top},'fast');
		}

		$(document).ready(function() {
			$('span.swap').on('click',function() {
				swap($(this));
			});

			$('span.scroll').on('click',function() {
				scroll($(this));
			});

			$('span.swapscroll').on('click',function() {
				swap($(this));
				scroll($(this));
			});

			$('input[type="checkbox"]').on('click',function(item) {
				var card = $(this).closest('div').parent();

				switch ($(this).data('name')) {
					case 'duplicate':
						if (card.hasClass('border-success')) {
							card.removeClass('border-success').addClass('border-light');
							break;

						} else if (card.hasClass('border-danger')) {
							// Do nothing

						} else {
							card.toggleClass('border-light');
						}

						break;

					case 'remove':
						if ($(this).is(':checked')) {
							if (card.hasClass('border-light'))
								card.removeClass('border-light');
							else
								card.removeClass('border-success');

							card.addClass('border-danger');

						} else {
							if (card.hasClass('border-danger')) {
								card.removeClass('border-danger');
							}

							if ($(this).closest('tr').parent().find('input[name^="duplicate"]').is(':checked'))
								card.addClass('border-light')
							else
								card.addClass('border-success');
						}

						break;
				}
			})
		});
	</script>
@append