Expand collapsed Javascript code? - javascript

I have javascript source code that was not obscured, but compressed by collapsing. How can i expand it? Any tools/IDEs?
Thank you!!!

This should work for you:
http://jsbeautifier.org/

I once used with success UniversalIndent for this purpose: http://universalindent.sourceforge.net/
It also works as a notepad++ plugin, which was very useful for me.
If you are interested in doing a lot of Javascript programming, I can also recommend the Aptana Studio 3. From all the code editors I have ever tried, when it comes to Javascript this is the best one, offering code outlining and a primitive (but the best I've seen for Javascript) autocomplete functionality. It also has a Source Auto Format functionality that will help you auto indent the code.
You can more about the Aptana studio on the official site: http://aptana.com/products/studio3 . Please note that Aptana Studio 3 is a Beta product, but even so for me it was the best editor I could find.

Related

VS code Intellisense support in PHTML-files for inline css / inline javascript

I am using Visual Studio Code since a few days and I was wondering if it is possible to have support for Intellisense inside inlined css-blocks and/or inlined javascript in '.phtml'-files.
I could not find a solution online only a few people complaining about this not working from a few months back but I nothing that worked for me.
It would really help me a lot if someone has any idea how to solve this or at least a step in the right direction, or if I have to move the css and js into external files (of course thats better(!) but thats not the point here ;))
Thanks in advance.
This works for me after 2 changes in vscode.
User settings
I added below to the user settings
"files.associations": {
"*.phtml": "php"
},
Extension
Installing the intelliphense extension
And now both php as well as css intellisense works
Make sure you have no other conflicting extension enabled which may cause issue.
Also do have a look at the below open thread
https://github.com/Microsoft/vscode/issues/670

Javascript code folding only works for functions with Web Essentials

I've got Web Essentials 2.5.3 installed in Visual Studio 2013 and the code folding feature works fine for function declarations but fails to show expand/collapse icons for object literals and array literals. Its driving me nuts and I can't seem to find anything in the Web Essentials settings to control these settings.
Has anyone encountered this issue or know of a solution?
I have the same issue. But I have found a work around for this, follow these 2 steps
1.select code snippet you want fold.
2.right click on selection, go to outlining Hide Selection. Short cut: (Ctrl+M, Ctrl+H)
This will work for you.

Keep javascript functions collapsed in VS2013

I am working with the new Visual Studio 2013 that now also has better support for embedded javascript code inside ASPX-Pages.
Since I there are some ASPX pages that have pretty much javascript code on it, I am collapsing the functions I don't need. However the next time I open the ASPX page in the editor the functions are all expanded again...
I am now asking: Does anyone know if there is a setting or something that enables to keep them collapsed, once they got collapsed by me? Just like it works for methods / classes collapsed in .cs files.
I also could not find a direct solution for this, so I looked up information regarding macros in Visual Studio. I found that recording the collapse operation (Ctrl+M) on the specified functions and running this macro at each startup solved my problem temporarily, but not after extensive change in my code.
I would recommend looking into parametering macros for an easy to maintain, semi-automatic code-collapse on startup. This is not a read-and-go answer, but it can give you some hints on where to start a workaround.
http://msdn.microsoft.com/en-us/library/b4c73967(v=vs.90).aspx

How to highlight (un)used JavaScript live in Dreamweaver

I am working in Dreamweaver CS4 and implemented JQuery code that I found online for a gallery function.
I am only using a very small part of the gallery functions available, and would like to delete the unused script in order to get more clarity and a cleaner script. But as a JavaScript beginner I can't identify what is important and what is not.
My question: Is there a way in Dreamweaver to view/highlight the JS code that the site is using? I am imagining a tool that you could turn on when running the live view that would visualize the portions of code that is being used.
Or, the other way round, is there a way to highlight the unused code.
The live code button doesn't seem to do this.
Thanks for your help!
My question: Is there a way in Dreamweaver to view/highlight the JS code that the site is using?
No. You would need to use Firebug or a similar javascript tracker/debugger to see how the code is used. The most DW will tell you is which external files are linked to a page.

Vim style folding for CSS/javascript in Visual Studio

Is anyone aware of a way to have VIM style folding in Visual Studio? I use #region blocks in c# class files and they're great, but unfortunately there's no equivalent functionality for javascript and css. The site/app I'm currently working on has a rather lot of css selectors and javascript and navigating the monolithic files is becoming difficult.
One option that we've considered is breaking up the css and javascript into separate files similiar to jquery modules, but then that introduces performance problems in terms of increasing the overall number of http requests.
If anyone has any suggestions for managing the madness, I'd be greatly appreciative!
Update: Richard Kimber suggests using the bookmarking features of visual studio to make navigating by headings more manageable. This is a step in the right direction, but not as useful as code folding/blocking.
I found a Microsoft extension that improved the JavaScript text editor for Visual Studio 2010.
http://visualstudiogallery.msdn.microsoft.com/en-us/872d27ee-38c7-4a97-98dc-0d8a431cc2ed
I have used it, and it gives all of the following for JavaScript files:
Brace Matching
Outlining / Code-folding
Current Word Highlighting
IntelliSense Doc-Comments Support
I know I'm not really helping with this one,
but have you heard of ViEmu. It is a, lets say, vim emulation within VS. Although it does not support all of vim's features, it does bring a flavor of it to VS navigation.
I haven't used it myself, but others talk pretty good of it, so you might want to give it a shot.
I am currently using JScript Editor Extensions as Brian Grinstead suggested. If it supports region folding, I haven't figured out how. It does support function folding in JavaScript.
There are also JSEnhancements and JSOutlining. Haven't tried either of those though.
This issue is a partial duplicate of this and this.

Categories