Pages: 1
Hello/Hi/Greetings,
My GOAL is to incorporate the RV Autocomplete (https://piwigo.org/ext/extension_view.php?eid=694) into plugin Block search (https://piwigo.org/ext/extension_view.php?eid=896). And show total numbers of files in the gallery in the searchbox
Heres what I have manage to do so far:
plugins/block_search/blocksearch/stuffs_search.tpl
{html_style} .bsearck{ padding:20px; font-align:center; width:100%; margin-left: auto; margin-right: auto; margin: 20px: padding-left: inherit; padding-right: 20px; } #bqsearchInput { color: black; border: 1px solid #3c3c3c; padding: 5px; background-color: transparent; font-weight: bolder; font-size: 20px; width: 300px; text-align: center; margin-bottom: 10px; } {/html_style} <div class="bsearck"> <form class="navbar-form" role="search" action="{$ROOT_URL}qsearch.php" method="get" id="quicksearch" onsubmit="return this.q.value!='' && this.q.value!=qsearch_prompt;"> <div class="form-group"> <input type="text" name="q" id="qsearchInput" class="form-control ui-autocomplete-input" placeholder="{'bSearch'|@translate|escape:'html'}..." />' </div> </form> </div>
Last edited by BigIsland270972 (2023-01-23 18:21:41)
Offline
Do i need to inclue the javascript code from plugin?
<script type="text/javascript" async="" src="plugins/rv_autocomplete/res/suggest-core.js"></script>
Does Anyone have the knowledge?
Offline
Hi :-)
js in'st already include ?
Offline
Hi. I don't know... Im in deepwater as i dont have expertise in this field, so It's kinda hit and miss. sorry but do you understand what I'm trying to accomplish? Have the rv autocomlete suggestion to the Blocksearch [PWGStuff] plugin.
Offline
Here's is what I have now:
{/html_style} <div class="bsearck"> <form class="navbar-form" role="search" action="{$ROOT_URL}qsearch.php" method="get" id="quicksearch" onsubmit="return this.q.value!='' && this.q.value!=qsearch_prompt;"> <div class="form-group"> <script type="text/javascript">var qsearch_prompt="{'Quick search'|@translate|@escape:'javascript'}";{if empty($QUERY_SEARCH)}document.getElementById('qsearchInput').value=qsearch_prompt;{/if}</script> <input type="text" name="q" id="qsearchInput" class="form-control ui-autocomplete-input" placeholder="{'bSearch'|@translate|escape:'html'}..." />' </div> </div>
Offline
<div class="bsearck"> <form action="{$ROOT_URL}qsearch.php" method="get" id="quicksearch" onsubmit="return this.q.value!='' && this.q.value!=qsearch_prompt;"> <p style="margin:0;padding:0"{*this <p> is for html validation only - does not affect positioning*}> <input type="text" name="q" id="qsearchInput" onfocus="if (value==qsearch_prompt) value='';" onblur="if (value=='') value=qsearch_prompt;" style="width:90%"{if !empty($QUERY_SEARCH)} value="{$QUERY_SEARCH}"{/if}> </p> </form> <script type="text/javascript">var qsearch_prompt="{'Quick search'|@translate|@escape:'javascript'}";{if empty($QUERY_SEARCH)}document.getElementById('qsearchInput').value=qsearch_prompt;{/if}</script>
Last edited by BigIsland270972 (2023-01-24 11:27:21)
Offline
Not working...Allthough I might be close: -)
Offline
SO FAR UPDATE:
{if $theme_config->quicksearch_navbar} <script type="text/javascript" async="" src="plugins/rv_autocomplete/res/suggest-core.js"></script> <ul class="ui-autocomplete ui-front ui-menu ui-widget ui-widget-content ui-corner-all" id="ui-id-1" tabindex="0" style="display: none;"></ul> <form class="form-inline navbar-form ml-auto" role="search" action="{$ROOT_URL}qsearch.php" method="get" id="quicksearch" onsubmit="return this.q.value!='' && this.q.value!=qsearch_prompt;"> <i class="fas fa-search" title="{'bSearch'|@translate}" aria-hidden="false"></i> <div class="form-group"> <input type="text" name="q" id="qsearchInput" class="form-control" placeholder="{'bSearch'|@translate}" /> </div> </form> {footer_script require='jquery'} var qsearch_icon = $('#navbar-menubar>#quicksearch>.fa-search'); var qsearch_text = $('#navbar-menubar>#quicksearch #qsearchInput'); $(qsearch_icon).click(function () { $(qsearch_text).focus(); }); $(document).ready(function() { $('#navbar-menubar>#quicksearch').css({literal}{'color': $('#navbar-menubar .nav-link').css('color')}{/literal}); }); {/footer_script} {/if}
Offline
Does anybody have the knowledge?
Here's what I have now:
plugins/block_search/blocksearch/stuffs_search.tpl
{html_style} .form-control { text-align: center; } .pwgstuffs-container { padding-top: 20px; padding-bottom: 20px; } .fas { font-weight: 1000; font-size: x-large; padding-right: 10px; } .col-12 { padding-top: 30px; } .form-inline { display: block ruby; } .form-inline .form-control { display: inline-block; width: auto; vertical-align: middle; padding-left: 10px; padding-right: 10px; float: unset; font-size: x-large; } {/html_style} {if $theme_config->quicksearch_navbar} <form class="form-inline navbar-form ml-auto" role="search" action="{$ROOT_URL}qsearch.php" method="get" id="quicksearch" onsubmit="return this.q.value!='' && this.q.value!=qsearch_prompt;"> <i class="fas fa-search" title="{'bSearch'|@translate}" aria-hidden="false"></i> <div class="form-group"> <span role="status" aria-live="polite" class="ui-helper-hidden-accessible"> <input type="text" name="q" id="qsearchInput" class="form-control ui-autocomplete-input" placeholder="{'bSearch'|@translate}" autocomplete="off" /> </div> </form> {footer_script require='jquery'} var qsearch_icon = $('#navbar-menubar>#quicksearch>.fa-search'); var qsearch_text = $('#navbar-menubar>#quicksearch #qsearchInput'); $(qsearch_icon).click(function () { $(qsearch_text).focus(); }); $(document).ready(function() { $('#navbar-menubar>#quicksearch').css({literal}{'color': $('#navbar-menubar .nav-link').css('color')}{/literal}); }); {/footer_script} {/if}
Last edited by BigIsland270972 (2023-02-03 14:26:46)
Offline
Ir really need some input from ddtddt on this one.
plugins/block_search/blocksearch/stuffs_search.tpl
UPDATE:
{html_style} .form-control { text-align: center; } .pwgstuffs-container { padding-top: 0px; padding-bottom: 0px; } .fas { font-weight: 1000; font-size: x-large; padding-right: 10px; } .form-inline { display: block ruby; } .form-inline .form-control { display: inline-block; width: auto; vertical-align: middle; padding-left: 10px; padding-right: 10px; float: unset; font-size: x-large; } {/html_style} {if isset($blocks.mbMenu->data.qsearch) and !$theme_config->quicksearch_navbar} <div class="dropdown-header"> <form class="navbar-form" role="search" action="{$ROOT_URL}qsearch.php" method="get" id="quicksearch" onsubmit="return this.q.value!='' && this.q.value!=qsearch_prompt;"> <div class="form-group"> <input type="text" name="q" id="qsearchInput" class="form-control" placeholder="{'Quick search'|@translate}" /> </div> </form> </div> <div class="dropdown-divider"></div> {/if} {if isset($MENUBAR)} <nav class="navbar navbar-expand-lg navbar-main {$theme_config->navbar_main_bg} {if $theme_config->page_header == 'fancy'}navbar-dark navbar-transparent fixed-top{else}{$theme_config->navbar_main_style}{/if}"> <div class="container{if $theme_config->fluid_width}-fluid{/if}"> {if $theme_config->logo_image_enabled && $theme_config->logo_image_path !== ''} <a class="navbar-brand mr-auto" href="{$U_HOME}"><img class="img-fluid" src="{$ROOT_URL}{$theme_config->logo_image_path}" alt="{$GALLERY_TITLE}"/></a> {else} <a class="navbar-brand mr-auto" href="{$U_HOME}">{$GALLERY_TITLE}</a> {/if} <button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#navbar-menubar" aria-controls="navbar-menubar" aria-expanded="false" aria-label="Toggle navigation"> <span class="fas fa-bars"></span> </button> <div class="collapse navbar-collapse" id="navbar-menubar"> {/if} {if $theme_config->quicksearch_navbar} <form class="form-inline navbar-form ml-auto" role="search" action="{$ROOT_URL}qsearch.php" method="get" id="quicksearch" onsubmit="return this.q.value!='' && this.q.value!=qsearch_prompt;"> <i class="fas fa-search" title="{'Quick search'|@translate}" aria-hidden="true"></i> <div class="form-group"> <input type="text" name="q" id="qsearchInput" class="form-control" placeholder="{'Quick search'|@translate}" /> </div> </form> {footer_script require='jquery'} var qsearch_icon = $('#navbar-menubar>#quicksearch>.fa-search'); var qsearch_text = $('#navbar-menubar>#quicksearch #qsearchInput'); $(qsearch_icon).click(function () { $(qsearch_text).focus(); }); $(document).ready(function() { $('#navbar-menubar>#quicksearch').css({literal}{'color': $('#navbar-menubar .nav-link').css('color')}{/literal}); }); {/footer_script} {/if}
Last edited by BigIsland270972 (2023-02-11 15:47:29)
Offline
Pages: 1