I'm using java swt browser for java single page application. In the browser the webpages is showing the PDF successfully, but in the swt browser PDFs are not shown properly.
I'm using <object/> tag to display the PDFs.
$(document).on('click', 'input[type=button]', function(){
var datas = '<object data="files/Documents/'+$(this).attr('class')+'#page=1&zoom=130" type="application/pdf" width="100%" height="100%"></object>';
$('#custom-size-dialogBox').dialogBox({
width: screen.width-100,
height: screen.height-100,
hasMask: true,
title: 'View Details',
hasClose: true,
content: datas
});
});
If you can assume that a system-pdf viewer is installed, you can use the Browser widget by setting the following HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/loose.dtd">
<head>
</head>
<body onResize="fit();">
<embed
type="application/pdf"
src="http://www.adobe.com/security/pdfs/riskcompliance_faq.pdf"
id="pdfDocument">
</embed>
<script type="text/javascript">
fit();
function fit() {
var myWidth = 0, myHeight = 0;
if( typeof( window.innerWidth ) == 'number' ) {
//Non-IE
myWidth = window.innerWidth;
myHeight = window.innerHeight;
} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
//IE 6+ in 'standards compliant mode'
myWidth = document.documentElement.clientWidth;
myHeight = document.documentElement.clientHeight;
} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
//IE 4 compatible
myWidth = document.body.clientWidth;
myHeight = document.body.clientHeight;
}
document.getElementById('pdfDocument').width = myWidth;
document.getElementById('pdfDocument').height = myHeight;
}</script>
</body>
</html>
The src of the embed tag must point to the desired pdf, for local files: file://myPath/../test.pdf
Related
In java this is what I would use to download the html:
static public String savePage(final String URL) throws IOException {
String line = "", all = "";
java.net.URL myUrl = null;
BufferedReader in = null;
try {
myUrl = new URL(URL);
in = new BufferedReader(new InputStreamReader(myUrl.openStream()));
while ((line = in.readLine()) != null) {
all += line;
}
} finally {
if (in != null) {
in.close();
}
}
return all;
}
The HTML I get by using this code in normal java is exactly what I need. However when I try using this code in Android Java (Android studio) the resulting HTML is incomplete and is not what I need. All I want is the HTML to be exactly how it is on the actual link.
This is what the HTML looks like when I download it in Android Java:
<!DOCTYPE html><html lang="en-GB"> <head id="head"> <style
name="www-roboto">#font-face{font-family:'Roboto';font-style:italic;font-weight:400;src:url(//fonts.gstatic.com/s/roboto/v15/W4wDsBUluyw0tK3tykhXEXYhjbSpvc47ee6xR_80Hnw.ttf)format('truetype');}#font-face{font-family:'Roboto';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/s/roboto/v15/QHD8zigcbDB8aPfIoaupKOvvDin1pK8aKteLpeZ5c0A.ttf)format('truetype');}#font-face{font-family:'Roboto';font-style:normal;font-weight:500;src:url(//fonts.gstatic.com/s/roboto/v15/RxZJdnzeo3R5zSexge8UUSZ2oysoEQEeKwjgmXLRnTc.ttf)format('truetype');}#font-face{font-family:'Roboto';font-style:italic;font-weight:500;src:url(//fonts.gstatic.com/s/roboto/v15/OLffGBTaF0XFOW1gnuHF0SwlidHJgAgmTjOEEzwu1L8.ttf)format('truetype');}</style><script
name="www-roboto">if (document.fonts && document.fonts.load) {document.fonts.load("400 10pt Roboto", "E");document.fonts.load("500 10pt Roboto", "E");}</script> <script>var ytcsi = {gt: function(n) {n = (n || '') + 'data_';return ytcsi[n] || (ytcsi[n] = {tick: {},span: {},info: {}});},tick: function(l, t, n) {ytcsi.gt(n).tick[l] = t || +new Date();},span: function(l, s, e, n) {ytcsi.gt(n).span[l] = (e ? e : +new Date()) - ytcsi.gt(n).tick[s];},setSpan: function(l, s, n) {ytcsi.gt(n).span[l]
= s;},info: function(k, v, n) {ytcsi.gt(n).info[k] = v;},setStart: function(s, t, n) {ytcsi.info('yt_sts', s, n);ytcsi.tick('_start', t, n);}};(function(w, d) {ytcsi.perf = w.performance || w.mozPerformance ||w.msPerformance || w.webkitPerformance;ytcsi.setStart('dhs', ytcsi.perf ? ytcsi.perf.timing.responseStart : null);var isPrerender = (d.visibilityState || d.webkitVisibilityState) == 'prerender';var vName = d.webkitVisibilityState ? 'webkitvisibilitychange' : 'visibilitychange';if (isPrerender) {ytcsi.info('prerender', 1);var startTick = function() {ytcsi.setStart('dhs');d.removeEventListener(vName, startTick);};d.addEventListener(vName, startTick, false);}if (d.addEventListener) {d.addEventListener(vName, function() {ytcsi.tick('vc');}, false);}})(window, document);</script> <script>if (window.ytcsi) {window.ytcsi.tick("_start", null, 'initpb');}</script> <script>if (window.ytcsi) {window.ytcsi.tick("_start", null, 'blz_watch_ads');}</script> <script>if (window.ytcsi) {window.ytcsi.tick("_start", null, 'blz_home_ads');}</script> <script>if (window.ytcsi) {window.ytcsi.tick("_start", null, 'blz_search_ads');}</script> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, target-densityDpi=medium-dpi"> <link rel="icon" href="//s.ytimg.com/yts/favicon-vflz7uhzw.ico" type="image/x-icon"> <link rel="shortcut icon" href="//s.ytimg.com/yts/favicon-vflz7uhzw.ico" type="image/x-icon"> <title>YouTube</title> <link rel="stylesheet" href="//s.ytimg.com/yts/cssbin/mobile-nirvana-tablet-mangled-vflylHmeV.css" id="page_css"> </head> <body id="body" class="atom fusion-tn"> <script> var original_url = encodeURIComponent(encodeURIComponent(encodeURIComponent(document.location.href))); var iframe_url = 'https://accounts.google.com/ServiceLogin?continue=http%3A%2F%2Fwww.youtube.com%2Fsignin%3Fnext%3Dhttp%253A%252F%252Fm.youtube.com%252Fsignin_passive%253Foriginal_url%253DORIGINAL_URL_PLACE_HOLDER%26hl%3Den-GB%26feature%3Dmobile_passive%26app%3Dm%26action_handle_signin%3Dtrue&hl=en-GB&passive=true&service=youtube&uilel=3'.replace('ORIGINAL_URL_PLACE_HOLDER', original_url); document.write('<iframe src=\"' + iframe_url + '\" style=\"width:0;height:0;margin:0;border-width:0;padding:0;position:absolute;\"></iframe>'); </script> <div id="player"></div> <div id="guide-layout-container"> <div id="guide-container"></div> <div id="content-container"> <div id="content"></div> </div> <div id="guide-overlay"></div> <div id="lightbox"></div> <div id="toast"></div> <div id="content-overlay"></div> </div> <div id="_yt_orientation_de
This HTML is nothing like the website, Im trying to download it from. Ive tried a lot of different methods for downloading html from websites and all give me incomplete and random HTML like this.
I have tried to encode the URL and used libraries that I can use to download HTML but still no luck.
An explanation to this and a maybe even code that would do what I want would be greatly appreciated. Android java is new to me so lots of details would help me understand better.
Thank you
According to the comments, if you want to site to think you are not communicating with it from a mobile device, you need to set the User-Agent in the network request.
I'm writing online shopping application using Struts 2.
In front-end I'm using jsp, twitter bootstrap, jquery, moustache.js template, twbs pagination plugin and some javascript.
I have Product entity and I want to display the list of products to the user in jsp page.
The way I'm doing it is async loading page with fix number(20) of products in json format and then obtaining them using mustache template.
All my code works except the time when user the first time sees this jsp page - first 20 products are not displaying. So when I'm moving from page to page it loads info, but as twbs plugin works through firing events it means that event is not triggered after jsp page loaded the first time.
So my question is whats the truly good way to fix this ?
Should I fire an event once or use $(document).ready() or $(document).onload() ?
I'm not an expert in javascript, so please be patient
<html>
<%# include file="/WEB-INF/jspf/head.jspf"%>
<body>
<%# include file="/WEB-INF/jspf/menu.jspf"%>
<div class="container">
<ul class="sync-pagination pagination"></ul>
<div id="products" style="width: 50%"></div>
<ul class="sync-pagination pagination"></ul>
</div>
<script type="text/javascript"
src="webjars/mustachejs/0.8.2/mustache.js"></script>
<script id="products-template" type="text/mustache-template">
<ul class="list-group">
{{#.}}
<li class="list-group-item">
<label for="{{name}}">Name: /label> {{name}}
</br>
<label for="{{price}}">Price: </label> {{price}}
</br>
Full description...
</li>
{{/.}}
</ul>
</script>
<script type="text/javascript"
src="script/jquery.twbsPagination.min.js"></script>
<script type="text/javascript">
var records = "${requestScope.records}";
var recordsPerPage = 20;
var pages = Math.ceil(records / recordsPerPage);
$('.sync-pagination').twbsPagination({
totalPages : pages,
visiblePages : 7,
onPageClick : function(event, page) {
$('#products').html(changePage(page));
}
});
function changePage(page) {
pnumber = page || 1;
$.ajax({
type : 'GET',
dataType : 'json',
url : 'product/upload_products?page=' + pnumber,
success : function(products) {
var template = $('#products-template').html();
var info = Mustache.render(template, products);
$('#products').html(info);
}
})
}
</script>
</body>
</html>
You need to call changePage(); on the initial load. You might also want to call this when the page finishes loading everything by using $(document).ready();
<script type="text/javascript">
var records = "${requestScope.records}";
var recordsPerPage = 20;
var pages = Math.ceil(records / recordsPerPage);
$('.sync-pagination').twbsPagination({
totalPages : pages,
visiblePages : 7,
onPageClick : function(event, page) {
$('#products').html(changePage(page));
}
});
function changePage(page) {
pnumber = page || 1;
$.ajax({
type : 'GET',
dataType : 'json',
url : 'product/upload_products?page=' + pnumber,
success : function(products) {
var template = $('#products-template').html();
var info = Mustache.render(template, products);
$('#products').html(info);
}
})
}
//Add this in here
changePage();
</script>
What is the best way to display PDFs in a swt application? I would prefer an open source solution.
If you can assume that a system-pdf viewer is installed, you can use the Browser widget by setting the following HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/loose.dtd">
<head>
</head>
<body onResize="fit();">
<embed
type="application/pdf"
src="http://www.adobe.com/security/pdfs/riskcompliance_faq.pdf"
id="pdfDocument">
</embed>
<script type="text/javascript">
fit();
function fit() {
var myWidth = 0, myHeight = 0;
if( typeof( window.innerWidth ) == 'number' ) {
//Non-IE
myWidth = window.innerWidth;
myHeight = window.innerHeight;
} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
//IE 6+ in 'standards compliant mode'
myWidth = document.documentElement.clientWidth;
myHeight = document.documentElement.clientHeight;
} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
//IE 4 compatible
myWidth = document.body.clientWidth;
myHeight = document.body.clientHeight;
}
document.getElementById('pdfDocument').width = myWidth;
document.getElementById('pdfDocument').height = myHeight;
}</script>
</body>
</html>
The src of the embed tag must point to the desired pdf, for local files: file://myPath/../test.pdf
i wan to ask that if my machine got 1000/10000 of image and each image is named follow by order (1.jpg, 2.jpg, 3.jpg, 4.jpg .... 10000.jpg) , how to do it to let it display follow th order ?
i saw a lot of question on internet that they put it on the JLabel but many of them say it won't work . i have even try a few method to let it display like javascript but it is not the result i want.
I wish the program is running like 0.5 seconds a time and display the image followed the image number.
Can anyone guild me through this ? thanks in advance
==================================================================================
update : this is my javascript code
<html>
<head>
</head>
<body>
<img src="images/image1.jpg" alt="rotating image" width="600" height="500" id="rotator">
<script type="text/javascript">
(function() {
var rotator = document.getElementById('rotator'); // change to match image ID
//var imageDir = 'images/'; // change to match images folder
var delayInSeconds = 1; // set number of seconds delay
// list image names
var images = ['1.jpg','2.jpg', '3.jpg', '4.jpg'];
// don't change below this line
var num = 0;
var changeImage = function() {
var len = images.length;
rotator.src = images[num++];
if (num == len) {
num = 0;
}
};
setInterval(changeImage, delayInSeconds * 50);
})();
</script>
</body>
</html>
first of all, you need to preload images, to do it, you can add them in hidden div. Then replace your original image with it.Something like this:
<html>
<head>
<title>ViewImage</title>
<script type="text/javascript" src="/jquery-1.4.2.min.js"></script>
<script>
var img_num = 1;
$(function(){
window.setInterval(function(){
var img = $('#hiden-img');
if(img[0].complete==true)
$('#real-image').attr('src', img.attr('src'));
img_num++;
if(img_num>10000)img_num=1;
img.attr('src', '/img/'+img_num+'.jpg');
}, 500);
});
</script>
</head>
<body>
<img id="hiden-img" style="display:none;"/>
<img id="real-image" src="/img/1.jpg"/>
</body>
</html>
try it like this. Download jquery and place it in your site, replace paths "/path/to/img" (2 times) and "/path/to/jquery" to your real paths. this should do the trick.
you do not need to refresh page every second. You do not need to refresh it all.
It's works on my site.
I want to make an image viewer (for my website) like the one in Facebook (the old one). When the user click the next or back arrow it will change the picture and the URL of the page.
This is an example of what I want (http://www.facebook.com/pages/Forest-Ville/307556775942281)
Most importantly I want the page to reload with each click with new (URL, comment box, ads, etc.) I do not want to use any Cookies.
Now I am using this, but its completely different from what I want.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<script language="JavaScript">
var NumberOfImages = 10
var img = new Array(NumberOfImages)
img[0] = "http://damnthisfunny.site40.net/1.jpg"
img[1] = "http://damnthisfunny.site40.net/2.jpg"
img[2] = "http://damnthisfunny.site40.net/3.jpg"
img[3] = "http://damnthisfunny.site40.net/4.jpg"
img[4] = "http://damnthisfunny.site40.net/5.jpg"
img[5] = "http://damnthisfunny.site40.net/6.jpg"
img[6] = "http://damnthisfunny.site40.net/7.jpg"
img[7] = "http://damnthisfunny.site40.net/8.jpg"
img[8] = "http://damnthisfunny.site40.net/9.jpg"
img[9] = "http://damnthisfunny.site40.net/10.jpg"
var imgNumber = 0
function NextImage()
{
imgNumber++
if (imgNumber == NumberOfImages)
imgNumber = 0
document.images["VCRImage"].src = img[imgNumber]
}
function PreviousImage()
{
imgNumber--
if (imgNumber < 0)
imgNumber = NumberOfImages - 1
document.images["VCRImage"].src = img[imgNumber]
}
</script>
<body>
<center>
<img name="VCRImage" src="http://damnthisfunny.site40.net/1.jpg" /></dr>
<br />
<a href="javascript:PreviousImage()">
<img border="0" src="left1.jpg" /></a>
<a href="javascript:NextImage()">
<img border="0" src="right1.jpg" /></a>
</center>
</body>
</html>
Any ideas ?