ASCII-Benutzeroberflächen

18

In dieser Herausforderung rendern wir ASCII-Benutzeroberflächen.

+----------------------+
|+-----------++-------+|
||<- Previous||Next ->||
|+-----------++-------+|
|== The title ==       |
|                      |
|Lorem ipsum dolor     |
|sit amet...           |
|+--------------+      |
||Post a comment|      |
|+--------------+      |
|+-----------------+   |
||User X commented:|   |
||                 |   |
||This is amazing! |   |
|+-----------------+   |
|+-----------------+   |
||User Y commented:|   |
||                 |   |
||lol              |   |
|+-----------------+   |
+----------------------+

Jede Zeichnung wie diese besteht aus einem Element , das Unterelemente enthalten kann. Die möglichen Elemente sind nachfolgend aufgeführt:

  1. Textelement. Enthält eine oder mehrere Textzeilen.
  2. Kastenelement. Enthält ein mit Rahmen umgebenes Unterelement. Die Ränder haben +s an den Ecken und -s und |an den Rändern.
  3. Horizontale Liste. Enthält ein oder mehrere Elemente, die horizontal ausgerichtet sind.
  4. Vertikale Liste. Enthält ein oder mehrere Elemente, die vertikal übereinander und horizontal nach links ausgerichtet sind.

Jedes Element ist ein Rechteck.

Jedes Element verfügt zusätzlich zu seinem Inhalt über eine Eigenschaft namens baseline . Die Grundlinie wird verwendet, um die Elemente vertikal auszurichten: Jedes Element einer horizontalen Liste wird so ausgerichtet, dass sich ihre Grundlinien auf derselben Linie befinden. Im folgenden Beispiel enthält die Grundlinie Zeichen aeg. Die Grundlinien der drei Kastenelemente (0-indizierte) 1, 3und 2.

   +-+   
   |c|+-+
+-+|d||f|
|a||e||g|
|b|+-+|h|
+-+   +-+

Die Baselines werden nach folgenden Regeln ermittelt:

  1. Bei Textelementen ist die erste Textzeile die Grundlinie, d. H. 0.
  2. Bei Box-Elementen ist die Grundlinie 1 + die Grundlinie des Unterelements.
  3. Bei horizontalen Listen ist die Grundlinie die maximale Grundlinie in der Liste ( 3im obigen Beispiel).
  4. Bei vertikalen Listen ist die Grundlinie die Grundlinie eines Elements, die in der Eingabe angegeben werden muss.

Eingang

Die Eingabe ist eine Spezifikation einer Schnittstelle in einem bestimmten Format (z. B. Listen, JSON). Die Beispieleingaben haben das folgende Format:

  1. Ein String-Element ist ein String: "..."
  2. Ein box-Element ist eine Liste, deren erstes Element ist "b":["b", subelement]
  3. Eine horizontale Liste ist eine Liste, deren erstes Element ist "h":["h", items...]
  4. Eine vertikale Liste ist eine Liste, deren erstes Element "v"und deren zweites Element die (0-indizierte) Nummer des Elements ist, dessen Grundlinie verwendet wird:["v", n, items...]

Ausgabe

Die Ausgabe muss die Elemente enthalten, die gemäß den oben angegebenen Regeln ausgerichtet wurden. Die Ausgabe kann stdout, eine Liste von Zeichenfolgen oder irgendetwas anderes sein, was von Bedeutung ist.

Wertung

Dies ist , es gelten die üblichen Regeln.

Testfälle

1

["b", ["v", 0, ["h", ["b", "<- Previous"], ["b", "Next ->"]], "== The title ==\n\nLorem ipsum dolor\nsit amet...", ["b", "Post a comment"], ["b", "User X commented:\n\nThis is amazing!"], ["b", "User Y commented:\n\nlol"]]]

+----------------------+
|+-----------++-------+|
||<- Previous||Next ->||
|+-----------++-------+|
|== The title ==       |
|                      |
|Lorem ipsum dolor     |
|sit amet...           |
|+--------------+      |
||Post a comment|      |
|+--------------+      |
|+-----------------+   |
||User X commented:|   |
||                 |   |
||This is amazing! |   |
|+-----------------+   |
|+-----------------+   |
||User Y commented:|   |
||                 |   |
||lol              |   |
|+-----------------+   |
+----------------------+

2

["h", ["b", ["v", 0, "a", "b"]], ["b", ["v", 2, "c", "d", "e"]], ["b", ["v", 1, "f", "g", "h"]]]

   +-+   
   |c|+-+
+-+|d||f|
|a||e||g|
|b|+-+|h|
+-+   +-+

3

["h", ["b", ["v", 0, ["b", ["h", "a\nb", "c"]], "d", "e", ["h", ["h", "f"], ["b", ["h", "g"]], "h"]]], ["b", "ijk\nl\nmn\no"], ["v", 2, ["b", "pqrst"], ["b", "uv\nw"], ["b", "x"]], ["b", ["b", ["b", "yz"]]]]

            +-----+        
            |pqrst|        
            +-----+        
            +--+           
            |uv|           
            |w |   +------+
+-----+     +--+   |+----+|
|+--+ |+---++-+    ||+--+||
||ac| ||ijk||x|    |||yz|||
||b | ||l  |+-+    ||+--+||
|+--+ ||mn |       |+----+|
|d    ||o  |       +------+
|e    |+---+               
| +-+ |                    
|f|g|h|                    
| +-+ |                    
+-----+                    

4

["h", "a * b = ", ["v", 0, "a + a + ... + a", "\\_____________/", "    b times"]]

a * b = a + a + ... + a
        \_____________/
            b times    
fergusq
quelle
2
Süßer Jesus ... Es sind wieder Geocities.
Magic Octopus Urn
Ich bin mir nicht ganz sicher, wie die Baseline funktioniert. Können Sie das näher erläutern?
Stan Strum
@StanStrum Die Grundlinie wird verwendet, um die Elemente in einer horizontalen Liste vertikal auszurichten. Die Basislinien der Elemente sollten übereinstimmen, d. H. Sie sollten alle dieselbe physische Reihe sein. Beispiel: Im zweiten Beispiel wurde das erste Feld nach unten verschoben, sodass sich der Buchstabe ain derselben Zeile wie befindet e, da sich beide in der Grundlinie ihrer Felder befinden. Ich bin mir nicht ganz sicher, ob "Grundlinie" das richtige Wort dafür ist, ich weiß nur, dass es auf dem Gebiet der Typografie für einen ähnlichen Zweck verwendet wird.
Fergusq
@fergusq Zur ersten Klausel: "Bei Textelementen ist die erste Textzeile die Grundlinie, dh 0." Bedeutet dies, dass die anderen "Grundlinien" den Text nach oben verschieben?
Stan Strum
@fergusq Baseline sollte das richtige Wort sein, IIRC wird auch in den Beschreibungen für die CSS-Flexbox verwendet
ASCII

Antworten:

10

Python 3 , 721 694 693 671 661 Bytes

Bearbeiten: 27 Byte aufgrund von @Arnold Palmer und @Step Hen gespeichert

Bearbeiten: 1 Byte gespeichert

Bearbeiten: 22 Bytes dank @Arnold Palmer gespeichert

Bearbeiten: 10 Bytes gespeichert

Dies könnte wahrscheinlich ziemlich viel Golf gespielt werden

L,M,R,e=len,max,range,lambda t:([list(r)+[" "]*(M(map(L,t.split("\n")))-L(r))for r in t.split("\n")],0)if str==type(t)else b(t)if"h">t[0]else h(t)if"v">t[0]else v(t);F=lambda t:"\n".join(map("".join,e(t)[0]))
def h(t):
	t=[e(r)for r in t[1:]];Z=M(s[1]for s in t);X=M(L(s[0])-s[1]for s in t)+Z;u=[[]for i in R(X)]
	for a,b in t:u=[u[j]+[Z-b<=j<L(a)+Z-b and a[j-Z+b][i]or" "for i in R(L(a[0]))]for j in R(X)]
	return u,Z
def b(t):t,b=e(t[1]);u=[["+",*"-"*L(t[0]),"+"]];return u+[["|"]+r+["|"]for r in t]+u,1+b
def v(t):w=[e(r)for r in t[2:]];return[a[i]+[" "]*(M(L(a[0])for a,d in w)-L(a[i]))for a,c in w for i in R(L(a))],sum(L(x[0])for x in w[:t[1]])+w[t[1]][1]

Probieren Sie es online aus

Halvard Hummel
quelle
Sie können auch alle Definitionen und P,L,M,R,K=[" "],len,max,range,mapan den Anfang des Programms (Variablen oben) und außerhalb von verschieben F. Wenn Sie das tun, können Sie es auf mindestens 711 Bytes reduzieren. (TIO-Link zu groß zum Posten).
Arnold Palmer
@StepHen Nicht mehr, ich habe das Problem behoben. :-)
Erik der Outgolfer
Bis auf 671 . Musste tinyurl verwenden, da die TIO-Verbindung viel zu lang war. Ich habe viele deiner maps überarbeitet, da sie durch normales Listenverständnis ersetzt werden könnten. Da ich so viele maps herausschneiden konnte, entfernte ich auch die KVariable, da sie 2 Bytes kostete.
Arnold Palmer
Gut gemacht. Sie gewinnen das Kopfgeld.
Oliver Ni