Entwicklertagebuch: Codeblöcke auf unseren Seiten

Mitglied: admtech

admtech (Level 2) - Jetzt verbinden

17.01.2020, aktualisiert 23.01.2020, 2267 Aufrufe, 29 Kommentare, 4 Danke

Hallo Administrator User,

Unsere Codeblöcke werden ab sofort anders dargestellt.
In Zukunft kommen neue Typen dazu. Hier ein Beispiel für ein PHP-Script:

Die Codeblöcke können nun direkt per Copy&Paste kopiert werden. Das zusätzliche Fenster für den Quellcode fällt weg. Die Zeilennummern werden erst dann eingeblendet, wenn ein Codeblock aus mehr als nur einer Zeile besteht. Die Zeilen werden ab sofort nicht mehr Zwangsumgebrochen, es erscheint bei Bedarf eine Scrollbar.

Diese Änderung sind ein erster Teil der neuen Version unserer Seite. Später kommt noch die automatische Erkennung von mehreren Scriptsprachen und das Einfärben bzw. das Erkennen von Variablen, Konstanten etc. dazu.

Dabei soll unser Text-Parser (das ist die Programmierung, die unsere Formatierungen in eine lesbare Seite umwandelt) anhand von z.B. "<?php" oder "/bin/bash" Kürzeln in den Codeblöcken die Skripte automatisch erkennen, ohne das man den Typ angeben muss.

Die Abstände der Codeblöcke zum Text braucht ihr nicht im Editor per 'Return' angeben, dass wird nun per CSS gemacht. Evtl müsst ihr eure Texte oder Anleitungen dafür etwas anpassen.

Ich hoffe die Änderungen gefallen und freue mich, wie immer, auf Euer Feedback

Gruß
Frank
29 Kommentare
Mitglied: tomolpi
17.01.2020 um 19:40 Uhr
Zitat von @admtech:
Ich hoffe die Änderungen gefallen und freue mich, wie immer, auf Euer Feedback
Das gibt's hier schon: https://administrator.de/forum/update-codebl%C3%B6cke-536289.html
Gruß
Frank
LG
tomolpi
Bitte warten ..
Mitglied: Frank
17.01.2020, aktualisiert 18.01.2020
@serial

Hm, also die Zeilennummern waren in der Hinsicht hilfreich das man dem TO eine Zeilennummer nennen konnte wenn man sich auf etwas bezog.

Laut meiner Analyse hat das aber kaum einer genutzt (unter 1% Erwähnungen in den Kommentaren). Der Nachteil mit Zeilennummer war, dass man den Code oder Text nicht einfach per Copy&Paste direkt aus dem Beitrag kopieren konnte. Das hat mich persönlich mehr gestört, als auf die Zeilennummer zu verweisen. Man musste immer erst den Quellcode Editor öffnen um es gescheit zu kopieren (gerade wenn man Anleitungen nachvollziehen wollte).

Zusätzlich geht jetzt ein STRG+A nicht mehr um den gesamten Code aus dem Quellcode-Fenster auszuwählen und zu kopieren

Das ist richtig, da soll später ein Popover-Menü erscheinen (wenn man über den Codeblock fährt), wo man den gesamten Code per klick kopieren kann.

@Lochkartenstanzer

Sinnvoller wäre es vielleicht, einen Button zum Ein- und Ausblenden von Nummern zu machen.

Evtl. baue ich in das Popover-Menü eine zusätzliche Ansicht mit Zeilen ein. Ich schau mal ob es passt.

Gruß
Frank
Bitte warten ..
Mitglied: Lochkartenstanzer
18.01.2020, aktualisiert um 00:48 Uhr
Warum ihr jetzt einen extra Beitrag dafür aufgemacht und nicht den Hauptbeitrag dazu genommen habt, ist mir ein Rätsel.

Frank



Ich habe übrigens nur auf die Frage geantwortet, war aber irgendwie der Meinung, daß das egentlich ein Kommentar hierzu war, weil ich übersehen habe, daß das eine Frage und nicht ein Kommentar war.

lks
Bitte warten ..
Mitglied: 142232
142232 (Level 2)
18.01.2020, aktualisiert um 08:57 Uhr
Warum ihr jetzt einen extra Beitrag dafür aufgemacht und nicht den Hauptbeitrag dazu genommen habt, ist mir ein Rätsel.
Der Wissensbeitrag dazu ist an mir vorbei gegangen, sorry hatte ich nicht gesehen.
[OFFTOPIC]
Aber noch kurz zu was anderem was mir neuerdings übelst aufstößt, und auch ein paar meiner Kollegen:

Normalerweise lasse ich hier ja den Werbeblocker ausgeschaltet um das Forum zu unterstützen, aber seitdem jetzt neuerdings auf jeder Detailseite unten ein selbst laufendes Video von der Platform *.pepsia.com abläuft bin ich gezwungen ihn einzuschalten, erstens weil das automatische Gezucke tierisch nervt und vom Beitrag ablenkt, zweitens erheblich zusätzlichen Traffic erzeugt (gerade Mobil gehen da in ein paar Sekunden 50-100MB flöten, in DE ist Traffic ja nicht gerade umsonst), und drittens die Seite auch verlangsamt. Ab und zu könnte ich das ja verstehen, aber bei jedem Beitrag immer und immer wieder, sehe ich persönlich nicht ein.
[/OFFTOPIC]
Bitte warten ..
Mitglied: Frank
19.01.2020, aktualisiert um 12:24 Uhr
Hi,

Aber noch kurz zu was anderem was mir neuerdings übelst aufstößt, und auch ein paar meiner Kollegen:

hier und da teste ich mal neue Werbemöglichkeiten. Aber du hast recht, die Pepsia-Videos stören den Lesefluss, verbraucht viel Traffic und bringt im Gegenzug auch nicht viel ein. Daher habe ich sie wieder deaktiviert. Danke für Dein Feedback und nicht vergessen, den Werbeblocker wieder auszuschalten ;-) face-wink

Davon lebt die Seite!

Gruß
Frank
Bitte warten ..
Mitglied: 142232
142232 (Level 2)
19.01.2020, aktualisiert um 12:56 Uhr
Zitat von @Frank:

Daher habe ich sie wieder deaktiviert.
TOP 👍 👍
Danke für Dein Feedback und nicht vergessen, den Werbeblocker wieder auszuschalten ;-) face-wink
Done! Ebenso herzlichen Dank für das prompte Reagieren.

Gruß s.
Bitte warten ..
Mitglied: rubberman
19.01.2020 um 13:03 Uhr
Hallo Frank,

wie von anderen schon geschrieben, waren die Zeilennummern recht gut um sich auf bestimmte Zeilen beziehen zu können. Was ich aber noch schlimmer finde, ist, dass lange Zeilen nun einfach umgebrochen werden, ohne dass erkennbar ist, dass sie zusammen gehören.

Grüße
Steffen
Bitte warten ..
Mitglied: colinardo
19.01.2020, aktualisiert 20.01.2020
Zitat von @rubberman:
wie von anderen schon geschrieben, waren die Zeilennummern recht gut um sich auf bestimmte Zeilen beziehen zu können. Was ich aber noch schlimmer finde, ist, dass lange Zeilen nun einfach umgebrochen werden, ohne dass erkennbar ist, dass sie zusammen gehören.
Dito da stimme ich absolut zu, macht das direkte Lesen und Interpretieren längerer Codes jetzt ziemlich unangenehm ohne Umkopieren in den Editor seiner Wahl.

So was in der Art wie CodeMirror würde ich mir hier wünschen.

Grüße Uwe
Bitte warten ..
Mitglied: Frank
22.01.2020, aktualisiert um 23:03 Uhr
Hallo,

auf vielseitigen Wunsch habe ich die neuen Codeblöcke um Zeilennummern erweitert. Hat ein Codeblock mehr als 1 Zeile, werden die Zeilennummer automatisch angezeigt. Mit <code typ=plain> kann man die Zeilennummern wieder komplett ausblenden. Ich habe den Originaltext oben dementsprechend geändert.

Auch werden die Zeilen nicht mehr Zwangsumgebrochen. Es erscheint bei Bedarf nun eine Scrollbar.

@colinardo CodeMirror ist leider zu langsam. Gerade bei großen Anleitungen (wie z.B. Deine) würde das Javascript von CodeMirror die Seite extrem verlangsamen, da die Autoren der Beiträge oft viele Codeblöcke benutzen.

Ich denke mit der Zeit bekommen wir eine vergleichbare Lösung, die viel schneller ist, selbst hin.

Danke für Euer Feedback :-) face-smile

Gruß
Frank
Bitte warten ..
Mitglied: colinardo
23.01.2020, aktualisiert um 11:41 Uhr
Servus Frank,
so wie es jetzt ist reicht das ja auch, aber leider wird jetzt beim Copy n' Paste in den Boxen mit der Zeilennummerierung zwischen jeder Code-Zeile wieder eine Leerzeile eingefügt.

Habe schon ein einige Beschwerden bekommen ala dein "Code funktioniert doch nicht", eben aus dem Grund der zusätzlich generierten Leerzeilen beim Kopieren (bei den jeweiligen Codes war das relevant).

Grüße Uwe
Bitte warten ..
Mitglied: colinardo
23.01.2020, aktualisiert um 11:25 Uhr
Aaargh....Die Codeblöcke in den PNs sind ebenfalls unvollständig, Code wird unvollständig angezeigt und nicht scrollbar. Das bekommen die TOs nicht gebacken das da raus zu kopieren.
Bitte warten ..
Mitglied: Frank
23.01.2020, aktualisiert um 11:51 Uhr
Hi,

@colinardo,

ruhig Blut. Das mit den Leerzeichen habe ich gerade behoben. Ich hatte es auf MacOS getestet und da gab es die Leerzeichen nicht (ich entwickle die Seite auf einem Mac). Wenn so ein Fehler auftritt, gleich eine PN schreiben und ich behebe das.
Auch sollten die PNs jetzt wieder funktionieren. Bitte mal prüfen!

Die Codeblöcke in den PNs sind ebenfalls unvollständig, Code wird unvollständig ...

Was meinst du denn damit genau? Ich habe es gerade getestet und die Codeblöcke in den Mails werden richtig dargestellt (mit Scrollbalken, wenn sie zu groß für die sichtbare Fläche sind). Da sich das CSS geändert hat, bitte mal den Cache löschen (oder shift-Reload drücken).

Es ist nicht einfach für so viele Systeme und Browser die optimale Code-Lösung zu finden :-) face-smile

Gruß
Frank
Bitte warten ..
Mitglied: colinardo
23.01.2020, aktualisiert um 12:07 Uhr
Zitat von @Frank:

Hi,

@colinardo,

ruhig Blut.
Kein Problem, ist wohl falsch rübergekommen, das war nicht bös gemeint :-) face-smile.
Das mit den Leerzeichen habe ich gerade behoben. Ich hatte es auf MacOS getestet und da gab es die Leerzeichen nicht (ich entwickle die Seite auf einem Mac). Wenn so ein Fehler auftritt, gleich eine PN schreiben und ich behebe das.
Auch sollten die PNs jetzt wieder funktionieren. Bitte mal prüfen!
Funktioniert ! Merci.
Die Codeblöcke in den PNs sind ebenfalls unvollständig, Code wird unvollständig ...

Was meinst du denn damit genau? Ich habe es gerade getestet und die Codeblöcke in den Mails werden richtig dargestellt (mit Scrollbalken, wenn sie zu groß für die sichtbare Fläche sind). Da sich das CSS geändert hat, bitte mal den Cache löschen (oder shift-Reload drücken).
Also jetzt gehen die auch wieder für den User "nutzbar", vorher war der DIV rechts abgeschnitten und der Code nicht umgebrochen (wahrscheinlich doch der Cache).
Was hier jedoch fehlt (OS Windows 10 / Browser Firefox 72.0.2) ist deine genannte Scrollbar und der graue Hintergrund und die Abstände (cache vollständig gelöscht)

Hier das Bild davon

screenshot - Klicke auf das Bild, um es zu vergrößern

Es ist nicht einfach für so viele Systeme und Browser die optimale Code-Lösung zu finden :-) face-smile
Verstehe ich vollkommen.
Bitte warten ..
Mitglied: Lochkartenstanzer
23.01.2020 um 12:03 Uhr
Zitat von @Frank:

Es ist nicht einfach für so viele Systeme und Browser die optimale Code-Lösung zu finden :-) face-smile

.Mach doch für den Codeblock einfach einen downloadlink, der den Teil im Codeblock direkt als txt herunterladen läßt. Sollen doch die "Kopierer" das direkt aus Notepad herauskipieren, wenn sie nur einen Teil brauchen. :-) face-smile


So
Bitte warten ..
Mitglied: Frank
23.01.2020, aktualisiert um 12:15 Uhr
Hi,

@Lochkartenstanzer
ich hatte ja schon geschrieben, in der neuen Version ist ein Popover mit "Alles kopieren" und "Drucken" dabei.
Das hier in die alte Version einzubauen, wäre zu aufwendig.

@colinardo
Laut Screenshot ist das aber immer noch nicht richtig. Die Codeblöcke werden überall gleich dargestellt. Es gibt keinen Unterschied zwischen der Detailseite und einer PN. Um den Codeblock sollte eine Farbe sein und die Scrollbalken sollte bei Code-Überlänge angezeigt werden. Ich melde mich per PN.


Gruß
Frank
Bitte warten ..
Mitglied: aqui
23.01.2020 um 12:40 Uhr
Mit <code typ=plain> kann man die Zeilennummern wieder komplett ausblenden.
Interessanterweise funktioniert das auch mit "type=plain" ! Bug or Feature ? ;-) face-wink
Bitte warten ..
Mitglied: Frank
23.01.2020, aktualisiert um 14:02 Uhr
Zitat von @aqui:

Mit <code typ=plain> kann man die Zeilennummern wieder komplett ausblenden.
Interessanterweise funktioniert das auch mit "type=plain" ! Bug or Feature ? ;-) face-wink

Feature, da ich mich (und andere hier) manchmal verschreibe :-) face-smile

Du solltest aber den Command: "typ=" nehmen (ohne e).

Ihr solltet alle immer den Command: "type=" nehmen :-) face-smile

Gruß
Frank
Bitte warten ..
Mitglied: aqui
23.01.2020 um 12:45 Uhr
Ich auch...man driftet dann ins Englische und es kommt automatisch aus den Fingern. ;-) face-wink
Bitte warten ..
Mitglied: colinardo
23.01.2020, aktualisiert um 12:48 Uhr
Du solltest aber den Command: "typ=" nehmen (ohne e).
Denglisch? Parametername auf Deutsch Parameterwert auf Englisch oder wie jetzt :-) face-smile?
Bitte warten ..
Mitglied: Lochkartenstanzer
23.01.2020 um 12:56 Uhr
Zitat von @Frank:

Zitat von @aqui:

Mit <code typ=plain> kann man die Zeilennummern wieder komplett ausblenden.
Interessanterweise funktioniert das auch mit "type=plain" ! Bug or Feature ? ;-) face-wink

Feature, da ich mich (und andere hier) manchmal verschreibe :-) face-smile
Du solltest aber den Command: "typ=" nehmen (ohne e).

In den FAQs steht aber was anderes. :-) face-smile

lks
Bitte warten ..
Mitglied: aqui
23.01.2020 um 12:59 Uhr
Stimmt auch wieder ! Dann verhalten wir uns im Gegensatz zu dem was @Frank uns sagt mit type also genau Foren Regel konform ! :-D face-big-smile
Bitte warten ..
Mitglied: Frank
23.01.2020, aktualisiert um 14:00 Uhr
Wenn das Euer einziges Problem ist ;-) face-wink

Stimmt, man sollte type= nehmen. Wir wollen ja nicht in die Denglish-Falle tappen. Ich korrigiere es gleich oben. Letztendlich egal, typ oder type - es wir immer beides funktionieren :-) face-smile

Gruß
Frank
Bitte warten ..
Mitglied: DerWoWusste
24.01.2020, aktualisiert um 15:11 Uhr
Hi Frank.

Du schreibst
Der Nachteil mit Zeilennummer war, dass man den Code oder Text nicht einfach per Copy&Paste direkt aus dem Beitrag kopieren konnte
Das konnte man mit einem weiteren Klick. Beispiel: https://web.archive.org/web/20190709060606/https://administrator.de/wiss ... - da klicke ich auf "Quelltext" neben dem Codeblock und dann kann ich sowohl Zeilen selektieren, als auch CTRL-A nutzen - Letzteres geht jetzt nicht mehr - schade.

Beispiel: https://administrator.de/content/detail.php?id=539062&token=702#comm ... - versuch da mal, das Logfile schnell zu kopieren um es ins lokale notepad++ einzufüfgen - das nervt ein wenig.
Bitte warten ..
Mitglied: Frank
24.01.2020, aktualisiert um 15:06 Uhr
@DerWoWusste

Das konnte man mit einem weiteren Klick ...

Das hatte ich oben bereits mehrfach erwähnt, in der neuen Version (V6) gibt es ein Popover mit den Punkten "Alles kopieren" und "Drucken". Hier in die alter Version (V5.8) werde ich das nicht mehr integrieren. Außerdem kommt es eher vor, dass man Commands oder kurze Teile kopiert z.B. um eine Anleitung nachzuvollziehen, als das man ganze Logfiles kopiert. Aber wie gesagt, in der nächsten Generation von unserer Seite ist "Alles kopieren" wieder mit dabei. Die eine Idee mit dem Download als Text fand ich auch gut.

Gruß
Frank
Bitte warten ..
Mitglied: DerWoWusste
24.01.2020 um 15:11 Uhr
Entschuldige, das hatte ich nicht begriffen :-| face-plain
Bitte warten ..
Mitglied: Frank
24.01.2020 um 15:22 Uhr
Gar kein Problem! Evtl hatte ich es auch schlecht formuliert ;-) face-wink

Gruß
Frank
Bitte warten ..
Mitglied: 142232
142232 (Level 2)
26.01.2020, aktualisiert um 13:22 Uhr
Also was mir noch aufgefallen ist (nicht weiter schlimm, nur ein Hinweis), ist das einzeilige Codeblöcke komplett markiert werden wenn man sie nur ein einziges mal anklickt selektives Kopieren wie vorher ist dann nicht möglich.
Bitte warten ..
Mitglied: Frank
07.02.2020, aktualisiert 25.02.2020
Hi @serial,

das ist eher ein Feature bzw. ein Test. Meist sind Einzeiler Bash oder Commando Befehle die damit sofort markiert werden. Damit teste ich, ob in der neuen Version Einzeiler Code sofort markieren sollen, oder ob man, wie bei Mehrzeiler, selektiv auswählen kann (ist im CSS nur ein einziger Befehl, um das zu ändern). Was meint ihr?

Gruß
Frank
Bitte warten ..
Mitglied: 142232
142232 (Level 2)
07.02.2020, aktualisiert um 07:27 Uhr
Zitat von @Frank:

Hi @serial,

das ist eher ein Feature bzw. ein Test. Meist sind Einzeiler Bash oder Commando Befehle die damit sofort markiert werden. Damit teste ich, ob in der neuen Version Einzeiler Code sofort markieren sollen, oder ob man, wie bei Mehrzeiler, selektiv auswählen kann (ist im CSS nur ein einziger Befehl, um das zu ändern). Was meinst ihr?
Ach so, hmm also mich irritiert es eher, ich bin gewohnt wenn sich alles so verhält wie man es von überall gewohnt ist, da denkt man im ersten Augenblick, shit was ist jetzt wieder kaputt. Just my 2 cent.
Bitte warten ..
Heiß diskutierte Inhalte
Windows 10
Windows 7 pro Lizenz nutzen für Windows 10
lukas0209Vor 1 TagFrageWindows 1016 Kommentare

Hallo Community, ich versuche seit einigen Wochen unser Netzwerk von Windows Server 2008 R2 Standard auf Windows Server 2016 Essentials um, welches eine städtische ...

Microsoft
Staatsanwaltschaften verschicken Vorladungen in Sachen Windows 10 Lizenzkeys
kgbornVor 1 TagInformationMicrosoft5 Kommentare

Nur zu Info für die Käufer der eBay-Schnäppchen - neuer Fall Staatsanwaltschaften verschicken Vorladungen in Sachen Windows 10 Lizenzkeys

Router & Routing
Vodafone Kabel: Eigenen Router an den Kabelanschluss oder einen WLAN-Router ohne Modem hinter die Vodafone Station?
DyingWordsVor 1 TagFrageRouter & Routing8 Kommentare

Hallo zusammen, da wir demnächst in eine Wohnung mit Kabelanschluss von Vodafone einziehen werden, frage ich mich, ob es sinnvoller ist einen eigenen Router ...

Netzwerke
Netzwerklaufwerk - Nur Lesen (Streamen)
CryexXVor 1 TagFrageNetzwerke8 Kommentare

Hallo, ich hab mal ne Frage und hoffe auf Lösung. Mir schießt aktuell keine in den Kopf :( Ich möchte ein Netzlaufwerk freigeben. Auf ...

Linux
Knoppix 9.1 verfügbar
sabinesVor 1 TagInformationLinux6 Kommentare

Klaus Knopper hat eine neue Version zum Download bereitgestellt. Achtung in der Übersicht ist noch die Version 8.6.1 aus 2019 genannt, im Downloadverzeichnis ist ...

Netzwerke
Multi WAN Router
JoergDittVor 1 TagFrageNetzwerke9 Kommentare

Hallo zusammen, folgende Situation wir versorgen ca 150 Refugess in einer Gemeinschaftsunterkunft mit freiem WLAN Aktuell haben wir einen Fritzrouter mit Richtantenne an einer ...

Netzwerke
Wieviel parallel TCP Verbindung zum Datenserver erlauben
gelöst decehakanVor 1 TagFrageNetzwerke4 Kommentare

Hallo Zusammen, ich spiele gerade mit meinem Ubuntu Server mit der Firewall iptables rum und würde gern wissen wieviel man parallele Verbindung zum Datenserver ...

Windows Systemdateien
Windows CE 6.0 Problem
gelöst PepsiDoseVor 1 TagFrageWindows Systemdateien10 Kommentare

Servus, Ich habe letztens ein alten mini. Netbook mobile Computer gefunden (Oder wie die heißen) welches Windows CE 6.0 betreibt. Mein Problem ist, es ...