@extends('frontend.layouts.app')

@section('title', app_name() . ' | ' . __('navs.general.home'))

@section('page-style-files')
    <style>
        .files{
            border: 1px solid lightgray;
            border-radius: 5px;
            padding: 5px;
        }
        .files input[type=file] {
            border: none;
	}
	.previous{
            padding: 10px;
	    border: 1px solid lightgray;
	    border-radius: 5px;
	    margin: 5px;
	}
    </style>
@endsection

@section('content')
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <h2><a href="{{url('/project')}}" style="text-decoration: none;">Projects</a> :: <a href="{{url('/project/' . $file->box->project->name . '/show')}}">{{$file->box->project->label}}</a> :: <a href="{{url('/project/' . $file->box->project->name . '/box')}}">Boxes</a> :: <a href="{{url('/project/' . $file->box->project->name . '/box/' . $file->box->name)}}">{{$file->box->label}}</a> :: <a href="{{url('/project/' . $file->box->project->name . '/box/' . $file->box->name . '/file')}}">Files</a> :: Edit {{isset($file->label) && $file->label ? $file->label : $file->name}}</h2>
            </div>
        </div>

        <div class="row">
            <div class="col-md-12">
                @if ($errors->any())
                    <div class="alert alert-danger">
                        <ul>
                            @foreach ($errors->all() as $error)
                                <li>{{ $error }}</li>
                            @endforeach
                        </ul>
                    </div><br />
                @endif
                <form method="post" action="{{url('/project/' . $file->box->project->name . '/box/' . $file->box->name . '/file/' . $file->name)}}" enctype="multipart/form-data">
                    {{csrf_field()}}
                    <input name="_method" type="hidden" value="PUT">
                    <input type="hidden" value="{{csrf_token()}}" name="_token" />
                    <div class="form-group">
                        <label for="type">Type:</label>
                        <select name="type" class="form-control">
                            <option value="photo" {{$file->type == 'photo' ? 'selected' : ''}}>Photo</option>
                            <option value="blender" {{$file->type == 'blender' ? 'selected' : ''}}>Blender</option>
                            <option value="render" {{$file->type == 'render' ? 'selected' : ''}}>Render</option>
                            <option value="glb" {{$file->type == 'glb' ? 'selected' : ''}}>GLB</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label for="name">Name:</label>
                        <input type="text" class="form-control" name="name" value={{$file->name}} disabled />
                    </div>
                    <div class="form-group">
                        <label for="file">File:</label>
                        <input name="file" type="file" class="form-control" accept="image/*">
                    </div>
                    <div class="form-group">
                        <label for="label">Label:</label>
                        <input type="text" class="form-control" name="label" value={{$file->label}} autocomplete="off"/>
                    </div>
                    <div class="form-group">
                        <label for="description">Description:</label>
                        <textarea cols="5" rows="5" class="form-control" name="description">{{$file->description}}</textarea>
                    </div>
                    <div class="form-group">
                        <label for="visible">Visible:</label>
                        <input name="visible" type="checkbox" {{isset($file->visible) && $file->visible ? 'checked' : ''}}/>
                    </div>
                    <div class="form-group">
                        <label for="order">Order:</label>
                        <input name="order" type="number" class="form-control" min="1" max="99" value="{{$file->order}}"/>
                    </div>
		    @php
            $files = [];
            foreach(scandir(base_path() . '/public' . pathinfo($file->path, PATHINFO_DIRNAME) . '/') as $filename){
                if ($filename != '.' && $filename != '..'){
                    if (basename($file->path) != $filename && strpos(pathinfo(basename($filename), PATHINFO_FILENAME), pathinfo(basename($file->path), PATHINFO_FILENAME)) === 0) {
                        $files[] = $filename;
                    }
                }
            }
            @endphp
			    @if(count($files) > 0)
					<div class="row"><div class="col-md-12"><div style="text-align: center"><h4>Предыдущие версии</h4></div></div></div>
					<div class="row" style="padding-bottom: 10px">
                    @foreach($files as $filename)
                        <div class="col-sm-3">
                            <div class="previous">
                                @php
                                $filepath = str_replace(basename($file->path), $filename, $file->path);
                                $extension = pathinfo(basename($filename), PATHINFO_EXTENSION);
                                $bytes = filesize(base_path() . '/public' . $filepath);
                                $sz = 'BKMGTP';
                                $factor = floor((strlen($bytes) - 1) / 3);
                                $decimals = 2;
                                $size = sprintf("%.{$decimals}f", $bytes / pow(1024, $factor)) . @$sz[$factor];
                                $mtime = filemtime(base_path() . '/public' . $filepath)
                                @endphp
                                <div>
                                    @if($extension == 'jpg' || $extension == 'jpeg' || $extension == 'png')
                                        <img src='{{url('util/image/resize?path=' . $filepath . '&updated=' . $mtime)}}' style='width: 100%'/>
                                    @elseif($extension == 'glb')
                                        <a href="{{url('util/model/3d?path=' . $filepath)}}" target="_blank"><img src='{{ URL::asset('img/3d.svg') }}' style='opacity: 0.5;'></a>
                                    @endif
                                </div>
                                <div>
                                    {{date('Y-m-d H:i:s', $mtime)}}
                                </div>
                                <div>
                                    {{$size}}
                                </div>
                                <div>
                                    <div style="display: inline-block;"><span class="btn btn-warning" onclick="revert('{{$filename}}')">Revert</span></div>
                                    <div style="display: inline-block; float: right;"><span class="btn btn-danger" onclick="remove('{{$filename}}')">Delete</span></div>
                                </div>
                            </div>
                        </div>
                    @endforeach
                    </div>
				@endif
                    <div style="text-align: center; padding-bottom: 20px">
                        <button type="submit" class="btn btn-primary">Update</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
@endsection

@section('page-js-script')
    <script>
        jQuery(document).ready(function() {
            jQuery('select[name=type]').on('change', function() {
                switch (this.value) {
                    case 'photo':
                        jQuery('input[name=file]').attr('accept', 'image/*');
                        break;
                    case 'blender':
                        jQuery('input[name=file]').attr('accept', '.blend');
                        break;
                    case 'render':
                        jQuery('input[name=file]').attr('accept', 'image/*');
                        break;
                    case 'glb':
                        jQuery('input[name=file]').attr('accept', '.glb');
                        break;
                }
            });
            jQuery('select[name=type]').change();
        });

        function revert(filename) {
            if (confirm('Are you sure?')){
                jQuery.ajax({
                    url : '{{url('/project/' . $file->box->project->name . '/box/' . $file->box->name . '/file/' . $file->name)}}',
                    type : 'PATCH',
                    contentType : 'application/json',
                    data : JSON.stringify({'action': 'revert', 'filename': filename}),
                    processData: false,
                    dataType: 'json',
                    success: function(data) {
                        if (data && typeof data['MESSAGE'] != 'undefined' && data['MESSAGE'] == 'OK'){
                            window.location.reload();
                        }
                    }
                });
            }
        }

        function remove(filename) {
            if (confirm('Are you sure?')) {
                jQuery.ajax({
                    url : '{{url('/project/' . $file->box->project->name . '/box/' . $file->box->name . '/file/' . $file->name)}}',
                    type : 'PATCH',
                    contentType : 'application/json',
                    data : JSON.stringify({'action': 'remove', 'filename': filename}),
                    processData: false,
                    dataType: 'json',
                    success: function(data) {
                        if (data && typeof data['MESSAGE'] != 'undefined' && data['MESSAGE'] == 'OK'){
                            window.location.reload();
                        }
                    }
                });
            }
        }
    </script>
@stop