Show query rewrite of VC as title attribute
Change-Id: I6946bf1f9a2f8e7de95d61788c558ce5d5d39446
diff --git a/dev/js/spec/vcSpec.js b/dev/js/spec/vcSpec.js
index 0c86d85..482d384 100644
--- a/dev/js/spec/vcSpec.js
+++ b/dev/js/spec/vcSpec.js
@@ -1986,6 +1986,36 @@
expect(doc.element().classList.contains('rewritten')).toBeTruthy();
});
+ it('should be described in a title attribute', function () {
+
+ doc = docClass.create(
+ undefined,
+ {
+ "@type":"koral:doc",
+ "key":"Titel",
+ "value":"Baum",
+ "match":"match:eq",
+ "rewrites" : [
+ {
+ "@type" : "koral:rewrite",
+ "operation" : "operation:modification",
+ "src" : "querySerializer",
+ "scope" : "tree"
+ },
+ {
+ "@type" : "koral:rewrite",
+ "operation" : "operation:injection",
+ "src" : "me"
+ }
+ ]
+ });
+
+ expect(doc.element().classList.contains('doc')).toBeTruthy();
+ expect(doc.element().classList.contains('rewritten')).toBeTruthy();
+ expect(doc.element().lastChild.getAttribute("title")).toEqual("querySerializer: tree (modification)\nme (injection)");
+ });
+
+
xit('should be deserialized by docGroups', function () {
var docGroup = docGroupClass.create(
undefined,
diff --git a/dev/js/src/vc/rewritelist.js b/dev/js/src/vc/rewritelist.js
index cec95ff..8e68fa0 100644
--- a/dev/js/src/vc/rewritelist.js
+++ b/dev/js/src/vc/rewritelist.js
@@ -32,22 +32,32 @@
this._element = document.createElement('div');
this._element.setAttribute('class', 'rewrite');
+ var comments = [];
for (var x in this._list) {
var rewrite = this._list[x];
+
+ // This is a blind element
var span = document.createElement('span');
// Set class attribute
span.setAttribute('class', rewrite.operation());
// Append source information
- span.addT(rewrite.src());
+ var rewriteText = rewrite.src();
// Append scope information
if (rewrite.scope() !== undefined) {
- span.addT(': ' + rewrite.scope());
+ rewriteText += ': ' + rewrite.scope();
};
+
+ // Append source information
+ span.addT(rewriteText);
+
+ comments.push(rewriteText + ' (' + rewrite.operation() + ')');
+
this._element.appendChild(span);
};
+ this._element.setAttribute("title", comments.join("\n"))
return this._element;
}
};
diff --git a/dev/scss/header/vc.scss b/dev/scss/header/vc.scss
index 7cc528d..02c8b54 100644
--- a/dev/scss/header/vc.scss
+++ b/dev/scss/header/vc.scss
@@ -38,21 +38,21 @@
&[data-operation] {
> .doc:first-child::before,
> .docGroup:first-child::before {
- content: none;
+ content: none;
}
> .doc::before,
> .docGroup::before {
- display: inline-block;
- position: absolute;
- text-align: right;
- width: $left-padding;
- margin-left: -1 * ($left-padding + .5em); // -28pt
- color: $dark-green;
- line-height: 1.5em;
- border-top: $border-size solid transparent;
+ display: inline-block;
+ position: absolute;
+ text-align: right;
+ width: $left-padding;
+ margin-left: -1 * ($left-padding + .5em); // -28pt
+ color: $dark-green;
+ line-height: 1.5em;
+ border-top: $border-size solid transparent;
}
> .docGroup::before {
- margin-left: -1 * ($left-padding + .5em) + (-1 * $bracket-size);
+ margin-left: -1 * ($left-padding + .5em) + (-1 * $bracket-size);
}
}
@@ -61,8 +61,8 @@
border-color: $dark-orange;
> .doc::before,
> .docGroup::before {
- // This will be overruled by JS!
- content: "or";
+ // This will be overruled by JS!
+ content: "or";
}
}
@@ -70,8 +70,8 @@
&[data-operation=and] {
> .doc::before,
> .docGroup::before {
- // This will be overruled by JS!
- content: "and";
+ // This will be overruled by JS!
+ content: "and";
}
}
@@ -86,10 +86,10 @@
vertical-align: middle;
left: 3px;
> span:first-child {
- border: {
- top-left-radius: 0;
- bottom-left-radius: 0;
- }
+ border: {
+ top-left-radius: 0;
+ bottom-left-radius: 0;
+ }
}
margin-left: 100%;
padding: 0;
@@ -112,10 +112,11 @@
> span.value {
font-weight: bold;
&[data-type=regex] {
- font-style: italic;
- &::after, &::before {
- content: '/';
- }
+ font-style: italic;
+ &::after,
+ &::before {
+ content: '/';
+ }
}
}
@@ -129,8 +130,8 @@
> span.key {
position: relative;
> ul {
- margin: 0;
- margin-left: 3.3em;
+ margin: 0;
+ margin-left: 3.3em;
}
}
}
@@ -141,16 +142,16 @@
display: inline-block;
color: $dark-orange;
&::after {
- font: {
- family: FontAwesome;
- style: normal;
- weight: normal;
- }
- content: $fa-rewrite;
- text-decoration: underline;
+ font: {
+ family: FontAwesome;
+ style: normal;
+ weight: normal;
+ }
+ content: $fa-rewrite;
+ text-decoration: underline;
}
- span {
- display: none;
+ > span {
+ display: none;
}
}
}
@@ -208,28 +209,28 @@
padding: 2pt;
cursor: pointer;
font: {
- size: 80%;
- style: italic;
+ size: 80%;
+ style: italic;
}
display: inline-block;
@include choose-item;
border: {
- width: $border-size;
- style: solid;
- radius: $standard-border-radius;
+ width: $border-size;
+ style: solid;
+ radius: $standard-border-radius;
}
&:hover {
- @include choose-hover;
+ @include choose-hover;
}
}
&.regex {
> input {
- font-style: italic;
+ font-style: italic;
}
> div {
- @include choose-active;
+ @include choose-active;
}
}
}
@@ -250,27 +251,27 @@
}
.docGroup {
> .operators {
- z-index: $dg-index + 2;
+ z-index: $dg-index + 2;
}
.docGroup {
- > .operators {
- z-index: $dg-index + 3;
- }
- .docGroup {
- > .operators {
- z-index: $dg-index + 4;
- }
- .docGroup {
- > .operators {
- z-index: $dg-index + 5;
- }
- .docGroup {
- > .operators {
- z-index: $dg-index + 6;
- }
- }
- }
- }
+ > .operators {
+ z-index: $dg-index + 3;
+ }
+ .docGroup {
+ > .operators {
+ z-index: $dg-index + 4;
+ }
+ .docGroup {
+ > .operators {
+ z-index: $dg-index + 5;
+ }
+ .docGroup {
+ > .operators {
+ z-index: $dg-index + 6;
+ }
+ }
+ }
+ }
}
}
}
@@ -287,12 +288,12 @@
color: $dark-orange;
padding: 0;
padding-left: 4px;
- font: {
- family: FontAwesome;
- style: normal;
- weight: normal;
- }
- content: $fa-rewrite;
- text-decoration: underline;
+ font: {
+ family: FontAwesome;
+ style: normal;
+ weight: normal;
+ }
+ content: $fa-rewrite;
+ text-decoration: underline;
}
}