Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Task improve usability #6

Open
wants to merge 5 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
161 changes: 90 additions & 71 deletions extension.js
Original file line number Diff line number Diff line change
@@ -1,25 +1,27 @@
const fs = require('fs');
const path = require('path');
const fs = require("fs");
const path = require("path");

const open = require("open");
const vscode = require("vscode");

const filetypes = JSON.parse(fs.readFileSync(path.resolve(__dirname, "filetypes.json"), "utf-8"));
const filetypes = JSON.parse(
fs.readFileSync(path.resolve(__dirname, "filetypes.json"), "utf-8")
);

/**
* Generates modified Base64 Encoded String
* @param {String} str - The string to be encoded.
* @returns {String} Base64 Encoded String
*/
const generateEncodedCode = str => Buffer.from(str).toString("base64");
const generateEncodedCode = (str) => Buffer.from(str).toString("base64");

/**
* Generate a URL from using the script-commands
* by Raycast as a reference.
* @param {Object} [options]
Query parameters to be used to
construct the completed request.
* @param {('candy'|'breeze'|'midnight'|'sunset')} [options.colors]
* @param {('breeze'|'candy'|'crimson'|'falcon'|'meadow'|'midnight'|'raindrop'|'sunset')} [options.theme]
The color scheme you want the
uploaded code to have.
* @param {(
Expand Down Expand Up @@ -50,85 +52,102 @@ const generateEncodedCode = str => Buffer.from(str).toString("base64");
The snippet of code.
* @returns {String} Returns the URL of the snippet.
*/
const generateRayUrl = (
code,
options = {}
) => {
const objParams = {...options, code: generateEncodedCode(code), language: getLanguageName()},
parameters = Object.keys(objParams).map(key =>
`${key}=${encodeURIComponent(objParams[key])}`
).join("&");

return "https://ray.so/#" + parameters;
}
const generateRayUrl = (code, options = {}) => {
const objParams = {
...options,
code: generateEncodedCode(code),
language: getLanguageName(),
},
parameters = Object.keys(objParams)
.map((key) => `${key}=${encodeURIComponent(objParams[key])}`)
.join("&");

return "https://ray.so/#" + parameters;
};

function correctIndentation(text) {
const lines = text.split("\n");
const indents = lines.filter(Boolean).map(line => {
return (line.split(/[^\t\s]/)[0] || "").length;
});
const minimumLength = Math.min(...indents);
return lines.map(x => x.slice(minimumLength)).join("\n").trim();
const lines = text.split("\n");
const indents = lines.filter(Boolean).map((line) => {
return (line.split(/[^\t\s]/)[0] || "").length;
});
const minimumLength = Math.min(...indents);
return lines
.map((x) => x.slice(minimumLength))
.join("\n")
.trim();
}

function getLanguageName() {
const tabFilePath = vscode.window.activeTextEditor.document.fileName;
const segments = tabFilePath.split(".");
if (!segments.length) return;
const extension = segments[segments.length - 1].toLowerCase();
const [language] = filetypes.filter(({ extensions }) => extensions.includes(extension));
return language ? language.value : "auto";
const tabFilePath = vscode.window.activeTextEditor.document.fileName;
const segments = tabFilePath.split(".");
if (!segments.length) return;
const extension = segments[segments.length - 1].toLowerCase();
const [language] = filetypes.filter(({ extensions }) =>
extensions.includes(extension)
);
return language ? language.value : "auto";
}

function activate(context) {

const publishSelectedSnippet = vscode.commands.registerCommand("ray-this.publishSelectedSnippet", () => {
const {
activeTextEditor,
showErrorMessage,
showInformationMessage
} = vscode.window;

// * If there is no active text editor,
// * return an error message.
if (!activeTextEditor)
return showErrorMessage(
`You need to have an open editor to upload a code snippet to Ray.so.
const publishSelectedSnippet = vscode.commands.registerCommand(
"ray-this.publishSelectedSnippet",
() => {
const {
activeTextEditor,
showErrorMessage,
showInformationMessage,
} = vscode.window;

// * If there is no active text editor,
// * return an error message.
if (!activeTextEditor)
return showErrorMessage(
`You need to have an open editor to upload a code snippet to Ray.so.
Please select a file and make a text selection to upload a snippet.`
)

const selectedContent = activeTextEditor.document.getText(activeTextEditor.selection);

// * If there is no selected content,
// * return an error message.
if (!selectedContent)
return showErrorMessage(
`You have to have text selected to upload a snippet to Ray.so.
);

const selectedContent = activeTextEditor.document.getText(
activeTextEditor.selection
);

// * If there is no selected content,
// * return an error message.
if (!selectedContent)
return showErrorMessage(
`You have to have text selected to upload a snippet to Ray.so.
Please select the text you would like to be included in your snippet.`
);

// * Generate URL & open in default browser,
// * then send success message.
const url = generateRayUrl(correctIndentation(selectedContent), {
title: "Uploaded using RayThis Extension",
colors: "breeze",
padding: "16"
});

showInformationMessage(
`Successfully generated Ray.so snippet!`
);

open(url);
});

context.subscriptions.push(publishSelectedSnippet);
);

// * Retrieve settings values
const config = vscode.workspace.getConfiguration("raythis");
const padding = config.get("padding", "16");
const title = config.get(
"title",
"Uploaded using RayThis Extension"
);
const theme = config.get("theme", "breeze");

// * Generate URL & open in default browser,
// * then send success message.
const url = generateRayUrl(correctIndentation(selectedContent), {
title: title,
theme: theme,
padding: padding,
});

showInformationMessage(`Successfully generated Ray.so snippet!`);

open(url);
}
);

context.subscriptions.push(publishSelectedSnippet);
}

// this method is called when your extension is deactivated
function deactivate() {}

module.exports = {
activate,
deactivate,
}
activate,
deactivate,
};
169 changes: 115 additions & 54 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,56 +1,117 @@
{
"name": "raythis",
"displayName": "RayThis: Instant Beautiful Code Screenshots",
"description": "Instantly deploy beautiful code snippets to Ray.so without leaving your coding environment.",
"icon": "256x256.png",
"publisher": "Goopware",
"version": "1.1.1",
"repository": {
"url": "https://github.com/ridarf/raythis"
},
"engines": {
"vscode": "^1.53.0"
},
"categories": [
"Snippets",
"Visualization",
"Other"
],
"keywords": [
"ray.so",
"ray",
"snippets",
"code snippets"
],
"activationEvents": [
"onCommand:ray-this.publishSelectedSnippet"
],
"main": "./extension.js",
"contributes": {
"commands": [
{
"command": "ray-this.publishSelectedSnippet",
"title": "RayThis: Upload Snippet"
}
]
},
"scripts": {
"lint": "eslint .",
"pretest": "npm run lint",
"test": "node ./test/runTest.js"
},
"devDependencies": {
"@types/vscode": "^1.53.0",
"@types/glob": "^7.1.3",
"@types/mocha": "^8.0.4",
"@types/node": "^12.11.7",
"eslint": "^7.19.0",
"glob": "^7.1.6",
"mocha": "^8.2.1",
"typescript": "^4.1.3",
"vscode-test": "^1.5.0"
},
"dependencies": {
"open": "^7.4.2"
}
"name": "raythis",
"displayName": "RayThis: Instant Beautiful Code Screenshots",
"description": "Instantly deploy beautiful code snippets to Ray.so without leaving your coding environment.",
"icon": "256x256.png",
"publisher": "Goopware",
"version": "1.1.1",
"repository": {
"url": "https://github.com/ridarf/raythis"
},
"engines": {
"vscode": "^1.53.0"
},
"categories": [
"Snippets",
"Visualization",
"Other"
],
"keywords": [
"ray.so",
"ray",
"snippets",
"code snippets"
],
"activationEvents": [
"onCommand:ray-this.publishSelectedSnippet"
],
"main": "./extension.js",
"contributes": {
"commands": [
{
"command": "ray-this.publishSelectedSnippet",
"title": "RayThis: Upload Snippet"
}
],
"menus": {
"editor/context": [
{
"command": "ray-this.publishSelectedSnippet",
"group": "1_modification",
"when": "editorHasSelection"
}
]
},
"configuration": {
"title": "Ray This Screenshots",
"properties": {
"raythis.padding": {
"type": "string",
"default": "16",
"enum": [
"16",
"32",
"64",
"128"
],
"enumDescriptions": [
"16px",
"32px",
"64px",
"128px"
],
"description": "Default image padding"
},
"raythis.title": {
"type": "string",
"default": "Uploaded using RayThis Extension",
"description": "Default snippet title"
},
"raythis.theme": {
"type": "string",
"default": "breeze",
"enum": [
"breeze",
"candy",
"crimson",
"falcon",
"meadow",
"midnight",
"raindrop",
"sunset"
],
"enumDescriptions": [
"Breeze",
"Candy",
"Crimson",
"Falcon",
"Meadow",
"Midnight",
"Raindrop",
"Sunset"
],
"description": "Default colour theme"
}
}
}
},
"scripts": {
"lint": "eslint .",
"pretest": "npm run lint",
"test": "node ./test/runTest.js"
},
"devDependencies": {
"@types/vscode": "^1.53.0",
"@types/glob": "^7.1.3",
"@types/mocha": "^8.0.4",
"@types/node": "^12.11.7",
"eslint": "^7.19.0",
"glob": "^7.1.6",
"mocha": "^8.2.1",
"typescript": "^4.1.3",
"vscode-test": "^1.5.0"
},
"dependencies": {
"open": "^7.4.2"
}
}