UNPKG

8 kBPlain TextView Raw
1 _ _ _____
2 (_) | | / ____|
3 _ _ __ ___ ___ ___ | | | (___
4 | | | '_ ` _ \ / __| / __| _ | | \___ \
5 | | | | | | | | \__ \ | (__ | |__| | ____) |
6 |_| |_| |_| |_| |___/ \___| \____/ |_____/
7
8
9INTRODUCTION
10============
11
12imscJS is a JavaScript library for rendering IMSC1 Text and Image Profile
13documents [1] to HTML5. IMSC1 is a profile of TTML [2] designed for subtitle and
14caption delivery worldwide.
15
16[1] https://www.w3.org/TR/ttml-imsc1/
17[2] https://www.w3.org/TR/ttaf1-dfxp
18
19A live sample web app using imscJS is available at [3].
20
21[3] http://sandflow.com/imsc1proc/index.html
22
23
24
25KNOWN ISSUES AND LIMITATIONS
26============================
27
28imscJS is primarily developed on Chrome. Latest versions of Firefox, Safari,
29Microsoft Internet Explorer 11 and Microsoft Edge are intended to be supported
30nevertheless.
31
32imscJS is intended to reflect the most recent published versions of TTML1 and
33IMSC1, as clarified by proposed resolutions to issues captured in their
34respective bug trackers [1-2].
35
36[1] https://github.com/w3c/ttml1/issues
37[2] https://github.com/w3c/imsc/issues
38
39imscJS bugs are tracked at [3]
40
41[3] https://github.com/sandflow/imscJS/issues
42
43
44
45RUNTIME DEPENDENCIES
46====================
47
48(required) sax-js (1.2.1) [https://www.npmjs.com/package/sax]
49
50imscJS defines an NPM package (see DEVELOPMENT DEPENDENCIES and PACKAGE below) to simplify development,
51track dependencies and manage versions, but has no runtime dependency on node.js. Rendering to HTML5 requires a
52browser environment but parsing an IMSC1 document and tranforming it into ISDs does not.
53
54
55
56DEVELOPMENT DEPENDENCIES
57========================
58
59(required) node.js (see package.json for a complete list of dependencies)
60
61(recommended) git
62
63(recommended) Netbeans 8.2
64
65imscJS consists of a collection of modules (see MODULES below), which can be used in a node
66environment using the 'require' functionality, or standalone, in which case each module hosts its
67definitions under a global name. The modules can be combined into a single file using Browserify [1]
68to simplify use in web apps (see Gruntfile.js for an example).
69
70
71
72QUICK START
73===========
74
75* build the 'build' target defined in Gruntfile.js using grunt [1]. This will build the library and the tests into the
76build/public_html directory, which can be served by popular web server.
77
78[1] http://gruntjs.com/
79
80* the resulting imsc.js and sax.js files at build/public_html/libs are, respectively, the
81imscJS library and its sax-js dependency. Both are included in a web page using the following:
82
83 <script src="libs/sax.js"></script>
84 <script src="libs/imsc.js"></script>
85
86See TESTS AND SAMPLES below for a list of samples available.
87
88
89
90ARCHITECTURE
91============
92
93imscJS renders an IMSC1 document in three distinct steps:
94
95* `fromXML(xmlstring, errorHandler)` parses the document and returns a TT object. The latter contains opaque representation of the document
96and exposes the method `getMediaTimeEvents()` that returns a list of time offsets (in seconds) of the ISD, i.e. the points in time
97where the visual representation of the document change.
98
99* `generateISD(tt, offset, errorHandler)` creates a canonical representation of the document (provided as a TT object generated by `fromXML()`)
100at a point in time (`offset` parameter). This point in time does not have to be one of the values returned by `getMediaTimeEvents()`. For
101example, given an ISOBMFF sample covering the interval `[a, b[`, `generateISD(tt, offset, errorHandler)` would be called first with `offset = a`,
102then in turn with offset set to each value of `getMediaTimeEvents()` that fall in the interval `]a, b[`.
103
104* `renderHTML(isd, element, imgResolver, eheight, ewidth, displayForcedOnlyMode, errorHandler)` renders an `isd` object returned by `generateISD()`
105into a newly-created `div` element that is appended to the `element`. The `element` must be attached to the DOM.
106The height and width of the child `div` element are equal to `eheight` and `ewidth` if not null, or `clientWidth` and `clientHeight` of the
107parent `element` otherwise. Images URIs specified in `smpte:background` attributes are mapped to image resource URLs by the `imgResolver`
108function. The latter takes the value of the `smpte:background` attribute URI and an `img` DOM element as input and is expected to
109set the `src` attribute of the `img` DOM element to the absolute URI of the image. `displayForcedOnlyMode` sets the (boolean) value
110 of the IMSC1 displayForcedOnlyMode parameter.
111
112In each step, the caller can provide an `errorHandler` to be notified of events during processing. The `errorHandler` may define four methods:
113`info`, `warn`, `error` and `fatal`. Each is called with a string argument describing the event, and will cause processing to terminate if it
114returns `true`.
115
116See inline documentation for additional documentation.
117
118
119
120MODULES
121=======
122
123The imscJS codebase is arranged in the following modules (the token between parantheses is the global name
124used if 'require' is not used to load modules):
125
126* doc.js (imscDoc): parses an IMSC1 document into an in-memory TT object
127* isd.js (imscISD): generates an ISD object from a TT object
128* html.js (imscHTML): generates an HTML fragment from an ISD object
129* names.js (imscNames): common constants
130* styles.js (imscStyles): defines TTML styling attributes processing
131* utils.js (imscUtils): common utility functions
132
133
134
135TESTS AND SAMPLES
136=================
137
138W3C Test Suite
139**************
140
141imscJS imports the IMSC1 test suite [1] managed by the W3C as submodule at [2].
142The gen-renders.html web app can be used to generate PNG renderings as as well intermediary files from these
143tests. For regression testing, a copy of these intermediary files are committed at [3].
144
145[1] https://github.com/w3c/imsc-tests
146[2] src/test/resources/imsc-tests
147[3] src/test/resources/generated
148
149Unit tests
150**********
151
152Unit tests are located at [1] and run as a webapp [2] using QUnit [3].
153
154[1] src/test/webapp/js/unit-tests.js
155[2] src/test/webapp/unit_tests.html
156[3] https://qunitjs.com/
157
158
159IRT and W3C samples
160*******************
161
162Also included is the 'samples' webapp [1] that renders the samples listed at [2].
163
164[1] src/test/webapp/samples.html
165[2] src/test/resources/samples/samples.json
166
167The samples.json provided with the distribution expects the following two directories to be added to [3]
168
169* "irt" directory that contains the "ttml" and "png" directories at [4]. These are test vectors provided by the
170Institut für Rundfunktechnik (IRT) [5].
171* "ttml" directory that contains the directories at [6]. These are the formal TTML1 test vectors provided by the W3C.
172Only tests that are compatible with IMSC1 are referenced.
173
174
175[3] src/test/resources/samples/
176[4] https://github.com/IRT-Open-Source/irt-ebu-tt-d-application-samples
177[5] https://www.irt.de/en
178[6] https://github.com/w3c/ttml1/tree/gh-pages/testsuite
179
180
181
182NPM PACKAGE
183===========
184
185imscJS is released as an NPM package under the name "imsc".
186
187
188
189NOTABLE DIRECTORIES AND FILES
190=============================
191
192/package.json NPM package definition
193
194/Gruntfile.js Grunt build script
195
196/properties.json General project properties
197
198/README This file
199
200/LICENSE License under which imscJS is made available
201
202/src/main/js JavaScript modules
203
204/src/test/resources Test files
205
206/src/test/webapp Test web applications
207
208/build Build output