I am developing an iPad application with PhoneGap and jQueryMobile and Kinvey's Javascript method for data storage. It's working fine in simulator and I am not able to get it working in the iPad. I am attaching the index.html code below
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta name="viewport" content="initial-scale=1.0,maximum-scale=1.0,width=device-width, user-scalable=no;" />
<meta charset="utf-8">
<link rel="stylesheet" href="jquery.mobile-1.1.0.css"/>
<link rel="stylesheet" href="jquery.mobile.structure-1.1.0.css"/>
<link rel="stylesheet" href="jquery.mobile.theme-1.1.0.css"/>
<link rel="stylesheet" href="datetime/jquery.mobile.datebox.min.css" type="text/css"/>
<script type="text/javascript" charset="utf-8" src="phonegap-1.2.0.js"></script>
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="jquery.mobile-1.1.0.min.js"></script>
<script type="text/javascript" src="datetime/jquery.mobile.datebox.min.js"/>
<script async src="kinvey-js.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
if(typeof Kinvey != 'undefined')
{
alert('Kinvey is there');
}
else
{
alert('Kinvey is not there');
}
});
</script>
</head>
<body>
Test
</body>
</html>
I am getting the alert message "Kinvey is there", when I run on simulator and I am getting the alert message "Kinvey is not there" on my iPad.
Have you tried loading the library non-async?, change
<script async src="kinvey-js.js"></script>
to:
<script type="text/javascript" src="kinvey-js.js"></script>
Since you're not pulling the library from our AWS bucket you don't need to load the library async. See if this helps make the loading more predictable.
Related
Every once in awhile I get the error "Uncaught (in promise) null" when using MGT and I'm unable to access any of the toolkit components. I refresh the page and the error goes away.
Any reason that this could be happening? I'm guessing that the SDK isn't recognizing the login state?
Below is the code where I initialize my provider. Maybe that is the issue?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://use.typekit.net/ytq8cvk.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script type="text/javascript" src="https://alcdn.msauth.net/browser/2.17.0/js/msal-browser.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/#microsoft/microsoft-graph-client/lib/graph-js-sdk.js"></script>
<script src="/site/global_scripts" type="text/javascript"></script>
<link href="/site/global_styles" type="text/css" rel="stylesheet">
</head>
<body>
<script src="https://unpkg.com/#microsoft/mgt/dist/bundle/mgt-loader.js"></script>
<mgt-msal2-provider client-id="***"
scopes="user.read,people.read"
></mgt-msal2-provider>
I can't setup KaTeX. It works if I load KaTeX remotely, but it refuses to work locally. Here is my code:
<!DOCTYPE html>
<html>
<head>
<link href="katex/katex.min.css" rel="stylesheet" type="text/css">
<script defer src="katex/katex.min.js" integrity="sha384-y23I5Q6l+B6vatafAwxRu/0oK/79VlbSz7Q9aiSZUvyWYIYsd+qj+o24G5ZU2zJz" crossorigin="anonymous" integrity="sha384-zB1R0rpPzHqg7Kpt0Aljp8JPLqbXI3bhnPWROx27a9N0Ll6ZP/+DiW/UqRcLbRjq" crossorigin="anonymous"></script>
<script
defer
src="katex/auto-render.min.js"
integrity="sha384-kWPLUVMOks5AQFrykwIup5lo0m3iMkkHrD0uJ4H5cjeGihAutqP0yW0J6dpFiVkI"
crossorigin="anonymous"
onload="renderMathInElement(document.body);"
></script>
</head>
<body>
<div id="el"><span>$$2+\frac{1}{x}$$</span></div>
</body>
</html>
What can be the reason for not working? If I paste paths of remote files of KaTeX, it works perfectly.
Remove integrity and crossorigin. And by default the auto-render.min.js is located inside contrib folder, But you did not path it to katex/contrib/auto-render.min.js and you path it to katex/auto-render.min.js. So make sure where the auto-render.min.js is located. if auto-render.min.js is located inside the contrib folder the below code would work.
<!DOCTYPE html>
<html>
<head>
<link href="katex/katex.min.css" rel="stylesheet" type="text/css">
<script defer src="katex/katex.min.js"></script>
<script defer src="katex/contrib/auto-render.min.js"
onload="renderMathInElement(document.body);"></script>
</head>
<body>
<div id="el"><span>$$2+\frac{1}{x}$$</span></div>
</body>
</html>
I am having problems setting up the Jasmine Test Framework from nuget in my MVC 5 project in VS2013.
I always get an error message when I run the SpecRunner.cshtml file. It keeps saying that the resource cannot be found but it doesn't specify which one.
Anyone know how to properly setup a standalone SpecRunner.cshtml (without needing to go through the index page)?
Here is what I currently have in my SpecRunner.cshtml
#{
Layout = null;
}
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Toolkit - Tests</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" type="image/png" href="/Content/jasmine/jasmine_favicon.png">
<link rel="stylesheet" type="text/css" href="/Content/jasmine/jasmine.css">
<script type="text/javascript" src="/Scripts/jasmine/jasmine.js"></script>
<script type="text/javascript" src="/Scripts/jasmine/jasmine-html.js"></script>
<script type="text/javascript" src="/Scripts/jasmine/boot.js"></script>
<script src="~/Scripts/AngularJS/angular.js"></script>
<script src="~/Scripts/AngularJS/angular-mocks.js"></script>
<script src="~/Scripts/AngularJS/angular-ui-router.js"></script>
<!-- include source files here... -->
<!--<script type="text/javascript" src="/Scripts/jasmine-samples/SpecHelper.js"></script>
<script type="text/javascript" src="/Scripts/jasmine-samples/PlayerSpec.js"></script>-->
<script src="~/Scripts/MyAngularJS/app.js"></script>
<script src="~/Scripts/MyAngularJS/controllers.js"></script>
<!-- include spec files here... -->
<!--<script type="text/javascript" src="/Scripts/jasmine-samples/Player.js"></script>
<script type="text/javascript" src="/Scripts/jasmine-samples/Song.js"></script>-->
<script src="~/Scripts/MyAngularJS/controllersTest.js"></script>
<script>
(function () {
var jasmineEnv = jasmine.getEnv();
jasmineEnv.updateInterval = 1000;
var htmlReporter = new jasmine.HtmlReporter();
jasmineEnv.addReporter(htmlReporter);
jasmineEnv.specFilter = function (spec) {
return htmlReporter.specFilter(spec);
};
var currentWindowOnload = window.onload;
window.onload = function () {
if (currentWindowOnload) {
currentWindowOnload();
}
execJasmine();
};
function execJasmine() {
jasmineEnv.execute();
}
})();
</script>
</head>
<body>
</body>
</html>
You could use Chutzpah. It is a JavaScript test runner which works fine with Jasmine. It is available as a plug-in for Visual Studio and is easy to setup. It also integrates with the Test Explorer of Visual Studio. The wiki explains the features and how it works.
I'm struggling to integrate Cordova(=Phonegap) with Ember.js, and jQuery Mobile. Ember.js + jQuery Mobile works fine, as loading index.html in any desktop browser successfully loads the app.
Using xCode 4 and the iPhone 5.1 simulator, it doesn't show any content within handlebar tags. Which means Ember.js fails to load.
index.html:
<html lang="en">
<head>
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
<meta charset="utf-8">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
</head>
<body>
<script type="text/x-handlebars" data-template-name="main">
this text is NOT displayed
</script>
<div> this text IS displayed </div>
<script src="js/vendor/jquery.min.js"></script>
<script src="js/vendor/jquery.mobile.js"></script>
<script src="js/vendor/ember.js"></script>
<script src="js/app/app.js"></script>
<script src="js/vendor/cordova-1.5.0.js"></script>
<script type="text/javascript">
// If you want to prevent dragging, uncomment this section
function preventBehavior(e){
e.preventDefault();
};
document.addEventListener("touchmove", preventBehavior, false);
document.addEventListener("deviceready", onDeviceReady, false);
/* When this function is called, Cordova has been initialized and is ready to roll */
/* If you are supporting your own protocol, the var invokeString will contain any arguments to the app launch.
see http://iosdevelopertips.com/cocoa/launching-your-own-application-via-a-custom-url-scheme.html
for more details -jm */
function onDeviceReady(){
// do your thing!
}
</script>
</body>
</html>
Found the problem. XCode was reporting:
ERROR whitelist rejection: url='http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css'
Following this, I added *.jquery.com to the ExternalHosts array, within Cordova.plist.
My phonegap OnDeviceReady event is firing on the first page of my app, but doesn't fire when I go to the second page. I am including sample code for both pages. Note, that if I rename the second page to index.html, it will fire the OnDeviceReady, it just doesn't work if I navigate to the page through another page.
I am using the BlackBerry 9550 Emulator, and Phonegap 0.9.6
Here is the code for the first Page
<!DOCTYPE HTML>
<html>
<head>
<title>PhoneGap</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" id="viewport" content="initial-scale=1.0,user-scalable=no">
</head>
<script type="text/javascript">
var scrollView;
function onLoad() {
document.addEventListener("deviceready", onDeviceReady, false);
}
function onDeviceReady() {
alert("OnDeviceReady");
}
</script>
<script src="phonegap.js" type="text/javascript"></script>
<script src="json2.js" type="text/javascript"></script>
<body onload="onLoad()" background-color="white">
<h1><a href="index2.html" >GoToIndex2</a></h1>
</body>
</html>
Here is my second Page:
<!DOCTYPE HTML>
<html>
<head>
<title>PhoneGap</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" id="viewport" content="initial-scale=1.0,user-scalable=no">
</head>
<script type="text/javascript">
var scrollView;
function onLoad() {
document.addEventListener("deviceready", onDeviceReady, false);
}
function onDeviceReady() {
alert("2: OnDeviceReady");
}
</script>
<script src="phonegap.js" type="text/javascript"></script>
<script src="json2.js" type="text/javascript"></script>
<body onload="onLoad()" background="white">
<h1><a href="index.html" >GoToIndex 1</a></h1>
</body>
</html>
Which BlackBerry OS are you using? The PhoneGap documentation for deviceready points out that it doesn't work in 4.6 and suggests a workaround.
I took the sample from PhoneGap version 1.0.0, it was working fine till I added the sencha script file then it didn't work anymore
<script src="json2.js" type="text/javascript"></script>
<script src="phonegap.1.0.0.js" type="text/javascript"></script>
<script src="sencha.js" type="text/javascript"></script>