I am making a clock in javascript. The code below is just the start. It should produce an orange rectangle only.
I am using the raphael library for the vector graphics.
However, when i try and view this in a web browser, in the inspect element i get a message saying that raphael is undefined.
I have stored my clock.html and clock.js file in a folder that contains only raphael-min.js
I have the html code as follows
<!DOCTYPE HTML>
<html>
<head>
<script src="Clock.js" type="text/javascript"> </script>
<script src=“raphael-min.js" type="text/javascript"> </script>
</head>
<body>
</body>
</html>
and the java code as follows
window .onload= function (){
var paper = new Raphael( 0, 0, 400, 400);
var backGround = paper.rect(0, 0, 400, 400);
backGround.attr({ fill: "orange"});
/* Comment - Add your code here*/
};`
If someone could please tell me what I am doing wrong, that would be fantastic. In plain english please. I started learning html and javascript last week.
Many thanks
Always add the scripts your code uses before you add your code.
Like this:
<!DOCTYPE HTML>
<html>
<head>
<script src=“raphael-min.js"></script>
<script src="Clock.js"></script>
</head>
<body>
</body>
</html>
In the question, Clock.js appears first. That's probably why you are getting the Raphael undefined error.
I removed type="text/javascript". You'll find that in older JS books and tutorials but it is unnecessary.
Related
So I want to use the console of Mozilla in my computer to see what errors have the page that is normally executed by Pepper robot in his tablet, because console.log() is not displayed on Choregraphe log.
I have tried to call the robot qimessaging.js library from computer but it throws an error:
SyntaxError: The URI is malformed. qimessaging.js:12
The html is there:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Video</title>
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
<script type = "text/javascript" src="http://nao:nao#192.168.1.238/libs/qimessaging/1.0/qimessaging.js"></script>
<script type="text/javascript" src="js/video.js"></script>
</head>
<body>
<canvas width = "320px" height = "240px"></canvas>
<p id="log">log</p>
</body>
</html>
Is there a way to call the qimessaging.js without errors to test the web in my computer?
Instead of console.log() you can use alert().
Also you can connect with your PC browser with this link robot_ip/apps/your_app_name/index.html', but your index.html must be in sub folder named html.
You can also test from your computer if you import the script from the robot directly:
<script src="http://12.34.56.78/libs/qi/2/qi.js"></script>
Then when you open a session, add the robot url as a third argument of the QiSession:
QiSession( onSuccess, onError, "12.34.56.78:80" );
Then your browser will connect to your remote robot.
I am using javascript code inside an HTMLQuestion form to validate the user input .
<HTMLQuestion xmlns="http://mechanicalturk.amazonaws.com/AWSMechanicalTurkDataSchemas/2011-11-11/HTMLQuestion.xsd" >
<HTMLContent>
<![CDATA[
<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=UTF-8'/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script language = "javascript" type='text/javascript' >
$(document).ready(function()
{
alert("iFrame is ready");
});
</script>
sadly i am not getting the javascript code working. I tried to track the html code and it turned out that Each hit will be impeded as IFrame. It looks like Amazon Mechanical Turk disallow imbeded javascript code
I have an Ember application running with hadlebars. I have several ember templates in my HTML page, but I ran into a slight dilemma - I can't escape an HTML code within script tag. I am looking to insert a non-working raw HTML into script tag for illustrative purposes. Will it be of help by using .hbs file method? I would prefer not to use .hbs method.
<script type="text/x-handlebars" data-template-name="name">
<html>
<head>
so on....
</head>
</html>
</script>
Thank you.
You can do this exactly the same way you would do it in normal HTML: escape the HTML entities:
<script type="text/x-handlebars" data-template-name="name">
<html>
<head>
so on....
</head>
</html>
</script>
I am trying to implement the instafeed tutorial to just show some instagram pictures.
I am working on PyCharm using Django.
Here is my folder hierarchy:
/test_project/js/instafeed.min.js
I have a suspicion that I am not referencing the 'src' correctly. I had 'Cannot resolve directory' warnings before, but I got them to disappear by playing around with the Source preferences.
Here's the HTML code:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<style>
</style>
<script type="text/javascript" src="/js/instafeed.min.js"></script>
<script type="text/javascript">
var feed = new Instafeed({
get: 'tagged',
tagName: 'awesome',
clientId: 'b8dacdbf587f41798d8dfb03e3f7a29',
useHTTP: true
});
feed.run();
</script>
</head>
<body>
<div id="instafeed">
</div>
</body>
</html>
I used the 'useHTTP:true' because I saw on another answer that this needs to be set to true to work on a local machine. I've looked at how the code was used in other tutorials and implementations, but I don't see how my code is any different.
Thanks for the help!
Instafeed needs jQuery (the documentation says that you don't need, but i got some errors without it), so make sure you have both libs loaded correctly.
Try with this:
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="//cdn.lukej.me/instafeed.js/1.2.0/instafeed.min.js"></script>
So I'm tossing around an idea for a presentation for work to try to show the power of Ember. I planned on starting at some of the primitives and showing that things can technically stand on there own, but Ember works best when you adhere to patterns. Anyways I would like to just render a view. In the Ember Guides under view there is this example:
View
var view = Ember.View.create({
templateName: 'say-hello',
name: "Bob"
});
view.appendTo('#container');
HTML
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="http://builds.emberjs.com/handlebars-1.0.0.js"></script>
<script src="http://builds.emberjs.com.s3.amazonaws.com/ember-1.0.0-rc.7.prod.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
<div id="container"></div>
<script type="text/x-handlebars" id="say-hello">
Hello, <b>{{view.name}}</b>
</script>
</body>
</html>
http://jsbin.com/EPuwApE/3/edit
This does not work. Why?
You have a few issues.
When you create a template, name it with the data-template-name attribute.
In order for your view to find the template, you must create an Ember.Application even if you don't use it.
Alternatively, if you'd prefer not to do the above, you can inline your template in the view, compile it, and set it to the view's template property. I commented it out as an example.
Check out this updated jsbin.
You missed to create an instance of Ember application like
App = Ember.Application.create({
});
Working Bin