Using Eclipse to edit javascript, 'Phaser not defined' - javascript

I am trying to use the Eclipse IDE to develop games in JavaScript using the Phaser game framework. I have a simple html file:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Game</title>
<script type="text/javascript" src="phaser.min.js"></script>
</head>
<body>
<script type="text/javascript" src="base.js"></script>
</body>
</html>
And a simple Phaser script (base.js) that simply creates a blank canvas:
var game = new Phaser.Game(1280, 720, Phaser.AUTO, '', { preload: preload, create: create, update: update });
function preload() {
}
function create() {
}
function update() {
}
And of course, I have the Phaser framework in a separate file (phaser.min.js).
This all work, and when I run a local web server and go to the page a blank black Phaser canvas is created. However, in Eclipse, the first line of the javascript file is underlined in red, with the error 'Phaser' is not defined.
When editing Javascript in Eclipse, how do you 'import' (for lack of a better term) another javascript file for use in validation? Code completion for Phaser would be useful to, but isn't necessary.
Thanks for any help!

Dsiclaimer, I'm the author of tern.java
I suggest you that you try Tern Phaser support with tern.java which gives features like completion, validation for Phaser inside Eclipse IDE.

I would hazard a guess that out of the box, Eclipse doesn't have Javascript support given that it's primarily a Java IDE.
Try adding the JSDT plugin: https://eclipse.org/webtools/jsdt/
Or:
Giving another editor a try, one of the IntelliJ IDEs: https://www.jetbrains.com/webstorm/

Related

P5.js in IntelliJ IDEA?

I started learning p5.js some days ago, and now I wanted to use IntelliJ IDEA instead of the p5.js online editor. Most things like the setup(), draw() and ellipse() functions work as expected, but the createCanvas() function doesn't - it is underlined green and the error message says "Unresolved function or method createCanvas()".
I tried using VSCode, and there it worked perfectly, but I prefer to use IntelliJ, and so I wanted to know if and if yes how I can get it to work in IntelliJ.
<script src="p5.js"></script> //p5.js is the file with all the code from the official p5js.org homepage.
<script src="sketch.js"></script> //sketch.js is the file where my code that should be executed is located
function setup() { //The setup() function is recognized as expected,
createCanvas(1000, 1000); //But the createCanvas() function isn't.
}
p5 functions are defined as p5.prototype.<function name> = function(){}, so the IDE expects a namespace here... As a workaround, please try installing p5 typings: in Preferences | Languages & Frameworks | JavaScript | Libraries, press Downloads..., select p5 from the list. This should solve the problem
I used to mimic the p5js online editor in IntelliJ IDEA by using the Live Edit plugin in combination with split screening Chrome and IntelliJ. The plugin will automatically update your HTML/JS in the Chrome window, s.t. you can instantly see the effects of your changes to your p5js code. It will only work when you run your HTML/JS file in debug mode.
Here's an example:

Noty (notification library) is not defined - AngularJS Web Application

I currently am in the process of making an AngularJS web application from scratch and am new to AngularJS, which is important to note because I could always be missing something fundamental.
The issue is this:
I have installed the Noty library (npm install noty) and wrote code for a simple Noty dialog:
var confirmSubmit = new Noty({
text: 'Your feedback has been submitted!',
buttons: [
Noty.button('Close', 'btn btn-default', function() {
confirmSubmit.close();
})
]
});
This code is inside a working, already integrated JavaScript file other than the main app.js. Format:
(function() {
var app = angular.module('JStest-reviews', []);
...
})();
However, when I launch the web application in Chrome, I get the following error in the console:
Uncaught ReferenceError: Noty is not defined
The official documentation (https://ned.im/noty/#/installation) has little to no description of what is needed aside from installing Noty and creating a Noty object. I have tried using other statements provided in the installation documentation like:
import Noty from 'noty'; or const Noty = require('noty'); before the object creation, but none have resolved the error.
Since my web app was made from scratch, a package.json file was not automatically created, and I wonder if code is needed in there to make this work (right now my manually created one just has name, version, etc. info).
Thank you in advance for suggestions/solutions
I appreciate your time and help.
Approximate answer given by #Phil:
Noty script inclusions should contain the actual path to the Noty library files.
e.g. for me, the fix was:
<link href="node_modules/noty/lib/noty.css" rel="stylesheet">
<script src="node_modules/noty/lib/noty.js" type="text/javascript"></script>
instead of just:
<link href="lib/noty.css" rel="stylesheet">
<script src="lib/noty.js" type="text/javascript"></script>
(From official documentation https://ned.im/noty/#/installation)

External script not working in PaperJS v0.9.22

I am new to paperJS and I'm trying to include an external paperscript file in html, but it isn't working. While the inline scripting is working fine. My code are:
HTML Code:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="js/paper.js"></script>
</head>
<body>
<script type="text/paperscript" src = "js/myScript.js" canvas = "myCanvas" >
</script>
<canvas id="myCanvas" resize></canvas>
paperScript Code (myScript.js):
// Create a Paper.js Path to draw a line into it:
var path = new Path();
// Give the stroke a color
path.strokeColor = 'black';
var start = new Point(100, 100);
// Move to start and draw a line from there
path.moveTo(start);
// Note the plus operator on Point objects.
// PaperScript does that for us, and much more!
path.lineTo(start + [ 100, -50 ]);
I found an old link on stackOverflow which says that using version 0.9.10 fix the problem. But is that issue still not fixed in newer version?
Here's the link:
How to use paperscript from external source?
This is not paperJs issue. Here I was trying to load a resource from the local file system, which chrome doesn't permit (Violation of its same-origin policy) and so we need a local web server.Why?
Local web server can be setup using WAMP (on Windows), MAMP (on OS X), LAMP(for ubuntu). It can aslo be setup by Python http-server and NodeJS http-server.
The only guess I can make based on the information here is that you're loading paper-core.js, not paper-full.js. paperscript is not implemented in paper-core.js.
The behavior if it's paper-core.js would be that your code is never called because there is nothing to interpret paperscript.
Actually I found the solution via another student in Udemy -Git link here. Go to the paper-full.js (it works only with the downloaded version, not CDN) and transform the line
xhr.open((options.method || 'get').toUpperCase(), options.url,
Base.pick(options.async, true));
into only
xhr.open((options.method || 'get').toUpperCase(), options.url);
I understood that's not to be used in normal website as it's against a security protocols, so it's just for practicing. The async method is optional according to Paperjs. By the way, for me it works on Firefox, but not in Chrome.

Simple Javascript test not being exectuted

I'm using Notepad++ to write a simple JavaScript program. I tried to run it with Firefox but the page was blank. I saved it as a HTML file but still nothing. Where am I going wrong?
Here is the code:
<!DOCTYPE html>
<html>
<head>
<title>Exercise 1 </title>
</head>
<body>
<script type = “text/javascript”>
var myName = "type your name!!";
document.write("Hello World");
</script>
</body>
</html>
These look like left quote/right quote characters:
<script type = “text/javascript”>
^ ^
They should be regular double-quote characters <script type="text/javascript">, or you can leave them out entirely, as all browsers default to using Javascript:
<script>
</script>
Additionally, it is not recommended to use document.write any longer. You should use some of the DOM manipulation methods available instead.
As pointed out you are using the wrong type of quotes. Note that you can download jshint for notepad++ which can be very useful as it catches these types of bugs before you run. At the time of writing this answer, you can get it from sourceforge here. It includes jslint and jshint.
JSHint is a community-driven tool to detect errors and potential
problems in JavaScript code and to enforce your team's coding
conventions. It is very flexible so you can easily adjust it to your
particular coding guidelines and the environment you expect your code
to execute in.

Execute browser page/javascript from a script/command-line

Hope this isnt a stupid question.
I have recently had an idea about something which I am very curious about.
I am a fan of Node.js (not really relevent here I think) and the V8 engine but I was wondering if its possible to run a browser (get it to execute JS) but INTERNALLY.
What I mean by that is to create a program (possibly using the V8 engine) which can open a page (as if in the browser) and execute its javascript.
For instance say I have the below file hosted on www.mysite.co.uk/home.php
<!DOCTYPE html>
<html>
<head>
<script>
function myFunction()
{
//javascript AJAX call to www.mysite.co.uk/ping.php
}
myFunction();
</script>
</head>
<body>
</body>
</html>
And ping.php looks something like:
<?php
//connect mysql, database ping and table ping
//it is a single column table with integer value starting on 0
//increment by 1 and update the table
Say I wanted to get the Javascript to execute by using some sort of script on my command line/linux box (essentially WITHOUT using a browser).
So something like:
./mybrowser http://www.mysite.co.uk/home.php
or even:
./mybrowser home.php
I feel like it should be possible as the V8 (or different JS engine) should technically be able to execute Javascript but I havnt the foggiest how it could do so out of a browser context (or even if its possible).
Any ideas?
You can use any js engine to run js scripts as long as they do not rely on the DOM.
You could start by looking at:
Running V8 Javascript Engine Standalone
Edit: as I understand you want a headless browser, here are some:
HTMLUnit (I use that one for unit testing)
PhantomJS
Zombie.js
Running JavaScript on the command line by using either Rhino for Java or Windows Script Host.
http://www.mozilla.org/rhino/
http://msdn.microsoft.com/en-us/library/9bbdkx3k%28VS.85%29.aspx

Categories