JSX script to Photoshop action - Is it possible? - action

I wonder if there exist a method to convert a simple JSX script to an action.
I have created an action and converted it to jsx in order to clean and edit it. Now, I want to convert it back to atn in order to use a keybord shorcut.
PS: I did create an action (with ctrl+F12 assigned) that calls the script, but I'd like to have a not dependant action.

Copy the JSX file into your Photoshop Script folder (PHOTOSHOP_INSTALL_FOLDER/Presets/Scripts).
For example:
C:\Program Files\Adobe\Adobe Photoshop CS6 (64 Bit)\Presets\Scripts
/Applications/Adobe Photoshop CC 2018/Presets/Scripts
Once your script is there, restart Photoshop and you see it under File > Scripts and you should be able assign keyboard shortcut to that easily using Edit -> Keyboard Shortcuts -> File (expand this) -> Scripts (expand this)
Note: If you place text like this at the top of your .jsx file, YOUR DESCRIPTION will show up on the Scripts menu:
<javascriptresource>
<name>$$$/JavaScripts/YOURNAME/Menu=YOUR DESCRIPITION</name>
<category>Scripts</category>
</javascriptresource>
#target photoshop

You can simply create an action to load the script. That's it.
You can do this by navigating Files>Scripts>Browse while recording an action, then you can assign Shortcut to it.
Hope it will help you.

record an action (with ctrl-f12 assigned) running the script.
The script needs to be in the above stated folder.

Related

Navigate to the file from output in the terminal - WebStorm

Is it possible to tune WebStorm so that when I have something like this in my terminal window, then I just click on the filename and jump to it.
Not possible using built-in terminal (please vote for IDEA-118566 and IDEA-154439).
Awesome Console plugin might be a solution; but it doesn't support built-in terminal (https://github.com/anthraxx/intellij-awesome-console/issues/23)
there is also Output Link Filter plugin that provides similar functionality, but it looks outdated and (also) doesn't work in built-in terminal
Update (2022): IDEA-118566 is already fixed, links should work. Please note that providing links for particular output needs adding specific logic handing such output. Thus, if you encounter missing links in a particular output, please file a separate issue request describing link output format and steps to reproduce such output.
Webstorm does in fact now have this functionality.
Note that the bug about this functionality being missing (linked in another answer) has been marked as fixed: https://youtrack.jetbrains.com/issue/IDEA-118566.
It's not quite a single click solution, but what I do, is double click the text so that it auto selects and copies the path, including line and char numbers to clipboard. Then use the shortcut for Goto File.... Hit paste (cmd+v) then Enter and it will take you to the exact location.
For me, the shortcut for Goto File... is cmd+shift+O - you can check your shortcut in the menu Navigate -> File...
You can use the following format to output text in the terminal via console.log and the path will be clickable:
at ($FILE_FULL_PATH:$LINE_NUMBER:$SYMBOL_NUMBER)
Example with the full path to the file:
at (/home/ubuntu/project/index.js:12:55)
However, if you're running WebStorm with exact file path's project's folder, you can use the following format:
at (./project/index.js:12:55)
I installed Awesome Console plugin and with this plugin, all files and links in the console and terminal will be highlighted and can be clicked. Source code files will be opened in the IDE, other links with the default viewer/browser for this type.
You can jump to files from the terminal with left click
Just select file path (dblclick) & press "shift" twice (search everywhere) & press "enter"...

Get Build Action from Roslyn API?

Using the Roslyn (Microsoft.CodeAnalysis) APIs, how do I get the Build Action and Copy to Output Directory File Properties? I'm able to open the project file and get the documents, but not sure how to get the file properties.
Opening the project and looping over the filesis easy enough. I just want to know what the build action is of each.
open Microsoft.CodeAnalysis.MSBuild
use ws = MSBuildWorkspace.Create()
let pr = ws.OpenProjectAsync proj |> Async.RunTask
for doc in pr.Documents do
printfn "file %s" doc.FilePath
Roslyn's API doesn't surface things the compiler doesn't care about or need for language analysis. In this case you'll want to use the MSBuild APIs directly.
Here's one way to retrieve the item type (also known as build action) of an item with just the project id (Guid from Roslyn's ProjectId.Id) and the Document.FilePath: http://www.cazzulino.com/item-type-from-file.html

How do I teach WebStorm 9 inspector to recognize Angular Material Design tags/attributes?

Currently, all my angular material HTML attributes are highlighted in yellow with WebStorm 9 (Mac OS X Yosemite) warning: "Attribute [name] is not allowed here".
How can I teach WS to automatically recognize these attributes as valid? I am aware that I can add each one one-by-one to the list of custom attributes, but was hoping that there would be a better way to do this.
UPDATE:
Just wanted to clarify that this issue applies to Angular Material project, and not the AngularJS itself.
You need to add the angular-material.js file as a Library in WebStorm:
Open Preferences (Mac: Cmd+,, Win/Linux: Ctrl+Alt+S)
Go to Languages & Frameworks > JavaScript > Libraries
Click Add and then press the + icon
Find angular-material.js in your node_modules folder
Add a Name and a version and press Ok
Now you will have completions for all elements and attributes that have an #ngdoc documentation in the angular-material source code.
Usage
Start typing and you will see the completions:
Pressing F1 (Ctrl+Q on Win/Linux) will also show some docs, if available in the source code:
Important note
Not all features are properly documented, the following won't show up (unless you already used them) cause they are defined dynamically in a loop, with no #ngdoc for them:
var API_WITH_VALUES = [ "layout", "flex", "flex-order", "flex-offset", "layout-align" ];
var API_NO_VALUES = [ "show", "hide", "layout-padding", "layout-margin" ];
So for these you'd have to add them as a custom attribute (Alt+Enter > "Add flex to custom html attributes").
Environment
Tested on a Mac OS X 10.11.4 using WebStorm 2016.1.1, but this should work for older versions as well.
I am using PHPStorm, which is a sister Project of WebStorm, but it should work the same way.
You maybe need to add the Library:
File
Settings
Languages & Frameworks
Javascript
Librarys
Add here AngularJS
If this does not work, you can add them manually:
Follow this Steps:
File
Default Settings
Editor
Inspection
HTML
Unknown HTML tag attributes
To the right you will see in Options "Custom HTML tag attributes". Enter here the attributes you want to allow.
I highly recomend you to install the Angular.js plugin:
Go to menu File > Settings (or ctrl + alt + S if you're on Windows);
Select Plugins in the window that'll open;
Click in the Browse Repositories button;
Type AngularJS in the search field. Select the plugin;
Click Install Plugin.
The plugin is incumbed to read #ngdoc annotations present in ngMaterial sources and create documentation for their directives.
It seems to support WebStorm and other IDEs, but I could not find it in the plugin registry while filtering by other IDEs. Maybe it'll work inside WebStorm...
Anyway, this is what you get:
You have also a plugin that helps a lot, check it out. It helps a lot
Angular material v2, Teradata covalent v1, Angular flex layout v1 & Material icon live templates
And with the solution provided by #Alex Ilyaev gives a lot of help.
But its no perfect.
Hope it helps.
Currently I don't think that idea's AngularJS plugin understands angular-materials attribute extensions.
It does understand the directives i.e. control click <md-button ...> and the directive (custom tag) is found.
For now you will have to add the attributes af custom attributes in order to get a "green" page.

How can I change the file type association of an existing file in WebStorm?

I accidentally created a file with no extension and I chose the wrong file type association. Text Document I think. I renamed it to have the .js extension which is what I wanted, but now it's stuck without any syntax highlighting. WebStorm doesn't treat it as a javascript file. I can't find anywhere to change how WebStorm treats this file. I've tried renaming it and renaming it back and that doesn't work. With any other name, (with a .js extension) it treats it as a javascript file, but not as the original name.
How can I fix this? The WebStorm documentation is no help.
In Settings (or Preferences for mac) > Editor > File Types you can edit patterns by which a file gets associated as some type or other.
If you select the patterns for a file type you have wrongly selected (in your case Text type) you can remove the filename pattern with which was created to associate you file's filename as a wrong type.
Then click Apply > OK
I've had this problem in php storm 8.0.3 on OSX.
I was struggling with a single file that had been added as a text file, but I'd typed in the .js extension.
I tried deleting and recreating, renaming and renaming back, deleting .idea altogether. Nothing worked.
I found that PHPStorm had added the entire file name to the list of patterns for a text file.
....
*.txt
myfile.js
... etc
This was obviously overriding all other settings. And futhermore it was in the IDE Config not the project config. So I'm guessing every other project would have suffered the same issue.
Once I knew where to look it was easily fixed.
Navigate to:
PhpStorm > Preferences > Editor > File Types > <highlight> Text files
Then find myfile.js in the Registered Patterns panel and delete it.
The file should immediately assume it's correct association.
Go to Settings->File Types and then click on "Text Files". You should see the file if you scroll down. You can then remove it with the association by selecting it and clicking the - (minus) button
Refer to File -> Settings -> IDE Settings -> File Types
In right select "Text files" in Reconigzed File Types then find in Registered Patterns your file and click remove your file
On Windows 8, I was able to remove the invalid association by going under File > Settings > Editor > File Types, then I selected "Text files" as the Recognised File Type and removed the invalid entry from the Registered Patterns block at the bottom.
So much answers and everything is close but no one as in my case.
A had an issue with .vue files. My old PHpStorm version did not track the .vue files, so I somehow associated them as .js files. However, this was a mistake because the syntax is different and I saw a lot of "mistakes" in the code.
Yeah, the solution is really in Settings (or Preferences for mac) > Editor > File Types dialogue. In the window you can see the list of possible associations. At the very bottom of the list you'll see the Vue.js Templates and I had no associations in the bottom window (see the pic), so I manually added *.vue association after clicking green "+".
I think this would be right for any proper file type added to PHPStorm. However, you can add your own file type.
In the new WebStorm versions we can click on the file, select the option Override File Type and change for the type that we want.
Selecting the Override File Type option:
Selecting the file extension:
I have found in phpstorm that I can use the Refactor > Rename... function to associate a file of unspecified file type (e.g. a name with no extension) with a file type.
For example if I have a bash script named do_the_things I can Refactor > Rename it to do_the_things.sh which causes it to pick up the bash highlighting, then when I Refactor > Rename it back to do_the_things it keeps the bash highlighting.
This works in PHPStorm, i can assume in WebStorm should be something similar
Go to Preferences directory
Here is how to find for your OS
https://intellij-support.jetbrains.com/hc/en-us/articles/206544519-Directories-used-by-the-IDE-to-store-settings-caches-plugins-and-logs
Find a file YOUR_PREFERENCES_DIRECTORY/options/filetypes.xml
Edit it with any text editor and delete needed row, for example
<mapping pattern="delete.yaml" type="PLAIN_TEXT" />
Top Menu File->Invalidate Caches / Restart
Enjoy
In my case, the file in question, DepositBreakdownList.js, was associated with a "type" called "File type auto-detected by file content". Selecting it and then removing it (with the minus sign button) allowed the file to be treated as a proper JavaScript file again.
Until I did that, I was unable to use Live Templates associated with JavaScript, even though the file extension was .js, which was just maddening.
I've found a solution,
delete (o rename as .old) the file:
C:\Users\.PyCharmCE\config\options\filetypes.xml
Es:
C:\Users\goofy.PyCharmCE2018.3\config\options\filetypes.xml
After like an hour of searching and screwing around I found a fix:
I renamed the file (through the refactor command) to a temporary file name. Then I created a new file with the correct name with the .js extension and it worked, then I copied the code from the original to the newly created file with the correct extension.
I imagine selecting "new javascript file" and doing the same thing would also work.

TextMate: Preview in Firefox without having to save document first?

Using TextMate:
Is it possible to assign a shortcut to preview/refresh the currently edited HTML document in, say, Firefox, without having to first hit Save?
I'm looking for the same functionality as TextMate's built-in Web Preview window, but I'd prefer an external browser instead of TextMate's. (Mainly in order to use a JavaScript console such as Firebug for instance).
Would it be possible to pipe the currently unsaved document through the shell and then preview in Firefox. And if so, is there anyone having a TextMate command for this, willing to share it?
Not trivially. The easiest way would be to write the current file to the temp dir, then launch that file.. but, this would break any relative links (images, scripts, CSS files)
Add a bundle:
Input: Entire Document
Output: Discard
Scope Selector: source.html
And the script:
#!/usr/bin/env python2.5
import os
import sys
import random
import tempfile
import subprocess
fname = os.environ.get("TM_FILEPATH", "Untitled %s.html" % random.randint(100, 1000))
fcontent = sys.stdin.read()
fd, name = tempfile.mkstemp()
print name
open(name, "w+").write(fcontent)
print subprocess.Popen(["open", "-a", "Firefox", name]).communicate()
As I said, that wont work with relative resource links, which is probably a big problem.. Another option is to modify the following line of code, from the exiting "Refresh Browsers" command:
osascript <<'APPLESCRIPT'
tell app "Firefox" to Get URL "JavaScript:window.location.reload();" inside window 1
APPLESCRIPT
Instead of having the javascript reload the page, it could clear it, and write the current document using a series of document.write() calls. The problem with this is you can't guarantee the current document is the one you want to replace.. Windows 1 could have changed to another site etc, especially with tabbed browsing..
Finally, an option that doesn't have a huge drawback: Use version control, particularly one of the "distributed" ones, where you don't have to send your changes to a remote server - git, mercurial, darcs, bazaar etc (all have TextMate integration also)
If your code is in version control, it doesn't matter if you save before previewing, you can also always go back to your last-commited version if you break something and lose the undo buffer.
Here's something that you can use and just replace "Safari" with "Firefox":
http://wiki.macromates.com/Main/Howtos#SafariPreview
Open the Bundle Editor (control + option + command + B)
Scroll to the HTML Bundle and expand the tree
Select "Open Document in Running Browser(s)"
Assign Activation Key Equivalent (shortcut)
Close the bundle editor
I don't think this is possible. You can however enable the 'atomic saves' option so every time you alt tab to Firefox your project is saved.
If you ever find a solution to have a proper Firefox live preview, let us know.