From fe5315badcaa9e326d5e5737a290ee7b299903c5 Mon Sep 17 00:00:00 2001 From: Alex Dima Date: Mon, 23 Sep 2019 13:18:20 +0200 Subject: [PATCH] Ship codicon with the standalone editor --- build/gulpfile.editor.js | 9 +-- build/lib/standalone.js | 52 +++++++++-------- build/lib/standalone.ts | 57 ++++++++++--------- .../ui/codiconLabel/codiconLabel.mock.ts | 24 -------- 4 files changed, 57 insertions(+), 85 deletions(-) delete mode 100644 src/vs/base/browser/ui/codiconLabel/codiconLabel.mock.ts diff --git a/build/gulpfile.editor.js b/build/gulpfile.editor.js index 44f38953adb..64cf089d440 100644 --- a/build/gulpfile.editor.js +++ b/build/gulpfile.editor.js @@ -41,13 +41,7 @@ var editorEntryPoints = [ ]; var editorResources = [ - 'out-build/vs/{base,editor}/**/*.{svg,png}', - '!out-build/vs/base/browser/ui/splitview/**/*', - '!out-build/vs/base/browser/ui/toolbar/**/*', - '!out-build/vs/base/browser/ui/octiconLabel/**/*', - '!out-build/vs/base/browser/ui/codiconLabel/**/*', - '!out-build/vs/workbench/**', - '!**/test/**' + 'out-editor-build/vs/base/browser/ui/codiconLabel/**/*.ttf' ]; var BUNDLED_FILE_HEADER = [ @@ -92,7 +86,6 @@ const extractEditorSrcTask = task.define('extract-editor-src', () => { ], redirects: { 'vs/base/browser/ui/octiconLabel/octiconLabel': 'vs/base/browser/ui/octiconLabel/octiconLabel.mock', - 'vs/base/browser/ui/codiconLabel/codiconLabel': 'vs/base/browser/ui/codiconLabel/codiconLabel.mock', }, shakeLevel: 2, // 0-Files, 1-InnerFile, 2-ClassMembers importIgnorePattern: /(^vs\/css!)|(promise-polyfill\/polyfill)/, diff --git a/build/lib/standalone.js b/build/lib/standalone.js index 7e363da0948..56f89544dac 100644 --- a/build/lib/standalone.js +++ b/build/lib/standalone.js @@ -130,7 +130,7 @@ function createESMSourcesAndResources2(options) { write(getDestAbsoluteFilePath(file), JSON.stringify(tsConfig, null, '\t')); continue; } - if (/\.d\.ts$/.test(file) || /\.css$/.test(file) || /\.js$/.test(file)) { + if (/\.d\.ts$/.test(file) || /\.css$/.test(file) || /\.js$/.test(file) || /\.ttf$/.test(file)) { // Transport the files directly write(getDestAbsoluteFilePath(file), fs.readFileSync(path.join(SRC_FOLDER, file))); continue; @@ -250,35 +250,37 @@ function transportCSS(module, enqueue, write) { const filename = path.join(SRC_DIR, module); const fileContents = fs.readFileSync(filename).toString(); const inlineResources = 'base64'; // see https://github.com/Microsoft/monaco-editor/issues/148 - const inlineResourcesLimit = 300000; //3000; // see https://github.com/Microsoft/monaco-editor/issues/336 - const newContents = _rewriteOrInlineUrls(fileContents, inlineResources === 'base64', inlineResourcesLimit); + const newContents = _rewriteOrInlineUrls(fileContents, inlineResources === 'base64'); write(module, newContents); return true; - function _rewriteOrInlineUrls(contents, forceBase64, inlineByteLimit) { + function _rewriteOrInlineUrls(contents, forceBase64) { return _replaceURL(contents, (url) => { - let imagePath = path.join(path.dirname(module), url); - let fileContents = fs.readFileSync(path.join(SRC_DIR, imagePath)); - if (fileContents.length < inlineByteLimit) { - const MIME = /\.svg$/.test(url) ? 'image/svg+xml' : 'image/png'; - let DATA = ';base64,' + fileContents.toString('base64'); - if (!forceBase64 && /\.svg$/.test(url)) { - // .svg => url encode as explained at https://codepen.io/tigt/post/optimizing-svgs-in-data-uris - let newText = fileContents.toString() - .replace(/"/g, '\'') - .replace(//g, '%3E') - .replace(/&/g, '%26') - .replace(/#/g, '%23') - .replace(/\s+/g, ' '); - let encodedData = ',' + newText; - if (encodedData.length < DATA.length) { - DATA = encodedData; - } + const fontMatch = url.match(/^(.*).ttf\?(.*)$/); + if (fontMatch) { + const relativeFontPath = `${fontMatch[1]}.ttf`; // trim the query parameter + const fontPath = path.join(path.dirname(module), relativeFontPath); + enqueue(fontPath); + return relativeFontPath; + } + const imagePath = path.join(path.dirname(module), url); + const fileContents = fs.readFileSync(path.join(SRC_DIR, imagePath)); + const MIME = /\.svg$/.test(url) ? 'image/svg+xml' : 'image/png'; + let DATA = ';base64,' + fileContents.toString('base64'); + if (!forceBase64 && /\.svg$/.test(url)) { + // .svg => url encode as explained at https://codepen.io/tigt/post/optimizing-svgs-in-data-uris + let newText = fileContents.toString() + .replace(/"/g, '\'') + .replace(//g, '%3E') + .replace(/&/g, '%26') + .replace(/#/g, '%23') + .replace(/\s+/g, ' '); + let encodedData = ',' + newText; + if (encodedData.length < DATA.length) { + DATA = encodedData; } - return '"data:' + MIME + DATA + '"'; } - enqueue(imagePath); - return url; + return '"data:' + MIME + DATA + '"'; }); } function _replaceURL(contents, replacer) { diff --git a/build/lib/standalone.ts b/build/lib/standalone.ts index 6a4cdbf7718..07000331ad2 100644 --- a/build/lib/standalone.ts +++ b/build/lib/standalone.ts @@ -154,7 +154,7 @@ export function createESMSourcesAndResources2(options: IOptions2): void { continue; } - if (/\.d\.ts$/.test(file) || /\.css$/.test(file) || /\.js$/.test(file)) { + if (/\.d\.ts$/.test(file) || /\.css$/.test(file) || /\.js$/.test(file) || /\.ttf$/.test(file)) { // Transport the files directly write(getDestAbsoluteFilePath(file), fs.readFileSync(path.join(SRC_FOLDER, file))); continue; @@ -290,40 +290,41 @@ function transportCSS(module: string, enqueue: (module: string) => void, write: const filename = path.join(SRC_DIR, module); const fileContents = fs.readFileSync(filename).toString(); const inlineResources = 'base64'; // see https://github.com/Microsoft/monaco-editor/issues/148 - const inlineResourcesLimit = 300000;//3000; // see https://github.com/Microsoft/monaco-editor/issues/336 - const newContents = _rewriteOrInlineUrls(fileContents, inlineResources === 'base64', inlineResourcesLimit); + const newContents = _rewriteOrInlineUrls(fileContents, inlineResources === 'base64'); write(module, newContents); return true; - function _rewriteOrInlineUrls(contents: string, forceBase64: boolean, inlineByteLimit: number): string { + function _rewriteOrInlineUrls(contents: string, forceBase64: boolean): string { return _replaceURL(contents, (url) => { - let imagePath = path.join(path.dirname(module), url); - let fileContents = fs.readFileSync(path.join(SRC_DIR, imagePath)); - - if (fileContents.length < inlineByteLimit) { - const MIME = /\.svg$/.test(url) ? 'image/svg+xml' : 'image/png'; - let DATA = ';base64,' + fileContents.toString('base64'); - - if (!forceBase64 && /\.svg$/.test(url)) { - // .svg => url encode as explained at https://codepen.io/tigt/post/optimizing-svgs-in-data-uris - let newText = fileContents.toString() - .replace(/"/g, '\'') - .replace(//g, '%3E') - .replace(/&/g, '%26') - .replace(/#/g, '%23') - .replace(/\s+/g, ' '); - let encodedData = ',' + newText; - if (encodedData.length < DATA.length) { - DATA = encodedData; - } - } - return '"data:' + MIME + DATA + '"'; + const fontMatch = url.match(/^(.*).ttf\?(.*)$/); + if (fontMatch) { + const relativeFontPath = `${fontMatch[1]}.ttf`; // trim the query parameter + const fontPath = path.join(path.dirname(module), relativeFontPath); + enqueue(fontPath); + return relativeFontPath; } - enqueue(imagePath); - return url; + const imagePath = path.join(path.dirname(module), url); + const fileContents = fs.readFileSync(path.join(SRC_DIR, imagePath)); + const MIME = /\.svg$/.test(url) ? 'image/svg+xml' : 'image/png'; + let DATA = ';base64,' + fileContents.toString('base64'); + + if (!forceBase64 && /\.svg$/.test(url)) { + // .svg => url encode as explained at https://codepen.io/tigt/post/optimizing-svgs-in-data-uris + let newText = fileContents.toString() + .replace(/"/g, '\'') + .replace(//g, '%3E') + .replace(/&/g, '%26') + .replace(/#/g, '%23') + .replace(/\s+/g, ' '); + let encodedData = ',' + newText; + if (encodedData.length < DATA.length) { + DATA = encodedData; + } + } + return '"data:' + MIME + DATA + '"'; }); } diff --git a/src/vs/base/browser/ui/codiconLabel/codiconLabel.mock.ts b/src/vs/base/browser/ui/codiconLabel/codiconLabel.mock.ts deleted file mode 100644 index 37862376c2c..00000000000 --- a/src/vs/base/browser/ui/codiconLabel/codiconLabel.mock.ts +++ /dev/null @@ -1,24 +0,0 @@ -/*--------------------------------------------------------------------------------------------- - * Copyright (c) Microsoft Corporation. All rights reserved. - * Licensed under the MIT License. See License.txt in the project root for license information. - *--------------------------------------------------------------------------------------------*/ - -import { escape } from 'vs/base/common/strings'; - -export function renderCodicons(text: string): string { - return escape(text); -} - -export class CodiconLabel { - - private _container: HTMLElement; - - constructor(container: HTMLElement) { - this._container = container; - } - - set text(text: string) { - this._container.innerHTML = renderCodicons(text || ''); - } - -} -- GitLab