├── .gitignore ├── .vscode └── launch.json ├── .vscodeignore ├── README.md ├── demo.gif ├── extension.js ├── icon.png ├── icon.psd ├── jsconfig.json ├── package.json ├── test ├── extension.test.js └── index.js ├── typings ├── node.d.ts └── vscode-typings.d.ts └── vsc-extension-quickstart.md /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules -------------------------------------------------------------------------------- /.vscode/launch.json: -------------------------------------------------------------------------------- 1 | // A launch configuration that compiles the extension and then opens it inside a new window 2 | { 3 | "version": "0.1.0", 4 | "configurations": [ 5 | { 6 | "name": "Launch Extension", 7 | "type": "extensionHost", 8 | "request": "launch", 9 | "runtimeExecutable": "${execPath}", 10 | "args": ["--extensionDevelopmentPath=${workspaceRoot}" ], 11 | "stopOnEntry": false 12 | }, 13 | { 14 | "name": "Launch Tests", 15 | "type": "extensionHost", 16 | "request": "launch", 17 | "runtimeExecutable": "${execPath}", 18 | "args": ["--extensionDevelopmentPath=${workspaceRoot}", "--extensionTestsPath=${workspaceRoot}/test" ], 19 | "stopOnEntry": false 20 | } 21 | ] 22 | } -------------------------------------------------------------------------------- /.vscodeignore: -------------------------------------------------------------------------------- 1 | .vscode/** 2 | typings/** 3 | test/** 4 | .gitignore 5 | jsconfig.json 6 | vsc-extension-quickstart.md 7 | *.gif 8 | *.psd -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Generates QR code and save as transparent GIF 2 | 3 | Generates QR code from text and saves as transparent GIF in Visual Studio Code. Works without Internet connectivity. 4 | 5 | ![Demostration of using this extension](https://raw.githubusercontent.com/compulim/vscode-qrcode/master/demo.gif) 6 | 7 | ## Usage 8 | 9 | * Select text you want to generate QR code from 10 | * If no text was selected, an input prompt will be presented 11 | * Press `F1` or `Ctrl+Shift+P` for Command Palette 12 | * Type or find "QR code: Generate QR code from text" 13 | 14 | ## Change log 15 | * 0.2.0 (2016-02-10): 16 | * Previews generated QR code inside Visual Studio Code 17 | * Customizable error correction level (L, M, Q, H) 18 | * Updated to use new API reference, technically `vscode^0.11.x`, to align with VS Code 0.10.8 (January 2016) 19 | 20 | ## Contributions 21 | Love this extension? [Star](https://github.com/compulim/vscode-qrcode/stargazers) us! 22 | 23 | Want to make this extension even more awesome? [Send us your wish](https://github.com/compulim/vscode-qrcode/issues/new/). 24 | 25 | Hate how it is working? [File an issue](https://github.com/compulim/vscode-qrcode/issues/new/) to us. 26 | -------------------------------------------------------------------------------- /demo.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/compulim/vscode-qrcode/1a9f683aab1ddb6deb06604244bb474c3b2886d6/demo.gif -------------------------------------------------------------------------------- /extension.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | // The module 'vscode' contains the VS Code extensibility API 4 | // Import the module and reference it with the alias vscode in your code below 5 | const 6 | fs = require('fs'), 7 | path = require('path'), 8 | Q = require('q'), 9 | QRCode = require('qrcode-generator'), 10 | vscode = require('vscode'), 11 | ERROR_CORRECTIONS = [{ 12 | label: 'L', 13 | description: 'Low error correction rate', 14 | detail: '7% of codewords can be restored' 15 | }, { 16 | label: 'M', 17 | description: 'Medium error correction rate', 18 | detail: '15% of codewords can be restored' 19 | }, { 20 | label: 'Q', 21 | description: 'Quartile error correction rate', 22 | detail: '25% of codewords can be restored' 23 | }, { 24 | label: 'H', 25 | description: 'High error correction rate', 26 | detail: '30% of codewords can be restored' 27 | }], 28 | FILENAME = 'qrcode.gif', 29 | MAX_VERSION = 40; 30 | 31 | // this method is called when your extension is activated 32 | // your extension is activated the very first time the command is executed 33 | function activate(context) { 34 | // Use the console to output diagnostic information (console.log) and errors (console.error) 35 | // This line of code will only be executed once when your extension is activated 36 | // console.log('Congratulations, your extension "compulim-qrcode" is now active!'); 37 | 38 | vscode.workspace.registerTextDocumentContentProvider('qrcode-image', { 39 | provideTextDocumentContent: uri => { 40 | const query = parseQueryString('?' + uri.query); 41 | 42 | return ` 43 |
44 |
45 | 46 |
47 |
48 | `; 49 | } 50 | }); 51 | 52 | // The command has been defined in the package.json file 53 | // Now provide the implementation of the command with registerCommand 54 | // The commandId parameter must match the command field in package.json 55 | var disposable = vscode.commands.registerCommand('qrcode.generateFromSelected', () => { 56 | // The code you place here will be executed every time your command is executed 57 | const filename = path.resolve(vscode.workspace.rootPath || '.', FILENAME); 58 | 59 | getSelectedTextOrPrompt('Text to convert into QR code') 60 | .then(text => { 61 | if (!text) { return; } 62 | 63 | vscode.window.showQuickPick(ERROR_CORRECTIONS) 64 | .then(level => { 65 | if (!level) { return; } 66 | 67 | exists(filename) 68 | .then(exists => { 69 | if (exists) { 70 | return vscode.window.showQuickPick(['Yes', 'No'], { 71 | placeHolder: `Do you want to overwrite "${filename}"?`, 72 | }); 73 | } else { 74 | return 'Yes'; 75 | } 76 | }) 77 | .then(answer => { 78 | if (answer === 'Yes') { 79 | const base64 = generateQRCodeAsBase64(text, level.label); 80 | 81 | return Q.nfcall( 82 | fs.writeFile, 83 | filename, 84 | new Buffer(base64, 'base64') 85 | ) 86 | .then(() => { 87 | vscode.commands.executeCommand('vscode.previewHtml', vscode.Uri.parse(`qrcode-image:qrcode.gif?base64=${encodeURIComponent(base64)}`)); 88 | // vscode.window.showInformationMessage(`QR code with message "${text}" has been generated to file "${filename}"`); 89 | }, err => { 90 | throw new Error(`Failed to generate QR code to file "${filename}" due to "${err.message}"`); 91 | }); 92 | } 93 | }) 94 | .catch(err => { 95 | vscode.window.showErrorMessage(err.message); 96 | }); 97 | }); 98 | }) 99 | }); 100 | 101 | context.subscriptions.push(disposable); 102 | } 103 | 104 | function getSelectedTextOrPrompt(prompt) { 105 | const activeTextEditor = vscode.window.activeTextEditor; 106 | 107 | if (activeTextEditor) { 108 | const 109 | selection = activeTextEditor.selection, 110 | start = selection.start, 111 | end = selection.end; 112 | 113 | if (start.line !== end.line || start.character !== end.character) { 114 | return Q(activeTextEditor.document.getText(selection)); 115 | } 116 | } 117 | 118 | return vscode.window.showInputBox({ prompt }); 119 | } 120 | 121 | function generateQRCodeAsBase64(text, level) { 122 | let qrcode; 123 | 124 | for (let version = 1; version <= MAX_VERSION; version++) { 125 | qrcode = QRCode(version, level); 126 | qrcode.addData(text); 127 | 128 | try { 129 | qrcode.make(); 130 | break; 131 | } catch (err) { 132 | qrcode = null; 133 | continue; 134 | } 135 | } 136 | 137 | if (!qrcode) { 138 | throw new Error('Failed to generate QR code, probably message is too large.'); 139 | } 140 | 141 | const imageTag = qrcode.createImgTag(); 142 | 143 | return (/base64,([^"]*)/.exec(imageTag) || [])[1]; 144 | } 145 | 146 | function exists(filename) { 147 | return new Promise((resolve, reject) => fs.exists(filename, exists => resolve(exists))); 148 | } 149 | 150 | function parseQueryString(search) { 151 | const 152 | pattern = /[#\?&]([^=]+)(?:=([^&]+))?/g, 153 | query = {}; 154 | 155 | let 156 | match, 157 | value; 158 | 159 | while ((match = pattern.exec(search))) { 160 | value = match[2]; 161 | query[decodeURIComponent(match[1])] = value && decodeURIComponent(value); 162 | } 163 | 164 | return query; 165 | } 166 | 167 | exports.activate = activate; 168 | 169 | // this method is called when your extension is deactivated 170 | function deactivate() { 171 | } 172 | 173 | exports.deactivate = deactivate; -------------------------------------------------------------------------------- /icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/compulim/vscode-qrcode/1a9f683aab1ddb6deb06604244bb474c3b2886d6/icon.png -------------------------------------------------------------------------------- /icon.psd: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/compulim/vscode-qrcode/1a9f683aab1ddb6deb06604244bb474c3b2886d6/icon.psd -------------------------------------------------------------------------------- /jsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "module": "commonjs", 4 | "target": "ES5", 5 | "noLib": true 6 | }, 7 | "exclude": [ 8 | "node_modules" 9 | ] 10 | } -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vscode-qrcode", 3 | "displayName": "QR Code Generator", 4 | "description": "Generates QR code and save as transparent GIF", 5 | "version": "0.2.0", 6 | "publisher": "Compulim", 7 | "engines": { 8 | "vscode": "^0.10.8" 9 | }, 10 | "icon": "icon.png", 11 | "galleryBanner.color": "#0D5CAB", 12 | "keywords": [ 13 | "qr", 14 | "qr code" 15 | ], 16 | "categories": [ 17 | "Other" 18 | ], 19 | "repository": { 20 | "type": "git", 21 | "url": "https://github.com/compulim/vscode-qrcode.git" 22 | }, 23 | "bugs": "https://github.com/compulim/vscode-qrcode/issues/", 24 | "homepage": "https://github.com/compulim/vscode-qrcode/blob/master/README.md", 25 | "activationEvents": [ 26 | "onCommand:qrcode.generateFromSelected" 27 | ], 28 | "main": "./extension", 29 | "contributes": { 30 | "commands": [ 31 | { 32 | "command": "qrcode.generateFromSelected", 33 | "title": "QR code: Generate QR code from text" 34 | } 35 | ] 36 | }, 37 | "devDependencies": { 38 | "vscode": "^0.11.x" 39 | }, 40 | "dependencies": { 41 | "q": "^1.4.1", 42 | "qrcode-generator": "^1.0.0" 43 | } 44 | } 45 | -------------------------------------------------------------------------------- /test/extension.test.js: -------------------------------------------------------------------------------- 1 | /* global suite, test */ 2 | 3 | // 4 | // Note: This example test is leveraging the Mocha test framework. 5 | // Please refer to their documentation on https://mochajs.org/ for help. 6 | // 7 | 8 | // The module 'assert' provides assertion methods from node 9 | var assert = require('assert'); 10 | 11 | // You can import and use all API from the 'vscode' module 12 | // as well as import your extension to test it 13 | var vscode = require('vscode'); 14 | var myExtension = require('../extension'); 15 | 16 | // Defines a Mocha test suite to group tests of similar kind together 17 | suite("Extension Tests", function() { 18 | 19 | // Defines a Mocha unit test 20 | test("Something 1", function() { 21 | assert.equal(-1, [1, 2, 3].indexOf(5)); 22 | assert.equal(-1, [1, 2, 3].indexOf(0)); 23 | }); 24 | }); -------------------------------------------------------------------------------- /test/index.js: -------------------------------------------------------------------------------- 1 | // 2 | // PLEASE DO NOT MODIFY / DELETE UNLESS YOU KNOW WHAT YOU ARE DOING 3 | // 4 | // This file is providing the test runner to use when running extension tests. 5 | // By default the test runner in use is Mocha based. 6 | // 7 | // You can provide your own test runner if you want to override it by exporting 8 | // a function run(testRoot: string, clb: (error:Error) => void) that the extension 9 | // host can call to run the tests. The test runner is expected to use console.log 10 | // to report the results back to the caller. When the tests are finished, return 11 | // a possible error to the callback or null if none. 12 | 13 | var testRunner = require('vscode/lib/testrunner'); 14 | 15 | // You can directly control Mocha options by uncommenting the following lines 16 | // See https://github.com/mochajs/mocha/wiki/Using-mocha-programmatically#set-options for more info 17 | testRunner.configure({ 18 | ui: 'tdd', // the TDD UI is being used in extension.test.js (suite, test, etc.) 19 | useColors: true // colored output from test results 20 | }); 21 | 22 | module.exports = testRunner; -------------------------------------------------------------------------------- /typings/node.d.ts: -------------------------------------------------------------------------------- 1 | /// -------------------------------------------------------------------------------- /typings/vscode-typings.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | -------------------------------------------------------------------------------- /vsc-extension-quickstart.md: -------------------------------------------------------------------------------- 1 | # Welcome to your first VS Code Extension 2 | 3 | ## What's in the folder 4 | * This folder contains all of the files necessary for your extension 5 | * `package.json` - this is the manifest file in which you declare your extension and command. 6 | The sample plugin registers a command and defines its title and command name. With this information 7 | VS Code can show the command in the command palette. It doesn’t yet need to load the plugin. 8 | * `extension.js` - this is the main file where you will provide the implementation of your command. 9 | The file exports one function, `activate`, which is called the very first time your extension is 10 | activated (in this case by executing the command). Inside the `activate` function we call `registerCommand`. 11 | We pass the function containing the implementation of the command as the second parameter to 12 | `registerCommand`. 13 | 14 | ## Get up and running straight away 15 | * press `F5` to open a new window with your extension loaded 16 | * run your command from the command palette by pressing (`Ctrl+Shift+P` or `Cmd+Shift+P` on Mac) and typing `Hello World` 17 | * set breakpoints in your code inside extension.ts to debug your extension 18 | * find output from your extension in the debug console 19 | 20 | ## Make changes 21 | * you can relaunch the extension from the debug toolbar after changing code in `extension.js` 22 | * you can also reload (`Ctrl+R` or `Cmd+R` on Mac) the VS Code window with your extension to load your changes 23 | 24 | ## Explore the API 25 | * you can open the full set of our API when you open the file `node_modules/vscode/vscode.d.ts` 26 | 27 | ## Run tests 28 | * open the debug viewlet (`Ctrl+Shift+D` or `Cmd+Shift+D` on Mac) and from the launch configuration dropdown pick `Launch Tests` 29 | * press `F5` to run the tests in a new window with your extension loaded 30 | * see the output of the test result in the debug console 31 | * make changes to `test/extension.test.js` or create new test files inside the `test` folder 32 | * by convention, the test runner will only consider files matching the name pattern `**.test.js` 33 | * you can create folders inside the `test` folder to structure your tests any way you want --------------------------------------------------------------------------------