Interfaces utilisateur Ascii


18

Dans ce défi, nous rendons les interfaces utilisateur Ascii.

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

Chaque dessin comme celui-ci est composé d'un élément , qui peut contenir des sous-éléments. Les éléments possibles sont listés ci-dessous:

  1. Élément de texte. Contient une ou plusieurs lignes de texte.
  2. Élément de boîte. Contient un sous-élément entouré de bordures. Les bordures ont +s aux coins et -s et |aux bords.
  3. Liste horizontale. Contient un ou plusieurs éléments alignés horizontalement.
  4. Liste verticale. Contient un ou plusieurs éléments alignés verticalement et à gauche horizontalement.

Chaque élément est un rectangle.

Chaque élément, en plus de son contenu, possède une propriété appelée baseline . La ligne de base est utilisée pour aligner les éléments verticalement: chaque élément d'une liste horizontale est aligné de telle sorte que leurs lignes de base sont sur la même ligne. Dans l'exemple ci-dessous, la ligne de base contient des caractères aeg. Les lignes de base des trois éléments de boîtier sont (0 indexée) 1, 3et 2.

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

Les lignes de base sont déterminées avec les règles suivantes:

  1. Pour les éléments de texte, la première ligne de texte est la ligne de base, c'est-à-dire. 0.
  2. Pour les éléments de boîte, la ligne de base est 1 + la ligne de base du sous-élément.
  3. Pour les listes horizontales, la ligne de base est la ligne de base maximale dans la liste ( 3dans l'exemple ci-dessus).
  4. Pour les listes verticales, la ligne de base est la ligne de base d'un élément, qui doit être spécifiée dans l'entrée.

Contribution

L'entrée est une spécification d'une interface dans un certain format (par exemple, listes, json). Les exemples d'entrées ont le format suivant:

  1. Un élément de chaîne est une chaîne: "..."
  2. Un élément box est une liste qui est le premier élément "b":["b", subelement]
  3. Une liste horizontale est une liste dont le premier élément est "h":["h", items...]
  4. Une liste verticale est une liste qui est le premier élément "v"et le deuxième élément est le numéro (indexé 0) de l'élément qui utilise la ligne de base:["v", n, items...]

Production

La sortie doit contenir les éléments alignés en utilisant les règles que j'ai spécifiées ci-dessus. La sortie peut être stdout, une liste de chaînes ou tout autre élément significatif.

Notation

C'est du , les règles habituelles s'appliquent.

Cas de test

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    

2
Doux Jésus ... C'est encore une fois des géocités.
Magic Octopus Urn

Je ne sais pas trop comment fonctionne la ligne de base, pourriez-vous l'expliquer davantage?
Stan Strum

@StanStrum La ligne de base est utilisée pour aligner verticalement les éléments d'une liste horizontale. Les lignes de base des éléments doivent correspondre, c'est-à-dire. ils devraient tous être la même ligne physique. Par exemple, dans l'exemple swcond, la première case a été déplacée vers le bas de sorte que la lettre se atrouve sur la même ligne que e, car elles se trouvent toutes les deux sur la ligne de base de leurs cases. Je ne suis pas tout à fait sûr si "baseline" est le mot correct pour cela, je sais seulement qu'il est utilisé dans le domaine de la typographie dans un but similaire.
fergusq

@fergusq Sur la première clause: "Pour les éléments de texte, la première ligne de texte est la ligne de base, c'est-à-dire 0.", cela signifie-t-il que les autres "lignes de base" déplacent le texte vers le haut?
Stan Strum

@fergusq Baseline devrait être le mot correct, IIRC il est également utilisé dans les descriptions de CSS flexbox
ASCII uniquement

Réponses:


10

Python 3 , 721 694 693 671 661 octets

Edit: 27 octets enregistrés grâce à @Arnold Palmer et @Step Hen

Modifier: enregistré 1 octet

Edit: enregistré 22 octets grâce à @Arnold Palmer

Modifier: enregistré 10 octets

Cela pourrait probablement être joué un peu

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]

Essayez-le en ligne


Vous pouvez également déplacer toutes les définitions et P,L,M,R,K=[" "],len,max,range,mapvers le haut du programme (variables en haut), et à l'extérieur de F. Ce faisant, vous pouvez le réduire à au moins 711 octets. (Lien TIO trop volumineux pour être publié).
Arnold Palmer

@StepHen Plus maintenant, j'ai résolu le problème. :-)
Erik the Outgolfer

Jusqu'à 671 . J'ai dû utiliser tinyurl car le lien TIO était beaucoup trop long. J'ai retravaillé beaucoup de vos maps car ils pourraient être remplacés par des choses normales de compréhension de liste. Parce que j'étais capable de couper autant de maps, j'ai également supprimé la Kvariable car elle coûtait 2 octets.
Arnold Palmer

Bon travail. Vous gagnez la prime.
Oliver Ni
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.