Spade

Mini Shell

Directory:~$ /home/lmsyaran/public_html/j3/templates/g5_hydrogen/custom/particles/
Upload File

[Home] [System Details] [Kill Me]
Current File:~$ /home/lmsyaran/public_html/j3/templates/g5_hydrogen/custom/particles/jlsearch.html.twig

{% extends '@nucleus/partials/particle.html.twig' %}

{% block stylesheets %}
<style>
{% if particle.particle_title_color or particle.particle_title_fontsize %}
#{{ id }}.g5-particle-title { {% if particle.particle_title_color %}color:
{{ particle.particle_title_color }};{% endif %}{% if
particle.particle_title_fontsize %}font-size:
{{particle.particle_title_fontsize}}px;{% endif %} }
{% endif %}
{% if particle.padding %}
#{{id}} .tm-search-inner {padding:{{particle.padding}}; }
{% endif %}
#{{id}} .jl-search input{box-shadow:none;border-radius:0}
{% if particle.form_style == 'blank' %}
.tm-search .jl-form-blank{background:0
0!important;border-color:transparent!important}
.tm-search
.jl-form-blank:focus{border-color:#e5e5e5!important;border-style:dashed!important}
{% endif %}
{% if particle.form_style == 'danger' %}
.tm-search .jl-form-danger,
.tm-search
.jl-form-danger:focus{color:#f0506e;border-color:#f0506e!important}
{% endif %}
{% if particle.form_style == 'success' %}
.tm-search .jl-form-success,
.tm-search
.jl-form-success:focus{color:#32d296;border-color:#32d296!important}
{% endif %}
{% if particle.search_lineheight %}
#{{id}}-particle .tm-search-inner
{line-height:{{particle.search_lineheight}}px; }
{% endif %}
{% if particle.search_style == 'modal' %}
.jl-modal-dialog .jl-search input[type=search]{border:none;box-shadow:none}
{% endif %}
#{{id}} input.jl-search-input {margin-bottom:0;}
{% if particle.toggle_color %}
#{{id}} .jl-search-toggle {color: {{ particle.toggle_color }};}
{% endif %}
{% if particle.toggle_hover_color %}
#{{id}} .jl-search-toggle:focus, #{{id}} .jl-search-toggle:hover {color: {{
particle.toggle_hover_color }};}
{% endif %}
</style>
{% endblock %}

{# Set Max-Width Content #}
{% set content_maxwidth %}
{% if particle.g_maxwidth != 'inherit' %}
jl-width-{{particle.g_maxwidth}}{% if particle.g_maxwidth_breakpoint !=
'always' %}@{{particle.g_maxwidth_breakpoint}}{% endif %}{% if
particle.g_maxwidth_alignment == 'left' %}{% elseif
particle.g_maxwidth_alignment == 'center' %} jl-margin-auto{%
else %} jl-margin-auto-left{% endif %}{% endif %}
{% endset %}

{# Set Particle Alignment #}
{% set particle_alignment %}
{% if particle.align != 'inherit' %}
jl-text-{{particle.align|e}}{% if particle.breakpoint != 'always'
%}@{{particle.breakpoint|e}}{% endif %}{% endif %}{% if particle.align !=
'inherit' and particle.breakpoint != 'always' %}{% if
particle.fallback != 'inherit' %}
jl-text-{{particle.fallback|e}}{% endif %}{% endif %}
{% endset %}

{# set Particle Title Style #}
{% set particle_title_style %}
{% if particle.particle_title %}
<{{particle.particle_title_element|e}} id="{{ id }}"
class="g5-particle-title{% if particle.particle_title_align !=
'inherit' %} jl-text-{{particle.particle_title_align|e}}{% endif
%}{% if particle.particle_predefined_color != 'default' %}
jl-text-{{particle.particle_predefined_color|e}}{% endif %}{% if
particle.particle_title_style != 'default' %}
jl-{{particle.particle_title_style|e}}{% endif %}{% if
particle.particle_title_decoration != 'none' %}
jl-heading-{{particle.particle_title_decoration|e}}{% endif %}">
{% if particle.particle_title_decoration == 'line' %}
<span>{{particle.particle_title|raw}}</span>
{% else %} {{particle.particle_title|raw}}
{% endif %}
</{{particle.particle_title_element|e}}>
{% endif %}
{% endset %}

{# set Animation #}
{% set animation %}
{% if particle.animation != 'inherit' %} jl-scrollspy="cls:
jl-animation-{{particle.animation|e}};{% if particle.animation_repeat ==
'enabled' %} repeat: true;{% endif %}{% if
particle.animation_delay %} delay: {{particle.animation_delay|e}};{% endif
%}"{% endif %}
{% endset %}

{% block particle %}
{% if particle.enabled %}
{{particle_title_style}}
<div id="{{ id }}" class="tm-search{{content_maxwidth}}{%
if particle.class %} {{ particle.class }}{% endif
%}{{particle_alignment}}{% if particle.margin == 'inherit' %}{%
elseif particle.margin == 'default' %} jl-margin{% else %}
jl-margin-{{particle.margin|e}}{% endif %}{% if particle.visibility !=
'inherit' %} jl-visible@{{particle.visibility|e}}{% endif
%}"{{animation}}>
  <div class="tm-search-inner{% if particle.search_text_color !=
'default' %} jl-{{particle.search_text_color}}{% endif
%}">

{% if gantry.platform.name == "joomla" %}

  {% if particle.search_style == 'default' %}
  <form class="jl-search jl-width-1-1{% if particle.large_form ==
'1' %} jl-search-large{% else %} jl-search-default{% endif
%}" action="{{ gantry.siteUrl()
}}/index.php/component/search/" method="post">
  {% if particle.search_icon != 'none'%}
  <button jl-search-icon class="{% if particle.search_icon ==
'right'%} jl-search-icon-flip{% endif %}"
title="{{particle.title|default('Search')}}"></button>
  {% endif %}
  <input class="jl-search-input{% if particle.form_style !=
'default' %} jl-form-{{particle.form_style}}{% endif %}"
type="search" name="searchword" placeholder="{{
particle.placeholder|default('Search...') }}"
size="30" maxlength="200" value="">
  </form>

{% elseif particle.search_style == 'modal' %}

<a class="jl-search-toggle jl-search-icon jl-icon"
href="#js-search-{{id}}" jl-search-icon jl-toggle></a>

<div id="js-search-{{id}}" class="jl-modal-full
jl-modal" jl-modal>
  <div class="jl-modal-dialog jl-flex jl-flex-center
jl-flex-middle" jl-height-viewport>
    <button class="jl-modal-close-full jl-close-large"
type="button" jl-close></button>
    <form class="jl-search{% if particle.large_form ==
'1' %} jl-search-large{% endif %}" action="{{
gantry.siteUrl() }}/index.php/component/search/"
method="post">
      <input class="jl-search-input jl-text-center{% if
particle.form_style != 'default' %}
jl-form-{{particle.form_style}}{% endif %}" type="search"
name="searchword" placeholder="{{
particle.placeholder|default('Search...') }}"
size="30" maxlength="200" value=""
autofocus>
    </form>
  </div>
</div>

{% elseif particle.search_style == 'drop' %}
<a jl-search-icon href="#"></a>
<div jl-drop="mode: {{particle.drop_mode}}; pos:
{{particle.drop_position|e}}; offset: 0">
  <form class="jl-search jl-search-navbar jl-width-1-1{% if
particle.large_form == '1' %} jl-search-large{% endif %}"
action="{{ gantry.siteUrl() }}/index.php/component/search/"
method="post">
    <input class="jl-search-input jl-width-xxlarge{% if
particle.form_style != 'default' %}
jl-form-{{particle.form_style}}{% endif %}" type="search"
name="searchword" placeholder="{{
particle.placeholder|default('Search...') }}"
size="30" maxlength="200" value="">
  </form>
</div>

{% endif %}


{% elseif gantry.platform.name == "wordpress"  %}

{% if particle.search_style == 'default' %}

<form class="jl-search jl-width-1-1{% if particle.large_form ==
'1' %} jl-search-large{% else %} jl-search-default{% endif
%}" action="{{ gantry.siteUrl() }}" method="get"
role="search">
{% if particle.search_icon != 'none'%}
<button jl-search-icon class="{% if particle.search_icon ==
'right'%} jl-search-icon-flip{% endif %}"
title="{{particle.title|default('Search')}}"></button>
{% endif %}
<input class="jl-search-input{% if particle.form_style !=
'default' %} jl-form-{{particle.form_style}}{% endif %}"
type="search" name="s" placeholder="{{
particle.placeholder|default('Search...') }}"
size="30" maxlength="200" value="">
</form>

{% elseif particle.search_style == 'modal' %}

<a class="jl-search-toggle jl-search-icon jl-icon"
href="#js-search-{{id}}" jl-search-icon jl-toggle></a>
<div id="js-search-{{id}}" class="jl-modal-full
jl-modal" jl-modal>
<div class="jl-modal-dialog jl-flex jl-flex-center
jl-flex-middle" jl-height-viewport>
  <button class="jl-modal-close-full jl-close-large"
type="button" jl-close></button>
  <form class="jl-search{% if particle.large_form == '1'
%} jl-search-large{% endif %}" action="{{ gantry.siteUrl()
}}" method="get" role="search">
    <input class="jl-search-input jl-text-center{% if
particle.form_style != 'default' %}
jl-form-{{particle.form_style}}{% endif %}" type="search"
name="s" placeholder="{{
particle.placeholder|default('Search...') }}"
size="30" maxlength="200" value=""
autofocus>
  </form>
</div>
</div>

{% elseif particle.search_style == 'drop' %}

<a jl-search-icon href="#"></a>

<div jl-drop="mode: {{particle.drop_mode}}; pos:
{{particle.drop_position|e}}; offset: 0">
<form class="jl-search jl-search-navbar jl-width-1-1{% if
particle.large_form == '1' %} jl-search-large{% endif %}"
action="{{ gantry.siteUrl() }}" method="get"
role="search">
  <input class="jl-search-input jl-width-xxlarge{% if
particle.form_style != 'default' %}
jl-form-{{particle.form_style}}{% endif %}" type="search"
name="s" placeholder="{{
particle.placeholder|default('Search...') }}"
size="30" maxlength="200" value="">
</form>
</div>

{% endif %}
{% elseif gantry.platform.name == "grav"  %}

{% if particle.search_style == 'default' %}

<form class="jl-search jl-width-1-1{% if particle.large_form ==
'1' %} jl-search-large{% else %} jl-search-default{% endif
%}" name="search" onSubmit="return
validateSearch(event);" data-simplesearch-form>
    {% if particle.search_icon != 'none'%}
    <button jl-search-icon class="{% if particle.search_icon ==
'right'%} jl-search-icon-flip{% endif %}"
title="{{particle.title|default('Search')}}"></button>
    {% endif %}                
    <input
        name="searchfield"
        class="jl-search-input{% if particle.form_style !=
'default' %} jl-form-{{particle.form_style}}{% endif %}"
        type="text"
        required
        value=""
        placeholder="{{ particle.placeholder|default('')
}}"
        data-search-separator="{{ config.system.param_sep }}"
        data-search-input="{{ gantry.siteUrl() }}{{
config.plugins.simplesearch.route == '@self' ? '' :
(config.plugins.simplesearch.route == '/' ? '' :
config.plugins.simplesearch.route) }}/query"
        title="{{particle.title|default('Search')}}"
    />
</form>

{% elseif particle.search_style == 'modal' %}
<a class="jl-search-icon jl-icon"
href="#js-search-{{id}}" jl-search-icon jl-toggle></a>
<div id="js-search-{{id}}" class="jl-modal-full
jl-modal" jl-modal>
<div class="jl-modal-dialog jl-flex jl-flex-center
jl-flex-middle" jl-height-viewport>
  <button class="jl-modal-close-full jl-close-large"
type="button" jl-close></button>
  <form class="jl-search{% if particle.large_form == '1'
%} jl-search-large{% endif %}" name="search"
onSubmit="return validateSearch(event);"
data-simplesearch-form>               
      <input
          name="searchfield"
          class="jl-search-input jl-text-center{% if
particle.form_style != 'default' %}
jl-form-{{particle.form_style}}{% endif %}"
          type="text"
          required
          value=""
          placeholder="{{
particle.placeholder|default('Search...') }}"
          data-search-separator="{{ config.system.param_sep }}"
          data-search-input="{{ gantry.siteUrl() }}{{
config.plugins.simplesearch.route == '@self' ? '' :
(config.plugins.simplesearch.route == '/' ? '' :
config.plugins.simplesearch.route) }}/query"
          title="{{particle.title|default('Search')}}"
      />
  </form>  
</div>
</div>

{% elseif particle.search_style == 'drop' %}
<a jl-search-icon href="#"></a>
<div jl-drop="mode: {{particle.drop_mode}}; pos:
{{particle.drop_position|e}}; offset: 0">
<form class="jl-search jl-search-navbar jl-width-1-1{% if
particle.large_form == '1' %} jl-search-large{% endif %}"
action="{{ gantry.siteUrl() }}/query" method="post">
  <input class="jl-search-input jl-width-xxlarge{% if
particle.form_style != 'default' %}
jl-form-{{particle.form_style}}{% endif %}" type="search"
name="s" placeholder="{{
particle.placeholder|default('Search...') }}"
value="">
</form>
</div>

{% endif %}
{% endif  %}
</div>
</div>
{% endif  %}
{% endblock %}

{% block javascript_footer %}
    {% if gantry.platform.name == "grav" %}
    {% do gantry.load('jquery') %}
    {% do gantry.load('lightcase.init') %}     
        <script>
            {% set min_chars =
config.plugins.simplesearch.min_query_length|default('3') %}
            function validateSearch(event) {
                var input =
document.forms["search"]["searchfield"];
                var location =
input.getAttribute('data-search-input');
                var separator =
input.getAttribute('data-search-separator');
                if (input.value.length >= {{ min_chars }}) {
                    event.preventDefault();
                    window.location.href = location + separator +
input.value;
                } else {
                    event.preventDefault();
                }
            }
        </script>
    {% endif %}    
{% endblock %}