summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorGravatar Adam Chlipala <adam@chlipala.net>2018-10-19 16:28:39 -0400
committerGravatar Adam Chlipala <adam@chlipala.net>2018-10-19 16:28:39 -0400
commitabd0bdd9518b8ed9e9b0ad0a0c1059760b0ec5ce (patch)
tree136495948ad933f9b62981c81a3ca43588179fe6
parent1a4a8b5ab8eb499ee2217c966f7fbb7716adf9e9 (diff)
Automatic merging of style/dynStyle and class/dynClass (closes #64)
-rw-r--r--lib/js/urweb.js13
-rw-r--r--tests/classAndDynClass.ur9
2 files changed, 20 insertions, 2 deletions
diff --git a/lib/js/urweb.js b/lib/js/urweb.js
index bf20cfd4..f81f05e3 100644
--- a/lib/js/urweb.js
+++ b/lib/js/urweb.js
@@ -1310,6 +1310,9 @@ function dynClass(pnode, html, s_class, s_style) {
var x = null;
var y = null;
+ var classNameBefore = html.className;
+ var styleCssBefore = html.style.cssText;
+
if (s_class) {
x = document.createElement("script");
x.dead = false;
@@ -1322,7 +1325,10 @@ function dynClass(pnode, html, s_class, s_style) {
freeClosure(ls.data);
var cls = {v : null};
- html.className = flatten(cls, v);
+ var s = flatten(cls, v);
+ if (classNameBefore)
+ s += " " + classNameBefore;
+ html.className = s;
x.closures = concat(cls.v, htmlCls);
}
@@ -1342,7 +1348,10 @@ function dynClass(pnode, html, s_class, s_style) {
freeClosure(ls.data);
var cls = {v : null};
- html.style.cssText = flatten(cls, v);
+ var s = flatten(cls, v);
+ if (styleCssBefore)
+ s += " " + styleCssBefore;
+ html.style.cssText = s;
y.closures = concat(cls.v, htmlCls2);
}
diff --git a/tests/classAndDynClass.ur b/tests/classAndDynClass.ur
new file mode 100644
index 00000000..ba01962d
--- /dev/null
+++ b/tests/classAndDynClass.ur
@@ -0,0 +1,9 @@
+style style1
+style style2
+
+fun main () : transaction page = return <xml><body>
+ <div class="style1" dynClass={return (CLASS "style2")}>Text</div>
+ <div dynClass={return (CLASS "style2")}>Text</div>
+ <div style="font-weight: bold" dynStyle={return (STYLE "font-variant: small-caps")}>Text</div>
+ <div dynStyle={return (STYLE "font-variant: small-caps")}>Text</div>
+</body></xml>