<?php
$this->load->view($left);
$this->load->view($header);
?>
<style type="text/css">
    .ibox-content {
        border-style : none;
    }

    .hr-line-dashed {
        margin: 5px 0;
    }

    .disabledbutton {
        pointer-events: none;
        opacity: 0.4;
    }


    .imageupload {
        background: white;
        border-radius: 5px;
        border: 2px dashed rgb(0, 135, 247);
        border-image: none;
        max-width: 500px;
        min-height:200px;
        margin-left: auto;
        margin-right: auto;
    }

    .svgimageupload {
        background: white;
        border-radius: 5px;
        border: 2px dashed rgb(0, 135, 247);
        border-image: none;
        max-width: 500px;
        min-height:200px;
        margin-left: auto;
        margin-right: auto;
    }
    
    .addform .required:after {
  	content: " *";
    	color: red;
    	font-weight: 100;
    }


</style>
<link rel="stylesheet" 
              href=
"https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.1/css/select2.min.css" />

<div class="row wrapper border-bottom white-bg page-heading">
    <div class="col-sm-4">
        <h2>New Product</h2>
    </div>
</div>
<div class="wrapper wrapper-content">
    <div class="row text-center animated fadeInRightBig">
        <div class="col-lg-12">
            <form method="POST" action="<?php echo site_url('all_products/newproduct');?>" class="form-horizontal addform" id="invoice_data" enctype='multipart/form-data'>
                <div class="ibox float-e-margins">
                    <div class="ibox-content">
                        <?php if($consumar_product){ ?>
                        <div class="form-group">
                            <label class="col-sm-2 control-label required">Customer</label>
                            <div class="col-sm-10">
                                <select class="form-control select2" multiple name="customer[]" id="customer" required>
                                    <option value="">Select Customer</option>
                                    <?php
                                    if (count($customer_name_list) > 0) {
                                        foreach ($customer_name_list as $key => $value) {
                                            ?>
                                            <option value="<?php echo $value->cust_id; ?>" ><?php echo $value->name; ?></option>
                                    <?php
                                        }
                                    }
                                    ?>
                                </select>
                            </div>
                        </div>
                        <?php } ?>
                        <div class="form-group">
                            <label class="col-sm-2 control-label required">Name</label>
                            <div class="col-sm-10">
                                <input type="text" name="name" id="name" class="form-control" placeholder="Name" value="" required>
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-2 control-label required">Vendor</label>
                            <div class="col-sm-10">
                                <select class="form-control select2" name="vendor" id="vendor" required>
                                    <option value="">Select Vendor</option>
                                    <?php
                                    if (count($vendor_list) > 0) {
                                        foreach ($vendor_list as $key => $value) {
                                            ?>
                                            <option value="<?php echo $value->id; ?>" ><?php echo $value->vendor_name; ?></option>
                                            <?php
                                        }
                                    }
                                    ?>
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label"><a id="create_vendor_option" href='javascript:void(0)'>Create Vendor</a></label>
                            <div class="col-sm-10">
                                <input type="text" name="create_vendor" id="create_vendor" class="form-control" placeholder="Create Vendor" value="" >
                            </div>
                            
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label required">Category</label>
                            <div class="col-sm-10">
                                <select class="form-control select2" name="category" id="category" required>
                                    <option value="">Select Category</option>
                                    <?php
                                    if (count($category_list) > 0) {
                                        foreach ($category_list as $key => $value) {
                                            ?>
                                            <option value="<?php echo $value->id; ?>" ><?php echo $value->name; ?></option>
                                            <?php
                                        }
                                    }
                                    ?>
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label"><a id="create_category_option" href='javascript:void(0)'>Create Category</a></label>
                            <div class="col-sm-10">
                                <input type="text" name="create_category" id="create_category" class="form-control" placeholder="Create Category" value="" >
                            </div>
                            
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label required">SKU</label>
                            <div class="col-sm-10">
                                <input type="text" name="photo_id" id="photo_id" class="form-control" placeholder="SKU" value="" required>
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-2 control-label required">Description</label>
                            <div class="col-sm-10">
                                <input type="text" name="description" id="description" class="form-control" placeholder="Description" value="" required>
                            </div>
                        </div>

                        <!--<div class="form-group">
                            <label class="col-sm-2 control-label">Color</label>
                            <div class="col-sm-10">
                                
                                <select class="form-control select2" name="color" id="color" required>
                                    <option value="">Select Color</option>
                                    <?php
                                    if (!empty($color_drop)) {
                                        foreach ($color_drop->result() as $value) {
                                            ?>
                                            <option value="<?php echo $value->id; ?>" ><?php echo $value->color; ?></option>
                                            <?php
                                        }
                                    }
                                    ?>
                                </select>
                            </div>
                            
                        </div>-->
                        
                        
                        <div class="form-group">
                            <label class="col-sm-2 control-label required">Colors</label>
                            <div class="col-sm-10">
                                
                                <select class="form-control select2" multiple name="colors[]" id="colors" required>
                                    <option value="">Select Color</option>
                                    <?php
                                    if (!empty($color_drop)) {
                                        foreach ($color_drop->result() as $value) {
                                            ?>
                                            <option value="<?php echo $value->color; ?>" ><?php echo $value->color; ?></option>
                                            <?php
                                        }
                                    }
                                    ?>
                                </select>
                            </div>
                            
                        </div>

                        <div class="form-group">
                            <label class="col-sm-2 control-label"><a id="create_color_option" href='javascript:void(0)'>Create Color</a></label>
                            <div class="col-sm-10">
                                <input type="text" name="create_color" id="create_color" class="form-control" placeholder="Create Color" value="" >
                            </div>
                            
                        </div>
                        
                        <!--<div class="form-group">
                            <label class="col-sm-2 control-label">Residential</label>
                            <div class="col-sm-10">
                                <select class="form-control" name="isResidential" id="isResidential" data-tr="0" required>
                                                <option value="">Residential</option>
                                                  <option value="1" >Yes</option>
                                                  <option value="0" >No</option>  
                                </select>
                            </div>
                            
                        </div>
                        
                        <div class="form-group">
                            <label class="col-sm-2 control-label">Commercial</label>
                            <div class="col-sm-10">
                                <select class="form-control" name="isCommercial" id="isCommercial" data-tr="0" required>
                                                <option value="">Commercial</option>
                                                  <option value="1" >Yes</option>
                                                  <option value="0" >No</option>  
                                </select>
                            </div>
                            
                        </div>
                        
                        <div class="form-group">
                            <label class="col-sm-2 control-label">Furniture</label>
                            <div class="col-sm-10">
                                <select class="form-control" name="isFurniture" id="isFurniture" data-tr="0" required>
                                                <option value="">Furniture</option>
                                                  <option value="1" >Yes</option>
                                                  <option value="0" >No</option>  
                                </select>
                            </div>
                            
                        </div>
                        
                        <div class="form-group">
                            <label class="col-sm-2 control-label">Promo</label>
                            <div class="col-sm-10">
                                 <input type="text" name="promo" id="promo" class="form-control" placeholder="Promo" value="" >
                            </div>
                            
                        </div>-->
                        
                        <div class="form-group">
                            <label class="col-sm-2 control-label">Sale</label>
                            <div class="col-sm-10">
                                 <input type="text" name="sale" id="sale" class="form-control" placeholder="Sale" value="" >
                            </div>
                            
                        </div>
                        
                        <div class="form-group">
                            <label class="col-sm-2 control-label">Custom Price</label>
                            <div class="col-sm-10">
                                 <input type="text" name="custom_price" id="custom_price" class="form-control" placeholder="Custom Price" value="" >
                            </div>
                            
                        </div>
                        
                        
                        <div class="form-group">
                            <div class="col-sm-12">
                                <input type="hidden" name="new_arrival" id="new_arrival" class="form-control" value="0" >
                            </div>
                            
                        </div>
                        
                        
                        <div class="form-group">
                            <label class="col-sm-2 control-label required">Material</label>
                            <div class="col-sm-10">
                                <input type="text" name="material" id="material" class="form-control" placeholder="Material" value="" required>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">Backing</label>
                            <div class="col-sm-10">
                                <input type="text" name="backing" id="backing" class="form-control" placeholder="Backing" value="">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label required">Quality</label>
                            <div class="col-sm-10">
                                <input type="text" name="quality" id="quality" class="form-control" placeholder="Quality" value="" required>
                                <?php /* ?> <select class="form-control" name="quality" id="quality" required>
                                    <option value="">Select Quality</option>
                                    <?php
                                    if (!empty($qualities_drop)) {
                                        foreach ($qualities_drop->result() as $value) {
                                            ?>
                                            <option value="<?php echo $value->id; ?>" ><?php echo $value->name; ?></option>
                                            <?php
                                        }
                                    }
                                    ?>
                                </select> <?php */ ?>
                            </div>
                            
                        </div>
                        
                        <div class="form-group">
                            <label class="col-sm-2 control-label"><a id="create_quality_option" href='javascript:void(0)'>Create Quality</a></label>
                            <div class="col-sm-10">
                                <input type="text" name="create_quality" id="create_quality" class="form-control" placeholder="Create Quality" value="" >
                            </div>
                            
                        </div>
                        
                        <div class="form-group">
                            <label class="col-sm-2 control-label required">Collection</label>
                            <div class="col-sm-10">
                                <select class="form-control" name="collections" id="collections" required>
                                    <option value="">Select Collection</option>
                                    <?php
                                    if (!empty($collection_list)) {
                                        foreach ($collection_list as $value) {
                                            ?>
                                            <option value="<?php echo $value->id; ?>" ><?php echo $value->name; ?></option>
                                            <?php
                                        }
                                    }
                                    ?>
                                </select>
                            </div>
                        </div>
                        
                        <div class="form-group">
                            <label class="col-sm-2 control-label required">Design</label>
                            <div class="col-sm-10">
                                <input type="text" name="design" id="design" class="form-control" placeholder="Design" value="" required>
                            </div>
                        </div>
                        
                        <div class="form-group">
                            <label class="col-sm-2 control-label required">Vendor SKU</label>
                            <div class="col-sm-10">
                                <input type="text" name="vendor_sku" id="vendor_sku" class="form-control" placeholder="Vendor SKU" value="" required>
                            </div>
                        </div>
                        
                        
                        <div class="form-group">
                            <label class="col-sm-2 control-label">Keywords</label>
                            <div class="col-sm-10">
                                <input type="text" name="keyword_additions" id="keyword_additions" class="form-control" placeholder="Keywords" value="">
                            </div>
                        </div>
                        
                        <div class="form-group">
                            <label class="col-sm-2 control-label required">Image</label>
                            <div class="col-sm-10">
                                <!-- <input type="file" name="productimage" id="productimage" class="form-control imageupload" required> -->

                                <input type="hidden" multiple="multiple" name="image_name[]" class="form-control image_upload" />
                                <div class="needsclick imageupload" id="demo-upload">
                                    <DIV class="dz-message needsclick">  

                                        Drop files here or click to upload.

                                    </DIV>
                                </div>



                            </div>
                        </div>
                        
                        <?php if($consumar_product){ ?>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">Svg Image</label>
                            <div class="col-sm-10">
                                <!-- <input type="file" name="productimage" id="productimage" class="form-control imageupload" required> -->

                                <input type="hidden" name="svg_image_name" class="form-control svg_image_upload" />
                                <div class="needsclick svgimageupload" id="demo-svg-upload">
                                    <DIV class="svg_dz-message needsclick">  

                                        Drop only <b>svg</b> files here or click to upload.

                                    </DIV>
                                </div>



                            </div>
                        </div>
                        <?php } ?>

                        <!-- <div class="form-group date_calender">
                             <label class="col-sm-2 control-label">Invoice Date</label>
                             <div class="col-sm-4">
                                 <div class="input-group date">
                                     <span class="input-group-addon"><i class="fa fa-calendar"></i></span><input type="text" name="invoice_date" id="invoice_date" class="form-control" value="<?php echo (!empty($invoice_id) && isset($invoice_data) ? date('d/m/Y', strtotime(str_replace('-', '/', $invoice_data['invoice_date']))) : date('d/m/Y')); ?>">
                                 </div>
                             </div>
                             <label class="col-sm-2 control-label">Due Date</label>
                             <div class="col-sm-4">
                                 <div class="input-group date">
                                     <span class="input-group-addon"><i class="fa fa-calendar"></i></span><input type="text" name="due_date" id="due_date" class="form-control" value="<?php echo (!empty($invoice_id) && isset($invoice_data) ? date('d/m/Y', strtotime(str_replace('-', '/', $invoice_data['due_date']))) : date('d/m/Y')); ?>">
                                 </div>
                             </div>
                         </div> -->
                        <div class="col-md-12" style="border-top:1px solid #939393; padding-top: 5px;">
                                <h3 style="float:left;"><b>Extra Images :</b></h3>
                        </div>
                                        
                                      
                            <div class="col-md-12">
                                <div class="col-md-3">
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">File</label>
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label text-center">Type</label>
                                    </div>
                                </div>
                            </div>
                        <div id="divextraimagerow">
                            <div class="col-md-12">
                                <div class="col-md-3">
                                    <div class="form-group">
                                        <div class="col-sm-10">
                                            <input type="file" name="extra_image[]"  class="form-control" value="">
                                            <input type="hidden" name="extra_image_id[]" value="">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="form-group">
                                        <div class="col-sm-10">
                                            <select class="form-select" name="extra_image_type[]" style="float:left;">
                                                <option value="">Select image type</option>
                                                <option value="ang">ang</option>
                                                <option value="back">back</option>
                                                <option value="corner">corner</option>
                                                <option value="head">head</option>
                                                <option value="roomscene">roomscene</option>
                                                <option value="wash">wash</option>
                                                <option value="rect">rect</option>
                                                <option value="zoom">zoom</option>
                                            </select>

                                        </div>
                                    </div>
                            </div>
                        </div>
                    </div>
                        <div class="row">
                            <div class="col-md-10">
                                <div class="form-group">
                                    <div class="col-sm-2"> 
                                        <button type="button" id="btn_extra_image_add" class="btn btn-primary"><i class="fa fa-plus"></i></button>
                                    </div>
                                </div>
                            </div>
                        <!-- variations -->
                        <div id="sell_item" class="form-group">
                            <!-- Variations(s) -->
                            <div class="col-md-12" style="border-top:1px solid #939393; padding-top: 5px;">
                                <h3 style="float:left;"><b>Variations(s) :</b></h3>
                            </div>
                            <div class="col-sm-12 table-responsive">
                                <table class="table table-bordered">
                                    <thead>
                                        <tr><th></th>
                                            <th>GS1</th>
                                            <th>MSRP</th>
                                            <!--<th>Length</th>
                                            <th>Width</th>
                                            <th>Height</th>--->
                                            <th>Old Price</th>
                                            <th class="required">Price</th>
                                            <th>Cost</th>
                                            <th class="required">Search Size</th>
                                            <th class="required">Size</th>
                                            <!--<th>Shape</th>
                                            <th>Stock</th>-->
                                            <!--<th>shippingHeight</th>
                                            <th>shippingLength</th>
                                            <th>shippingWidth</th>--->
                                            <th class="required">Active</th>
                                            <th class="required">Size SKU</th>
                        
                                            
                                        </tr>
                                    </thead>
                                    <tbody id="products">
                                       
                                            <tr class="tr_0">
                                                <td></td>
                                                <td style="width: 10%;"><input type="text" style="padding: 0px 0px;" name="gs1[]" id="hsn_code0" class="form-control hsn_code" data-tr="0"></td>
                                                <td style="width: 10%;"><input type="number" style="padding: 0px 0px;" name="msrp[]" id="hsn_code0" class="form-control hsn_code" data-tr="0"></td>
                                                <!--<td style="width: 10%;"><input type="text" style="padding: 0px 0px;" name="length[]" id="gst_rate0" class="form-control gst_rate" data-tr="0"></td>
                                                <td style="width: 10%;"><input type="number" style="padding: 0px 0px;" name="width[]" class="form-control quantity" data-tr="0"></td>
                                                <td style="width: 10%;"><input type="number" style="padding: 0px 0px;" name="height[]" class="form-control quantity" data-tr="0"></td>-->
                                                <td style="width: 10%;"><input type="number" style="padding: 0px 0px;" name="old_cost[]" class="form-control unit_price" id="oldcost0" data-tr="0"></td>
                                                <td style="width: 10%;"><input type="number" style="padding: 0px 0px;width: 80px;" name="price[]" class="form-control unit_price" id="unit_price0" data-tr="0" required></td>
                                                
                                                <td style="width: 10%;"><input type="number" style="padding: 0px 0px;" name="cost[]" class="form-control unit_price" id="cost0" data-tr="0"></td>
                                                <td style="width: 10%;">
                                                    <!--<input type="number" name="size[]" class="form-control discount" data-tr="0">-->
                                                    <select class="form-control discount" style="padding: 0px 0px;width: 80px;" name="searchsize[]" id="searchsize" data-tr="0" required>
                                                        <option value="">Search Size</option>
                                                        <?php
                                                        if (!empty($size_drop)) {
                                                            foreach ($size_drop->result() as $value) {
                                                                ?>
                                                                <option value="<?php echo $value->id; ?>" ><?php echo $value->size; ?></option>
                                                                <?php
                                                            }
                                                        }
                                                        ?>
                                                    </select>
                                                </td>
                                                <td style="width: 10%;"><input type="text" style="padding: 0px 0px;" name="size[]" class="form-control unit_price" id="cost0" data-tr="0" required></td>
                                                <!--<td style="width: 10%;">
                                                      <select class="form-control hsn_code" style="padding: 0px 0px;width: 80px;" name="shape[]" id="shape" data-tr="0" required>
                                                        <option value="">Shape</option>
                                                        <?php
                                                        if (!empty($shape_drop)) {
                                                            foreach ($shape_drop->result() as $value) {
                                                                ?>
                                                                <option value="<?php echo $value->id; ?>" ><?php echo $value->shape; ?></option>
                                                                <?php
                                                            }
                                                        }
                                                        ?>
                                                    </select>
                                                </td>
                                                <td style="width: 10%;"><input type="text" style="padding: 0px 0px;" name="shape[]" id="hsn_code0" class="form-control hsn_code" data-tr="0"></td>
                                                <td style="width: 10%;"><input type="text" style="padding: 0px 0px;" name="stock[]" id="hsn_code0" class="form-control hsn_code" data-tr="0"></td>-->
                                                <!--<td style="width: 10%;"><input type="text" style="padding: 0px 0px;" name="shippingHeight[]" id="hsn_code0" class="form-control hsn_code" data-tr="0"></td>
                                                <td style="width: 10%;"><input type="text" style="padding: 0px 0px;" name="shippingLength[]" id="hsn_code0" class="form-control hsn_code" data-tr="0"></td>
                                                <td style="width: 10%;"><input type="text" style="padding: 0px 0px;" name="shippingWidth[]" id="hsn_code0" class="form-control hsn_code" data-tr="0"></td>-->
                                                <td style="width: 10%;">
                                                      <select class="form-control hsn_code" style="padding: 0px 0px;width: 80px;" name="active[]" id="shape" data-tr="0" required>
                                                        <option value="">Active</option>
                                                          <option value="1" >Yes</option>
                                                          <option value="0" >No</option>  
                                                    </select>
                                                </td>
                                                <td style="width: 10%;"><input type="text" style="padding: 0px 0px;" name="sizesku[]" id="hsn_code0" class="form-control hsn_code" data-tr="0" required></td>
                                                <!--<td style="width: 10%;"><input type="text" style="padding: 0px 0px;" name="aliasSize[]" id="hsn_code0" class="form-control hsn_code" data-tr="0"></td>-->
                                            </tr>
                        
                                    </tbody>
                                </table>
                                <div class="form-group">
                                    <div class="col-lg-6" style="float: right;">
                                        <button type="button" style="float: right;" class="btn btn-success additem"><i class="fa fa-plus-square"></i><span class="m-l-xs">Add Item</span></button>
                                    </div>                            
                                </div>
                            </div>
                            <!-- Additional Attribute(s) -->
                            
                            <div class="col-md-12" style="border-top:1px solid #939393; padding-top: 5px;">
                                <h3 style="float:left;"><b>Additional Attribute :</b></h3>
                            </div>
                            <div class="col-md-12">
                                <div class="col-md-3">
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">Name</label>
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">value</label>
                                    </div>
                                </div>
                                <div class="col-md-2">
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">Frontend</label>
                                    </div>
                                </div>
                                <div class="col-md-2">
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">Backend</label>
                                    </div>
                                </div>
                                <div class="col-md-2">
                                    <div class="form-group">

                                    </div>
                                </div>
                            </div>
                            <div id="divrow">
                                <div class="col-md-12">
                                    <div class="col-md-3">
                                        <div class="form-group">
                                            <div class="col-sm-10">
                                                <input type="text" name="add_name[]" class="form-control" value="">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-md-3">
                                        <div class="form-group">
                                            <div class="col-sm-10">
                                                <input type="text" name="add_val[]" class="form-control" value="">
                                            </div>
                                        </div>
                                    </div> 
                                    <div class="col-md-2">
                                        <div class="form-group">
                                            <div class="col-sm-10">
                                               <select name="show_front[]">
                                                  <option value="1">True</option>
                                                  <option value="0">False</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>  
                                    <div class="col-md-2">
                                        <div class="form-group">
                                            <div class="col-sm-10">
                                                <select name="show_back[]">
                                                  <option value="1">True</option>
                                                  <option value="0">False</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>  
                                </div>
                            </div>
                            <div class="col-md-10">
                                <div class="form-group">
                                    <div class="col-sm-2"> 
                                        <button type="button" id="btn_add" class="btn btn-primary"><i class="fa fa-plus"></i></button>
                                    </div>
                                </div>
                            </div>
                            <!-- Attribute(s) -->
                            
                            <div class="col-md-12" style="border-top:1px solid #939393; padding-top: 5px;">
                                <h3 style="float:left;"><b>Attribute(s) :</b></h3>
                            </div>
                            <div class="col-sm-12 table-responsive">
                                    
                                <table class="table table-bordered">
                                        <thead>
                                            <tr><th></th>
                                                <th>Group</th>
                                                <th>value</th>
                                                <th>Name</th>
                                            </tr>
                                        </thead>
                                        <tbody id="att_products">
                                            <?php 
                                                   
                                            ?>
                                                        <tr class="att_tr_0">
                                                        
                                                                <td style="width: 10%;">
                                                                <button type="button" class="btn btn-danger btn-circle btn-xxs remove_att_item" data-tr="1"><i class="fa fa-times-circle-o fa-lg"></i></button></td>
                                                        
                                                        <td style="width: 30%;">
                                                            <input type="text" name="group[]" id="gst_rate0" class="form-control gst_rate" value="">
                                                        </td>
                                                        <td style="width: 30%;">
                                                            <input type="text" name="value[]" id="gst_rate0" class="form-control gst_rate" value="">
                                                        </td>
                                                        <td style="width: 30%;">
                                                            <input type="text" name="att_name[]" class="form-control quantity" value="">
                                                        
                                                        </td>
                                                        
                                                    </tr>
                                        </tbody>
                                </table>
                                <div class="form-group" style="float: right;">
                                        <div class="col-lg-6">
                                            <button type="button" style="float: right;" class="btn btn-success addAttributeItem"><i class="fa fa-plus-square"></i><span class="m-l-xs">Add Item</span></button>
                                        </div>                            
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
                <!--<div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-lg-8 pull-right">
                                <div class="form-group">
                                    <label class="col-sm-3 control-label" style="text-align: left;">Customer Note</label>
                                    <div class="col-sm-9">
                                        <textarea class="form-control" name="customer_note"></textarea>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div> -->
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-lg-6 pull-right">
                                <div class="form-group">
                                    <div class="col-sm-12 col-sm-offset-2">
                                        <!-- <button class="btn btn-info generate_invoice" type="button" data-status="0"><i class="fa fa-dropbox"></i><span class="m-l-xs">Save Draft</span></button> -->
                                        <button class="btn btn-primary generate_invoice" type="submit" data-status="1"><i class="fa fa-download"></i><span class="m-l-xs">Save</span></button>
                                        <button class="btn btn-danger back_listing" type="button">Cancel</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
<?php $this->load->view($footer); ?>
<script type="text/javascript" src="<?php echo js_url('jquery.scannerdetection'); ?>"></script>
<script type="text/javascript" src="<?php echo base_url('assets/js/dropzone.css'); ?>"></script>
<script type="text/javascript" src="<?php echo js_url('dropzone'); ?>"></script>
<script type="text/javascript">
    $(document).ready(function () {
        
        $('#create_vendor').hide();
        $('#create_category').hide();
        $('#create_color').hide();
        $('#create_quality').hide();
        
        $('#create_vendor_option').click(function(e){
            e.preventDefault();
            var vendor_value=$(this).closest('.form-group').prev('.form-group').children().eq(1).val();
            if(vendor_value.length===0){
                 $('#vendor').prop('disabled', true);
                 $('#create_vendor').show();
            }
        });
        
        $('#create_category_option').click(function(e){
            e.preventDefault();
            var vendor_value=$(this).closest('.form-group').prev('.form-group').children().eq(1).val();
            if(vendor_value.length===0){
                 $('#category').prop('disabled', true);
                 $('#create_category').show();
            }
        });
        
        $('#create_color_option').click(function(e){
            e.preventDefault();
            var vendor_value=$(this).closest('.form-group').prev('.form-group').children().eq(1).val();
            if(vendor_value.length===0){
                 $('#color').prop('disabled', true);
                 $('#create_color').show();
            }
        });
        
        $('#create_quality_option').click(function(e){
            e.preventDefault();
            var vendor_value=$(this).closest('.form-group').prev('.form-group').children().eq(1).val();
            if(vendor_value.length===0){
                 $('#quality').prop('disabled', true);
                 $('#create_quality').show();
            }
        });
        
        
        Dropzone.autoDiscover = false;
        $(".imageupload").dropzone({
            url: "/admin/all_products/newimage",
            addRemoveLinks: true,
            success: function (file, response) {
                 if(response==0){
                     $('.dz-message').text('Sorry! Image not uploaded properly....');
                     $('.dz-message').css({ 'color': 'red', 'font-size': '15px' });
                     $('#demo-upload').css('border-color', 'red');
                     //$('.generate_invoice').prop('disabled', true);
                 }else{
                     $('.image_upload').val(response);
                     $('.dz-message').text('Congrats! Image uploaded properly....');
                     $('.dz-message').css({ 'color': 'green', 'font-size': '15px' });
                     $('#demo-upload').css('border-color', 'blue');
                     $('.generate_invoice').prop('disabled', false);
                 }
            },
            error: function (file, response) {
                file.previewElement.classList.add("dz-error");
            }
        });


        // For svg image upload
        Dropzone.autoDiscover = false;
        Dropzone.options.imageUpload = {
            maxFiles: 1,
            acceptedFiles: ".svg"
        };
        $(".svgimageupload").dropzone({
            url: "/admin/all_products/newSvgImage",
            addRemoveLinks: true,
            success: function (file, response) {
                 if(response==0){
                     $('.svg_dz-message').text('Sorry! Image not uploaded properly or not a svg image');
                     $('.svg_dz-message').css({ 'color': 'red', 'font-size': '15px' });
                     $('#demo-svg-upload').css('border-color', 'red');
                     //$('.generate_invoice').prop('disabled', true);
                 }else{
                     $('.svg_image_upload').val(response);
                     $('.svg_dz-message').text('Congrats! Image uploaded successfully');
                     $('.svg_dz-message').css({ 'color': 'green', 'font-size': '15px' });
                     $('#demo-svg-upload').css('border-color', 'blue');
                     $('.generate_invoice').prop('disabled', false);
                 }
            },
            error: function (file, response) {
                file.previewElement.classList.add("dz-error");
            }
        });
       

        var trId = 0;

        $('.additem').on('click', function () {
            trId++;
            // alert();
            var tr = '<tr class="tr_' + trId + '">';
            tr += '<td style="width: 10%;">';
             tr += '<button type="button" class="btn btn-danger btn-circle btn-xxs remove_item" data-tr="' + trId + '"><i class="fa fa-times-circle-o fa-lg"></i></button></td>';
            tr+='<td style="width: 10%;"><input type="text" style="padding: 0px 0px;" name="gs1[]" id="hsn_code"' + trId + '" class="form-control hsn_code" data-tr="' + trId + '"></td>\
                 <td style="width: 10%;"><input type="number" style="padding: 0px 0px;" name="msrp[]" id="hsn_code"' + trId + '" class="form-control hsn_code" data-tr="' + trId + '"></td>';
            tr += '<td style="width: 10%;"><input type="number" style="padding: 0px 0px;" name="old_cost[]" class="form-control unit_price" id="oldcost"'+ trId + '" data-tr="'+ trId + '"></td>';
                                                        
            tr += '<td style="width: 10%;"><input type="number" style="padding: 0px 0px;width: 80px;" name="price[]" class="form-control unit_price" id="unit_price"' + trId + '"  data-tr="' + trId + '" required></td>';
            tr += '<td style="width: 10%;"><input type="number" style="padding: 0px 0px;" name="cost[]" class="form-control unit_price" id="cost"' + trId + '" data-tr="' + trId + '"></td>';
            tr += '<td style="width: 10%;">';
             tr += '<select class="form-control" style="padding: 0px 0px;width: 80px;" name="searchsize[]" id="searchSize"' + trId + '" data-tr="' + trId + '" required>';
             tr += '<option value="">Search Size</option>';
                        <?php
                        if (!empty($size_drop)) {
                            foreach ($size_drop->result() as $val) {
                                ?>
                               tr += ' <option value="<?php echo $val->id; ?>"><?php echo str_replace("'", "\'", $val->size); ?></option>';
                                <?php
                            }
                        }
                        ?>
                tr +='</select>\
                </td>\
                  </td>';
            tr += '<td style="width: 10%;"><input type="text" style="padding: 0px 0px;" name="size[]" class="form-control unit_price" id="size"' + trId + '" data-tr="' + trId + '" required></td>';
            /*tr += '<td style="width: 10%;">\
                    <select class="form-control hsn_code" style="padding: 0px 0px;width: 80px;" name="shape[]" id="shape" data-tr="0" required>\
                <option value="">Shape</option>';
                <?php
                if (!empty($shape_drop)) {
                    foreach ($shape_drop->result() as $value2) {
                        ?>
                        tr += '<option value="<?php echo $value2->id; ?>"><?php echo str_replace("'", "\'", $value2->shape); ?></option>';
                        <?php
                    }
                }
                ?>
            tr+='</select>\
        </td>';*/
        
          /*tr += '<td style="width: 10%;"><input type="text" style="padding: 0px 0px;" name="stock[]" class="form-control unit_price" id="stock"' + trId + '" data-tr="' + trId + '"></td>';*/
          tr +=      '<td style="width: 10%;">\
                 <select class="form-control hsn_code" style="padding: 0px 0px;width: 80px;" name="active[]" id="active" data-tr="' + trId + '" required>';
                tr += '<option value="">Active</option>';
                tr += '<option value="1" >Yes</option>';
                tr += '<option value="0">No</option>';  
                tr += '</select>\
                </td>';
           tr += '<td style="width: 10%;"><input type="text" style="padding: 0px 0px;" name="sizesku[]" id="hsn_code"' + trId + '" class="form-control hsn_code" data-tr="' + trId + '" required></td>\
                  </tr>';


            $('#products').append(tr);

        });

        $(document).on('click', '.remove_item', function () {
            var trId = $(this).data('tr');
            $('.tr_' + trId).remove();
            delete items[trId];
            invoice_calculation()
        });


        /* Attributes add options */
        var trId = 0;

        $('.addAttributeItem').on('click', function () {
            trId++;
            
            var tr = '<tr class="att_tr_' + trId + '">';
            tr += '<td style="width: 10%;">';
             tr += '<button type="button" class="btn btn-danger btn-circle btn-xxs remove_att_item" data-tr="' + trId + '"><i class="fa fa-times-circle-o fa-lg"></i></button></td>';
            tr+='<td style="width: 30%;"><input type="text" style="padding: 0px 0px;" name="group[]" id="hsn_code"' + trId + '" class="form-control hsn_code" data-tr="' + trId + '"></td>\
                 <td style="width: 30%;"><input type="text" style="padding: 0px 0px;" name="value[]" id="hsn_code"' + trId + '" class="form-control hsn_code" data-tr="' + trId + '"></td>';
            tr += '<td style="width: 30%;"><input type="text" style="padding: 0px 0px;" name="att_name[]" id="hsn_code"' + trId + '" class="form-control hsn_code" data-tr="' + trId + '"></td>\
                  </tr>';
            $('#att_products').append(tr);

        });

        $(document).on('click', '.remove_att_item', function () {
            var trId = $(this).data('tr');
            $('.att_tr_' + trId).remove();
            delete items[trId];
            invoice_calculation()
        });




        // $(document).on('keyup change','#shipping_charge',function(){
        //      items['shipping_charge'] = $(this).val();
        //      invoice_calculation();
        // });

        // $(document).on('keyup change','#final_adjustment',function(){
        //      items['final_adjustment'] = $(this).val();
        //      invoice_calculation();
        // });




        function format(val, type) {
            if (type == 'cost' || type == 'per') {
                var va = parseFloat(val).toFixed(2);
            } else {
                var va = parseFloat(val);
            }
            var test = va.toString().replace('.', '.');
            String.prototype.reverse = function () {
                var s = "";
                var i = this.length;
                while (i > 0) {
                    s += this.substring(i - 1, i);
                    i--;
                }
                return s;
            };

            var n = test.reverse().replace(/(\d{3})/g, "$1 ").reverse();

            if (type == 'cost') {
                n = n;
            } else if (type == 'per') {
                n = n + ' %';
            }
            return n;
        }

    });
    $(document).ready(function () {
        $('#btn_add').on("click", function () {
            var m = 1;
            var app = '<div class="col-md-12">\
                                    <div class="col-md-3">\
                                        <div class="form-group">\
                                            <div class="col-sm-10">\
                                                <input type="text" name="add_name[]" class="form-control" value="">\
                                            </div>\
                                        </div>\
                                    </div>\
                                    <div class="col-md-3">\
                                        <div class="form-group">\
                                            <div class="col-sm-10">\
                                                <input type="text" name="add_val[]" class="form-control" value="">\
                                            </div>\
                                        </div>\
                                    </div>\
                                    <div class="col-md-2">\
                                        <div class="form-group">\
                                            <div class="col-sm-10">\
                                                <select name="show_front[]">\
                                                  <option value="1">True</option>\
                                                  <option value="0">False</option>\
                                                </select>\
                                            </div>\
                                        </div>\
                                    </div>\
                                    <div class="col-md-2">\
                                        <div class="form-group">\
                                            <div class="col-sm-10">\
                                                <select name="show_back[]">\
                                                  <option value="1">True</option>\
                                                  <option value="0">False</option>\
                                                </select>\
                                            </div>\
                                        </div>\
                                    </div>\
                                     <div class="col-md-2 remove_row">\
                                <div class="form-group">\
                                    <div class="col-sm-2">\
                                        <button type="button" class="btn btn-danger"><i class="fa fa-times"></i></button>\
                                    </div>\
                                </div>\
                            </div>\
                            </div>';

            $('#divrow').append(app);

            m++;
        });
        
        $('#btn_extra_image_add').on("click", function () {
            var m = 1;
            var app = '<div class="col-md-12">\
                                    <div class="col-md-3">\
                                        <div class="form-group">\
                                            <div class="col-sm-10">\
                                                <input type="file" name="extra_image[]" id="extra_image" class="form-control" value="">\
                                            <input type="hidden" name="extra_image_id[]" value="">\
                                            </div>\
                                        </div>\
                                    </div>\
                                    <div class="col-md-3">\
                                        <div class="form-group">\
                                            <div class="col-sm-10">\
                                                <select name="extra_image_type[]" style="float:left;">\
                                                <option value="">Select image type</option>\
                                                <option value="ang">ang</option>\
                                                <option value="back">back</option>\
                                                <option value="corner">corner</option>\
                                                <option value="head">head</option>\
                                                <option value="roomscene">roomscene</option>\
                                                <option value="wash">wash</option>\
                                                <option value="rect">rect</option>\
                                                <option value="zoom">zoom</option>\
                                            </select>\
                                            </div>\
                                        </div>\
                                    </div>\
                                     <div class="col-md-2 remove_row">\
                                <div class="form-group">\
                                    <div class="col-sm-2">\
                                        <button type="button" class="btn btn-danger"><i class="fa fa-times"></i></button>\
                                    </div>\
                                </div>\
                            </div>\
                            </div>';

            $('#divextraimagerow').append(app);

            m++;
        });

        $(document).on('click', '.remove_row', function () {         
          $(this).parent().remove(); 
        });
        
        $(document).on('click', '.remove_extra_image', function () {
            $(this).parent().remove();
        });

    });
</script>
<script>
    $(document).ready(function () {
        //Select2
        $(".customer").select2({
           
        });

        $(".select2").select2({
           
        });
        
        $("select").on("select2:select", function (evt) {
          var element = evt.params.data.element;
          var $element = $(element);
          
          $element.detach();
          $(this).append($element);
          $(this).trigger("change");
        });
       
    });
</script>
<script src=
"https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.1/js/select2.min.js">
       </script>
