Compiled coffeescript preview side by side - webstorm

Is there a way to see generated javascript all the time?
Of course there's a 'Preview compiled coffescript' command that will open modal window.
not exactly the thing I'm looking for.
Also you always can split window vertically and have both .coffee and .js opened. But then, it won't change automatically when you navigate to a different coffeescript file.
And I'm hoping to have a side panel that maybe supports source maps too.
Possible?

No, but you can file a feature request here:
http://youtrack.jetbrains.com/dashboard#newissue=yes
It might be useful for other languages too: TypeScript, Less, Sass, etc

Related

How to colorize plain text files in browser based on multiple regular expressions?

I do often have to look at long plain text log file in browser and I find hard to spot the error message in that amount of text.
Most error messages are easily identifiable using regular expressions. I have being using this trick to highlight important text in iTerm2 for years.
Now the interesting challenge is how to bring the same feature to the browser?
I mention that I need to be able enable this feature per domain as it may have undersirable side effects on others.
A cross browser solution would be ideal but I am ready to switch browser (Safari, Chrome, Firefox).
I know of GreaseMonkey for Firefox which allows you to inject javascript into a webpage. I'm not familiar with who you create scripts to use with it but perhaps you could match the messages using regex. Not sure how you'll highlight a plain text file using it though.
You can easily develop an Extension which will inject a CSS file on whichever webpage you want. Now, in this CSS file you will need a pseudo selector(Do all the text elements have same class or other attribute?). You need to figure this out yourself. Once you have hold of all these elements you can add a CSS rule to change their color to whatever you like.

Is there any way to make WebStorm open one type of files in one tab and another type in a different tab?

I frequently wind up working with JS and CSS files alongside each other since we've adopted css-modules at work. It's an annoyingly tedious task for me to have to constantly reorder my tabs in WebStorm (well PhpStorm, but same difference).
Is there any way I can make all my JavaScript files open on the left hand side and my CSS files on the right hand side? I've tried looking in the preferences and plugins, but I can't find anything. Is there no hope?
There is no such feature in WebStorm; please vote for IDEA-111190 and linked tickets

Plugin for Sublime to see breadcrumbs

Does anyone know of a plugin where I can get the breadcrumbs of a file I am working on.
Lets say I am working on app/controllers/admin/crs/abc, So I can see this info at the top or start of the window.
I am using ember and due to pod structure its hard to know which file I am working as all of them have different folders but same names.
Simply edit your user preferences and add
"show_full_path": true
and the full path of the file will appear in Sublime's titlebar when the file is active.
Compare with the setting (OS X):
to without it:
I know this is an old question but still, I think this is an interesting Package that not many people know of.
On top of #mattdmo answer, you might even want to check the breadcrumbs for a nested structure (pretty much like you'd do in VS Code): just install Breadcrumbs for Sublime Text. Not as cool, but it works ok.

WebStorm opens files on AutoScroll to source

wondering if I could have the same behavior as Brackets like it previews the code on the right side but only opens the file if we do some edits.
Helpful when I'm just going through the files and not really changing anything but then at the end I've to close all.
Is there a setting in web storm that can help achieve the same behavior like brackets
Currently I may only suggest to use View | Quick Definition to preview file content instead of opening (has to be invoked for each file, which is possibly not what you are willing to do).
Other than that: https://youtrack.jetbrains.com/issue/IDEA-130918 -- star/vote/comment to get notified on progress.
P.S.
As stated in this comment they seems to worked on something like that already but quite possibly did not finished it for IDEA v14 release: in build 138.2502 there was an option to open file in "preview panel" first (and if satisfied -- move to editor) instead of opening in editor straight away. But it still a bit different to what Sublime does.

Everything inside < > lost, not seen in html?

I have many source/text file, say file.cpp or file.txt . Now, I want to see all my code/text in browser, so that it will be easy for me to navigate many files.
My main motive for doing all this is, I am learning C++ myself, so whenever I learn something new, I create some sample code and then compile and run it. Also, along these codes, there are comments/tips for me to be aware of. And then I create links for each file for easy navigation purpose. Since, there are many such files, I thought it would be easy to navigate it if I use this html method. I am not sure if it is OK or good approach, I would like to have some feedback.
What I did was save file.cpp/file.txt into file.html and then use pre and code html tag for formatting. And, also some more necessare html tags for viewing html files.
But when I use it, everything inside < > is lost
eg. #include <iostream> is just seen as #include, and <iostream> is lost.
Is there any way to see it, is there any tag or method that I can use ?
I can use regular HTML escape code < and > for this, to see < > but since I have many include files and changing it for all of them is bit time-consuming, so I want to know if there is any other idea ??
So is there any other solution than s/</< and s/>/>
I would also like to know if there any other ideas/tips than just converting cpp file into html.
What I want to have is,
in my main page something like this,
tip1 Do this
tip2 Do that
When I click tip1, it will open tip1.html which has my codes for that tip. And also there is back link in tip1.html, which will take me back to main page on clicking it. Everything is OK just that everything inside < > is lost,not seen.
Thanks.
You might want to take a look at online tools such as CodeHtmler, which allows you to copy into the browser, select the appropriate language, and it'll convert to HTML for you, together with keyword colourisation etc.
Or, do like many other people and put your documentation in Doxygen format (/** */) with code samples in #verbatim/#endverbatim tags. Doxygen is good stuff.
A few ideas:
If you serve the files as mimetype text/plain, the browser should display the text for you.
You could also possibly configure your browser to assume .cpp is text/plain.
Instead of opening the files directly in the browser, you could serve them with a web server than can change the characters for you.
You could also use SyntaxHighlighter to display the code on the client side using JavaScript.
It is pretty much essential that somewhere along the line you use a program to prevent the characters '<>&' from being (mis-)interpreted by your browser (and expand significant repeated blanks into '` '). You have a couple of options for when/how to do that. You could use static HTML, simply converting each file once before putting it into the web server document hierarchy. This has the least conversion overhead if the files are looked at more often than they are modified. Alternatively, you can configure your web server to server the pages via a filter program (CGI, or something more sophisticated) and serve the output of that in lieu of the file. The advantage is that files are only converted when needed; the disadvantage is that the files are converted each time they are needed. You could get fancy and consider a caching solution - convert the file on first demand but retain the converted file for future use. The main downside there is that the web server needs to be able to write to where the converted file is cached - not necessarily a good idea for security reasons. (A minimalist approach to security requires the document hierarchy to be owned by and only writable by one user, say webmaster, and the web server runs as another user, say webserver. Now the web server cannot do any damage because it cannot write anywhere in the document hierarchy. Simple; effective; restrictive.)
The program can be a simple Perl script or a simple C program (the C source for webcode 1.3 is available here).