Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Advanced search meets CSS grid #4076

Open
wants to merge 4 commits into
base: dev
Choose a base branch
from
+26 −18
Open

Advanced search meets CSS grid #4076

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
17b4b3c
refactor: adv search layout with CSS grid for more flexibility and st…
crhallberg Nov 12, 2024
f9aca1a
chore: update-bootstrap5
crhallberg Nov 12, 2024
8b90b84
chore: merge and compile less.
crhallberg Jan 9, 2025
19cf126
Merge remote-tracking branch 'origin/dev' into grid-adv-search
crhallberg Feb 4, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion themes/bootstrap5/templates/search/advanced/build_page.phtml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
$(document).ready(function() {
// Switch and prepare for JS mode
$('#groupJoin').addClass('hidden');
$('#groupPlaceHolder').removeClass('hidden');
$('#adv-add-group-btn').removeClass('hidden');
$('#new_search_template').addClass('hidden').detach().appendTo('[role="main"]');
$('#new_search_template').find('.adv-search').removeAttr('id');
$('#new_search_template').find('.form-control').removeAttr('id');
Expand Down
42 changes: 25 additions & 17 deletions themes/bootstrap5/templates/search/advanced/layout.phtml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -84,20 +84,26 @@
<?php if (!empty($lastSort)): ?>
<input type="hidden" name="sort" value="<?=$this->escapeHtmlAttr($lastSort)?>">
<?php endif; ?>
<div class="clearfix">
<h1 class="pull-left flip"><?=$this->transEsc('Advanced Search')?></h1>
<div id="groupJoin" class="form-inline pull-right flip">
<div class="adv-search-header">
<h2><?=$this->transEsc('Advanced Search')?></h2>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This appears to be undoing #4221, which is probably not the desired outcome.

<div id="groupJoin" class="adv-join-options">
<label for="groupJoinOptions"><?=$this->transEsc('search_match')?>:</label>
<select id="groupJoinOptions" name="join" class="form-control">
<option value="AND"<?php if ($searchDetails && $searchDetails->getOperator() == 'ALL'):?> selected<?php endif; ?>><?= $this->transEsc('group_AND') ?></option>
<option value="OR"<?php if ($searchDetails && $searchDetails->getOperator() == 'OR'):?> selected<?php endif; ?>><?= $this->transEsc('group_OR') ?></option>
</select>
</div>
</div>
<a role="button" class="icon-link hidden" id="groupPlaceHolder" href="#">

<div id="adv-search-groups">
<span id="groupPlaceHolder" class="sr-only"></span>
</div>

<button type="button" id="adv-add-group-btn" class="btn btn-link icon-link hidden">
<?=$this->icon('ui-add', 'icon-link__icon') ?>
<span class="icon-link__label"><?= $this->transEsc('add_search_group') ?></span>
</a>
</button>

<?php /* fallback to a fixed set of search groups/fields if JavaScript is turned off */ ?>
<div class="no-js">
<?php if (!empty($this->formOverride)): ?>
Expand Down Expand Up @@ -128,16 +134,22 @@
</div>
<?php if ($group == 0 && $search == 0): ?>
</div>
<div class="float-left">
<span class="search_place_holder hidden"></span>
<a href="#" class="add_search_link icon-link hidden" role="button">
<?=$this->icon('ui-add', 'icon-link__icon') ?>
<span class="icon-link__label"><?=$this->transEsc('add_search')?></span>
</a>
</div>

<span class="search_place_holder sr-only"></span>

<button href="#" class="add_search_link hidden">
<?=$this->icon('ui-add', 'icon-link__icon') ?>
<span class="icon-link__label"><?=$this->transEsc('add_search')?></span>
</button>

<button type="button" class="adv-group-close hidden">
<?=$this->icon('ui-remove', 'icon-link__icon') ?>
<span class="icon-link__label"><?=$this->transEsc('del_search') ?></span>
</button>
<?php endif; ?>
<?php endfor; ?>
</div>

<div class="adv-group-match">
<label class="search_bool"><?=$this->transEsc('search_match')?>:&nbsp;</label>
<select name="bool<?=$group ?>[]" id="search_bool<?=$group ?>" class="form-control">
Expand All @@ -146,10 +158,6 @@
<option value="NOT"<?php if (isset($setSearchGroups[$group]) && 'NOT' == $setSearchGroups[$group]):?> selected<?php endif; ?>><?=$this->transEsc('search_NOT')?></option>
</select>
</div>
<a href="#" class="adv-group-close icon-link hidden" role="button">
<?=$this->icon('ui-remove', 'icon-link__icon') ?>
<span class="icon-link__label"><?=$this->transEsc('del_search') ?></span>
</a>
</div>
<?php if ($group == 0): ?>
</div>
Expand Down Expand Up @@ -229,7 +237,7 @@
</div>
<?php
$script = <<<JS
$('#groupPlaceHolder').click(function(e) {
$('#adv-add-group-btn').click(function(e) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is it worth de-jQuerying this while we're changing it anyway, since I think it would be a pretty minor change?

addGroup(null, null, null, true);
return false;
})
Expand Down