Commit cc29e23f authored by yPhil's avatar yPhil
Browse files

Search OK

parent 752154f0
Pipeline #396098 passed with stage
in 42 seconds
{
"name": "petrolette",
"description": "News reading webapp.",
"version": "1.2.0",
"version": "1.2.2",
"private": true,
"license": "GPL-3.0-only",
"FAVICONS_CACHE_DIR": "favicons-cache",
......
@font-face {
font-family: 'fontello';
src: url('../font/fontello.eot?37133991');
src: url('../font/fontello.eot?37133991#iefix') format('embedded-opentype'),
url('../font/fontello.woff2?37133991') format('woff2'),
url('../font/fontello.woff?37133991') format('woff'),
url('../font/fontello.ttf?37133991') format('truetype'),
url('../font/fontello.svg?37133991#fontello') format('svg');
src: url('../font/fontello.eot?47708348');
src: url('../font/fontello.eot?47708348#iefix') format('embedded-opentype'),
url('../font/fontello.woff2?47708348') format('woff2'),
url('../font/fontello.woff?47708348') format('woff'),
url('../font/fontello.ttf?47708348') format('truetype'),
url('../font/fontello.svg?47708348#fontello') format('svg');
font-weight: normal;
font-style: normal;
}
......@@ -15,7 +15,7 @@
@media screen and (-webkit-min-device-pixel-ratio:0) {
@font-face {
font-family: 'fontello';
src: url('../font/fontello.svg?37133991#fontello') format('svg');
src: url('../font/fontello.svg?47708348#fontello') format('svg');
}
}
*/
......@@ -84,4 +84,5 @@
.icon-help:before { content: '\e827'; } /* '' */
.icon-buoy:before { content: '\e828'; } /* '' */
.icon-video:before { content: '\e829'; } /* '' */
.icon-w3c:before { content: '\e830'; } /* '' */
\ No newline at end of file
.icon-w3c:before { content: '\e830'; } /* '' */
.icon-reset:before { content: '\f831'; } /* '' */
\ No newline at end of file
......@@ -38,7 +38,7 @@
/* Relative to media */
--side-menu-width-expanded: 275px;
--side-menu-width-expanded: 280px;
--side-menu-width: -291px;
--header-height: 24px;
--controls-width: 150px;
......@@ -168,36 +168,30 @@ a:active {
order: 3;
}
.topnav > div.menuBarItem > i {
.topnav > div.menuBarItem > i.topMenuIcon {
display: block;
color: var(--color-ui-sec);
font-size: 16pt;
margin: 8px 8px 8px 12px;
}
.topnav > div.menuBarItem > input {
margin: 8px 8px 8px 12px;
}
.topnav > div.menuBarItem:hover {
background-color: var(--color-ui-qua);
.topnav > div.menuBarItem > i.icon-reset {
margin: 13px 0 8px -28px;
color: #333333;
}
.topnav > div.menuBarItem:hover i {
color: var(--color-ui-pri);
.topnav > div.menuBarItem > i.icon-reset:hover {
color: #555555;
}
.topnav > div.menuBarItem:hover .text {
/* display: none; */
visibility: hidden;
.topnav > div.menuBarItem > input {
margin: 8px;
}
.topnav > div.menuBarItem > .text {
position: relative;
z-index: 10;
.topnav > div.menuBarItem i.topMenuIcon:hover {
color: var(--color-ui-pri);
}
div#logo-title {
display: flex;
}
......@@ -206,6 +200,10 @@ div#logo-title {
color: var(--color-ui-sec);
}
.icon-w3c {
color: var(--color-ui-success);
}
.logoType i.icon-petrolette {
display: block;
cursor: pointer;
......@@ -460,11 +458,6 @@ ul.help li {
/* border-top: 1px solid var(--color-ui-danger) !important; */
/* } */
li.feed-item:not(.error) a {
display: block;
width: 100%;
}
i.feed-control {
color: var(--color-fg5);
}
......@@ -515,7 +508,7 @@ i.item-icon {
.feed-header > .feed-title > a.danger:link,
.feed-header > .feed-title > a.danger:visited {
color: var(--color-ui-danger);
color: var(--color-danger);
}
.feed-header > .feed-title > a.danger:hover,
......@@ -618,19 +611,19 @@ select {
fieldset {
color: var(--color-ui-pri);
background: var(--color-ui-qua) !important;
/* margin: 0 0 0.2em 0; */
/* padding-bottom: 0.4em; */
/* padding-left: 0.4em; */
/* padding-right: 0.4em; */
/* width: available; */
}
legend {
color: var(--color-ui-pri);
}
legend.first {
margin-top: 0.6em;
}
.menu legend {
margin-left: 6px;
color: var(--color-ui-qui);
margin-left: 14px;
font-size: 9pt;
}
......@@ -662,13 +655,12 @@ nav#sideMenu,
}
nav#sideMenu .ui-button,
nav#sideMenu #sync-box {
#sync-box {
margin-bottom: 0.3em;
}
.results {
background: #de1919;
color: white;
outline: 1px solid var(--color-fg7) !important;
}
nav#sideMenu:hover {
......@@ -679,6 +671,10 @@ nav#sideMenu.expanded {
left: 0;
}
.left {
margin-right: 0.3em;
}
#progress-bar {
color: var(--color-ui-sec);
}
......@@ -717,7 +713,6 @@ nav#sideMenu.expanded {
font-family: monospace;
overflow-wrap: break-word;
overflow: auto;
padding: 0 0.2em;
text-align: left;
}
......@@ -782,10 +777,12 @@ a.validateFeedButton {
flex: 1;
}
fieldset {
border: 0;
}
fieldset.menuForm {
display: flex;
height: 100%;
justify-content: space-between;
background-color: var(--color-ui-qua);
}
......@@ -793,10 +790,6 @@ fieldset.feedsMenuForm {
background-color: var(--color-ui-qua) !important;
}
/* .ui-button:not(.ui-spinner-button, .feedGuessButton, .feedErrorReportButton) { */
/* margin-right: 0.4em; */
/* } */
.buttonLeft {
margin-right: 0.4em;
}
......@@ -1225,7 +1218,7 @@ li.feed-item:nth-child(even) {
background-color: var(--color-bg4);
}
li.feed-item:hover {
li.feed-item:not(.error):hover {
background-color: var(--color-bg5);
}
......@@ -1239,6 +1232,11 @@ li.feed-item > div.itemDiv > a > .ptl-img {
/* max-width: 30%; */
}
li.feed-item:not(.error) a {
display: block;
width: 100%;
}
li.feed-item img:hover {
outline: 1px solid var(--color-fg2);
}
......
:root {
--color-pri: #111133;
--color-sec: #EEEEFF;
--color-ter: #007FFF;
--color-qua: #EEEEEF;
--color-qui: #C2C8D6; /* visited links */
--color-sen: #FFFFFF;
--color-sep: #C2C8D6;
--color-oct: #CCCCCC;
--color-non: #EEEEFF;
--color-den: #94C2D1;
--color-danger: #B00020;
--color-fg1: #111133; /* Normal text / Links */
--color-fg2: #E76F51; /* Active / Hover Links */
--color-fg1: #111133; /* Normal text */
--color-fg2: #E76F51; /* Links */
--color-fg3: #404552; /* Visited links */
--color-fg4: #264653; /* Separators */
--color-fg5: #F4D35E; /* Feed controls */
--color-fg6: #EE964B; /* Feed title */
--color-bg1: #EEEEFF; /* Body */
--color-fg7: #FFFF00; /* Feed title */
--color-bg1: #EEEEFF; /* Body / Feed border */
--color-bg2: #086375; /* Feed header */
--color-bg3: #D7DAE5; /* Feed item BG */
--color-bg4: #EEEEEE; /* Feed item BG alternate */
--color-bg5: #1F262E; /* Feed item BG hover */
--color-hl1: #1C0B19;
--color-hl2: #FF0000; /* Feed controls hover */
--color-hl3: #000000;
--color-danger: #BB0000;
}
......@@ -5,13 +5,14 @@
--color-fg4: #404552; /* Separators */
--color-fg5: #F77F00; /* Feed controls */
--color-fg6: #eae2b7; /* Feed title */
--color-fg7: #FFFF00; /* Feed title */
--color-bg1: #29323C; /* Body / Feed border */
--color-bg2: #1F262E; /* Feed header */
--color-bg3: #383C4A; /* Feed item BG */
--color-bg4: #424657; /* Feed item BG alternate */
--color-bg5: #1F262E; /* Feed item BG hover */
--color-hl1: #1F262E;
--color-hl2: #000000;
--color-hl2: #000000; /* Feed controls hover */
--color-hl3: #000000;
--color-danger: #FF0000;
}
......@@ -193,6 +193,12 @@
"css": "w3c",
"code": 59440,
"src": "elusive"
},
{
"uid": "44eb9d69bf3b9b74629ce6852a2f9681",
"css": "reset",
"code": 63537,
"src": "mfglabs"
}
]
}
\ No newline at end of file
No preview for this file type
......@@ -65,6 +65,8 @@
<glyph glyph-name="video" unicode="&#xe829;" d="M980 600l-100 0 0-100 100 0 0-100-100 0 0-100 100 0 0-100-100 0 0-100 100 0 0-60q0-16-12-28t-28-12l-900 0q-16 0-28 12t-12 28l0 60 100 0 0 100-100 0 0 100 100 0 0 100-100 0 0 100 100 0 0 100-100 0 0 60q0 18 12 29t28 11l900 0q16 0 28-11t12-29l0-60z m-600-400l250 150-250 150 0-300z" horiz-adv-x="980" />
<glyph glyph-name="w3c" unicode="&#xe830;" d="M0 84l0 766 1000 0 0-766-500-234z m84 461l63-275q3-14 17-14l47 0q14 0 18 14l23 113 21-113q4-14 18-14l49 0q14 0 17 14l61 275q2 10-3 16t-13 6l-50 0q-14 0-16-14l-23-121-26 121q-4 14-17 14l-38 0q-13 0-15-14l-26-121-25 121q-2 14-16 14l-50 0q-20 0-16-22z m344-242q37-51 103-53 45 2 76 30t32 68q-2 43-34 68 30 28 30 63-2 45-32 68t-72 24q-64 0-99-51-8-12 2-23l27-26q14-12 25 2 18 24 41 24 20 0 24-10 6-12 0-26-8-9-45-9-20 0-20-16l0-41q2-21 20-18 45 0 49-9t4-16q0-25-28-25-29 0-47 25-11 16-25 2l-29-29q-10-10-2-22z m232 108q0-73 36-117t95-44q70 0 104 75 3 19-10 23l-37 18q-6 2-14-1t-10-9q-12-29-33-29t-35 23-14 62 14 61 35 24q21-2 33-28 8-13 24-10l37 18q17 10 10 25-34 71-104 71-59 0-95-45t-36-117z" horiz-adv-x="1000" />
<glyph glyph-name="reset" unicode="&#xf831;" d="M0 350q0 95 37 182t100 149 150 100 182 37 182-37 149-100 100-149 37-182-37-182-100-150-149-100-182-37-182 37-150 100-100 150-37 182z m261-155q0-22 15-38 15-15 37-15 22 0 37 15l119 119 118-119q15-15 37-15 22 0 37 15 15 16 15 38t-15 37l-118 118 118 119q15 15 15 37t-15 37-37 15-37-15l-118-119-119 119q-15 15-37 15t-37-15q-15-15-15-37t15-37l118-119-118-118q-15-15-15-37z" horiz-adv-x="937.5" />
</font>
</defs>
</svg>
\ No newline at end of file
No preview for this file type
......@@ -80,7 +80,6 @@ PTL.dialog = {
.attr('href', 'javascript:void(window.open("' + window.location.href + '?add=" + window.location.href))');
$('.help-tour').on('click', function() {
PTL.sideMenu('close');
PTL.dialog.kill($dialog);
$('#tabs').tabs('option', 'active', 0);
PTL.util.help('ui');
......
......@@ -226,35 +226,38 @@ PTL.feed = {
PTL.util.say(PTL.tr('Problem reading feed [%1] Error type [%2]', feedUrl, message), 'warning');
var $w3cLink = $('<a>'),
$validCssIcon = $('<i>');
var $validateLink = $('<a>'),
$validateLinkIcon = $('<i>'),
$reportLink = $('<a>'),
$reportLinkIcon = $('<i>');
$validCssIcon
$validateLinkIcon
.attr('class', 'item-icon icon-w3c')
.attr('titre', PTL.tr('Validate /verify this feed file with the W3C'))
.appendTo($w3cLink);
.attr('title', PTL.tr('Validate /verify this feed file with the W3C'))
.appendTo($validateLink);
$w3cLink
$validateLink
.attr('href', 'https://validator.w3.org/feed/check.cgi?url=' + feedUrl)
.appendTo($feedBodyUl);
$reportLinkIcon
.attr('class', 'item-icon icon-petrolette')
.attr('title', PTL.tr('Report feed error'))
.appendTo($validateLink);
$reportLink
.attr('href', 'https://framagit.org/yphil/petrolette/-/issues/new?issue[title]=Feed%20error&issue[description]=' + feedUrl + ' (' + message + ')')
.appendTo($feedBodyUl);
$feedLink
.text(PTL.tr('Error'))
.addClass('translate danger')
.data('content', PTL.tr('Error'));
var $feedErrorReportButton = $('<a>')
.attr('href', 'https://framagit.org/yphil/petrolette/-/issues/new?issue[title]=Feed%20error&issue[description]=' + feedUrl + ' (' + message + ')')
.attr('class', 'translate ui-button ui-widget ui-corner-all feedErrorReportButton')
.attr('title', PTL.tr('Report feed error'))
.data('title', PTL.tr('Report feed error'))
.data('content', PTL.tr('Report'))
.text(PTL.tr('Report'));
var $key = $('<strong>')
.attr('class', 'translate key')
.data('content', PTL.tr('Type'))
.text(PTL.tr('Type'));
.data('content', PTL.tr('Error:'))
.text(PTL.tr('Error:'));
var $value = $('<strong>')
.attr('class', 'value')
......@@ -267,24 +270,11 @@ PTL.feed = {
var $errorButtonsFlexBox = $('<a>')
.attr('class', 'translate flex-box');
var $validateFeedButton = $('<a>')
.attr('class', 'translate ui-button ui-widget ui-corner-all validateFeedButton')
.attr('href', 'https://validator.w3.org/feed/check.cgi?url=' + feedUrl)
.attr('title', PTL.tr('Validate /verify this feed file with the W3C'))
.data('title', PTL.tr('Validate /verify this feed file with the W3C'))
.data('content', PTL.tr('Validate'))
.text(PTL.tr('Validate'));
$errorButtonsFlexBox.append($validateFeedButton, $feedErrorReportButton);
var $errorItem = $('<li>')
.attr('class', 'feed-item error')
// .append($errorLink)
.append('&nbsp;')
.append($key)
.append(':&nbsp;')
.append($value)
.append($errorButtonsFlexBox);
.append('&nbsp;')
.append($value);
$feedBodyUl
.append($errorItem);
......
......@@ -142,6 +142,10 @@ PTL.i18n.translations = {
"Restored search prefix to default value" : { fr: "Préfixe de recherche restauré à la valeur par défaut" , ja: "復元された検索プレフィックスをデフォルト値に復元しました", es: "Prefijo de búsqueda restaurado al valor predeterminado" },
"Search in feeds" : { fr: "Rechercher dans les flux" , ja: "フィードで検索します", es: "Búsqueda en fuentes" },
"English" : { fr: "English" , ja: "English", es: "English" },
"Français" : { fr: "Français" , ja: "Français", es: "Français" },
"日本語" : { fr: "日本語" , ja: "日本語", es: "日本語" },
......@@ -293,6 +297,7 @@ PTL.i18n.translations = {
"Pétrolette uses a time-tested technology" : { fr: "Pétrolette fonctionne sur une technologie éprouvée" , ja: "Pétroletteは時間を守った技術を使用しています", es: "Pétrolette utiliza una tecnología probada" },
"Websites provide a feed of their headlines to facilitate access to their content ; Pétrolette updates and displays them." : { fr: "Les sites produisent un flux d'info pour faciliter l'accès à leur contenu ; Pétrolette actualise ces sources et les affiche." , ja: "ウェブサイトは、コンテンツへのアクセスを容易にするために、見出しのフィードを提供します。 Pétroletteが更新して表示する", es: "Los sitios web proporcionan información sobre sus titulares para facilitar el acceso a su contenido; Pétrolette las actualiza y las muestra." },
"Tour" : { fr: "Visite", ja: "旅行", es: "Visita" },
"The website publishes a new article" : { fr: "Le site publie un nouvel article" , ja: "ウェブサイトは新しい記事を公開します", es: "El sitio web publica un nuevo artículo" },
"Its RSS feed is updated" : { fr: "Son flux RSS est mis à jour" , ja: "そのRSSフィードが更新されます", es: "Su feed RSS está actualizado" },
......@@ -406,9 +411,11 @@ PTL.i18n.translations = {
"Error type" : { fr: "Type d'erreur", ja: "エラータイプ", es: "Tipo de error" },
"Error" : { fr: "Erreur", ja: "エラー", es: "Error" },
"Error:" : { fr: "Erreur:", ja: "エラー", es: "Error:" },
"error" : { fr: "erreur", ja: "エラー", es: "error" },
"Set Pétrolette preferences/options" : { fr: "Définir les préférences / options de Pétrolette", ja: "ペレットの環境設定/オプションを設定する", es: "Establecer las preferencias / opciones de Pétrolette" },
"Main menu" : { fr: "Menu principal", ja: "メインメニュー", es: "Menú principal" },
// Dialogues
"Flux: Kill" : { fr: "Feed: Supprimer", ja: "フィード:削除", es: "Flux: Eliminar" },
......
......@@ -18,6 +18,7 @@ var PTL = (function() {
$saveButton = $('#saveTabs'),
$langMenu = $('select#language'),
$slider = $('div#gallerySpeedSlider'),
$searchField = $('#ptlSearch input').val(''),
$searchPrefixOkButton = $('button#searchPrefixOkButton'),
$searchPrefixRestoreButton = $('button#searchPrefixRestoreButton'),
$searchPrefixInput = $('input#searchPrefixInput'),
......@@ -55,22 +56,31 @@ var PTL = (function() {
$('#sideMenu legend').click(function() {
$(this).children('i').toggleClass('unfold');
$(this).next().toggle(50);
$(this).next().toggle();
});
$('#ptlSearch').hover(function() {
$(this).children('input').css({'opacity': '1'});
}, function() {
$(this).children('input').css({'opacity': '0'});
$('#ptlSearch i').click(function() {
$(this).prev('input').val('');
$('.results').removeClass('results');
});
$searchField.on('keypress',function(e) {
if(e.which == 13) $('a.ui-tabs-anchor.results').focus().trigger('click');
});
$('#ptlSearch input').on('keyup', function () {
console.log('plop!: %s (%s)');
$searchField.on('keyup', function () {
var v = $(this).val();
$('.results').removeClass('results');
$('a.feed-link').each(function () {
if (v != '' && $(this).text().search(new RegExp(v,'gi')) != -1) {
var $feed = $(this).parent().parent().parent().parent();
var $col = $feed.parent().parent();
var tabId = $col.parent().attr('aria-labelledby');
var $tab = $('a#' + tabId);
$(this).addClass('results');
$feed.addClass('results');
// $col.addClass('results');
$tab.addClass('results');
}
});
});
......@@ -160,7 +170,7 @@ var PTL = (function() {
var $themeBox = $('div#themeBox'),
$dayLabel = $('<label>')
.attr('for', 'day')
.attr('class', 'translate')
.attr('class', 'translate left')
.data('content', PTL.tr('Day'))
.text(PTL.tr('Day')),
$dayInput = $('<input>')
......@@ -196,7 +206,7 @@ var PTL = (function() {
var $brokenImagesBox = $('div#brokenImagesBox'),
$showLabel = $('<label>')
.attr('class', 'translate')
.attr('class', 'translate left')
.attr('for', 'show')
.data('content', PTL.tr('Show'))
.text(PTL.tr('Show')),
......
......@@ -6,7 +6,7 @@ PTL.prefs = (function() {
{"name":"news",
"columns": [
[
{"url":"https://www.sciencemag.org/rss/weekly_news_email.xml","type":"photo","limit": 200,"status":"off"},
{"url":"https://www.sciencemag.org/rss/weekly_news_email.xml","type":"photo","limit": 200,"status":"on"},
{"url":"https://www.youtube.com/feeds/videos.xml?channel_id=UCAYKj_peyESIMDp5LtHlH2A","type":"mixed","limit": 140,"status":"on"},
{"url":"https://www.popsci.com/arcio/rss/","type":"mixed","limit": 300,"status":"on"},
......
......@@ -302,6 +302,8 @@ PTL.util = {
},
help:function(type) {
PTL.sideMenu('close');
var dialog = introJs(),
menu = introJs(),
ui = introJs();
......
......@@ -108,37 +108,29 @@
</div>
<nav style="display:none;" id="top-menu" class="menu">
<div class="topnav" id="topnav">
<div id="menuButton"
class="menuBarItem translate js-enabled-only navLeft"
title="Set Pétrolette preferences/options"
data-title="Set Pétrolette preferences/options">
<i class="icon-menu"></i>
<!-- <span class="text translate"
data-content="Menu">
Menu
</span> -->
title="Main menu"
data-title="Main menu">
<i class="icon-menu topMenuIcon"></i>
</div>
<div id="newFeedButton"
class="menuBarItem translate new-feed-button js-enabled-only navLeft"
title="Add a feed"
data-title="Add a feed">
<i class="icon-plus"></i>
<!-- <span class="text translate"
data-content="Feed">
Feed
</span> -->
title="New feed"
data-title="New feed">
<i class="icon-plus topMenuIcon"></i>
</div>
<div id="ptlSearch" class="menuBarItem navLeft">
<i class="icon-search"></i>
<input
class="ui-widget-content ui-corner-all translate"
style="opacity:0"
type="text"
placeholder="What are you looking for?">
placeholder="Search in feeds">
<i class="icon-reset"></i>
</div>
<div class="menuBarItem navCenter">
......@@ -162,14 +154,13 @@
<div id="sideMenu" class="plip">
<legend class="ui-corner-top hover">
<legend class="ui-corner-top hover first">
<i class="icon-right rotate unfold"></i>
<span class="translate"
data-content="Language">Language
</span>
</legend>
<fieldset class="menuForm ui-widget ui-widget-content ui-corner-all">
<fieldset class="menuForm">
<select id="language"
class="unique translate"
name="language"
......@@ -198,40 +189,53 @@
<legend class="ui-corner-top hover">
<i class="icon-right rotate unfold"></i>
<span class="translate"
data-content="Help">Help
data-content="Help">
Help
</span>
</legend>
<fieldset class="menuForm ui-widget ui-widget-content ui-corner-all">
<fieldset class="menuForm">
<div class="flex-box">
<a href="https://framagit.org/yphil/petrolette"
class="ui-button ui-widget ui-corner-all unique translate"
data-title="Use the force - read the Source"
title="Use the force - read the Source"
data-content="Source code">
Source code
</a>
<button id="help"
class="grow translate help-button"
class="grow translate help-button left"
data-title="Documentation"