diff --git a/README.md b/README.md index fe67197..3cdaacd 100644 --- a/README.md +++ b/README.md @@ -1,52 +1,30 @@

-

Polacode — Polaroid for your code 📸

+

Polacode - 44886 — 基于polacode的一款vscode截图工具 📸

- -![usage](./demo/usage.gif) + +![usage](https://github.com/octref/polacode/raw/master/demo/usage.gif) -## Why? +## 为什么要修改原版？ -You have spent countless hours finding the perfect [JavaScript grammar](https://marketplace.visualstudio.com/search?term=javascript%20grammar&target=VSCode&category=All%20categories&sortBy=Relevance), matching it with a [sleek-looking VS Code theme](https://marketplace.visualstudio.com/search?target=VSCode&category=Themes&sortBy=Downloads), trying out all the [best programming fonts](https://www.slant.co/topics/67/~best-programming-fonts). +因为，原版功能太少了！ -You take three days porting over [your theme](https://github.com/wesbos/cobalt2-vscode) before starting to use VS Code. -You shell out $200 for [italic cursive html attributes](https://www.typography.com/blog/introducing-operator). +## 改了些什么？ -The code has to look right. +- 原版布局全是用的flex，我不知道这是为何，想要拓展真的很不方便，我把外层全部改为了普通的布局 +- 原版没有苹果装逼的左上角三点，这怎么能行？我加了苹果左上角控制三点 +- 原版如果你是用remote开发，那么这个插件就只能运行在ssh，但那样生成的截图就不能保存在本地，这是什么玩意？我在我电脑上截图，结果截的图放在服务器上？我怎么用？ -## Tips +## 怎么用？ +- 按下你键盘的F1，然后搜索 44886 ，就能看到 `polacode - 44886` ，嗯，点击它！ +- 这时，会出来一个新窗口在右边 +- 在左边用鼠标框选你想截图的代码，右边就自动复制过去啦！ +- 你现在可以用电脑自带的截图来截右边的代码，也可以点下方的照相按钮来生成图片。 -- Resize the snippet / container by dragging the lowerright corner -- Use `polacode.target`, `polacode.shadow`, `polacode.transparentBackground` and `polacode.backgroundColor` to control image appearance +## 下一步要改什么？ +- 要增加代码的行号 +- 还没相好…… -## Demo - -[Nord](https://github.com/arcticicestudio/nord-visual-studio-code) + [Input Mono](http://input.fontbureau.com) - -![demo1](https://raw.githubusercontent.com/octref/polacode/master/demo/1.png) - -[Monokai Pro](https://marketplace.visualstudio.com/items?itemName=monokai.theme-monokai-pro-vscode) + [Operator Mono](https://www.typography.com/blog/introducing-operator) - -![demo2](https://raw.githubusercontent.com/octref/polacode/master/demo/2.png) - -[Material Theme Palenight](https://marketplace.visualstudio.com/items?itemName=Equinusocio.vsc-material-theme) + [Fira Code](https://github.com/tonsky/FiraCode) - -![demo3](https://raw.githubusercontent.com/octref/polacode/master/demo/3.png) - -## Credit - -Thanks to [@tsayen](https://github.com/tsayen) for making [dom-to-image](https://github.com/tsayen/dom-to-image), which Polacode is using for generating the images. - -Thanks to [Dawn Labs](https://dawnlabs.io) for making [Carbon](https://carbon.now.sh) that inspired Polacode. - -Many color are taken from the elegant [Nord](https://github.com/arcticicestudio/nord) theme by [@arcticicestudio](https://github.com/arcticicestudio). - -Download button animation is made with [Vivus](https://github.com/maxwellito/vivus). - -## Contribution - -Contribution is not very welcome. -Please open an issue first so I can stop you from complicating the UX. ## License diff --git a/demo/1.png b/demo/1.png deleted file mode 100644 index 7f66f7a..0000000 Binary files a/demo/1.png and /dev/null differ diff --git a/demo/2.png b/demo/2.png deleted file mode 100644 index 149b97b..0000000 Binary files a/demo/2.png and /dev/null differ diff --git a/demo/3.png b/demo/3.png deleted file mode 100644 index cd23429..0000000 Binary files a/demo/3.png and /dev/null differ diff --git a/demo/usage.gif b/demo/usage.gif deleted file mode 100644 index 5b35a99..0000000 Binary files a/demo/usage.gif and /dev/null differ diff --git a/package.json b/package.json index c03366f..5d2dc14 100644 --- a/package.json +++ b/package.json @@ -1,19 +1,20 @@ { - "name": "polacode", - "displayName": "Polacode", - "description": "📸 Polaroid for your code", - "version": "0.3.2", + "name": "polacode-44886", + "displayName": "Polacode-44886", + "description": "📸 Polaroid for your code. edit by 44886.(给你的代码一个美美的截图，基于polacode而生)", + "version": "1.0.2", "repository": { "type": "git", - "url": "https://github.com/octref/polacode.git" + "url": "https://github.com/44886/polacode.git" }, - "publisher": "pnp", + "publisher": "44886", "keywords": [ "polacode", "polaroid", "screenshot", "snippet", - "share" + "share", + "44886" ], "galleryBanner": { "color": "#fbfbfb", @@ -35,7 +36,7 @@ "commands": [ { "command": "polacode.activate", - "title": "Polacode 📸" + "title": "Polacode📸-44886" } ], "configuration": { @@ -48,14 +49,14 @@ }, "polacode.transparentBackground": { "type": "boolean", - "description": "Transparent background for containers", + "description": "背景色透明吗？", "default": false }, "polacode.backgroundColor": { "type": "string", - "description": "Background color of snippet container. Use any value for CSS `background-color`", + "description": "背景颜色 `background-color`", "format": "color-hex", - "default": "#f2f2f2" + "default": "#fff" }, "polacode.target": { "type": "string", diff --git a/webview/._index.html b/webview/._index.html new file mode 100644 index 0000000..6203ec3 Binary files /dev/null and b/webview/._index.html differ diff --git a/webview/index.html b/webview/index.html index 65df1a8..d2cc62b 100644 --- a/webview/index.html +++ b/webview/index.html @@ -1,44 +1,44 @@ + - + + +
+ 控制按钮 + 阴影 + 背景色 + + +
+
-
console.log('0. Run command `Polacode 📸 `')
console.log('1. Copy some code')
console.log('2. Paste into Polacode view')
console.log('3. Click the button 📸 ')
+
+
+ + + + + + + +
+
+ +
+

两种方式：

+

1.点击本窗口，按Ctrl+V粘贴代码即可。

+

2.如果左边打开了代码窗口，在左边拖选代码，本窗口自动同步过来。

+
+
+
+ +
- - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + +
@@ -100,4 +145,5 @@ + \ No newline at end of file diff --git a/webview/index.js b/webview/index.js index 1b4ae9e..027eb89 100644 --- a/webview/index.js +++ b/webview/index.js @@ -1,4 +1,4 @@ -;(function() { +; (function () { const vscode = acquireVsCodeApi() let target = 'container' @@ -12,6 +12,7 @@ const snippetNode = document.getElementById('snippet') const snippetContainerNode = document.getElementById('snippet-container') const obturateur = document.getElementById('save') + const contrl = `
11
22
` snippetContainerNode.style.opacity = '1' const oldState = vscode.getState(); @@ -22,7 +23,7 @@ const getInitialHtml = fontFamily => { const cameraWithFlashEmoji = String.fromCodePoint(128248) const monoFontStack = `${fontFamily},SFMono-Regular,Consolas,DejaVu Sans Mono,Ubuntu Mono,Liberation Mono,Menlo,Courier,monospace` - return `
console.log('0. Run command \`Polacode ${cameraWithFlashEmoji}\`')
console.log('1. Copy some code')
console.log('2. Paste into Polacode view')
console.log('3. Click the button ${cameraWithFlashEmoji}')
` + return `

两种方式：

1.点击本窗口，按Ctrl+V粘贴代码即可。

2.如果左边打开了代码窗口，在左边拖选代码，本窗口自动同步过来。

` } const serializeBlob = (blob, cb) => { @@ -129,13 +130,14 @@ obturateur.addEventListener('click', () => { if (target === 'container') { - shootAll() + shootAll() } else { shootSnippet() } }) function shootAll() { + console.log(snippetContainerNode.offsetWidth); const width = snippetContainerNode.offsetWidth * 2 const height = snippetContainerNode.offsetHeight * 2 const config = { @@ -143,7 +145,7 @@ height, style: { transform: 'scale(2)', - 'transform-origin': 'center', + 'transform-origin': '0% 0%', background: getRgba(backgroundColor, transparentBackground) } } @@ -259,4 +261,12 @@ function getRgba(hex, transparentBackground) { const b = bigint & 255; const a = transparentBackground ? 0 : 1 return `rgba(${r}, ${g}, ${b}, ${a})` +} + +function change(dom,key){ + console.log(dom); + + if(key=="control"){ + document.getElementById("control").style.display="none"; + } } \ No newline at end of file