Commit 5907f1b2 authored by Daniel J. Ramirez's avatar Daniel J. Ramirez

Added missing categories, and other improvements

parent e0638f17
......@@ -505,7 +505,7 @@ nav #eelo_links > * {
#search_form #search_params {
display: flex;
justify-content: space-between;
font-size: 11px;
font-size: 14px;
padding-bottom: 16px;
padding-top: 16px;
padding-left: 24px;
......@@ -520,8 +520,11 @@ nav #eelo_links > * {
text-align: right;
padding-right: 32px;
}
#search_form #search_params #time_and_lang > :first-child {
margin-right: 16px;
#search_form #search_params #time_and_lang {
text-align: right;
}
#search_form #search_params #time_and_lang > * {
width: 160px;
}
#search_form .search_categories,
#search_form #categories {
......@@ -529,30 +532,96 @@ nav #eelo_links > * {
display: flex;
flex-wrap: wrap;
align-items: center;
position: relative;
flex: 100%;
}
#search_form .search_categories label,
#search_form #categories label {
flex-grow: 1;
flex-basis: auto;
font-size: 14px;
font-weight: normal;
margin-right: 16px;
}
#search_form .search_categories input[type="checkbox"]:checked + label,
#search_form #categories input[type="checkbox"]:checked + label {
#search_form .search_categories input[type="radio"]:checked + label,
#search_form #categories input[type="radio"]:checked + label {
color: #5068dd;
font-weight: bold;
}
#search_form #more_categories {
position: absolute;
top: 24px;
display: flex;
flex-direction: column;
border-radius: 8px;
border: 2px solid rgba(0, 0, 0, 0.2);
background-color: #eeeeee;
padding-bottom: 16px;
left: 0;
z-index: 998;
}
#search_form #more_categories > label {
padding: 16px;
padding-bottom: 0;
white-space: nowrap;
}
#more_categories_container {
border-left: 1px solid rgba(0, 0, 0, 0.24);
padding-left: 16px;
display: flex;
align-items: center;
position: relative;
}
#more_categories_toggle:checked ~ #more_categories,
#more_categories_toggle_[checked] ~ #more_categories {
display: flex;
}
#more_categories_toggle:checked ~ #show_more_categories,
#more_categories_toggle_[checked] ~ #show_more_categories {
display: none;
}
#more_categories_toggle:checked ~ #show_less_categories,
#more_categories_toggle_[checked] ~ #show_less_categories {
display: initial;
}
#more_categories_toggle:not(:checked) ~ #more_categories,
#more_categories_toggle_:not([checked]) ~ #more_categories {
display: none;
}
#more_categories_toggle:not(:checked) ~ #show_more_categories,
#more_categories_toggle_:not([checked]) ~ #show_more_categories {
display: initial;
}
#more_categories_toggle:not(:checked) ~ #show_less_categories,
#more_categories_toggle_:not([checked]) ~ #show_less_categories {
display: none;
}
@media screen and (max-width: 600px) {
#search_form #search_params {
overflow-x: scroll;
}
#search_form #search_params #time_and_lang {
display: flex;
}
#search_form #search_params #time_and_lang > * {
width: auto;
}
#search_form #search_params,
#search_form #categories {
flex-wrap: nowrap;
}
#search_form #time_and_lang {
display: flex;
#search_form #more_categories {
position: relative;
flex-direction: row;
align-items: center;
top: 0;
border: none;
border-radius: 0;
padding-bottom: 0;
background-color: transparent;
margin-left: 16px;
}
#search_form #more_categories > label {
padding: 0;
}
#search_input_container {
margin-right: 40px;
......@@ -651,6 +720,11 @@ nav #eelo_links > * {
width: 100%;
margin-top: 16px;
}
#image_result_mini_gallery_header {
display: flex;
align-items: center;
justify-content: space-between;
}
@media screen and (max-width: 1100px) {
#results.image-gallery {
grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
......
This diff is collapsed.
......@@ -62,7 +62,34 @@ $(document).ready(function() {
});
}
});
;/**
;
function configure_image_view(target) {
document.getElementById("image_view_image").src = target.href;
document.getElementById("image_view_file_link").href = target.href;
document.getElementById("image_view_url_link").href = target.dataset.url;
}
function show_image_view_modal(event) {
event.preventDefault();
var target = event.target;
if (target.tagName == "IMG") {
target = target.parentElement;
}
var modal = document.getElementById("image_view_modal");
modal.classList.remove("hidden");
modal.style.top = window.scrollY + "px";
configure_image_view(target);
document.body.classList.add("lock");
}
function close_image_view_modal() {
document.getElementById("image_view_modal").classList.add("hidden");
document.getElementById("image_view_image").src = "";
document.getElementById("image_view_file_link").href = "#";
document.getElementById("image_view_url_link").href = "#";
document.body.classList.remove("lock");
};/**
* searx is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
......@@ -83,7 +110,7 @@ $(document).ready(function() {
/**
* focus element if class="autofocus" and id="q"
*/
document.querySelector("#q[autofocus]").focus();
// document.querySelector("#q[autofocus]").focus();
$('#q[autofocus]').focus();
/**
......@@ -140,27 +167,22 @@ $(document).ready(function() {
iframe_load.attr('src', iframe_load.data('src'));
}
});
/**
* Select or deselect every categories on double clic
*/
$(".btn-sm").dblclick(function() {
var btnClass = 'btn-' + $(this).data('btn-class'); // primary
if($(this).hasClass('btn-default')) {
$(".btn-sm > input").attr('checked', 'checked');
$(".btn-sm > input").prop("checked", true);
$(".btn-sm").addClass(btnClass);
$(".btn-sm").addClass('active');
$(".btn-sm").removeClass('btn-default');
} else {
$(".btn-sm > input").attr('checked', '');
$(".btn-sm > input").removeAttr('checked');
$(".btn-sm > input").checked = false;
$(".btn-sm").removeClass(btnClass);
$(".btn-sm").removeClass('active');
$(".btn-sm").addClass('btn-default');
}
// kinda hack, to make the more categories menu work, when JS is enabled.
$("#show_more_categories_").click(function(event) {
$(event.target).addClass("hidden");
$("#show_less_categories_").removeClass("hidden");
$("#more_categories_toggle_").attr("checked", true);
});
$("#show_less_categories_").click(function(event) {
$(event.target).addClass("hidden");
$("#show_more_categories_").removeClass("hidden");
$("#more_categories_toggle_").attr("checked", false);
});
$("#show_more_categories_").removeClass("hidden");
$('<div id="more_categories_toggle_" class="hidden"></div>').insertAfter($("#more_categories_toggle"));
$("#more_categories_toggle, #show_more_categories, #show_less_categories").remove();
});
;/**
* searx is free software: you can redistribute it and/or modify
......
This diff is collapsed.
function configure_image_view(target) {
document.getElementById("image_view_image").src = target.href;
document.getElementById("image_view_file_link").href = target.href;
document.getElementById("image_view_url_link").href = target.dataset.url;
}
function show_image_view_modal(event) {
event.preventDefault();
var target = event.target;
if (target.tagName == "IMG") {
target = target.parentElement;
}
var modal = document.getElementById("image_view_modal");
modal.classList.remove("hidden");
modal.style.top = window.scrollY + "px";
configure_image_view(target);
document.body.classList.add("lock");
}
function close_image_view_modal() {
document.getElementById("image_view_modal").classList.add("hidden");
document.getElementById("image_view_image").src = "";
document.getElementById("image_view_file_link").href = "#";
document.getElementById("image_view_url_link").href = "#";
document.body.classList.remove("lock");
}
\ No newline at end of file
......@@ -19,7 +19,7 @@ $(document).ready(function() {
/**
* focus element if class="autofocus" and id="q"
*/
document.querySelector("#q[autofocus]").focus();
// document.querySelector("#q[autofocus]").focus();
$('#q[autofocus]').focus();
/**
......@@ -76,25 +76,20 @@ $(document).ready(function() {
iframe_load.attr('src', iframe_load.data('src'));
}
});
/**
* Select or deselect every categories on double clic
*/
$(".btn-sm").dblclick(function() {
var btnClass = 'btn-' + $(this).data('btn-class'); // primary
if($(this).hasClass('btn-default')) {
$(".btn-sm > input").attr('checked', 'checked');
$(".btn-sm > input").prop("checked", true);
$(".btn-sm").addClass(btnClass);
$(".btn-sm").addClass('active');
$(".btn-sm").removeClass('btn-default');
} else {
$(".btn-sm > input").attr('checked', '');
$(".btn-sm > input").removeAttr('checked');
$(".btn-sm > input").checked = false;
$(".btn-sm").removeClass(btnClass);
$(".btn-sm").removeClass('active');
$(".btn-sm").addClass('btn-default');
}
// kinda hack, to make the more categories menu work, when JS is enabled.
$("#show_more_categories_").click(function(event) {
$(event.target).addClass("hidden");
$("#show_less_categories_").removeClass("hidden");
$("#more_categories_toggle_").attr("checked", true);
});
$("#show_less_categories_").click(function(event) {
$(event.target).addClass("hidden");
$("#show_more_categories_").removeClass("hidden");
$("#more_categories_toggle_").attr("checked", false);
});
$("#show_more_categories_").removeClass("hidden");
$('<div id="more_categories_toggle_" class="hidden"></div>').insertAfter($("#more_categories_toggle"));
$("#more_categories_toggle, #show_more_categories, #show_less_categories").remove();
});
......@@ -113,6 +113,12 @@
}
}
#image_result_mini_gallery_header {
display: flex;
align-items: center;
justify-content: space-between;
}
.tablet-mq({
#results.image-gallery {
......@@ -123,6 +129,4 @@
max-height: 140px;
}
}
});
});
\ No newline at end of file
......@@ -13,15 +13,7 @@
border-radius: 50px;
height: @input-size;
&:hover, &:active { border-color: @color_accent; }
&:extend(.border-color-transition);
// used when autocomplete is enabled and the suggestion box is open
// &.expanded {
// border-radius: 25px;
// border-bottom-left-radius: 0;
// border-bottom-right-radius: 0;
// }
&:extend(.border-color-transition);
// the actual input
#q {
......@@ -99,7 +91,7 @@
box-sizing: border-box !important;
background-color: @grey;
padding-left: @spacing_large;
padding-right: @spacing_large;
padding-right: @spacing_large;
}
&.inline-search {
......@@ -114,7 +106,7 @@
#search_params {
display: flex;
justify-content: space-between;
font-size: @fontsize_x-small;
font-size: @fontsize_small;
padding-bottom: @spacing_large;
padding-top: @spacing_large;
padding-left: @spacing_x-large;
......@@ -126,9 +118,12 @@
text-align: right;
padding-right: 32px;
}
#time_and_lang > :first-child {
margin-right: @spacing_large;
#time_and_lang {
text-align: right;
// > :first-child { margin-right: @spacing_large; }
> * { width: 160px; }
}
}
......@@ -137,29 +132,84 @@
display: flex;
flex-wrap: wrap;
align-items: center;
position: relative;
flex: 100%;
label {
flex-grow: 1;
flex-basis: auto;
font-size: @fontsize_small;
font-weight: normal;
margin-right: @spacing_large;
}
input[type="checkbox"]:checked + label {
input[type="radio"]:checked + label {
color: @color_accent;
font-weight: bold;
}
}
#more_categories {
position: absolute;
top: @spacing_x-large;
display: flex;
flex-direction: column;
border-radius: @corner-radius;
.widget-border();
background-color: @grey;
padding-bottom: @spacing_large;
left: 0;
z-index: 998;
}
#more_categories > label {
padding: @spacing_large;
padding-bottom: 0;
white-space: nowrap;
}
}
#more_categories_container {
border-left: 1px solid rgba(0, 0, 0, 0.24);
padding-left: @spacing_large;
display: flex;
align-items: center;
position: relative;
}
#more_categories_toggle:checked, #more_categories_toggle_[checked] {
& ~ #more_categories { display: flex; }
& ~ #show_more_categories { display: none; }
& ~ #show_less_categories { display: initial; }
}
#more_categories_toggle:not(:checked), #more_categories_toggle_:not([checked]) {
& ~ #more_categories { display: none; }
& ~ #show_more_categories { display: initial; }
& ~ #show_less_categories { display: none; }
}
// make advanced options scrollable on mobile
.mobile-mq({
#search_form {
#search_params { overflow-x: scroll; }
#search_params {
overflow-x: scroll;
#time_and_lang {
display: flex;
> * { width: auto; }
}
}
#search_params, #categories { flex-wrap: nowrap; }
#time_and_lang { display: flex; }
#more_categories {
position: relative;
flex-direction: row;
align-items: center;
top: 0;
border: none;
border-radius: 0;
padding-bottom: 0;
background-color: transparent;
margin-left: @spacing_large;
> label { padding: 0; }
}
}
#search_input_container {
margin-right: @spacing_medium * 2 + 24px;
......
......@@ -121,39 +121,5 @@
{% for script in scripts %}
<script src="{{ url_for('static', filename=script) }}"></script>
{% endfor %}
<!-- modal -->
<script>
function configure_image_view(target) {
document.getElementById("image_view_image").src = target.href;
document.getElementById("image_view_file_link").href = target.href;
document.getElementById("image_view_url_link").href = target.dataset.url;
}
function show_image_view_modal(event) {
event.preventDefault();
let target = event.target;
if (target.tagName == "IMG") {
target = target.parentElement;
}
let modal = document.getElementById("image_view_modal");
modal.classList.remove("hidden");
modal.style.top = window.scrollY + "px";
configure_image_view(target);
document.body.classList.add("lock");
}
function close_image_view_modal() {
document.getElementById("image_view_modal").classList.add("hidden");
document.getElementById("image_view_image").src = "";
document.getElementById("image_view_file_link").href = "#";
document.getElementById("image_view_url_link").href = "#";
document.body.classList.remove("lock");
}
</script>
</body>
</html>
{% macro category_widget(category) -%}
<input class="hidden" type="radio" id="checkbox_{{ category|replace(' ', '_') }}" name="category" value="{{ category }}" {% if category in selected_categories %}checked="checked"{% endif %} />
<label for="checkbox_{{ category|replace(' ', '_') }}">{{ _(category) }}</label>
{%- endmacro -%}
<div id="categories" {% if rtl %} class="rtl" {% endif %}>
{% for category in categories %}
{% if category in ["general", "images"] %}
<input class="hidden" type="checkbox" id="checkbox_{{ category|replace(' ', '_') }}" name="category_{{ category }}" {% if category in selected_categories %}checked="checked"{% endif %} />
<label for="checkbox_{{ category|replace(' ', '_') }}">{{ _(category) }}</label>
{% if category in ["general", "images"] or category in selected_categories %}
{{ category_widget(category) }}
{% endif %}
{% endfor %}
<div id="more_categories_container">
<input type="checkbox" name="more_categories_toggle" id="more_categories_toggle" class="hidden">
<label for="more_categories_toggle" id="show_more_categories">{{_("More")}}</label>
<label for="more_categories_toggle" id="show_less_categories">{{_("Less")}}</label>
<span id="show_more_categories_" class="hidden">{{_("More")}}</span>
<span id="show_less_categories_" class="hidden">{{_("Less")}}</span>
<div id="more_categories">
{% for category in categories %}
{% if not (category in ["general", "images"] or category in selected_categories) %}
{{ category_widget(category) }}
{% endif %}
{% endfor %}
</div>
</div>
</div>
......@@ -17,7 +17,7 @@
</div>
{{ caller() }}
</form><!-- / #search_form_full -->
</form>
{%- endmacro %}
{% macro navbar_menu() -%}
......
......@@ -56,7 +56,16 @@
{{ put_results(results[:3]) }}
{% if image_results %}
<h1>images</h1>
<div id="image_result_mini_gallery_header">
<h1>{{_("Images")}}</h1>
<form method="{{ method or 'POST' }}" action="{{ url_for('index') }}">
<input type="hidden" name="q" value="{{ q|e }}" />
<input type="hidden" name="time_range" value="{{ time_range }}" />
<input type="hidden" name="language" value="{{ current_language }}" />
<input type="hidden" name="category" value="images" />
<button type="submit" class="btn btn-flat" >{{_("More")}}</button>
</form>
</div>
<div id="default_images_container">
{{ put_results(image_results) }}
</div>
......
......@@ -481,6 +481,19 @@ def index():
search_query = None
result_container = None
try:
# we dont want users to select multiple categories, this simplifies the experience.
if request.form.get("categories"):
request.form["categories"] = "general"
if request.form.get("category"):
for k, v in request.form.items():
if k.startswith("category_"):
request.form.pop(k, None)
request.form["category_" + request.form['category']] = u"On"
# else:
# request.form["category_general"] = u"On"
print(request.form)
search_query = get_search_query_from_webapp(request.preferences, request.form)
# search = Search(search_query) # without plugins
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment