Posts

Showing posts from April, 2020

Updating Supported Files- Weekly Update

Image
We added 2 small updates: 1. To make the extension work on all kinds of files (up until now, it supported only javascript files), we changed this line: to the following line: which means- support all kinds of languages. 2. We added a button 'Open In Browser' on the hover panel, which opens the image in the browser: The final details for the image part of the extension are: 1. Add another button -'Open In A New Tab'- which opens the image in the webview panel we already made. (check how to create a button on click event in markdown?) 2. Right now, the extension must be called for each image we want to preview. We don't want that, so we need to understand how to notify when the selection has changed, and change the image if needed. (while or an event? the activate function should never end?) 

making image preview webview tab + on mouse hover

Image
First, we started researching the extension API of VS Code  (from:  https://code.visualstudio.com/api ) From this documentation we have learned: How to build, run, debug, test and publish an extension. How to take advantage of VS Code's Extension API. Where to find guides and code samples to help get you started. So, after that overview, we started our first experience by developing a basic “Hello world” extension. We run VS Code extensions generator with “yo code” command, and then we filled out a few fields for creating a TypeScript project. And here is our first extension! Our next step was creating an extension that open in a new tab a marked URL string which represent an image. For doing this, we have defined a vscode.WebViewPanel variable and created a function that receives URL as a string and returns it as an html page. Then, our variable, by using its method, presents the image, just like below: Now, for valida...