Improved: Show URL button (#4238)

* done

* fix extra.js

* click event

* URL input does not extend anymore

* fix

* improved the i18n key

* Update app/i18n/fr/gen.php

Co-authored-by: Alexandre Alapetite <alexandre@alapetite.fr>

app/i18n/cz/gen.php

@@ -28,6 +28,7 @@ return array(
 		'load_default_shortcuts' => 'Načíst výchozí zkratky',
 		'manage' => 'Spravovat',
 		'mark_read' => 'Označit jako přečtené',
+		'open_url' => 'Open URL',	// TODO
 		'promote' => 'Zvýšit úroveň',
 		'purge' => 'Vymazat',
 		'remove' => 'Odebrat',

app/i18n/de/gen.php

@@ -28,6 +28,7 @@ return array(
 		'load_default_shortcuts' => 'Standard-Kürzel laden',
 		'manage' => 'Verwalten',
 		'mark_read' => 'Als gelesen markieren',
+		'open_url' => 'URL öffnen',
 		'promote' => 'Hochstufen',
 		'purge' => 'Bereinigen',
 		'remove' => 'Entfernen',

app/i18n/en-us/gen.php

@@ -28,6 +28,7 @@ return array(
 		'load_default_shortcuts' => 'Load default shortcuts',	// IGNORE
 		'manage' => 'Manage',	// IGNORE
 		'mark_read' => 'Mark as read',	// IGNORE
+		'open_url' => 'Open URL',	// IGNORE
 		'promote' => 'Promote',	// IGNORE
 		'purge' => 'Purge',	// IGNORE
 		'remove' => 'Remove',	// IGNORE

app/i18n/en/gen.php

@@ -28,6 +28,7 @@ return array(
 		'load_default_shortcuts' => 'Load default shortcuts',
 		'manage' => 'Manage',
 		'mark_read' => 'Mark as read',
+		'open_url' => 'Open URL',
 		'promote' => 'Promote',
 		'purge' => 'Purge',
 		'remove' => 'Remove',

app/i18n/es/gen.php

@@ -28,6 +28,7 @@ return array(
 		'load_default_shortcuts' => 'Cargar accesos directos predeterminados',
 		'manage' => 'Administrar',
 		'mark_read' => 'Marcar como leído',
+		'open_url' => 'Open URL',	// TODO
 		'promote' => 'Promover',
 		'purge' => 'Eliminar',
 		'remove' => 'Borrar',

app/i18n/fr/gen.php

@@ -28,6 +28,7 @@ return array(
 		'load_default_shortcuts' => 'Utiliser les raccourcis par défaut',
 		'manage' => 'Gérer',
 		'mark_read' => 'Marquer comme lu',
+		'open_url' => 'Ouvrir l’URL',
 		'promote' => 'Promouvoir',
 		'purge' => 'Purger',
 		'remove' => 'Supprimer',

app/i18n/he/gen.php

@@ -28,6 +28,7 @@ return array(
 		'load_default_shortcuts' => 'Load default shortcuts',	// TODO
 		'manage' => 'ניהול',
 		'mark_read' => 'סימון כנקרא',
+		'open_url' => 'Open URL',	// TODO
 		'promote' => 'Promote',	// TODO
 		'purge' => 'Purge',	// TODO
 		'remove' => 'Remove',	// TODO

app/i18n/it/gen.php

@@ -28,6 +28,7 @@ return array(
 		'load_default_shortcuts' => 'Load default shortcuts',	// TODO
 		'manage' => 'Gestisci',
 		'mark_read' => 'Segna come letto',
+		'open_url' => 'Open URL',	// TODO
 		'promote' => 'Promote',	// TODO
 		'purge' => 'Purge',	// TODO
 		'remove' => 'Rimuovi',

app/i18n/ja/gen.php

@@ -28,6 +28,7 @@ return array(
 		'load_default_shortcuts' => 'デフォルトのショートカットを読み込む',
 		'manage' => '管理',
 		'mark_read' => '既読にする',
+		'open_url' => 'Open URL',	// TODO
 		'promote' => 'プロモート',
 		'purge' => '不要なデータの削除',
 		'remove' => '消去',

app/i18n/ko/gen.php

@@ -28,6 +28,7 @@ return array(
 		'load_default_shortcuts' => '기본 단축키 불러오기',
 		'manage' => '관리',
 		'mark_read' => '읽음으로 표시',
+		'open_url' => 'Open URL',	// TODO
 		'promote' => '목록 수준 올리기',
 		'purge' => '제거',
 		'remove' => '삭제',

app/i18n/nl/gen.php

@@ -28,6 +28,7 @@ return array(
 		'load_default_shortcuts' => 'Standaardshortcuts laden',
 		'manage' => 'Beheren',
 		'mark_read' => 'Markeer als gelezen',
+		'open_url' => 'Open URL',	// TODO
 		'promote' => 'Bevorderen',
 		'purge' => 'Zuiveren',
 		'remove' => 'Verwijderen',

app/i18n/oc/gen.php

@@ -28,6 +28,7 @@ return array(
 		'load_default_shortcuts' => 'Cargar los acorchis per defaut',
 		'manage' => 'Gerir',
 		'mark_read' => 'Marcar coma legit',
+		'open_url' => 'Open URL',	// TODO
 		'promote' => 'Promòure',
 		'purge' => 'Purgar',
 		'remove' => 'Levar',

app/i18n/pl/gen.php

@@ -28,6 +28,7 @@ return array(
 		'load_default_shortcuts' => 'Ustaw domyślne skróty',
 		'manage' => 'Ustawienia',
 		'mark_read' => 'Oznacz jako przeczytane',
+		'open_url' => 'Open URL',	// TODO
 		'promote' => 'Awansuj',
 		'purge' => 'Oczyść',
 		'remove' => 'Usuń',

app/i18n/pt-br/gen.php

@@ -28,6 +28,7 @@ return array(
 		'load_default_shortcuts' => 'Carregar mais atalhos',
 		'manage' => 'Gerenciar',
 		'mark_read' => 'Marcar como lido',
+		'open_url' => 'Open URL',	// TODO
 		'promote' => 'Promover',
 		'purge' => 'Limpar',
 		'remove' => 'Remover',

app/i18n/ru/gen.php

@@ -28,6 +28,7 @@ return array(
 		'load_default_shortcuts' => 'Загрузить горячие клавиши по умолчанию',
 		'manage' => 'Настроить',
 		'mark_read' => 'Отметить прочитанным',
+		'open_url' => 'Open URL',	// TODO
 		'promote' => 'Продвинуть',
 		'purge' => 'Запустить очистку',
 		'remove' => 'Удалить',

app/i18n/sk/gen.php

@@ -28,6 +28,7 @@ return array(
 		'load_default_shortcuts' => 'Načítať prednastavené klávesové skratky',
 		'manage' => 'Spravovať',
 		'mark_read' => 'Označiť ako prečítané',
+		'open_url' => 'Open URL',	// TODO
 		'promote' => 'Podporiť',
 		'purge' => 'Vymazať',
 		'remove' => 'Odstrániť',

app/i18n/tr/gen.php

@@ -28,6 +28,7 @@ return array(
 		'load_default_shortcuts' => 'Öntanımlı kısayolları yükle',
 		'manage' => 'Yönet',
 		'mark_read' => 'Okundu olarak işaretle',
+		'open_url' => 'Open URL',	// TODO
 		'promote' => 'Yöneticilik ata',
 		'purge' => 'Temizle',
 		'remove' => 'Sil',

app/i18n/zh-cn/gen.php

@@ -28,6 +28,7 @@ return array(
 		'load_default_shortcuts' => '重置快捷键',
 		'manage' => '管理',
 		'mark_read' => '标记已读',
+		'open_url' => 'Open URL',	// TODO
 		'promote' => '设为管理员',
 		'purge' => '清理',
 		'remove' => '删除',

app/views/feed/add.phtml

@@ -40,8 +40,8 @@
 			<label class="group-name" for="url"><?= _t('sub.feed.url') ?></label>
 			<div class="group-controls">
 				<div class="stick">
-					<input type="text" name="url_rss" id="url" class="extend" value="<?= $this->feed->url() ?>" />
-					<a class="btn" target="_blank" rel="noreferrer" href="<?= $this->feed->url() ?>"><?= _i('link') ?></a>
+					<input type="text" name="url_rss" id="url" value="<?= $this->feed->url() ?>" />
+					<a class="btn open-url" target="_blank" rel="noreferrer" href="<?= $this->feed->url() ?>" data-input="url" title="<?= _t('gen.action.open_url') ?>"><?= _i('link') ?></a>
 				</div>
 				<a class="btn" target="_blank" rel="noreferrer" href="https://validator.w3.org/feed/check.cgi?url=<?= $this->feed->url() ?>"><?= _t('sub.feed.validator') ?></a>
 			</div>

app/views/helpers/feed/update.phtml

@@ -45,8 +45,8 @@
 			<label class="group-name" for="website"><?= _t('sub.feed.website') ?></label>
 			<div class="group-controls">
 				<div class="stick">
-					<input type="text" name="website" id="website" class="extend" value="<?= $this->feed->website() ?>" />
-					<a class="btn" target="_blank" rel="noreferrer" href="<?= $this->feed->website() ?>"><?= _i('link') ?></a>
+					<input type="text" name="website" id="website" value="<?= $this->feed->website() ?>" />
+					<a class="btn open-url" target="_blank" rel="noreferrer" href="<?= $this->feed->website() ?>" data-input="website" title="<?= _t('gen.action.open_url') ?>"><?= _i('link') ?></a>
 				</div>
 			</div>
 		</div>
@@ -54,8 +54,8 @@
 			<label class="group-name" for="url"><?= _t('sub.feed.url') ?></label>
 			<div class="group-controls">
 				<div class="stick">
-					<input type="text" name="url" id="url" class="extend" value="<?= $this->feed->url() ?>" />
-					<a class="btn" target="_blank" rel="noreferrer" href="<?= $this->feed->url() ?>"><?= _i('link') ?></a>
+					<input type="text" name="url" id="url" value="<?= $this->feed->url() ?>" />
+					<a class="btn open-url" target="_blank" rel="noreferrer" href="<?= $this->feed->url() ?>" data-input="url" title="<?= _t('gen.action.open_url') ?>"><?= _i('link') ?></a>
 				</div>
 
 				<a class="btn" target="_blank" rel="noreferrer" href="https://validator.w3.org/feed/check.cgi?url=<?=

app/views/subscription/add.phtml

@@ -34,7 +34,10 @@
 		<div class="form-group">
 			<label class="group-name" for="url_rss"><?= _t('sub.feed.url') ?></label>
 			<div class="group-controls">
-				<input id="url_rss" name="url_rss" type="url" required="required" autocomplete="off" class="long" autofocus="autofocus" />
+				<div class="stick">
+					<input id="url_rss" name="url_rss" type="url" required="required" autocomplete="off" class="long" autofocus="autofocus" />
+					<a class="btn open-url" target="_blank" rel="noreferrer" href="" data-input="url_rss" title="<?= _t('gen.action.open_url') ?>"><?= _i('link') ?></a>
+				</div>
 			</div>
 		</div>
 

p/scripts/extra.js

@@ -123,6 +123,29 @@ function init_password_observers() {
 	});
 }
 
+// overwrites the href attribute from the url input
+function updateHref(ev) {
+	const urlField = document.getElementById(this.getAttribute('data-input'));
+	const url = urlField.value;
+	if (url.length > 0) {
+		this.href = url;
+		return true;
+	} else {
+		urlField.focus();
+		this.removeAttribute('href');
+		ev.preventDefault();
+		return false;
+	}
+}
+
+// set event listener on "show url" buttons
+function init_url_observers() {
+	document.querySelectorAll('.open-url').forEach(function (btn) {
+		btn.addEventListener('mouseover', updateHref);
+		btn.addEventListener('click', updateHref);
+	});
+}
+
 function init_select_observers() {
 	document.querySelectorAll('.select-change').forEach(function (s) {
 		s.onchange = function (ev) {
@@ -266,6 +289,7 @@ function init_extra() {
 	}
 	init_crypto_form();
 	init_password_observers();
+	init_url_observers();
 	init_select_observers();
 	init_slider_observers();
 	init_configuration_alert();