font_loader.js 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297
  1. /* Copyright 2017 Mozilla Foundation
  2. *
  3. * Licensed under the Apache License, Version 2.0 (the "License");
  4. * you may not use this file except in compliance with the License.
  5. * You may obtain a copy of the License at
  6. *
  7. * http://www.apache.org/licenses/LICENSE-2.0
  8. *
  9. * Unless required by applicable law or agreed to in writing, software
  10. * distributed under the License is distributed on an "AS IS" BASIS,
  11. * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  12. * See the License for the specific language governing permissions and
  13. * limitations under the License.
  14. */
  15. 'use strict';
  16. var sharedUtil = require('../shared/util.js');
  17. var assert = sharedUtil.assert;
  18. var bytesToString = sharedUtil.bytesToString;
  19. var string32 = sharedUtil.string32;
  20. var shadow = sharedUtil.shadow;
  21. var warn = sharedUtil.warn;
  22. function FontLoader(docId) {
  23. this.docId = docId;
  24. this.styleElement = null;
  25. this.nativeFontFaces = [];
  26. this.loadTestFontId = 0;
  27. this.loadingContext = {
  28. requests: [],
  29. nextRequestId: 0
  30. };
  31. }
  32. FontLoader.prototype = {
  33. insertRule: function fontLoaderInsertRule(rule) {
  34. var styleElement = this.styleElement;
  35. if (!styleElement) {
  36. styleElement = this.styleElement = document.createElement('style');
  37. styleElement.id = 'PDFJS_FONT_STYLE_TAG_' + this.docId;
  38. document.documentElement.getElementsByTagName('head')[0].appendChild(styleElement);
  39. }
  40. var styleSheet = styleElement.sheet;
  41. styleSheet.insertRule(rule, styleSheet.cssRules.length);
  42. },
  43. clear: function fontLoaderClear() {
  44. if (this.styleElement) {
  45. this.styleElement.remove();
  46. this.styleElement = null;
  47. }
  48. this.nativeFontFaces.forEach(function (nativeFontFace) {
  49. document.fonts.delete(nativeFontFace);
  50. });
  51. this.nativeFontFaces.length = 0;
  52. }
  53. };
  54. var getLoadTestFont = function () {
  55. return atob('T1RUTwALAIAAAwAwQ0ZGIDHtZg4AAAOYAAAAgUZGVE1lkzZwAAAEHAAAABxHREVGABQAFQ' + 'AABDgAAAAeT1MvMlYNYwkAAAEgAAAAYGNtYXABDQLUAAACNAAAAUJoZWFk/xVFDQAAALwA' + 'AAA2aGhlYQdkA+oAAAD0AAAAJGhtdHgD6AAAAAAEWAAAAAZtYXhwAAJQAAAAARgAAAAGbm' + 'FtZVjmdH4AAAGAAAAAsXBvc3T/hgAzAAADeAAAACAAAQAAAAEAALZRFsRfDzz1AAsD6AAA' + 'AADOBOTLAAAAAM4KHDwAAAAAA+gDIQAAAAgAAgAAAAAAAAABAAADIQAAAFoD6AAAAAAD6A' + 'ABAAAAAAAAAAAAAAAAAAAAAQAAUAAAAgAAAAQD6AH0AAUAAAKKArwAAACMAooCvAAAAeAA' + 'MQECAAACAAYJAAAAAAAAAAAAAQAAAAAAAAAAAAAAAFBmRWQAwAAuAC4DIP84AFoDIQAAAA' + 'AAAQAAAAAAAAAAACAAIAABAAAADgCuAAEAAAAAAAAAAQAAAAEAAAAAAAEAAQAAAAEAAAAA' + 'AAIAAQAAAAEAAAAAAAMAAQAAAAEAAAAAAAQAAQAAAAEAAAAAAAUAAQAAAAEAAAAAAAYAAQ' + 'AAAAMAAQQJAAAAAgABAAMAAQQJAAEAAgABAAMAAQQJAAIAAgABAAMAAQQJAAMAAgABAAMA' + 'AQQJAAQAAgABAAMAAQQJAAUAAgABAAMAAQQJAAYAAgABWABYAAAAAAAAAwAAAAMAAAAcAA' + 'EAAAAAADwAAwABAAAAHAAEACAAAAAEAAQAAQAAAC7//wAAAC7////TAAEAAAAAAAABBgAA' + 'AQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAAAA' + 'AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA' + 'AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA' + 'AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA' + 'AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAMAAA' + 'AAAAD/gwAyAAAAAQAAAAAAAAAAAAAAAAAAAAABAAQEAAEBAQJYAAEBASH4DwD4GwHEAvgc' + 'A/gXBIwMAYuL+nz5tQXkD5j3CBLnEQACAQEBIVhYWFhYWFhYWFhYWFhYWFhYWFhYWFhYWF' + 'hYWFhYWFhYAAABAQAADwACAQEEE/t3Dov6fAH6fAT+fPp8+nwHDosMCvm1Cvm1DAz6fBQA' + 'AAAAAAABAAAAAMmJbzEAAAAAzgTjFQAAAADOBOQpAAEAAAAAAAAADAAUAAQAAAABAAAAAg' + 'ABAAAAAAAAAAAD6AAAAAAAAA==');
  56. };
  57. Object.defineProperty(FontLoader.prototype, 'loadTestFont', {
  58. get: function () {
  59. return shadow(this, 'loadTestFont', getLoadTestFont());
  60. },
  61. configurable: true
  62. });
  63. FontLoader.prototype.addNativeFontFace = function fontLoader_addNativeFontFace(nativeFontFace) {
  64. this.nativeFontFaces.push(nativeFontFace);
  65. document.fonts.add(nativeFontFace);
  66. };
  67. FontLoader.prototype.bind = function fontLoaderBind(fonts, callback) {
  68. var rules = [];
  69. var fontsToLoad = [];
  70. var fontLoadPromises = [];
  71. var getNativeFontPromise = function (nativeFontFace) {
  72. return nativeFontFace.loaded.catch(function (e) {
  73. warn('Failed to load font "' + nativeFontFace.family + '": ' + e);
  74. });
  75. };
  76. var isFontLoadingAPISupported = FontLoader.isFontLoadingAPISupported && !FontLoader.isSyncFontLoadingSupported;
  77. for (var i = 0, ii = fonts.length; i < ii; i++) {
  78. var font = fonts[i];
  79. if (font.attached || font.loading === false) {
  80. continue;
  81. }
  82. font.attached = true;
  83. if (isFontLoadingAPISupported) {
  84. var nativeFontFace = font.createNativeFontFace();
  85. if (nativeFontFace) {
  86. this.addNativeFontFace(nativeFontFace);
  87. fontLoadPromises.push(getNativeFontPromise(nativeFontFace));
  88. }
  89. } else {
  90. var rule = font.createFontFaceRule();
  91. if (rule) {
  92. this.insertRule(rule);
  93. rules.push(rule);
  94. fontsToLoad.push(font);
  95. }
  96. }
  97. }
  98. var request = this.queueLoadingCallback(callback);
  99. if (isFontLoadingAPISupported) {
  100. Promise.all(fontLoadPromises).then(function () {
  101. request.complete();
  102. });
  103. } else if (rules.length > 0 && !FontLoader.isSyncFontLoadingSupported) {
  104. this.prepareFontLoadEvent(rules, fontsToLoad, request);
  105. } else {
  106. request.complete();
  107. }
  108. };
  109. FontLoader.prototype.queueLoadingCallback = function FontLoader_queueLoadingCallback(callback) {
  110. function LoadLoader_completeRequest() {
  111. assert(!request.end, 'completeRequest() cannot be called twice');
  112. request.end = Date.now();
  113. while (context.requests.length > 0 && context.requests[0].end) {
  114. var otherRequest = context.requests.shift();
  115. setTimeout(otherRequest.callback, 0);
  116. }
  117. }
  118. var context = this.loadingContext;
  119. var requestId = 'pdfjs-font-loading-' + context.nextRequestId++;
  120. var request = {
  121. id: requestId,
  122. complete: LoadLoader_completeRequest,
  123. callback: callback,
  124. started: Date.now()
  125. };
  126. context.requests.push(request);
  127. return request;
  128. };
  129. FontLoader.prototype.prepareFontLoadEvent = function fontLoaderPrepareFontLoadEvent(rules, fonts, request) {
  130. function int32(data, offset) {
  131. return data.charCodeAt(offset) << 24 | data.charCodeAt(offset + 1) << 16 | data.charCodeAt(offset + 2) << 8 | data.charCodeAt(offset + 3) & 0xff;
  132. }
  133. function spliceString(s, offset, remove, insert) {
  134. var chunk1 = s.substr(0, offset);
  135. var chunk2 = s.substr(offset + remove);
  136. return chunk1 + insert + chunk2;
  137. }
  138. var i, ii;
  139. var canvas = document.createElement('canvas');
  140. canvas.width = 1;
  141. canvas.height = 1;
  142. var ctx = canvas.getContext('2d');
  143. var called = 0;
  144. function isFontReady(name, callback) {
  145. called++;
  146. if (called > 30) {
  147. warn('Load test font never loaded.');
  148. callback();
  149. return;
  150. }
  151. ctx.font = '30px ' + name;
  152. ctx.fillText('.', 0, 20);
  153. var imageData = ctx.getImageData(0, 0, 1, 1);
  154. if (imageData.data[3] > 0) {
  155. callback();
  156. return;
  157. }
  158. setTimeout(isFontReady.bind(null, name, callback));
  159. }
  160. var loadTestFontId = 'lt' + Date.now() + this.loadTestFontId++;
  161. var data = this.loadTestFont;
  162. var COMMENT_OFFSET = 976;
  163. data = spliceString(data, COMMENT_OFFSET, loadTestFontId.length, loadTestFontId);
  164. var CFF_CHECKSUM_OFFSET = 16;
  165. var XXXX_VALUE = 0x58585858;
  166. var checksum = int32(data, CFF_CHECKSUM_OFFSET);
  167. for (i = 0, ii = loadTestFontId.length - 3; i < ii; i += 4) {
  168. checksum = checksum - XXXX_VALUE + int32(loadTestFontId, i) | 0;
  169. }
  170. if (i < loadTestFontId.length) {
  171. checksum = checksum - XXXX_VALUE + int32(loadTestFontId + 'XXX', i) | 0;
  172. }
  173. data = spliceString(data, CFF_CHECKSUM_OFFSET, 4, string32(checksum));
  174. var url = 'url(data:font/opentype;base64,' + btoa(data) + ');';
  175. var rule = '@font-face { font-family:"' + loadTestFontId + '";src:' + url + '}';
  176. this.insertRule(rule);
  177. var names = [];
  178. for (i = 0, ii = fonts.length; i < ii; i++) {
  179. names.push(fonts[i].loadedName);
  180. }
  181. names.push(loadTestFontId);
  182. var div = document.createElement('div');
  183. div.setAttribute('style', 'visibility: hidden;' + 'width: 10px; height: 10px;' + 'position: absolute; top: 0px; left: 0px;');
  184. for (i = 0, ii = names.length; i < ii; ++i) {
  185. var span = document.createElement('span');
  186. span.textContent = 'Hi';
  187. span.style.fontFamily = names[i];
  188. div.appendChild(span);
  189. }
  190. document.body.appendChild(div);
  191. isFontReady(loadTestFontId, function () {
  192. document.body.removeChild(div);
  193. request.complete();
  194. });
  195. };
  196. FontLoader.isFontLoadingAPISupported = typeof document !== 'undefined' && !!document.fonts;
  197. var isSyncFontLoadingSupported = function isSyncFontLoadingSupported() {
  198. if (typeof navigator === 'undefined') {
  199. return true;
  200. }
  201. var supported = false;
  202. var m = /Mozilla\/5.0.*?rv:(\d+).*? Gecko/.exec(navigator.userAgent);
  203. if (m && m[1] >= 14) {
  204. supported = true;
  205. }
  206. return supported;
  207. };
  208. Object.defineProperty(FontLoader, 'isSyncFontLoadingSupported', {
  209. get: function () {
  210. return shadow(FontLoader, 'isSyncFontLoadingSupported', isSyncFontLoadingSupported());
  211. },
  212. enumerable: true,
  213. configurable: true
  214. });
  215. var IsEvalSupportedCached = {
  216. get value() {
  217. return shadow(this, 'value', sharedUtil.isEvalSupported());
  218. }
  219. };
  220. var FontFaceObject = function FontFaceObjectClosure() {
  221. function FontFaceObject(translatedData, options) {
  222. this.compiledGlyphs = Object.create(null);
  223. for (var i in translatedData) {
  224. this[i] = translatedData[i];
  225. }
  226. this.options = options;
  227. }
  228. FontFaceObject.prototype = {
  229. createNativeFontFace: function FontFaceObject_createNativeFontFace() {
  230. if (!this.data) {
  231. return null;
  232. }
  233. if (this.options.disableFontFace) {
  234. this.disableFontFace = true;
  235. return null;
  236. }
  237. var nativeFontFace = new FontFace(this.loadedName, this.data, {});
  238. if (this.options.fontRegistry) {
  239. this.options.fontRegistry.registerFont(this);
  240. }
  241. return nativeFontFace;
  242. },
  243. createFontFaceRule: function FontFaceObject_createFontFaceRule() {
  244. if (!this.data) {
  245. return null;
  246. }
  247. if (this.options.disableFontFace) {
  248. this.disableFontFace = true;
  249. return null;
  250. }
  251. var data = bytesToString(new Uint8Array(this.data));
  252. var fontName = this.loadedName;
  253. var url = 'url(data:' + this.mimetype + ';base64,' + btoa(data) + ');';
  254. var rule = '@font-face { font-family:"' + fontName + '";src:' + url + '}';
  255. if (this.options.fontRegistry) {
  256. this.options.fontRegistry.registerFont(this, url);
  257. }
  258. return rule;
  259. },
  260. getPathGenerator: function FontFaceObject_getPathGenerator(objs, character) {
  261. if (!(character in this.compiledGlyphs)) {
  262. var cmds = objs.get(this.loadedName + '_path_' + character);
  263. var current, i, len;
  264. if (this.options.isEvalSupported && IsEvalSupportedCached.value) {
  265. var args, js = '';
  266. for (i = 0, len = cmds.length; i < len; i++) {
  267. current = cmds[i];
  268. if (current.args !== undefined) {
  269. args = current.args.join(',');
  270. } else {
  271. args = '';
  272. }
  273. js += 'c.' + current.cmd + '(' + args + ');\n';
  274. }
  275. this.compiledGlyphs[character] = new Function('c', 'size', js);
  276. } else {
  277. this.compiledGlyphs[character] = function (c, size) {
  278. for (i = 0, len = cmds.length; i < len; i++) {
  279. current = cmds[i];
  280. if (current.cmd === 'scale') {
  281. current.args = [
  282. size,
  283. -size
  284. ];
  285. }
  286. c[current.cmd].apply(c, current.args);
  287. }
  288. };
  289. }
  290. }
  291. return this.compiledGlyphs[character];
  292. }
  293. };
  294. return FontFaceObject;
  295. }();
  296. exports.FontFaceObject = FontFaceObject;
  297. exports.FontLoader = FontLoader;