I am trying to retrieve records from an LRS and I'm using code that previously worked fine. Now when I try it and look at the console it says "Uncaught ReferenceError: TinCan is not defined" for lines 12, 20 and 71. I do have the tincan.js file in the same folder as the html file.
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='UTF-8'>
<title>Get statements 101</title>
<script type="text/javascript" src="tincan.js"></script>
</head>
<body>
<h1>Get statements 101</h1>
<div id='response'></div>
<script>
var tincan = new TinCan (
{
recordStores: [
{
endpoint: "https://lrs.adlnet.gov/xapi/",
username: "xapi-tools",
password: "xapi-tools",
allowFail: false
}
]
}
);
var container = document.getElementById('response');
tincan.getStatements({
'callback': function (err, result) {
container.innerHTML = (err !== null ? 'ERROR' : JSON.stringify(result.statements));
}
});
</script>
</body>
</html>
Related
This is index.html
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="https://code.jquery.com/jquery-1.11.2.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.js"></script>
<script src="node_modules/oclazyload/dist/ocLazyLoad.js"></script>
<script src="testApp.js"></script>
</head>
<body>
<h3>Lazy load succeded if you can see 'Hello world' below</h3>
<div id="example" ng-app="LazyLoadTest" ng-controller="TestController">
<button ng-click="fun()">Start</button>
</div>
<script>
angular.module("LazyLoadTest", ["oc.lazyLoad"])
.controller("TestController", function($scope, $ocLazyLoad, $compile) {
$scope.fun=function(MyService){
$ocLazyLoad.load("testApp.js").then(function() { //loading a module
console.log('loaded!!'+$scope);
var el, elToAppend,elToAppend2;
elToAppend = $compile('<say-hello to="world"></say-hello>')($scope); //appending it to div
el = angular.element('#example');
console.log(el);
el.append(elToAppend)
//el.append(elToAppend2);
}, function(e) {
console.log('errr');
console.error(e);
})
}
});
</script>
</body>
</html>
The above code is the module which is to be loaded at run time. Able to load Directive but need some help to load service.
How to laxyload the service defined in testApp.js?
Please help me out with this
I recently upgraded my "ember-cli" to "2.10.0" and "ember-cli-qunit" to "3.0.1" but each test module is getting run twice. However when I try the code in jsbin I am unable to recreate the issue. My test looks like:
import Qunit from 'qunit';
Qunit.module("[Reporting]", function (hooks) {
hooks.before(function () {
console.log("before");
});
hooks.after(function () {
console.log("after");
});
Qunit.test("test 1", function (assert) {
console.log("test 1");
assert.equal(1,1);
});
Qunit.test("test 2", function (assert) {
console.log("test 2");
assert.equal(1,1);
});
}
I can see that my quint version is 2.1.1 and jquery version is 1.11.3.
My Index.html file looks like this;
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Studio Tests</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
{{content-for 'head'}}
{{content-for 'test-head'}}
<link rel="stylesheet" href="assets/vendor.css">
<link rel="stylesheet" href="assets/studio-blessed1.css">
<link rel="stylesheet" href="assets/studio.css">
<link rel="stylesheet" href="assets/test-support.css">
<style>#blanket-main { position: relative; z-index: 99999; }</style>
{{content-for 'head-footer'}}
{{content-for 'test-head-footer'}}
</head>
<body>
{{content-for 'body'}}
{{content-for 'test-body'}}
<script src="assets/vendor.js"></script>
<script src="assets/test-support.js"></script>
<script src="assets/studio.js"></script>
<script src="assets/blanket-options.js"></script>
<script src="assets/blanket-loader.js"></script>
<script src="testem.js"></script>
<script src="assets/tests.js"></script>
{{content-for 'body-footer'}}
{{content-for 'test-body-footer'}}
</body>
</html>
I found the issue with my test. I was trying to configure the set of tests that would loaded based on a query parameter I send when running the tests. The way I was trying to do that basically wrong.
In my test-helper.js, I had added :
import Resolver from 'studio/resolver';
import {setResolver} from 'ember-qunit';
import TestLoader from 'ember-cli-test-loader/test-support';
setResolver(Resolver.create());
//ADDED THIS PROTOTYPE AS PER MENTIONED IN https://github.com/ember-cli/ember-cli-test-loader
TestLoader.prototype.shouldLoadModule = function(moduleName) {
//return (moduleName.match(/[-_]test$/));
var additionalCondition = true;
var dirName = QUnit.urlParams.directory;
if (dirName) {
additionalCondition = moduleName.indexOf(dirName + '/') === 0 && (moduleName.indexOf('/', dirName.length + 1) === -1);
}
return additionalCondition;
};
TestLoader.load();
But instead I had to do:
import Ember from 'ember';
import resolver from './helpers/resolver';
import {
setResolver
} from 'ember-qunit';
import TestLoader from 'ember-cli-test-loader/test-support';
Ember.$(document).ready(function () {
TestLoader.prototype.shouldLoadModule = function (moduleName) {
//return (moduleName.match(/[-_]test$/));
var additionalCondition = true;
var dirName = QUnit.urlParams.directory;
if (dirName) {
additionalCondition = moduleName.indexOf(dirName + '/') === 0 && (moduleName.indexOf('/', dirName.length + 1) === -1);
}
return additionalCondition;
};
});
setResolver(resolver);
But now I am getting following error when calling andThen helper method:
Assertion after the final `assert.async` was resolved
So:
//THIS FAILS(BUT USED TO WORK BEFORE QUINT UPGRADE)
test("DUMMY TEST 2", function (assert) {
clickSomeElement();
andThen(()=> {
assert.equal(1, 1);
});
});
I am using really classic version of ember "1.10.1". Not sure if it was caused by it! Could use some help resolving it. Posted here too: https://github.com/ember-cli/ember-cli/issues/6293
I want to load json data from js file (url:'myTurorials.json' throwing error so I used .js,)
Please give me solution, thanks in advance.
code from 'myTurorials.js' file is as bellow
`[
{"display": "JavaScript Tutorial", "url":"http://www.w3schools.com/js/default.asp"},
{"display": "HTML Tutorial", "url":"http://www.w3schools.com/html/default.asp"},
{"display": "CSS Tutorial", "url": "http://www.w3schools.com/css/default.asp"}
]`
code from 'myTurorials.js' ends here
$(document).ready(function(){
$.ajax({
type : 'GET',
url : 'myTutorials.js',
dataType : 'json',
contentType : 'application/json',
success: function (response) {
alert('success');
},
error : function(){
alert('error');
},
complete : function(){
//init();
}
});
});
function init(){
myFunction(myArray);
}
function myFunction(arr) {
var out = "";
var i;
for(i = 0; i < arr.length; i++) {
out += '' + arr[i].display + '<br>';
}
document.getElementById("id01").innerHTML = out;
}
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>HTML5 responsive website tutorial</title>
<link href='http://fonts.googleapis.com/css?family=Open+Sans|Baumans' rel='stylesheet' type='text/css'/>
<script>
</script>
<style>
</style>
<!-- my files -->
<script src="jquery.js"></script>
<script src="main.js"></script>
</head>
<body>
<div id="id01"></div>
</body>
</html>
new to parse and react and I'm I'm getting this error
Uncaught Error: Parse Error: Line 50: Unexpected token
observe: function() {
How can I fix it ?
Here is my whole code
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<meta name="viewport" content="width=device-width">
<link href='http://fonts.googleapis.com/css?family=Roboto:400' rel='stylesheet' type='text/css'>
<script src="http://fb.me/react-0.13.3.min.js"></script>
<script src="https://www.parsecdn.com/js/parse-latest.js"></script>
<!-- Now include parse-react.js -->
<script src="https://www.parsecdn.com/js/parse-react.js"></script>
</head>
<body>
<script src="./jquery.min.js"></script>
<script src="./jquery.velocity.min.js"></script>
<script src="./velocity.ui.min.js"></script>
<script src="./react.js"></script>
<script src="./JSXTransformer.js"></script>
<script type="text/jsx">
/** #jsx React.DOM */
var App = React.createClass({
render: function() {
var name=null;
var password=null;
var email=null;
return (
<div>
<label>Name</label>
<input type="text" ref="name" /><br/>
<label>Password</label>
<input type="password" ref="password" /><br/>
<label>Email</label>
<input type="email" ref="email" /><br/>
<button onClick={this.saveAndContinue}>
Save and Continue
</button>
</div>
)
},
saveAndContinue: function(e) {
e.preventDefault()
//debugger;
// Get values via this.refs
data = {
name: this.refs.name.getDOMNode().value,
password: this.refs.password.getDOMNode().value,
email: this.refs.email.getDOMNode().value,
}
//this.props.saveValues(data)
},
//this.props.nextStep()
saveValues: function()
{
return function()
{
mixins: [ParseReact.Mixin],
observe: function() {
return {
};
}
}
}
}
);
React.renderComponent(<App />, document.body);
</script>
</body>
</html>
Since I'm new to this so Any Help will be appreciated. Thanks
saveValues is a function that returns a function. Within the returned function body you seem to attempt to use object literal syntax.
function() {
a: "something",
b: "something else"
}
is not valid syntax. You probably mean to return some object.
i finished my app but when i test it on the other internet browsers, there was a problem
i will add my code. i couldnt see the error.as i said it works on opera but not in firefox :/
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2011/fbml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
</head>
<body>
<div id="fb-root"></div>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({appId: '199193070140222', status: true, cookie: true, xfbml: true});
};
(function() {
var e = document.createElement('script');
e.type = 'text/javascript';
e.src = document.location.protocol +
'//connect.facebook.net/tr_TR/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}
());
function lget(idd){
FB.api('/'+idd, function(response) {
document.getElementById(idd+"_a").innerHTML ="<a href='" + response.link + "' id='"+idd+"_und' style='color:#12566C;font-size:14px;' onmouseover=document.getElementById('"+idd+"').style.textDecoration=underline; onmouseout=document.getElementById('"+idd+"').style.textDecoration=none; target='_blank'><b>" + response.name + "</b></a>";
});
}
</script>
<div style="padding-left:6px;"><center>
<div id="525864081_a" ></div>
<script type="text/javascript">
lget(525864081);
</script>
<div id="534018674_a" ></div>
<script type="text/javascript">
lget(534018674);
</script>
</div>
</body>
</html>
You are loading the Facebook JS SDK in async mode and thus the FB object is not ready when you call it inside lget, the async loading occurs after your calls to lget and even after the onload event in Firefox.
Try not loading the code asynchronously and note that it is working fine
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2011/fbml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
</head>
<body>
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript">
FB.init({appId: '199193070140222', status: true, cookie: true, xfbml: true});
function lget(idd){
FB.api('/'+idd, function(response) {
document.getElementById(idd+"_a").innerHTML ="<a href='" + response.link + "' id='"+idd+"_und' style='color:#12566C;font-size:14px;' onmouseover=document.getElementById('"+idd+"').style.textDecoration=underline; onmouseout=document.getElementById('"+idd+"').style.textDecoration=none; target='_blank'><b>" + response.name + "</b></a>";
});
}
</script>
<div style="padding-left:6px;"><center>
<div id="525864081_a" ></div>
<script type="text/javascript">
lget(525864081);
</script>
<div id="534018674_a" ></div>
<script type="text/javascript">
lget(534018674);
</script>
</div>
</body>
</html>
if you want to see the execution order try something like this
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2011/fbml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
</head>
<body onload="console.log('onload event'); false;">
<div id="fb-root"></div>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({appId: '199193070140222', status: true, cookie: true, xfbml: true});
console.log('FB object ready');
};
(function() {
var e = document.createElement('script');
e.type = 'text/javascript';
e.src = document.location.protocol +
'//connect.facebook.net/tr_TR/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
console.log('This executed first');
}
());
function lget(idd){
console.log('lget - ' + idd);
};
</script>
<div style="padding-left:6px;"><center>
<div id="525864081_a" ></div>
<script type="text/javascript">
lget(525864081);
</script>
<div id="534018674_a" ></div>
<script type="text/javascript">
lget(534018674);
</script>
</div>
</body>
</html>
this is the output you'll get in Firefox
This executed first
lget - 525864081
lget - 534018674
onload event
FB object ready