extends layout


block content

    h1 #{title}
    form(id='compaddform',method='POST', action='/components_base/new')
        br
        .row
            #form-group.col-xs-4
                label Cikkszám:
                input.form-control(id='fasz',name='itemNumber',type=text, tabindex='1',autofocus,style='background-color:#99CCDD;', value= vjkvtitle) 
            #form-group.col-xs-4
                label EAN kód:
                input.form-control(id='ean1',name='ean1',type=text, tabindex='2',autofocus,style='background-color:#c9ddfc;', value= vjkvtitle) 
                br     
            #form-group.col-xs-4
                label Gyártó:
                input.form-control(name='manufacturer',type=text, tabindex='3',autofocus,style='background-color:#c9ddfc;', value= vjkvtitle) 
                br   
        .row
            #form-group.col-xs-4
                label Cikk csoport:
                .input-group.mb-3
                    input(id='itemGroupName',tabindex='4',name='itemGroupName',type='hidden')
                    input.form-control(name='itemGroup',type=text,list='listItemGroups',id='itemGroup',autocomplete='none' tabindex='4',autofocus,style='background-color:#c9ddfc;', value= vjkvtitle) 
                    span.input-group-btn
                        button.btn.btn-default(id='addItemGroup',type='button') +
                    datalist(id='listItemGroups') 
                        each igroup, i in igroups
                            option(value=igroup.name , id=igroup._id)            
            #form-group.col-xs-4
                label Mennyiségi egység:
                input.form-control(name='itemUnit',type=text, tabindex='5',autofocus,style='background-color:#c9ddfc;', value= vjkvtitle) 
                br     
            #form-group.col-xs-4
                label Beszállító:
                input(id='supplierId',tabindex='6',name='supplierId',type='hidden')
                input.form-control(name='supplier',type=text,list='listClients',id='supplier',autocomplete='none', autofocus,style='background-color:#c9ddfc;', value= vjkvtitle) 
                datalist(id='listClients') 
                    each client, i in clients
                        option(value=client.name ,id=client._id)
                br 
        .row
            #form-group.col-xs-4
                label Minimum készlet:
                input.form-control(name='minStock',type=text, tabindex='7',autofocus,style='background-color:#c9ddfc;', value= 0) 
            #form-group.col-xs-4
                label Listaár:
                input.form-control(name='itemPrice',type=text, tabindex='8',autofocus,style='background-color:#c9ddfc;', value= 0) 
                br     
            #form-group.col-xs-4
                label Valuta:
                input.form-control(name='valuta',type=text, tabindex='9',autofocus,style='background-color:#c9ddfc;', value= 'HUF') 
                br                 
        #form-group       
            label Megnevezés:
            input.form-control(name='compName',type=text, tabindex='10',autofocus,style='background-color:#c9ddfc;', value= name) 
            br                
            label Paraméterek:
            input.form-control(name='compParams',type=text, tabindex='11',style='background-color:#3CBC8D; color:white;', value= parameters) 
        br  
        button.btn.btn-primary(type='submit',name='action',value='save',tabindex='12') Mentés
        |    
        button.btn.btn-warning(type='submit',name='action',value='saveAndNew',tabindex='13') Mentés és új
        |        
        a.btn.btn-success(href='/components_base/list',tabindex='14') Vissza
        script(type='text/javascript', src='/bower_components/jquery/dist/jquery.min.js')
        script(src='/js/eventsItemGroup.js')
        script.


            function prinner (event) {

                if (event.key=='ö') {
                
                    var curval = $("#ean1").val(); //namaye is the ID of the input field.
                    var nval = curval +"0";
                    $("#ean1").val(nval);
                    
                    // Cancel the event
                    event.preventDefault();
                    event.stopPropagation();
                }
            }
            $( document ).ready(function() {
                            // register jQuery extension
                jQuery.extend(jQuery.expr[':'], {
                    focusable: function (el, index, selector) {
                        return $(el).is('a, button, :input, [tabindex]');
                    }
                });      
              
                $(document).on('keypress', 'input,select', function (e) {
                    if (e.which == 13) {
                        e.preventDefault();
                        // Get all focusable elements on the page
                        var $canfocus = $(':focusable');
                        var index = $canfocus.index(document.activeElement) + 1;
                        if (index >= $canfocus.length) index = 0;
                        $canfocus.eq(index).focus();
                    }
                });
                $("#ean1").keydown(prinner);
                /*document.getElementById('#ean1').addEventListener('keypress', function(event) {
                    if (event.keyCode == 13) {
                        event.preventDefault();
                    
                    }
                });*/
                // Supplier id tárolása a rejtett textboxban
                $( "#supplier" ).on('input',function() {
                    var opt = $('option[value="'+$(this).val()+'"]');
                    $( "#supplierId" ).val(opt.attr('id'));
                });

                // Itemgroup id tárolása a rejtett textboxban
                $( "#itemGroup" ).on('input',function() {
                var opt = $('option[value="'+$(this).val()+'"]');
                //console.log(opt.val());
                $( "#itemGroupName" ).val(opt.val());
                });

                
            });