@if ($showLabel && $showField)
    @if ($options['wrapper'] !== false)
        <div <?= $options['wrapperAttrs'] ?> >
    @endif
@endif

    @if ($showLabel && $options['label'] !== false && $options['label_show'])
        <?= Form::customLabel($name, $options['label'], $options['label_attr']) ?>
    @endif
    @if ($showField)
    @if (isset($options['form_horizontal']) && $options['form_horizontal'] == true)<div class="col-sm-9">@endif
        <?= Form::input('range', $name, $options['value'], $options['attr']) ?>

        @include('laravel-form-builder::help_block')
    @if (isset($options['form_horizontal']) && $options['form_horizontal'] == true)</div>@endif
    @endif

    @include('laravel-form-builder::errors')

    @if ($options['show_step_buttons'])
    <div class="btn-group pull-left">
        <button id="slider{{ studly_case($name) }}Minus" type="button" class="btn btn-default btn-xs slider-adjust slider-adjust-minus"><span class="fa-solid fa-minus"></span></button>
        <button id="slider{{ studly_case($name) }}Plus" type="button" class="btn btn-default btn-xs slider-adjust slider-adjust-plus"><span class="fa-solid fa-plus"></span></button>
    </div>
    @endif
    @if ($options['show_changed_default'])
    <span style="display: {{ ($options['value'] != $options['default_value']) ? 'block' : 'none' }}" class="slider-value-check pull-right" data-stored="{{ $options['value'] }}" data-default="{{ $options['default_value'] }}">overrides program default ({{ $options['default_value'] }}%)</span>
    @endif
@if ($showLabel && $showField)
    @if ($options['wrapper'] !== false)
    </div>
    @endif
@endif

@section('js')
    @parent
    @if ($options['show_step_buttons'])
    <script>
        jQuery(function($) {
            var step{{ studly_case($name) }}Value = function(direction) {
              var el = $('#{{ $options['attr']['id'] ?? $name }}');
              var val = parseFloat(el.val());
              var step = parseFloat(el.attr('step'));
              var update = direction === 'plus' ? (val + step) : (val - step);
              var slider = el.data('plugin_rangeslider');
              if (slider) {
                slider.onSlideEnd(slider.getPositionFromValue(update), update);
              }
              el.val(parseFloat(update.toFixed(2))).change();
            };
            $('#slider{{ studly_case($name) }}Minus').on('click', function() {
              step{{ studly_case($name) }}Value('minus');
            });
            $('#slider{{ studly_case($name) }}Plus').on('click', function() {
              step{{ studly_case($name) }}Value('plus');
            });
        })
    </script>
    @endif
@endsection
