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.
Related
I am new to Django, I am working in python 3.5, I linked CSS using Jinja but I am not able to see the CSS style within my HTML file, even thought I am getting 200 status in my network and the CSS file is loaded but the style is not working. Can you help me.
here is my html file
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>home</title>
<link rel="stylesheet" type="text/css" href="{%static
'posts/customstyle.css'%}">
</head>
<body>
<div class="container">
<h1>This is the HTML file</h1>
</div>
</body>
and my CSS file is also within 'static' folder within my project folder. I have tried changing the name but nothing is happening.
All I get in the console is:
Resource interpreted as Stylesheet but transferred with MIME type application/x-CSS.
While my network is pretty healthy and I am getting my files uploaded properly.
Here is what I am getting in console:
file uploads sucessfully
style showing but not working
I followed angular2 tutorial https://angular.io/docs/ts/latest/tutorial/.
I didnt want it run under node.js lite-server, but under django.
I managed to finish it and its working BUT: everytime I import any angular module eg. in index.html:
System.import('static/dist/js/main')
.then(null, console.error.bind(console));
or in main.ts:
import {AppComponent} from './app.component'
or everywhere, javascript application is trying to load some js resource like static/dist/js/main file which doesnt exist of course, because the compiled file is named main.js not main.
When I add the extensions '.js' like:
System.import('static/dist/js/main.js')
.then(null, console.error.bind(console));
or
import {AppComponent} from './app.component.js'
It suddenly works, but ts to js compiler (npm run tsc) is throwing error (even throught its compiling) and my IDE is underlining imports as errors.
This is my full index.html:
{% verbatim %}
<html>
<head>
<base href="/">
<title>Angular 2 QuickStart</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="styles.css">
<!-- 1. Load libraries -->
<!-- IE required polyfills, in this exact order -->
<script src="static/node_modules/es6-shim/es6-shim.min.js"></script>
<script src="static/node_modules/systemjs/dist/system-polyfills.js"></script>
<script src="static/node_modules/angular2/es6/dev/src/testing/shims_for_IE.js"></script>
<script src="static/node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="static/node_modules/systemjs/dist/system.src.js"></script>
<script src="static/node_modules/rxjs/bundles/Rx.js"></script>
<script src="static/node_modules/angular2/bundles/angular2.dev.js"></script>
<script src="static/node_modules/angular2/bundles/router.dev.js"></script>
<!-- 2. Configure SystemJS -->
<script>
System.config({
packages: {
app: {
format: 'register',
defaultExtension: 'js'
}
}
});
System.import('static/dist/js/main')
.then(null, console.error.bind(console));
</script>
</head>
<!-- 3. Display the application -->
<body>
<my-app>Loading...</my-app>
</body>
</html>
{% endverbatim %}
I checked this Angular2 Typescript app throws 404 on components when js extension not specified but it didnt helped me.
Does anyone have an idea, please?
Assuming you have configured tsc to output your code to the 'static/dist/js' folder you should be able to configure Systemjs like this:
<script>
System.defaultJSExtensions = true;
System.config({
baseURL: "./static/dist/js"
});
System.import("main")
</script>
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 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>
I'm trying to get a Google AdSense ad to display on my mobile website. I am using Django to serve my web pages and I'm using JQuery Mobile to display and format the content. I've followed these blog instructions on a static html page and the ad shows up fine. When I use the exact same code in my base template, the mobile ad does not show. When I compare the HTML source code they look exactly the same and all the links work exactly the same. Is there something Django injects into the header that would keep the ad from displaying? The HTML source is as follows:
<html>
<head>
<title>Test AdSense</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css"/>
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script>
<script type="text/javascript"><!--
google_ad_client = "ca-pub-XXXXXXXXXXXXXXXXXX";
/* LTC MobileHeader */
google_ad_slot = "XXXXXXXXXXXX";
google_ad_width = 320;
google_ad_height = 50;
//-->
</script>
</head>
<body>
<div id="Div1" data-role="page" data-ajax="false">
<header data-role="header" data-position="fixed">
<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>
<h1>Index Page</h1>
</header>
<section data-role="content">
to Page 2
</section>
<footer data-role="footer" data-position="fixed"></footer>
</div>
</body>
</html>
I decided to upload the code to my staging system system which runs on Ubuntu and the ads show up fine. There is something going on with my development environment which runs on windows that is blocking the call to Google.