├── .gitignore
├── demo.gif
├── .DS_Store
├── assets
└── icon.png
├── sketch-assets
└── icons.sketch
├── preview-in-browser.sketchplugin
└── Contents
│ ├── Resources
│ └── icon.png
│ └── Sketch
│ ├── manifest.json
│ ├── __my-command.js
│ └── __my-command.js.map
├── .appcast.xml
├── src
├── manifest.json
└── my-command.js
├── package.json
└── README.md
/.gitignore:
--------------------------------------------------------------------------------
1 | node_modules
--------------------------------------------------------------------------------
/demo.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/gaddafirusli/Preview-in-browser/HEAD/demo.gif
--------------------------------------------------------------------------------
/.DS_Store:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/gaddafirusli/Preview-in-browser/HEAD/.DS_Store
--------------------------------------------------------------------------------
/assets/icon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/gaddafirusli/Preview-in-browser/HEAD/assets/icon.png
--------------------------------------------------------------------------------
/sketch-assets/icons.sketch:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/gaddafirusli/Preview-in-browser/HEAD/sketch-assets/icons.sketch
--------------------------------------------------------------------------------
/preview-in-browser.sketchplugin/Contents/Resources/icon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/gaddafirusli/Preview-in-browser/HEAD/preview-in-browser.sketchplugin/Contents/Resources/icon.png
--------------------------------------------------------------------------------
/.appcast.xml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | -
5 |
6 |
7 |
8 |
--------------------------------------------------------------------------------
/src/manifest.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "https://raw.githubusercontent.com/BohemianCoding/SketchAPI/develop/docs/sketch-plugin-manifest-schema.json",
3 | "icon": "icon.png",
4 | "commands": [
5 | {
6 | "name": "Preview in browser",
7 | "identifier": "preview-in-browser.my-command-identifier",
8 | "script": "./my-command.js",
9 | "shortcut": "cmd shift ."
10 | }
11 | ],
12 | "menu": {
13 | "title": "Preview in browser",
14 | "isRoot": true,
15 | "items": ["preview-in-browser.my-command-identifier"]
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "preview-in-browser",
3 | "description": "Properly view your design in browser",
4 | "version": "1.1.1",
5 | "engines": {
6 | "sketch": ">=49.0"
7 | },
8 | "skpm": {
9 | "name": "Preview in browser",
10 | "manifest": "src/manifest.json",
11 | "main": "preview-in-browser.sketchplugin",
12 | "assets": [
13 | "assets/**/*"
14 | ],
15 | "sketch-assets-file": "sketch-assets/icons.sketch"
16 | },
17 | "scripts": {
18 | "build": "skpm-build",
19 | "watch": "skpm-build --watch",
20 | "start": "skpm-build --watch --run",
21 | "postinstall": "npm run build && skpm-link"
22 | },
23 | "devDependencies": {
24 | "@skpm/builder": "^0.7.0"
25 | },
26 | "author": "gaddafirusli ",
27 | "homepage": "https://github.com/gaddafirusli/Preview-in-browser",
28 | "repository": {
29 | "type": "git",
30 | "url": "https://github.com/gaddafirusli/Preview-in-browser"
31 | }
32 | }
33 |
--------------------------------------------------------------------------------
/preview-in-browser.sketchplugin/Contents/Sketch/manifest.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "https://raw.githubusercontent.com/BohemianCoding/SketchAPI/develop/docs/sketch-plugin-manifest-schema.json",
3 | "icon": "icon.png",
4 | "commands": [
5 | {
6 | "name": "Preview in browser",
7 | "identifier": "preview-in-browser.my-command-identifier",
8 | "script": "__my-command.js",
9 | "shortcut": "cmd shift ."
10 | }
11 | ],
12 | "menu": {
13 | "title": "Preview in browser",
14 | "isRoot": true,
15 | "items": [
16 | "preview-in-browser.my-command-identifier"
17 | ]
18 | },
19 | "version": "1.1.1",
20 | "description": "Properly view your design in browser",
21 | "homepage": "https://github.com/gaddafirusli/Preview-in-browser",
22 | "name": "Preview in browser",
23 | "identifier": "Preview in browser",
24 | "disableCocoaScriptPreprocessor": true,
25 | "appcast": "https://raw.githubusercontent.com/gaddafirusli/Preview-in-browser/master/.appcast.xml",
26 | "author": "gaddafirusli",
27 | "authorEmail": "gaddafirusli@gmail.com"
28 | }
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Preview in browser
2 | A Sketch.app plugin to properly view your design in browser.
3 |
4 | 
5 |
6 | ### What does this plugin do?
7 |
8 | 1. View your artboard in browser, with proper scrolling - unlike Sketch Mirror's web preview feature.
9 |
10 | 2. Your design will be aligned to the center of the browser. The background color on the empty spaces will be the same as the background color of your artboard
11 |
12 | 3. Your artboard will be automatically scaled up to @2x for better preview on retina displays. (Provided that you design in @1x 😬)
13 |
14 | ### How to use this plugin?
15 | 1. [Download the plugin](https://github.com/gaddafirusli/Preview-in-browser/archive/master.zip)
16 | 2. Double-click on the "```Preview in Browser.sketchplugin```"
17 | 3. Click on the artboard you'd like to view in browser
18 | 4. Use the keyboard shortcut ```Cmd+Shift+.``` to open it in the browser (You'll have to do this on every changes as this is not a live preview of your artboard)
19 | 5. ¯\\\_(ツ)\_/¯
20 |
21 | ### Credits
22 | Thanks to Lastroom's [Sketch Command](https://github.com/lastroom/sketch-commands) for providing the base code for the preview method. All I did was to improve the code, clean up the HTML markup output, and add a method to scale the artboard to @2x - for better preview on retina displays.
23 |
24 | ### Contact
25 | Have any suggestions or feedbacks? Hit me up on Twitter [@gaddafirusli](http://www.twitter.com/gaddafirusli)
26 |
--------------------------------------------------------------------------------
/src/my-command.js:
--------------------------------------------------------------------------------
1 | export default function(context) {
2 | var doc = context.document;
3 | var selections = context.selection;
4 | var artboard;
5 |
6 | if (selections.count() == 0) {
7 | doc.showMessage("Please select at least one artboard.");
8 | return;
9 | }
10 |
11 | for (var i = 0; i < selections.count(); i++) {
12 | if (selections[i].class() == "MSArtboardGroup") {
13 | artboard = selections[i];
14 | } else {
15 | artboard = doc.currentPage().currentArtboard();
16 | }
17 | var artboardname = artboard.name();
18 | artboardname = artboardname.replace(/['|'|/|#|.|\\|"|"]/g, "");
19 | var filename = NSTemporaryDirectory() + artboardname + ".png";
20 | doc.saveArtboardOrSlice_toFile(scaleArtboard(artboard), filename);
21 | var htmlContent = NSString.stringWithString_(
22 | "![](./" +
29 | artboardname +
30 | ".png)
"
31 | );
32 | var filepath = NSTemporaryDirectory() + artboardname + ".html";
33 | htmlContent
34 | .dataUsingEncoding_(NSUTF8StringEncoding)
35 | .writeToFile_atomically_(filepath, true);
36 | var file = NSURL.fileURLWithPath(filepath);
37 | NSWorkspace.sharedWorkspace().openFile(file.path());
38 | }
39 |
40 | function scaleArtboard(layer) {
41 | var rect = layer.absoluteInfluenceRect();
42 | var request = MSExportRequest.new();
43 | request.rect = rect;
44 | request.scale = 2;
45 | return request;
46 | }
47 |
48 | function colorToRGBA(color) {
49 | var rgbaValue =
50 | "rgba(" +
51 | (color.red() * 255).toFixed(0) +
52 | "," +
53 | (color.green() * 255).toFixed(0) +
54 | "," +
55 | (color.blue() * 255).toFixed(0) +
56 | "," +
57 | color.alpha().toFixed(2) +
58 | ")";
59 | return rgbaValue;
60 | }
61 | }
62 |
--------------------------------------------------------------------------------
/preview-in-browser.sketchplugin/Contents/Sketch/__my-command.js:
--------------------------------------------------------------------------------
1 | var globalThis = this;
2 | var global = this;
3 | function __skpm_run (key, context) {
4 | globalThis.context = context;
5 | try {
6 |
7 | var exports =
8 | /******/ (function(modules) { // webpackBootstrap
9 | /******/ // The module cache
10 | /******/ var installedModules = {};
11 | /******/
12 | /******/ // The require function
13 | /******/ function __webpack_require__(moduleId) {
14 | /******/
15 | /******/ // Check if module is in cache
16 | /******/ if(installedModules[moduleId]) {
17 | /******/ return installedModules[moduleId].exports;
18 | /******/ }
19 | /******/ // Create a new module (and put it into the cache)
20 | /******/ var module = installedModules[moduleId] = {
21 | /******/ i: moduleId,
22 | /******/ l: false,
23 | /******/ exports: {}
24 | /******/ };
25 | /******/
26 | /******/ // Execute the module function
27 | /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
28 | /******/
29 | /******/ // Flag the module as loaded
30 | /******/ module.l = true;
31 | /******/
32 | /******/ // Return the exports of the module
33 | /******/ return module.exports;
34 | /******/ }
35 | /******/
36 | /******/
37 | /******/ // expose the modules object (__webpack_modules__)
38 | /******/ __webpack_require__.m = modules;
39 | /******/
40 | /******/ // expose the module cache
41 | /******/ __webpack_require__.c = installedModules;
42 | /******/
43 | /******/ // define getter function for harmony exports
44 | /******/ __webpack_require__.d = function(exports, name, getter) {
45 | /******/ if(!__webpack_require__.o(exports, name)) {
46 | /******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
47 | /******/ }
48 | /******/ };
49 | /******/
50 | /******/ // define __esModule on exports
51 | /******/ __webpack_require__.r = function(exports) {
52 | /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
53 | /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
54 | /******/ }
55 | /******/ Object.defineProperty(exports, '__esModule', { value: true });
56 | /******/ };
57 | /******/
58 | /******/ // create a fake namespace object
59 | /******/ // mode & 1: value is a module id, require it
60 | /******/ // mode & 2: merge all properties of value into the ns
61 | /******/ // mode & 4: return value when already ns object
62 | /******/ // mode & 8|1: behave like require
63 | /******/ __webpack_require__.t = function(value, mode) {
64 | /******/ if(mode & 1) value = __webpack_require__(value);
65 | /******/ if(mode & 8) return value;
66 | /******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
67 | /******/ var ns = Object.create(null);
68 | /******/ __webpack_require__.r(ns);
69 | /******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
70 | /******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
71 | /******/ return ns;
72 | /******/ };
73 | /******/
74 | /******/ // getDefaultExport function for compatibility with non-harmony modules
75 | /******/ __webpack_require__.n = function(module) {
76 | /******/ var getter = module && module.__esModule ?
77 | /******/ function getDefault() { return module['default']; } :
78 | /******/ function getModuleExports() { return module; };
79 | /******/ __webpack_require__.d(getter, 'a', getter);
80 | /******/ return getter;
81 | /******/ };
82 | /******/
83 | /******/ // Object.prototype.hasOwnProperty.call
84 | /******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
85 | /******/
86 | /******/ // __webpack_public_path__
87 | /******/ __webpack_require__.p = "";
88 | /******/
89 | /******/
90 | /******/ // Load entry module and return exports
91 | /******/ return __webpack_require__(__webpack_require__.s = "./src/my-command.js");
92 | /******/ })
93 | /************************************************************************/
94 | /******/ ({
95 |
96 | /***/ "./src/my-command.js":
97 | /*!***************************!*\
98 | !*** ./src/my-command.js ***!
99 | \***************************/
100 | /*! exports provided: default */
101 | /***/ (function(module, __webpack_exports__, __webpack_require__) {
102 |
103 | "use strict";
104 | __webpack_require__.r(__webpack_exports__);
105 | /* harmony default export */ __webpack_exports__["default"] = (function (context) {
106 | var doc = context.document;
107 | var selections = context.selection;
108 | var artboard;
109 |
110 | if (selections.count() == 0) {
111 | doc.showMessage("Please select at least one artboard.");
112 | return;
113 | }
114 |
115 | for (var i = 0; i < selections.count(); i++) {
116 | if (selections[i].class() == "MSArtboardGroup") {
117 | artboard = selections[i];
118 | } else {
119 | artboard = doc.currentPage().currentArtboard();
120 | }
121 |
122 | var artboardname = artboard.name();
123 | artboardname = artboardname.replace(/['|'|/|#|.|\\|"|"]/g, "");
124 | var filename = NSTemporaryDirectory() + artboardname + ".png";
125 | doc.saveArtboardOrSlice_toFile(scaleArtboard(artboard), filename);
126 | var htmlContent = NSString.stringWithString_("![](./" + artboardname + ".png)
");
127 | var filepath = NSTemporaryDirectory() + artboardname + ".html";
128 | htmlContent.dataUsingEncoding_(NSUTF8StringEncoding).writeToFile_atomically_(filepath, true);
129 | var file = NSURL.fileURLWithPath(filepath);
130 | NSWorkspace.sharedWorkspace().openFile(file.path());
131 | }
132 |
133 | function scaleArtboard(layer) {
134 | var rect = layer.absoluteInfluenceRect();
135 | var request = MSExportRequest.new();
136 | request.rect = rect;
137 | request.scale = 2;
138 | return request;
139 | }
140 |
141 | function colorToRGBA(color) {
142 | var rgbaValue = "rgba(" + (color.red() * 255).toFixed(0) + "," + (color.green() * 255).toFixed(0) + "," + (color.blue() * 255).toFixed(0) + "," + color.alpha().toFixed(2) + ")";
143 | return rgbaValue;
144 | }
145 | });
146 |
147 | /***/ })
148 |
149 | /******/ });
150 | if (key === 'default' && typeof exports === 'function') {
151 | exports(context);
152 | } else if (typeof exports[key] !== 'function') {
153 | throw new Error('Missing export named "' + key + '". Your command should contain something like `export function " + key +"() {}`.');
154 | } else {
155 | exports[key](context);
156 | }
157 | } catch (err) {
158 | if (typeof process !== 'undefined' && process.listenerCount && process.listenerCount('uncaughtException')) {
159 | process.emit("uncaughtException", err, "uncaughtException");
160 | } else {
161 | throw err
162 | }
163 | }
164 | }
165 | globalThis['onRun'] = __skpm_run.bind(this, 'default')
166 |
167 | //# sourceMappingURL=__my-command.js.map
--------------------------------------------------------------------------------
/preview-in-browser.sketchplugin/Contents/Sketch/__my-command.js.map:
--------------------------------------------------------------------------------
1 | {"version":3,"sources":["webpack://exports/webpack/bootstrap","webpack://exports/./src/my-command.js"],"names":["context","doc","document","selections","selection","artboard","count","showMessage","i","class","currentPage","currentArtboard","artboardname","name","replace","filename","NSTemporaryDirectory","saveArtboardOrSlice_toFile","scaleArtboard","htmlContent","NSString","stringWithString_","colorToRGBA","backgroundColor","frame","width","filepath","dataUsingEncoding_","NSUTF8StringEncoding","writeToFile_atomically_","file","NSURL","fileURLWithPath","NSWorkspace","sharedWorkspace","openFile","path","layer","rect","absoluteInfluenceRect","request","MSExportRequest","new","scale","color","rgbaValue","red","toFixed","green","blue","alpha"],"mappings":"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","file":"__my-command.js","sourcesContent":[" \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, { enumerable: true, get: getter });\n \t\t}\n \t};\n\n \t// define __esModule on exports\n \t__webpack_require__.r = function(exports) {\n \t\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n \t\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n \t\t}\n \t\tObject.defineProperty(exports, '__esModule', { value: true });\n \t};\n\n \t// create a fake namespace object\n \t// mode & 1: value is a module id, require it\n \t// mode & 2: merge all properties of value into the ns\n \t// mode & 4: return value when already ns object\n \t// mode & 8|1: behave like require\n \t__webpack_require__.t = function(value, mode) {\n \t\tif(mode & 1) value = __webpack_require__(value);\n \t\tif(mode & 8) return value;\n \t\tif((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;\n \t\tvar ns = Object.create(null);\n \t\t__webpack_require__.r(ns);\n \t\tObject.defineProperty(ns, 'default', { enumerable: true, value: value });\n \t\tif(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));\n \t\treturn ns;\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = \"./src/my-command.js\");\n","export default function(context) {\n var doc = context.document;\n var selections = context.selection;\n var artboard;\n\n if (selections.count() == 0) {\n doc.showMessage(\"Please select at least one artboard.\");\n return;\n }\n\n for (var i = 0; i < selections.count(); i++) {\n if (selections[i].class() == \"MSArtboardGroup\") {\n artboard = selections[i];\n } else {\n artboard = doc.currentPage().currentArtboard();\n }\n var artboardname = artboard.name();\n artboardname = artboardname.replace(/['|'|/|#|.|\\\\|\"|\"]/g, \"\");\n var filename = NSTemporaryDirectory() + artboardname + \".png\";\n doc.saveArtboardOrSlice_toFile(scaleArtboard(artboard), filename);\n var htmlContent = NSString.stringWithString_(\n \"![](./\" +\n artboardname +\n \".png)
\"\n );\n var filepath = NSTemporaryDirectory() + artboardname + \".html\";\n htmlContent\n .dataUsingEncoding_(NSUTF8StringEncoding)\n .writeToFile_atomically_(filepath, true);\n var file = NSURL.fileURLWithPath(filepath);\n NSWorkspace.sharedWorkspace().openFile(file.path());\n }\n\n function scaleArtboard(layer) {\n var rect = layer.absoluteInfluenceRect();\n var request = MSExportRequest.new();\n request.rect = rect;\n request.scale = 2;\n return request;\n }\n\n function colorToRGBA(color) {\n var rgbaValue =\n \"rgba(\" +\n (color.red() * 255).toFixed(0) +\n \",\" +\n (color.green() * 255).toFixed(0) +\n \",\" +\n (color.blue() * 255).toFixed(0) +\n \",\" +\n color.alpha().toFixed(2) +\n \")\";\n return rgbaValue;\n }\n}\n"],"sourceRoot":""}
--------------------------------------------------------------------------------