この課題では、Asciiユーザーインターフェイスをレンダリングします。
+----------------------+
|+-----------++-------+|
||<- Previous||Next ->||
|+-----------++-------+|
|== The title == |
| |
|Lorem ipsum dolor |
|sit amet... |
|+--------------+ |
||Post a comment| |
|+--------------+ |
|+-----------------+ |
||User X commented:| |
|| | |
||This is amazing! | |
|+-----------------+ |
|+-----------------+ |
||User Y commented:| |
|| | |
||lol | |
|+-----------------+ |
+----------------------+
このような各図面は、サブ要素を含むことができる1つの要素で構成されています。可能な要素は次のとおりです。
- テキスト要素。1行以上のテキストが含まれます。
- ボックス要素。境界線で囲まれた1つのサブ要素が含まれます。境界線
+
のコーナーと-
s、および|
エッジにsがあります。 - 水平リスト。水平に配置された1つ以上の要素が含まれます。
- 垂直リスト。垂直方向および水平左方向に互いに整列された1つ以上の要素が含まれます。
すべての要素は長方形です。
各要素には、そのコンテンツに加えて、baselineというプロパティがあります。ベースラインは、要素を垂直に配置するために使用されます。水平リストのすべての要素は、ベースラインが同じ行にあるように配置されます。次の例では、ベースラインに文字が含まれていますaeg
。3つのボックス要素のベースライン(0インデックス)であり1
、3
そして2
。
+-+
|c|+-+
+-+|d||f|
|a||e||g|
|b|+-+|h|
+-+ +-+
ベースラインは、次のルールで決定されます。
- テキスト要素の場合、テキストの最初の行はベースラインです。
0
。 - ボックス要素の場合、ベースラインは1 +サブ要素のベースラインです。
- 水平リストの場合、ベースラインはリストの最大ベースラインです(
3
上記の例)。 - 垂直リストの場合、ベースラインは要素のベースラインであり、入力で指定する必要があります。
入力
入力は、何らかの形式のインターフェイスの仕様です(リスト、jsonなど)。入力例の形式は次のとおりです。
- 文字列要素は文字列です:
"..."
- ボックス要素は、最初の要素が次のリストである
"b"
:["b", subelement]
- 水平リストは、最初の要素が次のリストである
"h"
:["h", items...]
- 垂直リストは、最初の要素が含まれるリストで
"v"
あり、2番目の要素は、ベースラインが使用される要素の(0から始まる)番号です。["v", n, items...]
出力
出力には、上記で指定したルールを使用して整列された要素が含まれている必要があります。出力は、stdout、文字列のリスト、またはその他の意味のあるものです。
得点
これはcode-golfで、通常のルールが適用されます。
テストケース
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
甘いイエス...それは再び地質です。
—
魔法のタコUr
ベースラインがどのように機能するかはよくわかりませんが、さらに説明していただけますか?
—
スタンストラム
@StanStrumベースラインは、水平リスト内のアイテムを垂直に整列するために使用されます。アイテムのベースラインは一致する必要があります。それらはすべて同じ物理行である必要があります。たとえば、swcondの例では、最初のボックスが下に移動しており、両方のボックスのベースラインにあるため、文字
—
-fergusq
a
はと同じ行にありe
ます。「ベースライン」がこれに対する正しい単語であるかどうかは完全にはわかりませんが、それが似たような目的のためにタイポグラフィの分野で使用されていることだけを知っています。
@fergusq最初の節:「テキスト要素の場合、テキストの最初の行はベースライン、つまり0です。」、これは他の「ベースライン」がテキストを上にシフトしていることを意味しますか?
—
スタン・ストラム
ベースラインが正しい単語、IIRCそれは同様にCSSのフレキシボックスの説明に使われていなければなりません@fergusq
—
ASCIIのみ