NGB-Focus (Shortcut um zum Ttiel => Beitragseditor => Logo scrollen/springen)

theSplit

1998
Registriert
3 Aug. 2014
Beiträge
5.868
Über den Tastaturshortcut "Alt + y" kann:

a) in einem bestehenden Thema in das "Direkt Antworten Feld" gesprungen werden, mit erneutem Shortcut wird auf das Logo gesprungen
b) befinde man sich im WYSIWYG-Editor, wird zuerst der Titel des Beitrags angesprungen, dann das Beitragsfeld, danach wieder das Logo
c) In einem neuen Thema wird zuerst der Titel angesprungen, dann der Editor, dann wieder das Logo.

Und hier das kleine Skript.

[src=javascript]// ==UserScript==
// @name ngb_focus
// @namespace ngb_focus
// @description Focus the input areas or the logo by pressing Alt + y
// @include https://ngb.to/threads/*
// @include https://ngb.to/newreply.php?*
// @include https://ngb.to/newthread.php?*
// @version 1
// @grant none
// ==/UserScript==

function checkShortcut(evt) {
console.log(evt);
if (evt.altKey && (evt.key == 'y') ) {
evt.preventDefault();
var input = document.querySelector('input#subject');
var title = document.querySelector('input#title');
var editor = document.querySelector('textarea.cke_source');
var logo = document.querySelector('a.logo-image');

var active = document.activeElement;

if (input != null && active != input && active != editor) {
input.focus();
window.scrollTo(0, document.querySelector('form.vbform block').offsetTop - (input.clientHeight * 1.15));
return;
} else if (title != null && active != title && active != editor) {
title.focus();
window.scrollTo(0, document.querySelector('form.vbform block').offsetTop - (title.clientHeight * 1.15));
} else if (active != editor) {
editor.focus();
window.scrollTo(0, document.querySelector('div.editor_textbox').offsetTop - (editor.clientHeight * 0.45));
return;
}

logo.focus();
window.scrollTo(0, 0);
}
}

window.addEventListener('keypress', checkShortcut);
[/src]


Ich denke es wäre auch schon witzig, wenn sich das Skript merken würde, an welcher ScrollPosition man in einem Thema war, um statt auf das Logo, an diese Position zu springen, um so zwischen Beiträgen und Editor umherzuspringen, falls jemand das erweitern möchte. Zum Beispiel nach der Auswahl, welches Element gerade aktiv ist / focus hat :)
 
Zuletzt bearbeitet:
  • Thread Starter Thread Starter
  • #2
Re: NGB-Focus (Shortcut um zum Ttiel => Beitragseditor => letzte Stelle springen)

Hier mal eine zweite Variante, bei dieser wird nicht mehr auf das Logo gesprungen - aber man kann vom Editor zur letzten Scrollposition springen.

[src=javascript]// ==UserScript==
// @name ngb_focus
// @namespace ngb_focus
// @description Focus the input areas or the logo by pressing Alt + y
// @include https://ngb.to/threads/*
// @include https://ngb.to/newreply.php?*
// @include https://ngb.to/newthread.php?*
// @version 1
// @grant none
// ==/UserScript==

var scrollPosition = window.pageY;

function checkShortcut(evt) {
if (evt.altKey && (evt.key == 'y') ) {
evt.preventDefault();
var input = document.querySelector('input#subject');
var title = document.querySelector('input#title');
var editor = document.querySelector('textarea.cke_source');
var active = document.activeElement;

if (input != null && active != input && active != editor) {
input.focus();
window.scrollTo(0, document.querySelector('form.vbform block').offsetTop - (input.clientHeight * 1.15));
return;
} else if (title != null && active != title && active != editor) {
title.focus();
window.scrollTo(0, document.querySelector('form.vbform block').offsetTop - (title.clientHeight * 1.15));
} else if (active != editor) {
editor.focus();
window.scrollTo(0, document.querySelector('div.editor_textbox').offsetTop - (editor.clientHeight * 0.45));
return;
}

editor.blur();
window.scrollTo(0, scrollPosition);
}
}

function setScrollPosition(evt) {
if (document.activeElement == document.body) {
scrollPosition = evt.pageY;
}
}

window.addEventListener('keypress', checkShortcut);
window.addEventListener('scroll', setScrollPosition);
[/src]
 
  • Thread Starter Thread Starter
  • #3
Re: NGB-Focus (Shortcut um zum Ttiel => Beitragseditor => letzte Stelle springen)

Und wieder ein kleines Update, basierend auf der zweiten Variante aus Post #2.

Version 1.1

Neu dazugekommen:
- der korrekte Editor, auch "Beitrag bearbeiten" im Thema wird angesprungen, auch wenn das Direkt antworten Feld sichtbar ist, dies war vorher nicht der Fall
- der Listener auf das Scrollen wurde entfernt, immer wenn jetzt "Alt + Y" gedrückt wird, und keines der relevanten Eingabefelder aktiv ist, wird die Scrollposition vermerkt auf die zurückgesprungen werden kann
- außerdem wurden die Scrollpositionen etwas verbessert, so das sich das Skript den Parent Container sucht, welcher angesprungen wird, auch wurde Addition/Subtraktion auf die Scrollposition entfernt wenn in den Editor gesprungen wird

[src=javascript]
// ==UserScript==
// @name ngb_focus
// @namespace ngb_focus
// @description Focus the input areas or the last scrolled position by pressing Alt + y
// @include https://ngb.to/threads/*
// @include https://ngb.to/newreply.php?*
// @include https://ngb.to/newthread.php?*
// @version 1.1
// @grant none
// ==/UserScript==

var scrollPosition = window.pageYOffset;

function checkShortcut(evt) {
if (evt.altKey && (evt.key == 'y') ) {
evt.preventDefault();
var input = document.querySelector('input#subject');
var title = document.querySelector('input#title');
var editor = document.querySelectorAll('textarea.cke_source')[0];

if (document.activeElement != editor && document.activeElement != input && document.activeElement != title) {
scrollPosition = window.pageYOffset;
}

var active = document.activeElement;

if (input != null && active != input && active != editor) {
input.focus();
window.scrollTo(0, document.querySelector('form.vbform block').offsetTop - (input.clientHeight * 1.15));
return;
} else if (title != null && active != title && active != editor) {
title.focus();
window.scrollTo(0, document.querySelector('form.vbform block').offsetTop - (title.clientHeight * 1.15));
} else if (editor != null && active != editor) {
editor.focus();

var root = document.querySelectorAll('div.editor_textbox')[0];
var current = root;
var step = 0;

while(step++ < 20) {
current = current.parentNode;
if (current.nodeName == 'LI' || current.id == 'postlist' || current.id == 'quick_reply') {
break;
}
}

if (current != null) {
window.scrollTo(0, current.offsetTop);
}

return;
}

editor.blur();
window.scrollTo(0, scrollPosition);
}
}

window.addEventListener('keypress', checkShortcut);
[/src]
 
Zurück
Oben