@extends('layouts.master')

@section('content')  
  <div class="container">
        <p>Parties Séléctionnées: <span id="selectedKeys"></span></p>
        
        
        <div>
          <div style="float: left">
            <img
              id="veg_image"
              src="{{asset('style/images/trace voiture.png')}}"
              usemap="#veg_map"
            />
          </div>
          <div style="float: left; margin-left: 10px">
            <div>
              <ul id="veg_list"></ul>
              
            </div>
          
           <div>
           <form action="insert.php" method="post" enctype="multipart/form-data"> 
            
                <input type="hidden" name="demo_val" value="" id="demo_val"/>
                <input type="submit" value="Save" name="sub">
                <a href="javascript:void(0);" onclick="printPageArea('veg_list')">Print IMG</a>		
          </form>
           
        </div>
        </div>
          </div>
    
        
    <map name="veg_map" id="veg_map" >
        <area
        shape="poly"
        data-name="Capot"
        data-description="Capot"
        data-tooltip="Capot"
        coords="162,40,142,31,114,31,77,36,63,42,37,64,25,105,22,123,23,159,30,193,45,220,58,231,83,242,104,245,138,246,163,237,143,171,143,119,152,74" 
        href="#"
        />
        
        <area 
        shape="poly"
        data-name="Porte Arrière Droite"
        data-description="Porte Arrière Droite"
        data-tooltip="Porte Arrière Droite"
        coords="331,21,465,20,470,29,457,40,338,36,334,25"
        href="#"
        />
        
        <area
        shape="poly"
        data-name="Ail Arrière Droite"
        data-description="Ail Arrière Droite"
        data-tooltip="Ail Arrière Droite"
        coords="466,19,527,23,559,30,549,33,571,42,586,55,590,62,577,54,561,51,528,50,499,51,479,55,471,59,440,61,433,54,431,48,440,45,452,43,461,38,471,30" 
        href="#"
        />
        
        <area
        shape="poly"
        data-name="Ail Arrière Gauche"
        data-description="Ail Arrière Gauche"
        data-tooltip="Ail Arrière Gauche"
        coords="471,216,490,224,508,226,528,226,547,226,566,222,579,217,589,214,586,224,573,234,557,241,550,241,559,247,546,251,519,254,491,256,472,256,470,245,460,234,450,232,439,230,432,229,433,220,441,215"
        href="#"
        />
        
        <area
        shape="poly"
        data-name="Porte Arrière Gauche"
        data-description="Porte Arrière Gauche"
        data-tooltip="Porte Arrière Gauche"
        coords="330,256,466,258,469,244,458,237,429,236,339,240"
        href="#"
        />
        
        <area
        shape="poly"
        data-name="Porte Conducteur"
        data-description="Porte Conducteur"
        data-tooltip="Porte Conducteur"
        coords="185,245,180,254,328,257,336,240,223,238"
        href="#"
        />
        
        <area
        shape="poly"
        data-name="Porte Avant Droite"
        data-description="Porte Avant Droite"
        data-tooltip="Porte Avant Droite"
        coords="179,22,328,22,336,35,219,37,184,31"
        href="#"
        />
        
        <area
        shape="poly"
        data-name="Malle"
        data-description="Malle"
        data-tooltip="Malle"
        coords="527,52,558,51,589,63,601,136,590,211,559,221,530,224,552,173,556,133,552,105,541,76"
        href="#"
        />
        
        <area
        shape="poly"
        data-name="Ail Avant Gauche"
        data-description="Ail Avant Gauche"
        data-tooltip="Ail Avant Gauche"
        coords="166,238,184,238,184,245,179,254,127,256,94,255,74,250,63,242,59,234,72,238,84,241,95,245,111,248,139,247"
        href="#"
        />
        
        
        <area
        shape="poly"
        data-name="Ail Avant Droite"
        data-description="Ail Avant Droite"
        data-tooltip="Ail Avant Droite"
        coords="183,38,163,38,145,30,98,30,62,40,76,29,68,28,92,22,126,20,151,21,166,23,176,22"
        href="#"
        />
        
        <area
        shape="poly"
        data-name="Part Choque Avant"
        data-description="Part Choque Avant"
        data-tooltip="Part Choque Avant"
        coords="40,41,23,62,19,69,15,73,1,136,9,186,13,204,21,208,30,228,38,235,36,229,29,219,43,227,49,231,56,235,38,216,33,203,26,184,22,157,20,138,25,97,37,62,59,41,29,60"
        href="#"
        />
        
        <area
        shape="poly"
        data-name="Part Choque Arrière"
        data-description="Part Choque Arrière"
        data-tooltip="Part Choque Arrière"
        coords="591,65,601,134,599,172,593,209,592,226,609,154,606,100,600,71,590,48"
        href="#"
        />
        
         <area
        shape="poly"
        data-name="toit"
        data-description="Toit"
        data-tooltip="toit"
        coords="286,58,287,217,375,211,468,214,469,200,476,141,475,111,468,71,470,61,382,62,335,61"
        href="#"
        />
      
    </map>

</div>
@endsection