icon generation

.gitignore

@@ -0,0 +1,9 @@
+out
+node_modules
+
+icon-generation/dark
+icon-generation/light
+icon-generation/icons.json
+icon-generation/**/*.js
+
+

.vscode/launch.json

@@ -0,0 +1,28 @@
+// A launch configuration that compiles the extension and then opens it inside a new window
+{
+    "version": "0.1.0",
+    "configurations": [
+        {
+            "name": "Launch Extension",
+            "type": "extensionHost",
+            "request": "launch",
+            "runtimeExecutable": "${execPath}",
+            "args": ["--extensionDevelopmentPath=${workspaceRoot}" ],
+            "stopOnEntry": false,
+            "sourceMaps": true,
+            "outDir": "${workspaceRoot}/out/src",
+            "preLaunchTask": "npm"
+        },
+        {
+            "name": "Launch Tests",
+            "type": "extensionHost",
+            "request": "launch",
+            "runtimeExecutable": "${execPath}",
+            "args": ["--extensionDevelopmentPath=${workspaceRoot}", "--extensionTestsPath=${workspaceRoot}/out/test" ],
+            "stopOnEntry": false,
+            "sourceMaps": true,
+            "outDir": "${workspaceRoot}/out/test",
+            "preLaunchTask": "npm"
+        }
+    ]
+}

.vscode/settings.json

@@ -0,0 +1,10 @@
+// Place your settings in this file to overwrite default and user settings.
+{
+    "files.exclude": {
+        "out": false // set this to true to hide the "out" folder with the compiled JS files
+    },
+    "search.exclude": {
+        "out": true // set this to false to include "out" folder in search results
+    },
+    "typescript.tsdk": "./node_modules/typescript/lib" // we want to use the TS server from our node_modules folder to control its version
+}

.vscode/tasks.json

@@ -0,0 +1,30 @@
+// Available variables which can be used inside of strings.
+// ${workspaceRoot}: the root folder of the team
+// ${file}: the current opened file
+// ${fileBasename}: the current opened file's basename
+// ${fileDirname}: the current opened file's dirname
+// ${fileExtname}: the current opened file's extension
+// ${cwd}: the current working directory of the spawned process
+
+// A task runner that calls a custom npm script that compiles the extension.
+{
+    "version": "0.1.0",
+
+    // we want to run npm
+    "command": "npm",
+
+    // the command is a shell script
+    "isShellCommand": true,
+
+    // show the output window only if unrecognized errors occur.
+    "showOutput": "silent",
+
+    // we run the custom script "compile" as defined in package.json
+    "args": ["run", "compile", "--loglevel", "silent"],
+
+    // The tsc compiler is started in watching mode
+    "isWatching": true,
+
+    // use the standard tsc in watch mode problem matcher to find compile problems in the output.
+    "problemMatcher": "$tsc-watch"
+}

.vscodeignore

@@ -0,0 +1,9 @@
+.vscode/**
+.vscode-test/**
+out/test/**
+test/**
+src/**
+**/*.map
+.gitignore
+tsconfig.json
+vsc-extension-quickstart.md

README.md

@@ -0,0 +1,3 @@
+# vscode-jumpy README
+
+This is the README for the extension "vscode-jumpy".

icon-generation/icons-to-file.ts

@@ -0,0 +1,17 @@
+import * as fs from 'fs';
+import * as bluebird from 'bluebird';
+
+const readFile = bluebird.promisify(fs.readFile);
+const writeFile = bluebird.promisify<void, string, string, string>(fs.writeFile);
+
+readFile('./icon-generation/icons.json')
+    .then(data => {
+        const iconsSource = JSON.parse(data.toString());
+        const strip = s => s.replace(/^data:image\/png;base64,/, '');
+        const darkPromises = iconsSource.dark.map(x => writeFile(`./icon-generation/dark/${x.code}.png`, strip(x.pngEncoded), 'base64'));
+        const lightPromises = iconsSource.light.map(x => writeFile(`./icon-generation/light/${x.code}.png`, strip(x.pngEncoded), 'base64'));
+        return Promise.all([ ...darkPromises, ...lightPromises]);
+    })
+    .then(() => {
+        console.log('done');
+    });

icon-generation/tsconfig.json

@@ -0,0 +1,14 @@
+{
+    "compilerOptions": {
+        "module": "commonjs",
+        "target": "es6",
+        "outDir": "out",
+        "lib": [
+            "dom",
+            "es6"
+        ]
+    },
+    "exclude": [
+        "node_modules"
+    ]
+}

icon-generation/web/index.html

@@ -0,0 +1,7 @@
+<html>
+    <head>
+    </head>
+    <body style="background-color:black;">
+        <script src="index.js"></script>
+    </body>
+</html>

icon-generation/web/index.ts

@@ -0,0 +1,48 @@
+window.onload = () => {
+    let dark = null;
+    generateIcons('white', 'black')
+        .then(result => {
+            dark = result;
+            return generateIcons('black', 'white');
+        })
+        .then(light => {
+            console.log(JSON.stringify({ dark, light }));
+        });
+};
+
+function generateIcons(backgroundColor: string, fontColor: string) {
+    const body = document.getElementsByTagName('body')[0];
+    let promises = [];
+
+    const array = new Array(26).fill(null);
+    array.forEach((_, i) => {
+        array.forEach((_, j) => {
+            const code = String.fromCharCode(97 + i) + String.fromCharCode(97 + j);
+            const canvas = document.createElement('canvas');
+            canvas.setAttribute('width', '14');
+            canvas.setAttribute('height', '13');
+            const ctx = canvas.getContext('2d');
+            const img = document.createElement('img');
+            const svg = getSvg(code, backgroundColor, fontColor);
+            const svgEncoded = 'data:image/svg+xml;base64,' + btoa(svg);
+            const promise = new Promise((resolve, reject) => {
+                img.onload = () => {
+                    ctx.drawImage(img, 0, 0);
+                    resolve({
+                        code,
+                        pngEncoded: canvas.toDataURL('image/png')
+                    })
+                    img.style.margin = '5px';
+                    body.appendChild(img);
+                }
+                img.setAttribute('src', svgEncoded);
+            });
+            promises = [...promises, promise];
+        });
+    });
+    return Promise.all(promises);
+}
+
+function getSvg(code, backgroundColor: string, fontColor: string) {
+    return `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 14 13" height="13" width="14"><rect width="14" height="13" rx="2" ry="2" style="fill: ${backgroundColor};"></rect><text font-family="Consolas" font-size="10.5px" fill="${fontColor}" x="1" y="10">${code}</text></svg>`;
+}

package.json

@@ -0,0 +1,44 @@
+{
+  "name": "vscode-jumpy",
+  "displayName": "vscode-jumpy",
+  "description": "",
+  "version": "0.0.1",
+  "publisher": "wmaurer",
+  "engines": {
+    "vscode": "^1.5.0"
+  },
+  "categories": [
+    "Other"
+  ],
+  "activationEvents": [
+    "onCommand:extension.sayHello"
+  ],
+  "main": "./out/src/extension",
+  "contributes": {
+    "commands": [
+      {
+        "command": "extension.sayHello",
+        "title": "Hello World"
+      }
+    ]
+  },
+  "scripts": {
+    "vscode:prepublish": "tsc -p ./",
+    "compile": "tsc -watch -p ./",
+    "postinstall": "node ./node_modules/vscode/bin/install",
+    "icon-generation:compile-web": "./node_modules/.bin/tsc ./icon-generation/web/index.ts --lib dom,es6",
+    "icon-generation:run-web": "./node_modules/.bin/http-server ./icon-generation/web",
+    "icon-generation:compile-convert": "./node_modules/.bin/tsc ./icon-generation/icons-to-file.ts --lib es2015",
+    "icon-generation:run-convert": "./node_modules/.bin/node ./icon-generation7/icons-to-file.js"
+  },
+  "devDependencies": {
+    "@types/bluebird": "^3.0.33",
+    "@types/mocha": "^2.2.32",
+    "@types/node": "^6.0.40",
+    "bluebird": "^3.4.6",
+    "http-server": "^0.9.0",
+    "mocha": "^2.3.3",
+    "typescript": "^2.0.3",
+    "vscode": "^1.0.0"
+  }
+}

src/extension.ts

@@ -0,0 +1,43 @@
+'use strict';
+// The module 'vscode' contains the VS Code extensibility API
+// Import the module and reference it with the alias vscode in your code below
+import * as vscode from 'vscode';
+
+// this method is called when your extension is activated
+// your extension is activated the very first time the command is executed
+export function activate(context: vscode.ExtensionContext) {
+
+    // Use the console to output diagnostic information (console.log) and errors (console.error)
+    // This line of code will only be executed once when your extension is activated
+    console.log('Congratulations, your extension "vscode-jumpy" is now active!');
+
+    // The command has been defined in the package.json file
+    // Now provide the implementation of the command with  registerCommand
+    // The commandId parameter must match the command field in package.json
+    let disposable = vscode.commands.registerCommand('extension.sayHello', () => {
+        const decorationType = vscode.window.createTextEditorDecorationType({});
+
+        const rofn = n => ({
+            dark: {
+                after: {
+                    margin: '3px 0 0 -14px',
+                    contentIconPath: `c:\\temp\\${n}.png`
+                }
+            }
+        });
+
+        const d1 = {
+            range: new vscode.Range(1, 11, 1, 13),
+            renderOptions: rofn('zq')
+        };
+
+        const activeEditor = vscode.window.activeTextEditor;
+        activeEditor.setDecorations(decorationType, [d1])
+    });
+
+    context.subscriptions.push(disposable);
+}
+
+// this method is called when your extension is deactivated
+export function deactivate() {
+}

test/extension.test.ts

@@ -0,0 +1,22 @@
+//
+// Note: This example test is leveraging the Mocha test framework.
+// Please refer to their documentation on https://mochajs.org/ for help.
+//
+
+// The module 'assert' provides assertion methods from node
+import * as assert from 'assert';
+
+// You can import and use all API from the 'vscode' module
+// as well as import your extension to test it
+import * as vscode from 'vscode';
+import * as myExtension from '../src/extension';
+
+// Defines a Mocha test suite to group tests of similar kind together
+suite("Extension Tests", () => {
+
+    // Defines a Mocha unit test
+    test("Something 1", () => {
+        assert.equal(-1, [1, 2, 3].indexOf(5));
+        assert.equal(-1, [1, 2, 3].indexOf(0));
+    });
+});

test/index.ts

@@ -0,0 +1,22 @@
+//
+// PLEASE DO NOT MODIFY / DELETE UNLESS YOU KNOW WHAT YOU ARE DOING
+//
+// This file is providing the test runner to use when running extension tests.
+// By default the test runner in use is Mocha based.
+//
+// You can provide your own test runner if you want to override it by exporting
+// a function run(testRoot: string, clb: (error:Error) => void) that the extension
+// host can call to run the tests. The test runner is expected to use console.log
+// to report the results back to the caller. When the tests are finished, return
+// a possible error to the callback or null if none.
+
+var testRunner = require('vscode/lib/testrunner');
+
+// You can directly control Mocha options by uncommenting the following lines
+// See https://github.com/mochajs/mocha/wiki/Using-mocha-programmatically#set-options for more info
+testRunner.configure({
+    ui: 'tdd', 		// the TDD UI is being used in extension.test.ts (suite, test, etc.)
+    useColors: true // colored output from test results
+});
+
+module.exports = testRunner;

tsconfig.json

@@ -0,0 +1,17 @@
+{
+    "compilerOptions": {
+        "module": "commonjs",
+        "target": "es6",
+        "outDir": "out",
+        "lib": [
+            "es6"
+        ],
+        "sourceMap": true,
+        "rootDir": "."
+    },
+    "exclude": [
+        "node_modules",
+        "icon-generation",
+        ".vscode-test"
+    ]
+}