Implemented support for {\k}

README.md

@@ -96,13 +96,13 @@ You can also join the IRC channel in the links section below and ask any questio
 ### Supported features
 
 * Styles: Italic, Bold, Underline, StrikeOut, FontName, FontSize, ScaleX, ScaleY, Spacing, PrimaryColor, OutlineColor, BackColor, Outline, Shadow, Alignment, MarginL, MarginR, MarginV
-* Tags: \i, \b, \u, \s, \bord, \xbord, \ybord, \shad, \xshad, \yshad, \be, \blur, \fn, \fs, \fscx, \fscy, \fsp, \frx, \fry, \frz, \fr, \fax, \fay, \c, \1c, \3c, \4c, \alpha, \1a, \3a, \4a, \an, \a, \r, \pos, \move, \fad, \fade, \p
+* Tags: \i, \b, \u, \s, \bord, \xbord, \ybord, \shad, \xshad, \yshad, \be, \blur, \fn, \fs, \fscx, \fscy, \fsp, \frx, \fry, \frz, \fr, \fax, \fay, \c, \1c, \3c, \4c, \alpha, \1a, \3a, \4a, \an, \a, \k, \r, \pos, \move, \fad, \fade, \p
 * Custom fonts, using CSS web fonts.
 
 
 ### Known issues
 
-* Unsupported tags: \fe, \2c, \2a, \k, \K, \kf, \ko, \q, \org, \t, \clip, \iclip
+* Unsupported tags: \fe, \2c, \2a, \K, \kf, \ko, \q, \org, \t, \clip, \iclip
 * \an4, \an5, \an6 aren't positioned correctly.
 * All lines are rendered as [wrapping style 1 (end-of-line wrapping)](http://docs.aegisub.org/3.0/ASS_Tags/#wrapstyle)
 * Lines with multiple rotations aren't rotated the same as VSFilter or libass. See [#14](https://github.com/Arnavion/libjass/issues/14)

src/renderers/web.ts

@@ -241,6 +241,8 @@ class WebRenderer extends NullRenderer implements EventSource<string> {
 
 		var wrappingStyle = this.ass.properties.wrappingStyle;
 
+		var karaokeTimesAccumulator = 0;
+
 		dialogue.parts.forEach(part => {
 			if (part instanceof parts.Italic) {
 				currentSpanStyles.italic = part.value;
@@ -383,6 +385,20 @@ class WebRenderer extends NullRenderer implements EventSource<string> {
 				// Already handled in Dialogue
 			}
 
+			else if (part instanceof parts.ColorKaraoke) {
+				startNewSpan(false);
+
+				currentAnimationCollection.add("step-end", [
+					new Keyframe(0, new map.Map([
+						["color", currentSpanStyles.secondaryColor.withAlpha(currentSpanStyles.secondaryAlpha).toString()],
+					])), new Keyframe(karaokeTimesAccumulator, new map.Map([
+						["color", currentSpanStyles.primaryColor.withAlpha(currentSpanStyles.primaryAlpha).toString()],
+					]))
+				]);
+
+				karaokeTimesAccumulator += part.duration;
+			}
+
 			else if (part instanceof parts.WrappingStyle) {
 				wrappingStyle = part.value;
 			}