added edit visualizer

This commit is contained in:
franknstayn
2020-01-18 17:14:03 +08:00
parent ed4227bd05
commit 5e663d5891
5 changed files with 476 additions and 106 deletions

View File

@@ -252,13 +252,16 @@ desired effect
// hash && $('ul.nav a[href="' + hash + '"]').tab('show');
// $.fn.dataTable.moment( 'DD/M/YYYY' );
callSpectrumApi();
$('#orders_table').DataTable({
columnDefs: [{
target: 6,
type: 'datetime-moment'
}]
});
$('#store_owners_table').DataTable();
$.fn.dataTable.ext.search.push(
function (settings, data, dataIndex) {
@@ -356,7 +359,6 @@ desired effect
{ targets: 9, type: 'date', visible: false },
{ targets: 9, type: 'date' }
],
});
@@ -479,7 +481,7 @@ desired effect
$('#store_owners_table').DataTable();
$('#list').click(function(event){
event.preventDefault();
@@ -1022,6 +1024,23 @@ desired effect
}
});
$('#stepOneNextBtn_edit').click(function() {
if($("#frm_edit_visualizer").valid()){
var $active = $('.wizard .nav-tabs li.active');
$active.next().removeClass('disabled');
nextTab($active);
}
// $('#getSkins').val($('#_addPatterns').val());
});
$('#stepTwoNextBtn_edit').click(function() {
if($("#frm_edit_visualizer").valid()){
var $active = $('.wizard .nav-tabs li.active');
$active.next().removeClass('disabled');
nextTab($active);
}
});
//Initialize tooltips
// $('.nav-tabs > li a[title]').tooltip();
@@ -1055,7 +1074,7 @@ desired effect
' <input type="text" name="trim_label[]" class="form-control" value="Trim '+i+'"> ' +
'</div> ' +
'<div class="col-sm-2"> ' +
' <input type="hidden" name="trim_def_color[]" class="colorPicker-trim" value="#FFFFFF" form-control"> ' +
' <input type="hidden" name="trim_def_color[]" class="colorPicker-trim" value="#FFFFFF"> ' +
'</div> ' +
'</div>');
}else{
@@ -1065,7 +1084,7 @@ desired effect
' <input type="text" name="trim_label[]" class="form-control" value="Trim '+i+'"> ' +
'</div> ' +
'<div class="col-sm-2"> ' +
' <input type="hidden" name="trim_def_color[]" class="colorPicker-trim" value="#FFFFFF" form-control"> ' +
' <input type="hidden" name="trim_def_color[]" class="colorPicker-trim" value="#FFFFFF"> ' +
'</div> ' +
'</div>');
}
@@ -1117,18 +1136,29 @@ desired effect
$(document).on('button click', '.btn-preview-visualizer', function(event) {
event.preventDefault();
var v = $(this).closest("div.input-group").find("input[type='file']").val();
if(v == ""){
return false;
}
$('#modal_preview_visualizer').modal('show');
if($(this).data("for") != "edit"){
var v = $(this).closest("div.input-group").find("input[type='file']").val();
if(v == ""){
return false;
}
}
$('#modal_preview_visualizer_body').html('');
$('#modal_preview_visualizer_body').html('<object id="obj_visualizer_preview" type="image/svg+xml" height="502px" width="100%"> ' +
'Your browser is not supported svg file ' +
'</object>')
document.getElementById('obj_visualizer_preview').setAttribute('data', $(this).attr('data-visualizer'));
$(this).attr('disabled', true);
$(this).html('<i class="fa fa-spinner fa-spin"></i> opening');
document.getElementById('obj_visualizer_preview').setAttribute('data', $(this).data('visualizer'));
var self = $(this);
setTimeout(function(){
$('#modal_preview_visualizer').modal('show');
$(self).attr('disabled', false);
$(self).html('<i class="fa fa-eye"></i> Preview');
}, 1000);
});
@@ -1142,24 +1172,6 @@ desired effect
sportName: {
required: true
}
// store_url: {
// required: true
// },
// store_password: {
// required: '#with_password_opt:checked'
// },
// store_logo: {
// required: true
// },
// store_banner: {
// required: true
// },
// store_status: {
// required: true
// },
// store_currency: {
// required: true
// }
},
messages: {},
errorPlacement: function(error, element) {
@@ -1173,6 +1185,24 @@ desired effect
submitHandler: submitFormAddNewVisualizer
});
$("#frm_edit_visualizer").validate({
rules: {
sportName: {
required: true
}
},
messages: {},
errorPlacement: function(error, element) {
var placement = $(element).data('error');
if (placement) {
$(placement).append(error);
}else {
error.insertAfter(element);
}
},
submitHandler: submitFormEditVisualizer
});
$(document).on('button click', '#btn_delete_visualizer', function() {
if (!confirm("Are you sure you want to delete this Visualizer?")) {
@@ -1337,8 +1367,8 @@ desired effect
contentType: false,
dataType: 'json',
beforeSend: function(xhr){
// $("#submitTemplateBtn").attr('disabled', true);
// $("#submitTemplateBtn").html('<i class="fa fa-spinner fa-spin"></i> Saving...');
$("#submitTemplateBtn").attr('disabled', true);
$("#submitTemplateBtn").html('<i class="fa fa-spinner fa-spin"></i> Saving...');
var token = $('meta[name="csrf_token"]').attr('content');
@@ -1359,6 +1389,39 @@ desired effect
return false;
}
function submitFormEditVisualizer(){
$.ajax({
type: "POST",
url: "{{ url('admin/visualizer/update') }}",
data: new FormData($('#frm_edit_visualizer')[0]),
processData: false,
contentType: false,
dataType: 'json',
beforeSend: function(xhr){
$("#submitTemplateBtn").attr('disabled', true);
$("#submitTemplateBtn").html('<i class="fa fa-spinner fa-spin"></i> Saving...');
var token = $('meta[name="csrf_token"]').attr('content');
if (token) {
return xhr.setRequestHeader('X-CSRF-TOKEN', token);
}
},
success: function (response) {
console.log(response)
if(response.success){
alert(response.message);
location.reload();
}
}
});
return false;
}
function submitFormCreateStore(){
$.ajax({
type: "POST",
@@ -1475,14 +1538,13 @@ desired effect
}
function readURL(input, id) {
// console.log(input, id)
console.log(input, id)
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function(e) {
$('#'+id).attr('src', e.target.result);
$('.'+id+'_href').attr('href', e.target.result);
$('.'+id+'_img').attr('src', e.target.result);
}
@@ -1491,12 +1553,15 @@ desired effect
}
function readURLVisualizer(input, id) {
// console.log(input, id)
console.log(input, id)
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function(e) {
// $('.'+id+'_href').removeData('data-visualizer');
$('.'+id+'_href').attr('data-visualizer', e.target.result);
// console.log(e.target.result);
// document.getElementById('.'+id+'_href').setAttribute('data', $(this).data('visualizer'))
}
reader.readAsDataURL(input.files[0]);

View File

@@ -230,6 +230,7 @@
<h3><small><i class="fa fa-link" aria-hidden="true"></i></small> Step one</h3>
<br>
</div>
<input type="hidden" value="{{ $template_array[0]->Id }}" name="visualizer_id" />
<div class="col-lg-8 col-sm-8">
<div class="form-group">
<label class="col-sm-4 control-label">&nbsp;</label>
@@ -237,6 +238,15 @@
<button type="button" class="btn btn-danger" data-id="{{ $template_array[0]->Id }}" id="btn_delete_visualizer">Delete This Visualizer</button>
</div>
</div>
<div class="form-group">
<label class="col-sm-4 control-label">Is Active</label>
<div class="col-sm-8">
<select class="form-control" name="is_active">
<option value="TRUE" @if ($template_array[0]->IsActive == "TRUE") selected @endif>TRUE</option>
<option value="FALSE" @if ($template_array[0]->IsActive == "FALSE") selected @endif>FALSE</option>
</select>
</div>
</div>
<div class="form-group">
<label class="col-sm-4 control-label">Select Sports</label>
<div class="col-sm-8">
@@ -286,7 +296,8 @@
<div class="form-group">
<label class="col-sm-4 control-label">Add Thumbnail</label>
<div class="col-sm-8">
<input type="file" data-use-id="img_store_logo" class="form-control upload_img" name="visualizer_thumbnail" reqiured="required" />
<input type="file" data-use-id="img_store_logo" class="form-control upload_img" name="visualizer_thumbnail" reqiured="required" />
<input type="hidden" class="form-control upload_img" value="{{ $template_array[0]->Thumbnail }}" name="current_visualizer_thumbnail" reqiured="required" />
</div>
</div>
<div class="form-group" >
@@ -294,9 +305,16 @@
<div class="col-sm-8">
<p>Preview:</p>
<div class="store-logo-holder">
<a href="{{ config('site_config.images_directory') . 'teamstore/store-logo-placeholder.jpg' }}" class="img_store_logo_href" data-toggle="lightbox">
<img class="img_store_logo_img" id="img_store_logo" src="{{ config('site_config.images_directory') . 'teamstore/store-logo-placeholder.jpg' }}" style="max-width: 100%; max-height: 100%; ">
</a>
@if($template_array[0]->Thumbnail != null)
<a href="{{ config('site_config.images_directory') . $template_array[0]->Thumbnail }}" class="img_store_logo_href" data-toggle="lightbox">
<img class="img_store_logo_img" id="img_store_logo" src="{{ config('site_config.images_directory') . $template_array[0]->Thumbnail }}" style="max-width: 100%; max-height: 100%; ">
</a>
@else
<a href="{{ config('site_config.images_directory') . 'templates/thumbnail/visualizer-placeholder.jpg' }}" class="img_store_logo_href" data-toggle="lightbox">
<img class="img_store_logo_img" id="img_store_logo" src="{{ config('site_config.images_directory') . 'templates/thumbnail/visualizer-placeholder.jpg' }}" style="max-width: 100%; max-height: 100%; ">
</a>
@endif
</div>
</div>
</div>
@@ -304,7 +322,7 @@
<div class="col-sm-12">
<ul class="list-inline pull-right" style="margin-top: 50px;">
<li><button type="button" id="stepOneNextBtn" class="btn btn-primary next-step" >Next <i class="fa fa-long-arrow-right" aria-hidden="true"></i></button></li>
<li><button type="button" id="stepOneNextBtn_edit" class="btn btn-primary next-step" >Next <i class="fa fa-long-arrow-right" aria-hidden="true"></i></button></li>
</ul>
</div>
</div>
@@ -320,21 +338,27 @@
<label class="col-sm-2 control-label">Front</label>
<div class="col-sm-10">
<div class="input-group">
<span class="input-group-btn">
<select name="front_visualizer_type" class="form-control" style="width:100px;">
<option>Jersey</option>
<option>Shorts</option>
<option>Shirts</option>
<option>Hoodie</option>
</select>
</span>
<input type="file" name="front_visualizer" data-use-id="front_visualizer" class="form-control upload-visualizer">
<span class="input-group-btn">
<button data-visualizer="#" class="btn btn-primary front_visualizer_href btn-preview-visualizer" type="button">
<i class="fa fa-eye" aria-hidden="true">
</i> Preview
</button>
</span>
@foreach ($template_path_array as $front)
@if ($front->Side == "Front")
<span class="input-group-btn">
<select name="front_visualizer_type" class="form-control" style="width:100px;">
<option @if ($front->Type == "Jersey") selected @endif>Jersey</option>
<option @if ($front->Type == "Shorts") selected @endif>Shorts</option>
<option @if ($front->Type == "Shirts") selected @endif>Shirts</option>
<option @if ($front->Type == "Hoodie") selected @endif>Hoodie</option>
</select>
</span>
<input type="file" name="front_visualizer" data-use-id="front_visualizer" class="form-control upload-visualizer">
<input type="hidden" value="{{ $front->Path }}" name="current_front_visualizer" class="form-control">
<input type="hidden" value="{{ $front->Id }}" name="front_visualizer_id" class="form-control">
<span class="input-group-btn">
<button data-for="edit" class="btn btn-primary front_visualizer_href btn-preview-visualizer" type="button" data-visualizer="{{ config('site_config.images_directory') . $front->Path }}">
<i class="fa fa-eye" aria-hidden="true">
</i> Preview
</button>
</span>
@endif
@endforeach
</div>
</div>
</div>
@@ -343,21 +367,27 @@
<label class="col-sm-2 control-label">Back</label>
<div class="col-sm-10">
<div class="input-group">
<span class="input-group-btn">
<select name="back_visualizer_type" class="form-control" style="width:100px;">
<option>Jersey</option>
<option>Shorts</option>
<option>Shirts</option>
<option>Hoodie</option>
</select>
</span>
<input type="file" name="back_visualizer" data-use-id="back_visualizer" class="form-control upload-visualizer">
<span class="input-group-btn">
<button data-visualizer="#" class="btn btn-primary back_visualizer_href btn-preview-visualizer" type="button">
<i class="fa fa-eye" aria-hidden="true">
</i> Preview
</button>
</span>
@foreach ($template_path_array as $back)
@if ($back->Side == "Back")
<span class="input-group-btn">
<select name="back_visualizer_type" class="form-control" style="width:100px;">
<option @if ($back->Type == "Jersey") selected @endif>Jersey</option>
<option @if ($back->Type == "Shorts") selected @endif>Shorts</option>
<option @if ($back->Type == "Shirts") selected @endif>Shirts</option>
<option @if ($back->Type == "Hoodie") selected @endif>Hoodie</option>
</select>
</span>
<input type="file" name="back_visualizer" data-use-id="back_visualizer" class="form-control upload-visualizer">
<input type="hidden" name="current_back_visualizer" data-use-id="back_visualizer" value="{{ $back->Path }}" class="form-control">
<input type="hidden" name="back_visualizer_id" data-use-id="back_visualizer" value="{{ $back->Id }}" class="form-control">
<span class="input-group-btn">
<button data-for="edit" class="btn btn-primary back_visualizer_href btn-preview-visualizer" type="button" data-visualizer="{{ config('site_config.images_directory') . $back->Path }}">
<i class="fa fa-eye" aria-hidden="true">
</i> Preview
</button>
</span>
@endif
@endforeach
</div>
</div>
</div>
@@ -366,21 +396,27 @@
<label class="col-sm-2 control-label">Right</label>
<div class="col-sm-10">
<div class="input-group">
<span class="input-group-btn">
<select name="right_visualizer_type" class="form-control" style="width:100px;">
<option>Jersey</option>
<option>Shorts</option>
<option>Shirts</option>
<option>Hoodie</option>
</select>
</span>
<input type="file" name="right_visualizer" data-use-id="right_visualizer" class="form-control upload-visualizer">
<span class="input-group-btn">
<button data-visualizer="#" class="btn btn-primary right_visualizer_href btn-preview-visualizer" type="button">
<i class="fa fa-eye" aria-hidden="true">
</i> Preview
</button>
</span>
@foreach ($template_path_array as $right)
@if ($right->Side == "Right")
<span class="input-group-btn">
<select name="right_visualizer_type" class="form-control" style="width:100px;">
<option @if ($right->Type == "Jersey") selected @endif>Jersey</option>
<option @if ($right->Type == "Shorts") selected @endif>Shorts</option>
<option @if ($right->Type == "Shirts") selected @endif>Shirts</option>
<option @if ($right->Type == "Hoodie") selected @endif>Hoodie</option>
</select>
</span>
<input type="file" name="right_visualizer" data-use-id="right_visualizer" class="form-control upload-visualizer">
<input type="hidden" value="{{ $right->Path }}" name="current_right_visualizer" class="form-control">
<input type="hidden" value="{{ $right->Id }}" name="right_visualizer_id" class="form-control">
<span class="input-group-btn">
<button data-for="edit" class="btn btn-primary right_visualizer_href btn-preview-visualizer" type="button" data-visualizer="{{ config('site_config.images_directory') . $right->Path }}">
<i class="fa fa-eye" aria-hidden="true">
</i> Preview
</button>
</span>
@endif
@endforeach
</div>
</div>
</div>
@@ -388,21 +424,27 @@
<label class="col-sm-2 control-label">Left</label>
<div class="col-sm-10">
<div class="input-group">
<span class="input-group-btn">
<select name="left_visualizer_type" class="form-control" style="width:100px;">
<option>Jersey</option>
<option>Shorts</option>
<option>Shirts</option>
<option>Hoodie</option>
</select>
</span>
<input type="file" name="left_visualizer" data-use-id="left_visualizer" class="form-control upload-visualizer">
<span class="input-group-btn">
<button data-visualizer="#" class="btn btn-primary left_visualizer_href btn-preview-visualizer" type="button">
<i class="fa fa-eye" aria-hidden="true">
</i> Preview
</button>
</span>
@foreach ($template_path_array as $left)
@if ($left->Side == "Left")
<span class="input-group-btn">
<select name="left_visualizer_type" class="form-control" style="width:100px;">
<option @if ($left->Type == "Jersey") selected @endif>Jersey</option>
<option @if ($left->Type == "Shorts") selected @endif>Shorts</option>
<option @if ($left->Type == "Shirts") selected @endif>Shirts</option>
<option @if ($left->Type == "Hoodie") selected @endif>Hoodie</option>
</select>
</span>
<input type="file" name="left_visualizer" data-use-id="left_visualizer" class="form-control upload-visualizer">
<input type="hidden" value="{{ $left->Path }}" name="current_left_visualizer" class="form-control upload-visualizer">
<input type="hidden" value="{{ $left->Id }}" name="left_visualizer_id" class="form-control">
<span class="input-group-btn">
<button data-for="edit" class="btn btn-primary left_visualizer_href btn-preview-visualizer" type="button" data-visualizer="{{ config('site_config.images_directory') . $left->Path }}">
<i class="fa fa-eye" aria-hidden="true">
</i> Preview
</button>
</span>
@endif
@endforeach
</div>
</div>
</div>
@@ -413,18 +455,18 @@
<label class="col-sm-4 control-label">Select Visualizer Format</label>
<div class="col-sm-8">
<select class="form-control" name="visualizer_format">
<option value="svg">SVG</option>
<option value="png">PNG</option>
<option @if($template_array[0]->TemplateFormat == "svg") selected @endif value="svg" >SVG</option>
<option @if($template_array[0]->TemplateFormat == "png") selected @endif value="png">PNG</option>
</select>
</div>
</div>
<div class="form-group">
<label class="col-sm-4 control-label">Set Default Body Color</label>
<div class="col-sm-6">
<input type="text" class="form-control" name="main_body_label" value="Main Body" placeholder="Set Default Body Color">
<input type="text" class="form-control" name="main_body_label" value="{{ $default_body_color_array[0]->DisplayName }}" placeholder="Set Default Body Color">
</div>
<div class="col-sm-2">
<input type="hidden" name="main_body_def_color" value="#e2e2e2" class="colorPicker form-control">
<input type="hidden" name="main_body_def_color" value="{{ $default_body_color_array[0]->RGBColor }}" class="colorPicker form-control">
</div>
</div>
<div class="form-group">
@@ -432,20 +474,60 @@
<div class="col-sm-8">
<select class="form-control" id="numberOfTrims" name="numberOfTrims">
@for($i = 0; $i <= 10; $i++)
<option> {{$i }}</option>
@if ($template_array[0]->Trim == $i)
<option selected>{{ $i }}</option>
@else
<option>{{ $i }}</option>
@endif
@endfor
</select>
</div>
</div>
<div id="list_of_trims">
{{-- {{ var_dump($default_trim_color_array) }} --}}
@php ($a = 1)
@for ($i = 0; $i < $template_array[0]->Trim; $i++)
{{-- {{ $default_trim_color_array[$i]->RGBColor }} --}}
@if ($i == 0)
<div class="form-group">
<label class="col-sm-4 control-label">Set Default Trim Color</label>
<div class="col-sm-6">
<input type="text" name="trim_label[]" class="form-control" value="{{ $default_trim_color_array[$i]->DisplayName }}" placeholder="{{ "Trim " . $a }}">
</div>
<div class="col-sm-2">
<input type="hidden" name="trim_def_color[]" class="colorPicker-trim" value="{{ $default_trim_color_array[$i]->RGBColor }}">
</div>
</div>
@else
<div class="form-group">
<label class="col-sm-4 control-label">&nbsp;</label>
<div class="col-sm-6">
<input type="text" name="trim_label[]" class="form-control" value="{{ $default_trim_color_array[$i]->DisplayName }}" placeholder="{{ "Trim " . $a }}">
</div>
<div class="col-sm-2">
<input type="hidden" name="trim_def_color[]" class="colorPicker-trim" value="{{ $default_trim_color_array[$i]->RGBColor }}">
</div>
</div>
@endif
@php ($a++)
@endfor
{{-- @foreach ($default_trim_color_array as $trim_color)
@if ($i == 1)
{{ "if " . $i}}
@else
{{ "else " . $i}}
@endif
$i++;
@endforeach --}}
</div>
</div>
<br><br><br>
<div class="col-sm-12">
<ul class="list-inline pull-right" style="margin-top: 50px;">
<li><button type="button" class="btn btn-default prev-step"><i class="fa fa-long-arrow-left" aria-hidden="true"></i> Previous</button></li>
<li><button type="button" class="btn btn-primary next-step" id="stepTwoNextBtn">Next <i class="fa fa-long-arrow-right" aria-hidden="true"></i></button></li>
<li><button type="button" class="btn btn-primary next-step" id="stepTwoNextBtn_edit">Next <i class="fa fa-long-arrow-right" aria-hidden="true"></i></button></li>
</ul>
</div>
</div>