Develop Reference

Looking for a technology/code in java or other maybe to sync files from browser or https

https://github.com/deanhiller/webpieces is a platform that you can write code in java without rebooting the server via it's DevelopmentServer.
Now, to avoid the cycle of fix code, deploy to cloud, test, fix more code, deploy to cloud to test, I would like to just sync changed files to the cloud container so that the cycle becomes
change code
test
no more deploying and since you are just uploading human changes, it's FAST. Now, webpieces is a webserver that hosts a website or json api or whatever. I am thinking of 2 ways of doing this but not sure the technology is there?
Go to webpage on the cloud server and input local source directories to monitor
Locally, just run a program webpiecesSync configuring source directories and the json api to hit on the cloud instance
Number 2 has an extreme advantage over #1 in that I can register for async file notification of changes so as you change a file, the sync uploads it to the cloud and webpieces DevelopmentServer just saves the file to the needed location and when you hit the webpage with the change, the DevelopmentServer does the work of recompiling when needed.
I am not sure #1 can even come close to #2, but if anyone knows of a technology there, javascript or whatever that could maybe do this, I am wondering if I could make a wizard in the DevelopmentServer sync plugin (if I had one) that would then just keep up to date with changes of the directories and grab those files(assuming the user gives it permission somehow). I am very lost if #1 is even feasible?
Any ideas/guesses greatly appreciated.
thanks,
Dean

png files failing to load when opening html file directly, but they load when opening from webstorm

I've been working on a game in javascript for my CS course. When I open the document by hitting run in Webstorm, it loads the game correctly, however when I just try opening the html file from Finder, the webpage opens but none of the png files I'm using for the sprites load. I opened Inspect Element in google chrome, and the javascript files loaded correctly but all the png files listed as canceled. This doesnt happen when the game is run from webstorm (when I run it from webstorm, all image files load properly).
When the game is opened directly from an html file (that's when I have the problem), chrome lists the path of the html document as the webaddress, although when opened from webstorm, it lists http://localhost:63342/CS%20Week%2010/CS105_Jessica.Davis_DogGame.html?_ijt=tmrr2fndgac82h07hlvt101gi4
How can I get around this issue so that when opening the html file from Finder it loads everything correctly? All image files are in the same directory as the html file.

Because of browsers security, loading files like this might not work from a url starting with file://
What webstorm is probably is making a local web server so that instead of saying file:// you could say http://. if any website was able to load images from file:// then any webpage you visit would have been able to search for any file on your computer and send it over the internet without your consent so browser often have these settings on. So you'd need a server. If you are working on your computer, you could make a local server just like webstorm and host your own files there. or host it on another service like github pages or codepen.
Now since all images are in the same directory, make sure that every time you call loadImage you use the images name and extension instead of saying /User/user/whatever_other_directory_you_have_it_under/image.png.
Once you did that you can make a local web server for the project. To make a local server, open Terminal (an application under utilities, you could spotlight search for it as well) and type cd, drag your project folder and drop it over terminal, and hit enter. Then type python -m SimpleHTTPServer and wait till it says something like Serving HTTP on 0.0.0.0 port 8000 .... Then taking the 0.0.0.0 and the 8000 you see in the example (yours may or may not be the same) go to your browser and type http://0.0.0.0:8000 (replacing the digits with whatever you got, not this link doesn't work until you do that)
Images should load alright. If you need to stop the server you can go back to terminal and hit control+C.
Note that when presenting your p5 sketch, no one else would be able to see the website on their computers if you make your local server. The local server is secluded to the device that is running it (although if their making their own local server and have your project files it should work just fine).
If you want the website hosted so that you could share a link with anybody in the world you could use codepen or github pages. If you go to codepen.io it should be self-explanatory although you'd have to upload your images to some image hosting site like tumblr or something and add the URL source of those images to codepen or you could put everything into github for even better results!
To use github pages you'd need to make a github account (preferably with your username being whatever you want your page to be named). Make a repository named insert_username_here.github.io. add your files to the repository (make sure to try to keep all sub directories and folder exactly as they are from your project folder). After a minute or two go to http://insert_username_here.github.io to admire your brand new hosted webpage!

Save Javascript or Replace Javascript File in Chrome Developer Tools

Is there a way to replace a .js file in the website sources with a file on my workstation, or make a modification to a .js file and refresh the website to see the changes?
I am developing client-side JavaScript code against a SharePoint website on a server. I cannot create a local version of the website, so I need to modify the script, save the file to the server, refresh, etc. I do not have direct access to the server, and saving a file in a SP doc library or web part takes a lot of time between edits.
I can make small modifications using the dev tools while breaking on certain lines and applying snippets, but I am hoping for a better way.
Thanks!

If you have access the server that's hosting the file you should be able to replace or modify the JS file. Alternately you can use local hosting tools to test your file and then upload it to the server once you've confirmed it's working.
If you explain what you level of access to your host is we can offer better suggestions.

Eclipse EE + Webstorm development: enable automatic update of static web files on server

I'm working on a servlet/web services website, deployed in Tomcat 7.
The website is a single page application. Html/Css/JavaScript files are served as static content by the server, and then all the ajax calls are managed by Java webservices.
I'm using Eclipse for coding in Java, and WebStorm for HTML, CSS and JavaScript.
My problem is that changes made with WebStorm are not immediately reflected on the server, making it difficult to debug (changes made with Eclipse are immediately updated in the deployed site, however). WebStorm works on exactly the same files and folders as Eclipse, not on a copy.
Is it possible to configure the projects so that changes made with WebStorm are reflected in the server, without having to touch Eclipse?
Best,
Eloy

refresh your project in eclipse, or edit your static files with eclipse.
this is because the tomcat in eclipse publish the project in a temp folder to deploy it in tomcat.
you can also try to: open the tomcat server in the eclipse view "servers" by double clicking on it, and select the option "Serve modules without publishing"

Window-Preferenc-Workspac, check Refresh using native hooks or polling.
But you still need to wait 2-3seconds,and need to refresh your browser.
I am looking for a tool that can help me refresh broswer after code change.

Webstorm Remote Debugging + edit local javascript file while debugging

I've been working through the javascript remote debug tutorials for WebStorm / IntelliJ(numbers.js)
I've managed to get remote debugging working successfully, however there is one thing that is making life difficult.
When I'm debugging numbers.js in WebStorm(I've also tested in IntelliJ and have same result) there is a little lock icon which I guess implies that the file is read only. At the moment, it is slow and painful to go full cycle on the development / deploy process of:
code modification on local file
upload
debug on locked remote fuile
switch tabs in WebStorm to local file
code modification on local file
What I want to do at least is debug on local file, so that I can make changes while debugging and then quickly upload and repeat.
# the tutorial
http://wiki.jetbrains.net/intellij/Remote_JavaScript_debugging_with_WebStorm_and_PHPStorm
the numbers.js file does not have the locked symbol in the tab like I am seeing in my locally running WebStorm.
Anyone else have this problem? Anyone advise how they got WebStorm working so they can make changes to the local file while stepping through and debugging?
Thanks

Most likely you open the file from the Scripts tab in the Debugger panel and place breakpoints there. You should place breakpoints in the original file instead.
Deployment can be automatic (on Save) or you can use In Place configuration when your server root is configured to the project folder.
Another important thing is the local file to remote URL mapping in the Debug configuration. Note that in the wiki tutorial Remote URL is set to the full URL including the http:// and server name.
With In Place deployment or with Automatic Upload and correct mappings you can debug your scripts with zero turnaround time. Make a change, switch to a browser, Refresh (file is saved automatically as Settings | General | Save files on frame deactivation is enabled by default).
If it doesn't work this way for your project, please contact JetBrains support and send a sample project to reproduce this problem, also describe your server and deployment settings.