Difference between Samsung Smart TV apps with scenes and without? - javascript

Just a quick question. I'm using Samsung Smart TV SDK 5.1 and there are few JavaScript app templates. Cannot figure out why the template that uses scenes has this in index.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Title</title>
<script type="text/javascript" language="javascript" src="$MANAGER_WIDGET/Common/af/2.0.0/loader.js"></script>
</head>
<body>
</body>
</html>
And the other one (without scenes) has this:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Title</title>
<!-- TODO : Common API -->
<script type="text/javascript" language="javascript" src="$MANAGER_WIDGET/Common/API/Widget.js"></script>
<script type="text/javascript" language="javascript" src="$MANAGER_WIDGET/Common/API/TVKeyValue.js"></script>
<!-- TODO : Javascript code -->
<script language="javascript" type="text/javascript" src="app/javascript/Main.js"></script>
<!-- TODO : Style sheets code -->
<link rel="stylesheet" href="app/stylesheets/Main.css" type="text/css">
<!-- TODO: Plugins -->
</head>
Thanks.

Scenes template includes Samsung's Framework loader.
Other template don't, and instead include couple platform API scripts.
You should really read developer guide http://www.samsungdforum.com/Guide/?FolderName=art00114&FileName=index.html

Related

Error in adding css in jsp

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script type="text/javascript" src="../scripts/angular.min.js"></script>
<script type="text/javascript" src="../scripts/jquery-3.2.0.js"></script>
<link rel="stylesheet" type="text/css" href="../css/home.css">
<title>Hello</title>
</head>
<body>
<div id="d1">
asfsdg
</div>
</body>
</html>
I am trying to add styles to html elements in jsp page but when i add the style and run it on tomacat 9.0 nothing happens there and only plain text appears.
And when I moved to page source and click the links to css it shows me an error
HTTP Status 404 – Not Found
Type Status Report
Message /TutorNextDoor/css/home.css
Description The origin server did not find a current representation for the target resource or is not willing to disclose that one exists.
Apache Tomcat/9.0.0.M18
You can move your css and scripts folder inside Webcontent and give the path in the html/jsp file in the following manner :
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<!-- Scripts -->
<script type="text/javascript" src="<%=request.getContextPath()%>/scripts/angular.min.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/scripts/jquery-3.2.0.js"></script>
<!-- CSS -->
<link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/css/home.css">
<title>Hello</title>
</head>
<body>
<div id="d1">
asfsdg
</div>
</body>
</html>

ext-6 gpl hello world

i want to build applications with extjs, i downloaded the GPL version from sencha.com, in me html file i have the code:
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<link rel="stylesheet" type="text/css" href="../lib/extjs/build/resources/ext-watermark/style.css">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>Test ExtJs version 6</title>
<script type="text/javascript" src="../lib/extjs/build/ext-all-debug.js"></script>
<script type="text/javascript" src="../lib/extjs/build/ext-all.js"></script>
<script type="text/javascript" src="testExtJsscript.js"></script>
</head>
<body>
<h2>Test ExtJs</h2>
</body>
</html>
and in me testExtJsscript.js i have the code:
function mess(){
Ext.MessageBox.alert('info','Extjs4 est pret');
}
Ext.onReady(mess);
but the result is just like in the photo
i think that the problem is i haven't the right css file, in all documents there is a ext-all.css file and i can not find it?
I tried to install the trial version of sencha extjs, but the extraction is not working, i reach 42 % and i have problems (CRS faild) with *.png files
thanks for your help
The problem is that you are missing the css file. But anyway, you should not write the html file with the inclusion of the css and js files yourself. You should use Sencha Cmd right from the start, as #Evan suggests. http://docs.sencha.com/extjs/6.2.0/guides/getting_started/getting_started.html
The minimal html should be like this:
<!DOCTYPE html>
<html>
<head>
<link href="/ext/6.0.0/build/classic/theme-triton/resources/theme-triton-all.css" rel="stylesheet" />
<script src="/ext/6.0.0/build/ext-all.js"></script>
<script src="/ext/6.0.0/build/classic/theme-triton/theme-triton.js"></script>
</head>
<body>
<script>
Ext.onReady(function() {
Ext.Msg.alert('Welcome', 'Hello, World!');
});
</script>
</body>
</html>
See my online demos here:
ExtJS 6 Hello World Application
ExtJS 6 Hello World Application Using Ext Loader
ExtJS 6 "Hello World" Application - Modern Toolkit

HTA gives error in combination with angular

I made a angularjs HTML SPA that works fine.In a specific situation I need the power of a HTA. As far as I know there are no restrictions in using a HTA in combination with angular or any other valid HTML. Nevertheless I get an error when using the line
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
in a HTA, even when it's the only script tag in the header.
The error message is: Script error, Code 0, URL http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js
I would expect that others have encountered this error before but I can't find anything on stackoverflow.Does anybody recognize this problem? Is there a solution or workaround?
<!DOCTYPE html>
<html lang="en-US" ng-app="myApp" ng-controller="myCtrl">
<head>
<HTA:APPLICATION
APPLICATIONNAME="my app"
SINGLEINSTANCE="yes"/>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
</head>
<body>
<div >
...Do something
</div>
</body>
</html>
You have declared ng-app and ng-controller on HTML element, but its handlers are not defined. Also, as noted in comment, you must elevate implicit IE version to use sane JS engine with X-UA-Compatible meta. Adding those two lines fixes described error:
<!DOCTYPE html>
<html lang="en-US" ng-app="myApp" ng-controller="myCtrl">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<HTA:APPLICATION
APPLICATIONNAME="my app"
SINGLEINSTANCE="yes"/>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.js"></script>
<script>angular.module('myApp',[]).controller('myCtrl',['$scope',function($scope){}])</script>
</head>
<body>
<div>
...Do something
</div>
</body>
</html>

How to include HTML fragments via JQuery

I'm trying to include a HTML fragment inside another HTML page like so (below), via JQuery, but nothing works. What could I be doing wrong?
The folder structure looks as follows:
---> Project_Root --> jquery --> jquery-migrate-1.2.1.min
--> index.html
--> parts --> header.html
index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript" src="jquery/jquery-migrate-1.2.1.min"></script>
<script>
$(function(){
$("#navbar").load("parts/header.html");
});
</script>
<title>Sample</title>
</head>
<body>
<div id="navbar"></div>
</body>
</html>
header.html:
<p> This is my include file </p>
The actual jQuery library is missing:
<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="jq/jquery-migrate-1.2.1.min"></script>
Migrate plugin is used when you want to use some removed/deprecated methods of jQuery which is not in the latest jQuery library.

Curious! js links not working at the end of the file

I'm curious problem linking my js files in my php webpage. First at all, I put it at the end of the file (just before closing body tag) and in local mode everything works ok. But when I upload my web to my server js files seems not linking, I have to put it in header to work it.
So that way could be important to say all my functions are in a separated file called "scripts".
It's not important trouble, but I'm concerned. Anybody could explain me?
Thanks in advance
Edited
Thank you #Pointy and #Jochen for your quickly answer. I tried using chrome inspector. No errors show, only not load files. This is my web structure (I don't copy complete code cause would be so extense)
<!Doctype html>
<html lang="en">
<head>
<title></title>
<meta name="description" content="">
<meta name="author" content="">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;">
<!--CSS starter-->
<link href="" rel="stylesheet" media="screen">
<!--CSS font-awesome-->
<link href="font-awesome/css/font-awesome.css" rel="stylesheet">
<!--[if IE 7]>
<link href="font-awesome/css/font-awesome-ie7.min.css" rel="stylesheet">
<![endif]-->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<!-- javascript (here links working) -->
</head>
<body>
<!--sections-->
<!--/sections-->
<!-- javascript (here not working) -->
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.knob.js"></script>
<script type="text/javascript" src="js/jquery.easing.min.js"></script>
<script type="text/javascript" src="js/jquery.mixitup.min.js"></script>
<script type="text/javascript" src="js/jquery.validate.min.js"></script>
<script src="js/messages_es.js" type="text/javascript"></script>
<script src="js/main.js"></script>
</body>
</html>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
I guess this path is wrong, try:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

Categories

Resources