rickaym / plywood-gallery-for-vscode

An extension for loading code snippets galleries into VS Code.

Plywood Gallery For VSCode

A Visual Studio code extension with rich support for integrating the use of Plywood Gallery: allowing the insertion of code snippets into the editor through images galleries.

Index

1. Key Features
2. Introduction
3. Importing Gallaries
4. Release Notes

Key Features

• Visualizing Code Snippets
• Text/dropdown support for Code Snippets
• Gain access to many community and official code snippet repositories

Introduction

A Gallery is a list of code and image mappings using the template specifed by the core gallery Plywood Gallery. Individual developers can make a gallery of their own by following the template and publish them to Github where users can download and import them.

Once a gallery is imported, a webview will be installed revealing a set of images that the gallery provides. After placing the cursor down to the desired location, you can press on the images to insert the code snippet tied to it.

After the extension is fully installed, you will be introduced to this treeview on the activity bar.



Here you can control and modify imported galleries.

Certain things you can do inside the treeview

• Import Local and Remote galleries
• Remove Local and Remote galleries
• Check for Remote gallery updates
• Opening a gallery (clicking on the gallery item)
• Unpacking code items of a gallery

Importing Galleries

You can load galleries from two distinct locations:

• Remote GitHub Repositories
• Local Repositories/Directories

Remote Galleries

Recommended

By default the extension provides a curated list of recommended Galleries.



You click these Galleries to download them instantenously.

For Gallery Developers: if you would like to feature your own Gallery for recommendations, make sure that your gallery meets the given security criteria and create an issue for it!

Repositories

In order to load a remote github gallery, you can use the command plywood-gallery.ImportRemote or via the button for cloud-download in the treeview navigation bar.

This will prompt an input box where you'll have to provide the URL of the repository to be imported. Keep note though that the extension by default looks for a gallery under the main branch of any specified repositories, in cases where this may not be intended, you can specify an optional branch parameter before the URL with a semi-colon.

E.g.

master;https://github.com/kolibril13/plywood-gallery-minimal-example

Local Galleries

In order to load a local gallery, you can use the command:

• plywood-gallery.ImportLocal
• via the button for desktop-download

This will launch a file explorer for any .yaml files. Select the gallery_config.yaml file for the local gallery that you want to import (it doesn't have to be named gallery_config) and simply press open.

Importing a gallery inside a batch simply changes the protocol from picking a central gallery_config.yaml file to picking the specific config file for the gallery.

Release Notes

Pre-release!

0.0.1-0.0.2

Initial release of the Plywood Gallery Extension

Credits

• kolibril13 for building the plywood gallery core library and the minimal example.
• Picture icons created by Pixel perfect - Flaticon
• Photo icons created by Andrean Prabowo - Flaticon
• Wood icons created by Freepik - Flaticon

plywood-gallery-for-vscode's Issues

Including `preview_image` into gallery selection panel

It would be nice to use the social media preview image in gallery selection panel.
https://github.com/kolibril13/plywood-gallery-minimal-example/blob/e364cb73922018c9d3bbb09bf9fa9861befe3449/gallery_config.yaml#L5

Purposed design :

Current:

Live rendering

When importing a local gallery, it would be great if this extension has the option of live-update for each new generated entry in a gallery.
Implementation-wise, there would be a function that monitors changes in the JSON file.
Similar to this screen recording of the local hosted webpage, which updates every time a new entry is added:

c1.mov

Extension does not open any more

I've noted that last time I've opened VS Code, the extension does not open any more. I also tried re-installing the extension, without success. I still have the plywood options in the VS Code panel, but clicking on them has no effect. Any ideas why this might be the case?
A few weeks ago, it was still working in version 0.0.3, and I have no idea what I've changed since then.

this is the error message in the "extension host" log:

2023-01-03 10:05:15.707 [error] TypeError: Cannot read properties of undefined (reading 'isExternal')
    at y (/Users/jan-hendrik/.vscode/extensions/rickaym.plywood-gallery-0.0.3/dist/extension.js:1:58717)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)

Bug: Single quotes are inserted as `'`

When clicking on "Header" in the function gallery, this happens:

The variable `custom_footer`

In the commit kolibril13/plywood-gallery@ed9bb79 I've removed the variable custom_footer from gallery_config.yaml, so custom_footer can also be removed in the extension:
https://github.com/Rickaym/plywood-gallery-for-vscode/search?q=custom_footer