mirror of
https://github.com/enso-org/enso.git
synced 2024-12-24 14:24:11 +03:00
Enso Docs: Proper indentation in HTML render of code block and copy
button. (#1288)
This commit is contained in:
parent
a0f87b3611
commit
2c3f2014b2
@ -178,8 +178,8 @@ object Doc {
|
|||||||
val uniqueIDBtn = Random.alphanumeric.take(8).mkString("")
|
val uniqueIDBtn = Random.alphanumeric.take(8).mkString("")
|
||||||
val htmlIdCode = HTML.`id` := uniqueIDCode
|
val htmlIdCode = HTML.`id` := uniqueIDCode
|
||||||
val htmlIdBtn = HTML.`id` := uniqueIDBtn
|
val htmlIdBtn = HTML.`id` := uniqueIDBtn
|
||||||
val htmlStyle = HTML.`style` := "inline-block"
|
val firstIndent = elems.head.indent
|
||||||
val elemsHTML = elems.toList.map(elem => elem.html)
|
val elemsHTML = elems.toList.map(elem => elem.htmlOffset(firstIndent))
|
||||||
val btnAction = onclick :=
|
val btnAction = onclick :=
|
||||||
s"""var code = document.getElementById("$uniqueIDCode");
|
s"""var code = document.getElementById("$uniqueIDCode");
|
||||||
|var btn = document.getElementById("$uniqueIDBtn").firstChild;
|
|var btn = document.getElementById("$uniqueIDBtn").firstChild;
|
||||||
@ -187,11 +187,34 @@ object Doc {
|
|||||||
|code.style.display = code.style.display ==
|
|code.style.display = code.style.display ==
|
||||||
|"inline-block" ? "none" : "inline-block";""".stripMargin
|
|"inline-block" ? "none" : "inline-block";""".stripMargin
|
||||||
.replaceAll("\n", "")
|
.replaceAll("\n", "")
|
||||||
|
val copyAction = onclick :=
|
||||||
|
s"""var code = document.getElementById("$uniqueIDCode");
|
||||||
|
|var range = document.createRange();
|
||||||
|
|range.selectNode(code);
|
||||||
|
|window.getSelection().removeAllRanges();
|
||||||
|
|window.getSelection().addRange(range);
|
||||||
|
|document.execCommand("copy");
|
||||||
|
|window.getSelection().removeAllRanges();""".stripMargin
|
||||||
|
val btnStyle = HTML.`style` := "display: flex"
|
||||||
val btn = HTML.button(btnAction)(htmlIdBtn)("Show")
|
val btn = HTML.button(btnAction)(htmlIdBtn)("Show")
|
||||||
|
val copyBtn = HTML.button(copyAction)(btnStyle)("Copy")
|
||||||
if (isInGui) {
|
if (isInGui) {
|
||||||
Seq(HTML.div(htmlCls())(htmlStyle)(elemsHTML))
|
val htmlStyle = HTML.`style` := "display: block"
|
||||||
|
Seq(
|
||||||
|
HTML.div(
|
||||||
|
HTML.div(htmlCls())(htmlStyle)(htmlIdCode)(elemsHTML),
|
||||||
|
copyBtn
|
||||||
|
)
|
||||||
|
)
|
||||||
} else {
|
} else {
|
||||||
Seq(HTML.div(btn, HTML.div(htmlCls())(htmlIdCode)(elemsHTML)))
|
val htmlStyle = HTML.`style` := "display: none"
|
||||||
|
Seq(
|
||||||
|
HTML.div(
|
||||||
|
btn,
|
||||||
|
HTML.div(htmlCls())(htmlStyle)(htmlIdCode)(elemsHTML),
|
||||||
|
copyBtn
|
||||||
|
)
|
||||||
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -211,7 +234,9 @@ object Doc {
|
|||||||
}
|
}
|
||||||
final case class Line(indent: Int, elem: String) extends Elem {
|
final case class Line(indent: Int, elem: String) extends Elem {
|
||||||
val repr: Repr.Builder = R + indent + elem
|
val repr: Repr.Builder = R + indent + elem
|
||||||
val html: HTML = Seq(HTML.code(elem), HTML.br)
|
val html: HTML = Seq(HTML.code(" " * indent + elem), HTML.br)
|
||||||
|
def htmlOffset(off: Int): HTML =
|
||||||
|
Seq(HTML.code(" " * (indent - off) + elem), HTML.br)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user