<?php $helper = $this->getHelper() ?>
<?php $params = $this->getParams() ?>
<?php $exist = false ?>
<?php $top = -55 ?>
<?php $sliders = $helper->getModel('Mageplaza\BannerSlider\Model\Slider')->getCollection()->addFieldToFilter('status', 1) ?>
<div class="edit-static-form">
    
    <div class="line">
        <div class="col-des-12 builder-title">
            <h2><?php echo __('Mageplaza - Banner Slider') ?></h2>
        </div>
    </div>
    <form id="section-form" enctype="multipart/form-data" method="POST" action="<?php echo $this->getUrl('fbuilder/element/save') ?>" data-hasrequired="<?php echo __('* Required Fields') ?>" data-mage-init='{"validation":{}}'>
        <?php if ($pageId = $this->getRequest()->getParam('page_id')): ?>
            <input type="hidden" name="page_id" value="<?php echo $pageId ?>">
        <?php else: ?>
            <input type="hidden" name="product_id" value="<?php echo $this->getRequest()->getParam('product_id') ?>">
            <input type="hidden" name="overriden" value="<?php echo $this->getRequest()->getParam('overriden') ?>">
        <?php endif ?>
        <input type="hidden" name="page_type" value="<?php echo $this->getRequest()->getParam('page_type') ?>">
        <input id="block_type" type="hidden" name="type" value="mageplaza_slider">
        <input id="block_block_name" type="hidden" name="block_name" value="<?php echo $params['block'] ?>">
        <?php if (isset($params['id'])): ?>
            <?php
                $child =  $this->getModel('MGS\Fbuilder\Model\Child')->load($params['id']);
                $exist = true;
                $settings = json_decode($child->getSetting(), true);
                $top = $settings['nav_top'];
                $slider = $helper->getModel('Mageplaza\BannerSlider\Model\Slider')->getCollection()->addFieldToFilter('slider_id', $settings['slider_id'])->getFirstItem();
            ?>
            <input type="hidden" name="child_id" value="<?php echo $params['id'] ?>">
        <?php endif ?>
        
        <input id="block_html" type="hidden" name="setting[block_link]" value="<?php if ($exist && isset($settings['block_html']) && $settings['block_html']): ?><?php echo $settings['block_html'] ?><?php endif ?>">
        
        <div class="mgs-tab product data items" data-mage-init='{"tabs":{"openedState":"active"}}'>
            <div class="data item title" aria-labeledby="tab-label-general-title" data-role="collapsible" id="tab-label-general">
                <a class="data switch" tabindex="-1" data-toggle="switch" href="#general" id="tab-label-general-title">
                    <?php echo __('General') ?>
                </a>
            </div>
            
            <div class="data item content" id="general" data-role="content">
                <div class="form-group line">
                    <label for="col" class="col-des-3 control-label"><?php echo __('Block col (12 to full)') ?></label>
                    <div class="col-des-9">
                        <select id="col" class="required-entry input-text" name="col">
                            <?php for ($i=12; $i>=1; $i--): ?>
                                <option value="<?php echo $i ?>"<?php if ($exist && ($child->getCol()==$i)): ?> selected="selected"<?php endif ?>><?php echo $i ?></option>
                            <?php endfor ?>
                        </select>
                    </div>
                </div>
                <div class="form-group line">
                    <label for="class" class="col-des-3 control-label"><?php echo __('Custom Class') ?></label>
                    <div class="col-des-9">
                        <input type="text" id="class" class="input-text" name="class"<?php if ($exist): ?> value="<?php echo $child->getClass() ?>"<?php endif ?> />
                    </div>
                </div>
                
                <div class="form-group line">
                    <label for="animation" class="col-des-3 control-label"><?php echo __('Block Animation') ?></label>
                    <div class="col-des-5">
                        <select onchange="changeAnimationClass(this.value)" id="animation" class="input-text" name="setting[animation]">
                            <option value=""><?php echo __('Choose Animation Effect') ?></option>
                            <?php foreach ($helper->getAnimationEffect() as $animation => $label): ?>
                                <option value="<?php echo $animation ?>"<?php if ($exist && ($settings['animation']==$animation)): ?> selected="selected"<?php endif ?>><?php echo $label ?></option>
                            <?php endforeach ?>
                        </select>
                    </div>
                    
                    <div class="col-des-3 text-center animated<?php if ($exist && ($settings['animation']!='')): ?> <?php echo $settings['animation'] ?><?php endif ?>" id="animation-test">Animation Preview</div>
                </div>
                
                <div class="form-group line">
                    <label for="animation_delay" class="col-des-3 control-label"><?php echo __('Animation Delay') ?></label>
                    <div class="col-des-9">
                        <input type="text" placeholder="ms" id="animation_delay" class="input-text validate-number" name="setting[animation_delay]" <?php if ($exist && isset($settings['animation_delay'])): ?> value="<?php echo $settings['animation_delay'] ?>"<?php endif ?>>
                    </div>
                </div>
                
                <div class="form-group line">
                    <div class="col-des-12">
                        <div class="style-inline-container">
                            <div class="border-container">
                                <span class="inline-note margin-note">Margin</span>
                                
                                <input type="text" placeholder="px" id="margin-top" class="input-text validate-number" name="setting[margin_top]" <?php if ($exist && isset($settings['margin_top'])): ?> value="<?php echo $settings['margin_top'] ?>"<?php endif ?>>
                                
                                <div class="middle-content-input">
                                    
                                    <div class="left-margin"><input type="text" placeholder="px" id="margin-left" class="input-text validate-number" name="setting[margin_left]" <?php if ($exist && isset($settings['margin_left'])): ?> value="<?php echo $settings['margin_left'] ?>"<?php endif ?>></div>
                                    <div class="middle-content">
                                        <span class="inline-note padding-note">Padding</span>
                                        <input type="text" placeholder="px" id="padding-top" class="input-text validate-number" name="setting[padding_top]" <?php if ($exist && isset($settings['padding_top'])): ?> value="<?php echo $settings['padding_top'] ?>"<?php endif ?>>
                                        
                                        <div class="padding-middle">
                                            <input type="text" placeholder="px" id="padding-left" class="input-text validate-number" name="setting[padding_left]" <?php if ($exist && isset($settings['padding_left'])): ?> value="<?php echo $settings['padding_left'] ?>"<?php endif ?>>
                                            
                                            <input type="text" placeholder="px" id="padding-right" class="input-text validate-number" name="setting[padding_right]" <?php if ($exist && isset($settings['padding_right'])): ?> value="<?php echo $settings['padding_right'] ?>"<?php endif ?>>
                                        </div>
                                        
                                        <input type="text" placeholder="px" id="padding-bottom" class="input-text validate-number" name="setting[padding_bottom]" <?php if ($exist && isset($settings['padding_bottom'])): ?> value="<?php echo $settings['padding_bottom'] ?>"<?php endif ?>>
                                    </div>
                                    <div class="right-margin"><input type="text" placeholder="px" id="margin-right" class="input-text validate-number" name="setting[margin_right]" <?php if ($exist && isset($settings['margin_right'])): ?> value="<?php echo $settings['margin_right'] ?>"<?php endif ?>></div>
                                </div>
                                
                                <input type="text" placeholder="px" id="margin-bottom" class="input-text validate-number" name="setting[margin_bottom]" <?php if ($exist && isset($settings['margin_bottom'])): ?> value="<?php echo $settings['margin_bottom'] ?>"<?php endif ?>>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        
        
        
            <div class="data item title" aria-labeledby="tab-label-slider-title" data-role="collapsible" id="tab-label-slider">
                <a class="data switch" tabindex="-1" data-toggle="switch" href="#slider" id="tab-label-slider-title">
                    <?php echo __('Slider Config') ?>
                </a>
            </div>
            
            <div class="data item content" id="slider" data-role="content" style="display:none">
                <div class="form-group line">
                    <?php if (count($sliders)>0): ?>
                        <label for="slider_id" class="col-des-4 control-label"><?php echo __('Slider') ?></label>
                        <div class="col-des-8">
                            <select id="slider_id" class="input-text" name="setting[slider_id]">
                                <?php foreach ($sliders as $_slider): ?>
                                    <option value="<?php echo $_slider->getId() ?>"<?php if ($exist && ($settings['slider_id']==$_slider->getId())): ?> selected="selected"<?php endif ?>><?php echo $_slider->getName()?></option>
                                <?php endforeach ?>
                            </select>
                        </div>
                    <?php else: ?>
                        <div role="alert" class="col-des-12 alert alert-danger"><?php echo __('Please go to admin panel > Content > Manage Sliders to add slider first.') ?></div>
                    <?php endif ?>
                </div>
                
                <div class="form-group line">
                    <label for="items" class="col-des-4 control-label"><?php echo __('Number of items on slide (default)') ?></label>
                    <div class="col-des-8">
                        <input type="text" id="items" class="input-text required-entry validate-number" name="setting[items]"<?php if ($exist && $settings['items']): ?> value="<?php echo $settings['items'] ?>"<?php else: ?> value="1"<?php endif ?> onchange="displayNav()"/>
                    </div>
                </div>
                
                <div class="form-group line">
                    <label for="items_tablet" class="col-des-4 control-label"><?php echo __('Number of items on slide (tablet)') ?></label>
                    <div class="col-des-8">
                        <input type="text" id="items_tablet" class="input-text required-entry validate-number" name="setting[items_tablet]"<?php if ($exist && $settings['items_tablet']): ?> value="<?php echo $settings['items_tablet'] ?>"<?php else: ?> value="1"<?php endif ?>/>
                    </div>
                </div>
                
                <div class="form-group line">
                    <label for="items_mobile" class="col-des-4 control-label"><?php echo __('Number of items on slide (mobile)') ?></label>
                    <div class="col-des-8">
                        <input type="text" id="items_mobile" class="input-text required-entry validate-number" name="setting[items_mobile]"<?php if ($exist && $settings['items_mobile']): ?> value="<?php echo $settings['items_mobile'] ?>"<?php else: ?> value="1"<?php endif ?>/>
                    </div>
                </div>
                
                <div class="form-group line">
                    <label for="slide_margin" class="col-des-4 control-label"><?php echo __('Margin right (on item)') ?></label>
                    <div class="col-des-8">
                        <input type="text" id="slide_margin" class="input-text validate-number" name="setting[slide_margin]"<?php if ($exist && $settings['slide_margin']): ?> value="<?php echo $settings['slide_margin'] ?>"<?php endif ?> />
                    </div>
                </div>
                
                <div class="form-group line">
                    <label for="rtl" class="col-des-4 control-label"><?php echo __('RTL') ?></label>
                    <div class="col-des-8">
                        <div class="admin__actions-switch" data-role="switcher">
                            <input type="checkbox"<?php if ($exist && $settings['rtl']): ?> checked="checked"<?php endif ?> value="1" name="setting[rtl]" id="rtl" class="admin__actions-switch-checkbox">
                            <label for="rtl" class="admin__actions-switch-label">
                                <span data-text-off="<?php echo __('No') ?>" data-text-on="<?php echo __('Yes') ?>" class="admin__actions-switch-text"></span>
                            </label>
                        </div>
                    </div>
                </div>
                
                <div class="form-group line">
                    <label for="fullheight" class="col-des-4 control-label"><?php echo __('Full Height') ?></label>
                    <div class="col-des-8">
                        <div class="admin__actions-switch" data-role="switcher">
                            <input type="checkbox"<?php if ($exist && isset($settings['fullheight']) && $settings['fullheight']): ?> checked="checked"<?php endif ?> value="1" name="setting[fullheight]" id="fullheight" class="admin__actions-switch-checkbox">
                            <label for="fullheight" class="admin__actions-switch-label">
                                <span data-text-off="<?php echo __('No') ?>" data-text-on="<?php echo __('Yes') ?>" class="admin__actions-switch-text"></span>
                            </label>
                        </div>
                    </div>
                </div>
                
                <div class="form-group line">
                    <label for="autoplay" class="col-des-4 control-label"><?php echo __('Auto play') ?></label>
                    <div class="col-des-8">
                        <div class="admin__actions-switch" data-role="switcher">
                            <input type="checkbox"<?php if ($exist && $settings['autoplay']): ?> checked="checked"<?php endif ?> value="1" name="setting[autoplay]" id="autoplay" class="admin__actions-switch-checkbox" onclick="setAutoplay()">
                            <label for="autoplay" class="admin__actions-switch-label">
                                <span data-text-off="<?php echo __('No') ?>" data-text-on="<?php echo __('Yes') ?>" class="admin__actions-switch-text"></span>
                            </label>
                        </div>
                    </div>
                </div>
                
                <div class="form-group line" id="speed-input">
                    <label for="speed" class="col-des-4 control-label"><?php echo __('Auto play speed') ?></label>
                    <div class="col-des-8">
                        <input type="text" placeholder="ms" id="speed" class="input-text validate-number" name="setting[speed]" <?php if ($exist && isset($settings['speed'])): ?> value="<?php echo $settings['speed'] ?>"<?php endif ?>>
                    </div>
                </div>
                
                <div class="form-group line">
                    <label for="stop_auto" class="col-des-4 control-label"><?php echo __('Stop autoplay on mouse hover') ?></label>
                    <div class="col-des-8">
                        <div class="admin__actions-switch" data-role="switcher">
                            <input type="checkbox"<?php if ($exist && $settings['stop_auto']): ?> checked="checked"<?php endif ?> value="1" name="setting[stop_auto]" id="stop_auto" class="admin__actions-switch-checkbox">
                            <label for="stop_auto" class="admin__actions-switch-label">
                                <span data-text-off="<?php echo __('No') ?>" data-text-on="<?php echo __('Yes') ?>" class="admin__actions-switch-text"></span>
                            </label>
                        </div>
                    </div>
                </div>
                
                <div class="form-group line">
                    <label for="navigation" class="col-des-4 control-label"><?php echo __('Display navigation') ?></label>
                    <div class="col-des-8">
                        <div class="admin__actions-switch" data-role="switcher">
                            <input type="checkbox"<?php if ($exist && $settings['navigation']): ?> checked="checked"<?php endif ?> value="1" name="setting[navigation]" id="navigation" class="admin__actions-switch-checkbox" onclick="displayNav()">
                            <label for="navigation" class="admin__actions-switch-label">
                                <span data-text-off="<?php echo __('No') ?>" data-text-on="<?php echo __('Yes') ?>" class="admin__actions-switch-text"></span>
                            </label>
                        </div>
                    </div>
                </div>
                
                <div class="form-group line nav-fields">
                    <label for="navigation_position" class="col-des-4 control-label"><?php echo __('Navigation position') ?></label>
                    <div class="col-des-8">
                        <select name="setting[navigation_position]" id="navigation_position" onchange="displayNav()">
                            <option value="middle-inside"<?php if ($exist && ($settings['navigation_position']=='middle-inside')): ?> selected="selected"<?php endif ?>><?php echo __('Middle Inside'); ?></option>
                            <option value="top-left"<?php if ($exist && ($settings['navigation_position']=='top-left')): ?> selected="selected"<?php endif ?>><?php echo __('Top Left'); ?></option>
                            <option value="top-right"<?php if ($exist && ($settings['navigation_position']=='top-right')): ?> selected="selected"<?php endif ?>><?php echo __('Top Right'); ?></option>
                            
                            <option value="middle-outside"<?php if ($exist && ($settings['navigation_position']=='middle-outside')): ?> selected="selected"<?php endif ?>><?php echo __('Middle Outside'); ?></option>
                            <option value="bottom-left"<?php if ($exist && ($settings['navigation_position']=='bottom-left')): ?> selected="selected"<?php endif ?>><?php echo __('Bottom Left'); ?></option>
                            <option value="bottom-right"<?php if ($exist && ($settings['navigation_position']=='bottom-right')): ?> selected="selected"<?php endif ?>><?php echo __('Bottom Right'); ?></option>
                        </select>
                    </div>
                </div>
                
                <div class="form-group line nav-top-position">
                    <label for="nav_top" class="col-des-4 control-label"><?php echo __('Navigation top position') ?></label>
                    <div class="col-des-8">
                        <input type="text" id="nav_top" class="input-text validate-number" name="setting[nav_top]" value="<?php echo $top ?>" placeholder="px"/>
                    </div>
                </div>
                
                <div class="form-group line auto-hide-nav">
                    <label for="hide_nav" class="col-des-4 control-label"><?php echo __('Auto hide navigation') ?></label>
                    <div class="col-des-8">
                        <div class="admin__actions-switch" data-role="switcher">
                            <input type="checkbox"<?php if ($exist && $settings['hide_nav']): ?> checked="checked"<?php endif ?> value="1" name="setting[hide_nav]" id="hide_nav" class="admin__actions-switch-checkbox">
                            <label for="hide_nav" class="admin__actions-switch-label">
                                <span data-text-off="<?php echo __('No') ?>" data-text-on="<?php echo __('Yes') ?>" class="admin__actions-switch-text"></span>
                            </label>
                        </div>
                    </div>
                </div>
                
                <div class="form-group line">
                    <label for="pagination" class="col-des-4 control-label"><?php echo __('Display pagination') ?></label>
                    <div class="col-des-8">
                        <div class="admin__actions-switch" data-role="switcher">
                            <input type="checkbox"<?php if ($exist && $settings['pagination']): ?> checked="checked"<?php endif ?> value="1" name="setting[pagination]" id="pagination" class="admin__actions-switch-checkbox" onclick="displayDot()">
                            <label for="pagination" class="admin__actions-switch-label">
                                <span data-text-off="<?php echo __('No') ?>" data-text-on="<?php echo __('Yes') ?>" class="admin__actions-switch-text"></span>
                            </label>
                        </div>
                    </div>
                </div>
                
                <div class="form-group line dot-fields">
                    <label for="pagination_position" class="col-des-4 control-label"><?php echo __('Pagination position') ?></label>
                    <div class="col-des-8">
                        <select name="setting[pagination_position]" id="pagination_position">
                            <option value="center"<?php if ($exist && ($settings['pagination_position']=='center')): ?> selected="selected"<?php endif ?>><?php echo __('Center'); ?></option>
                            <option value="left"<?php if ($exist && ($settings['pagination_position']=='left')): ?> selected="selected"<?php endif ?>><?php echo __('Left'); ?></option>
                            <option value="right"<?php if ($exist && ($settings['pagination_position']=='right')): ?> selected="selected"<?php endif ?>><?php echo __('Right'); ?></option>
                        </select>
                    </div>
                </div>
                
                <div class="form-group line">
                    <label for="loop" class="col-des-4 control-label"><?php echo __('Loop') ?></label>
                    <div class="col-des-8">
                        <div class="admin__actions-switch" data-role="switcher">
                            <input type="checkbox"<?php if ($exist && $settings['loop']): ?> checked="checked"<?php endif ?> value="1" name="setting[loop]" id="loop" class="admin__actions-switch-checkbox">
                            <label for="loop" class="admin__actions-switch-label">
                                <span data-text-off="<?php echo __('No') ?>" data-text-on="<?php echo __('Yes') ?>" class="admin__actions-switch-text"></span>
                            </label>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
        
        <div class="line">
            <div class="form-group">
                <div class="col-des-12 builder-action">
                    <div class="buttons">
                        <?php if (!$exist): ?>
                            <button type="button" class="action" onclick="history.go(-1)"><span><?php echo __('Back') ?></span></button>
                        <?php endif ?>
                        <button type="submit" class="action primary"><span><?php echo __('Submit') ?></span></button>
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>