Checkpoint 3

js-src/Displacy.ts

@@ -10,14 +10,54 @@ interface Span {
 	end:   number;
 }
 
+interface SpanTag {
+	span: Span;
+	tag: "start" | "end";
+}
+
 class Displacy {
+	static sortSpans(spans: Span[]) {
+		spans.sort((a, b) => {  /// `a` should come first when the result is < 0
+			if (a.start === b.start) {
+				return b.end - a.end;   /// CAUTION.
+			}
+			return a.start - b.start;
+		});
+		
+		// Check existence of **strict overlapping**
+		spans.forEach((s, i) => {
+			if (i < spans.length - 1) {
+				const sNext = spans[i+1];
+				if (s.start < sNext.start && s.end > sNext.start) {
+					alert("Spans: strict overlapping");
+				}
+			}
+		});
+	}
 	
 	/**
 	 * Render a text string and its entity spans
 	 * 
 	 * *see displacy-ent.js*
+	 * see https://github.com/explosion/displacy-ent/issues/2
 	 */
 	static render(text: string, spans: Span[]): string {
+		this.sortSpans(spans);
+		
+		const tags: { [index: number]: SpanTag[] } = {};
+		const __addTag = (i: number, s: Span, tag: "start" | "end") => {
+			if (Array.isArray(tags[i])) {
+				tags[i].push({ span: s, tag: tag });
+			} else {
+				tags[i] = [{ span: s, tag: tag }];
+			}
+		};
+		for (const s of spans) {
+			__addTag(s.start, s, "start");
+			__addTag(s.end, s, "end");
+		}
+		// console.log(JSON.stringify(tags));  // todo remove
+		
 		let out = {
 			__content: "",
 			append(s: string) {
@@ -26,23 +66,24 @@ class Displacy {
 		};
 		let offset = 0;
 		
-		spans.forEach(({ type, start, end }) => {
-			const entity = text.slice(start, end);
-			const fragments = text.slice(offset, start).split('\n');
-			
-			fragments.forEach((fragment, i) => {
-				out.append(fragment);
-				if (fragments.length > 1 && i !== fragments.length - 1) {
-					out.append('<br>');
-				}
-			});
+		const indexes = Object.keys(tags).map(k => parseInt(k, 10)).sort((a, b) => a - b); /// CAUTION
+		for (const i of indexes) {
+			const spanTags = tags[i];
+			// console.log(i, spanTags);  // todo remove
+			if (i > offset) {
+				out.append(text.slice(offset, i));
+			}
 			
-			// Breaking change from displacy-ent.js:
-			// We do not filter any entity type out.
-			out.append(`<mark data-entity=${ type.toLowerCase() }>${ entity }</mark>`);
+			offset = i;
 			
-			offset = end;
-		});
+			for (const sT of spanTags) {
+				if (sT.tag === "start") {
+					out.append(`<mark data-entity="${ sT.span.type.toLowerCase() }">`);
+				} else {
+					out.append(`</mark>`);
+				}
+			}
+		}
 		
 		out.append(text.slice(offset, text.length));
 		return out.__content;

js-src/coref.ts

@@ -63,9 +63,9 @@ class Coref {
 	}
 	
 	render(res: Response) {
-		const markup = Displacy.render(res.cleanedText, (<any>res).entities);
+		const markup = Displacy.render(res.cleanedText, (<any>res).entities);  // We will sort the second param in Displacy
 		if (!this.container) { return ; }
-		console.log(markup);
+		console.log(markup);  // todo remove
 		this.container.innerHTML = `<div class="text">${markup}</div>`;
 	}
 }