forked from Ponysearch/Ponysearch
Merge pull request #573 from return42/img-lazy
[fix] lazy loading of <img> tags
This commit is contained in:
commit
ff48a41af0
12 changed files with 17 additions and 16 deletions
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -1 +1 @@
|
|||
{"version":3,"file":"searxng.head.min.js","sources":["../src/js/head/00_init.js"],"sourcesContent":["/**\n * @license\n * (C) Copyright Contributors to the SearXNG project.\n * (C) Copyright Contributors to the searx project (2014 - 2021).\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n/* global DocumentTouch:readonly */\n(function(w, d) {\n 'use strict';\n\n // add data- properties\n var script = d.currentScript || (function() {\n var scripts = d.getElementsByTagName('script');\n return scripts[scripts.length - 1];\n })();\n\n // try to detect touch screen\n w.searxng = {\n touch: ((\"ontouchstart\" in w) || w.DocumentTouch && document instanceof DocumentTouch) || false,\n method: script.getAttribute('data-method'),\n autocompleter: script.getAttribute('data-autocompleter') === 'true',\n search_on_category_select: script.getAttribute('data-search-on-category-select') === 'true',\n infinite_scroll: script.getAttribute('data-infinite-scroll') === 'true',\n hotkeys: script.getAttribute('data-hotkeys') === 'true',\n static_path: script.getAttribute('data-static-path'),\n translations: JSON.parse(script.getAttribute('data-translations')),\n theme : {\n // image that is displayed if load of <img src='...'> failed\n img_load_error: 'img/img_load_error.svg'\n }\n };\n\n // update the css\n var hmtlElement = d.getElementsByTagName(\"html\")[0];\n hmtlElement.classList.remove('no-js');\n hmtlElement.classList.add('js');\n if (w.searxng.touch) {\n hmtlElement.classList.add('touch');\n }\n})(window, document);"],"names":["w","d","script","currentScript","scripts","getElementsByTagName","length","searxng","touch","DocumentTouch","document","method","getAttribute","autocompleter","search_on_category_select","infinite_scroll","hotkeys","static_path","translations","JSON","parse","theme","img_load_error","hmtlElement","classList","remove","add","window"],"mappings":";;;;;;CAOA,SAAUA,EAAGC,gBAIT,IAAIC,EAASD,EAAEE,eAAkB,WAC7B,IAAIC,EAAUH,EAAEI,qBAAqB,UACrC,OAAOD,EAAQA,EAAQE,OAAS,GAFH,GAMjCN,EAAEO,QAAU,CACRC,MAAS,iBAAkBR,GAAMA,EAAES,eAAiBC,oBAAoBD,eAAkB,MAC1FE,OAAQT,EAAOU,aAAa,eAC5BC,cAAeX,EAAOU,aAAa,wBAA0B,OAC7DE,0BAA2BZ,EAAOU,aAAa,oCAAsC,OACrFG,gBAAiBb,EAAOU,aAAa,0BAA4B,OACjEI,QAASd,EAAOU,aAAa,kBAAoB,OACjDK,YAAaf,EAAOU,aAAa,oBACjCM,aAAcC,KAAKC,MAAMlB,EAAOU,aAAa,sBAC7CS,MAAQ,CAEJC,eAAgB,2BAKxB,IAAIC,EAActB,EAAEI,qBAAqB,QAAQ,GACjDkB,EAAYC,UAAUC,OAAO,SAC7BF,EAAYC,UAAUE,IAAI,MAC1B,GAAI1B,EAAEO,QAAQC,MAAO,CACjBe,EAAYC,UAAUE,IAAI,WA9BlC,CAgCGC,OAAQjB"}
|
||||
{"version":3,"file":"searxng.head.min.js","sources":["../src/js/head/00_init.js"],"sourcesContent":["/**\n * @license\n * (C) Copyright Contributors to the SearXNG project.\n * (C) Copyright Contributors to the searx project (2014 - 2021).\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n/* global DocumentTouch:readonly */\n(function (w, d) {\n 'use strict';\n\n // add data- properties\n var script = d.currentScript || (function () {\n var scripts = d.getElementsByTagName('script');\n return scripts[scripts.length - 1];\n })();\n\n // try to detect touch screen\n w.searxng = {\n touch: ((\"ontouchstart\" in w) || w.DocumentTouch && document instanceof DocumentTouch) || false,\n method: script.getAttribute('data-method'),\n autocompleter: script.getAttribute('data-autocompleter') === 'true',\n search_on_category_select: script.getAttribute('data-search-on-category-select') === 'true',\n infinite_scroll: script.getAttribute('data-infinite-scroll') === 'true',\n hotkeys: script.getAttribute('data-hotkeys') === 'true',\n static_path: script.getAttribute('data-static-path'),\n translations: JSON.parse(script.getAttribute('data-translations')),\n theme: {\n // image that is displayed if load of <img src='...'> failed\n img_load_error: 'img/img_load_error.svg'\n }\n };\n\n // update the css\n var hmtlElement = d.getElementsByTagName(\"html\")[0];\n hmtlElement.classList.remove('no-js');\n hmtlElement.classList.add('js');\n if (w.searxng.touch) {\n hmtlElement.classList.add('touch');\n }\n})(window, document);"],"names":["w","d","script","currentScript","scripts","getElementsByTagName","length","searxng","touch","DocumentTouch","document","method","getAttribute","autocompleter","search_on_category_select","infinite_scroll","hotkeys","static_path","translations","JSON","parse","theme","img_load_error","hmtlElement","classList","remove","add","window"],"mappings":";;;;;;CAOA,SAAWA,EAAGC,gBAIZ,IAAIC,EAASD,EAAEE,eAAkB,WAC/B,IAAIC,EAAUH,EAAEI,qBAAqB,UACrC,OAAOD,EAAQA,EAAQE,OAAS,GAFD,GAMjCN,EAAEO,QAAU,CACVC,MAAS,iBAAkBR,GAAMA,EAAES,eAAiBC,oBAAoBD,eAAkB,MAC1FE,OAAQT,EAAOU,aAAa,eAC5BC,cAAeX,EAAOU,aAAa,wBAA0B,OAC7DE,0BAA2BZ,EAAOU,aAAa,oCAAsC,OACrFG,gBAAiBb,EAAOU,aAAa,0BAA4B,OACjEI,QAASd,EAAOU,aAAa,kBAAoB,OACjDK,YAAaf,EAAOU,aAAa,oBACjCM,aAAcC,KAAKC,MAAMlB,EAAOU,aAAa,sBAC7CS,MAAO,CAELC,eAAgB,2BAKpB,IAAIC,EAActB,EAAEI,qBAAqB,QAAQ,GACjDkB,EAAYC,UAAUC,OAAO,SAC7BF,EAAYC,UAAUE,IAAI,MAC1B,GAAI1B,EAAEO,QAAQC,MAAO,CACnBe,EAAYC,UAAUE,IAAI,WA9B9B,CAgCGC,OAAQjB"}
|
File diff suppressed because one or more lines are too long
|
@ -267,6 +267,7 @@ article[data-vim-selected].category-social {
|
|||
float: left;
|
||||
padding: 0.6rem 1rem 0 0;
|
||||
width: 20rem;
|
||||
height: unset; // remove heigth value that was needed for lazy loading
|
||||
}
|
||||
|
||||
&.image {
|
||||
|
|
|
@ -23,8 +23,8 @@
|
|||
<span class="url_o{{loop.index}}"><span class="url_i{{loop.index}}">{{- part -}}</span></span>
|
||||
{%- endfor %}
|
||||
{{- result_close_link() -}}
|
||||
{%- if result.img_src %}{{ result_open_link(result.url) }}<img class="image" src="{{ image_proxify(result.img_src) }}" title="{{ result.title|striptags }}">{{ result_close_link() }}{% endif -%}
|
||||
{%- if result.thumbnail %}{{ result_open_link(result.url) }}<img class="thumbnail" src="{{ image_proxify(result.thumbnail) }}" title="{{ result.title|striptags }}">{{ result_close_link() }}{% endif -%}
|
||||
{%- if result.img_src %}{{ result_open_link(result.url) }}<img class="image" src="{{ image_proxify(result.img_src) }}" title="{{ result.title|striptags }}" loading="lazy" width="200" height="200">{{ result_close_link() }}{% endif -%}
|
||||
{%- if result.thumbnail %}{{ result_open_link(result.url) }}<img class="thumbnail" src="{{ image_proxify(result.thumbnail) }}" title="{{ result.title|striptags }}" loading="lazy" width="200" height="200">{{ result_close_link() }}{% endif -%}
|
||||
<h3>{{ result_link(result.url, result.title|safe) }}</h3>
|
||||
{%- endmacro -%}
|
||||
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<article class="result result-images {% if result['category'] %}category-{{ result['category'] }}{% endif %}">{{- "" -}}
|
||||
<a {% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %} href="{{ result.img_src }}">{{- "" -}}
|
||||
<img class="image_thumbnail" {% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %} src="{% if result.thumbnail_src %}{{ image_proxify(result.thumbnail_src) }}{% else %}{{ image_proxify(result.img_src) }}{% endif %}" loading="lazy" alt="{{ result.title|striptags }}">{{- "" -}}
|
||||
<img class="image_thumbnail" {% if results_on_new_tab %}target="_blank" rel="noopener noreferrer"{% else %}rel="noreferrer"{% endif %} src="{% if result.thumbnail_src %}{{ image_proxify(result.thumbnail_src) }}{% else %}{{ image_proxify(result.img_src) }}{% endif %}" alt="{{ result.title|striptags }}" loading="lazy" width="200" height="200">{{- "" -}}
|
||||
<span class="title">{{ result.title|striptags }}</span>{{- "" -}}
|
||||
</a>{{- "" -}}
|
||||
<div class="detail">{{- "" -}}
|
||||
|
@ -11,7 +11,7 @@
|
|||
{%- if result.thumbnail_src -%}
|
||||
<img src="" data-src="{{ image_proxify(result.img_src) }}" alt="{{ result.title|striptags }}">
|
||||
{%- else -%}
|
||||
<img src="{{ image_proxify(result.img_src) }}" alt="{{ result.title|striptags }}" loading="lazy">
|
||||
<img src="{{ image_proxify(result.img_src) }}" alt="{{ result.title|striptags }}" loading="lazy" width="200" height="200">
|
||||
{%- endif -%}
|
||||
</a>{{- "" -}}
|
||||
<div class="result-images-labels">{{- "" -}}
|
||||
|
|
Loading…
Reference in a new issue