I'm trying to get some attributes for HTML tags in a web page.
<html>
<head>
<title>test page</title>
</head>
<body>
<div id="header" class="clearit" role="banner">
<div id="headerWrapper">
<ul id="primaryNav" role="navigation">
<li id="musicNav" class="navItem">
Music
</li>
<li id="listenNav" class="navItem">
Radio
</li>
<li id="eventsNav" class="navItem">
Events
</li>
<li id="chartsNav" class="navItem">
Charts
</li>
<li id="communityNav" class="navItem">
Community
</li>
<li id="originalsNav" class="navItem">
Originals
</li>
</ul>
</div>
</div>
</body>
</html>
For example, I need the actual height and width for #headerWrapper and compare it with #musicNav in my PHP script. Since PHP is server-side, I can't get these attributes so I'm thinking to append Javascript code to calculate these attributes and store them in a JSON file like in this code:
<script type="text/javascript">
document.ready(function() {
var JSONObject= {
"tagname":"headerWrapper",
"height":$("#headerWrapper").height(),
"width":$("#headerWrapper").width()
},
{
"tagname":"musicNav",
"height":$("#musicNav").height(),
"width":$("#musicNav").width()
}
});
});
</script>
Then I'd like to read it in the php file that contains my algorithm to extract visual features from web pages. So I need to render the web page with appended Javascript using some browser. I'm using exec to send the new file to Firefox, like this:
exec('"C:\Program Files (x86)\Mozilla Firefox\firefox.exe" "http://localhost/Autoextractor/test.html" 2> errors.txt');
And Firefox opens in taskmanager but does not dispaly, the page is not rendered, and my appended Javascript code is not executed.
safe_mode=off - disabled_functions deleted from php.ini and when executing
exec("whoami");
The result is my user (note: my user in Administrator group) and I did try wscript with no result.
Does anyone have any idea why it's not working, or has another solution to get the dimensions of HTML tags?
Simply running a browser won't allow you to read any data back from it, so forget about using system.
You can use Selenium Webdriver to control a browser with PHP, run JavaScript, then return the result.
When you write your real JavaScript, you will need to fix the syntax errors that appear in the example you included in the question.
Keep in mind that the size of elements on screen will depend on factors such as installed fonts, chosen font size, browser, window size, etc. You can get a result for a browser running on your system, but you can't depend on it to be a universal result.
"have another solution to get Get dimension of HTML tags?"
Something wrong with Firebug/Inspect, which will give you rendered offsets with a few simple operations.
Run your code in a console if you want to do it programmatically, though you'll still need firebug/Inspect to find the right selectors (which really obviates the ability to do any of this automatically). Trying to log it all... well, it sounds like you're trying to keep a database... perhaps you should set one up.
This might be a problem that you need to add more context to get a useful response.
Related
My website has two div columns: a vertical navigation menu and main content. I used php to navigate different pages of my website to the main div (similar to this php example)...(eg. index.php?pg=about_us --> get content from /page/about.html). But one of the pages I want to display this gallery (http://sye.dk/sfpg/) on the main div.
How to display my gallery correctly in the main div (installed under /pages/gallery/index.php) (eg. width about 700px)? I have the same problem if the navigation menu is pointed to an external website. (let's say google) The size and charset are not displayed correctly while using div. Thank you.
<?php
// ...blah blah blah
$pgname = isset($_GET['pg']) ? trim(strip_tags($_GET['pg'])) : 'index';
//....
?>
// starts html, header and body
<div class="left_col">
<nav id="navigation">
<ul>
<li>Home</li>
<li>News</li>
<li>Gallery</li>
<li>Donate</li>
<li>About Us</li>
</ul>
</nav>
</div>
<section class="main_col clearfix">
<?php
if ($pgname != 'gallery'){
echo file_get_contents('pages/'. $pgname. '.html');
} else {
echo file_get_contents('http://google.com/'); // this doesn't work, and neither work with '/pages/gallery/index.php'
}
?>
</section>
Simplified, the above becomes:
gallery.php:
<?php
$name = 'gallery'; // Fixed for this example.
$html_gallery = 'pages/'. $name . '.html';
?>
<html>
<section>
<?php include $html_gallery ?>
</section>
</html>
pages/gallery.html:
<img src="/images/foo.jpg">
<img src="/images/bar.jpg">
<img src="/images/baz.jpg">
gallery.php would render much like this:
<html>
<section>
<img src="/images/foo.jpg">
<img src="/images/bar.jpg">
<img src="/images/baz.jpg">
</section>
</html>
So as you can see, it is up to you to style the output.
I like your idea a lot... but I think it would be much easier for you to use JavaScript and AJAX for this. Also, this approach will prevent the page from reloading!
EDIT - So, if you say you have both HTML and PHP files to use, an ext parameter (extension) in your events will do the trick. - EDIT
My idea would be to give an onclick event on each li calling a JavaScript function, let's say onclick="getContent(page, ext)". So of course you need to replace page to whatever string you like, let's say gallery; and ext to any extension you need as a string, let's say php.
Sample result:
<li onclick="getContent('news', 'html')" title="News">News</li>
<li onclick="getContent('gallery', 'php')" title="Gallery">Gallery</li>
Now, let's build our JavaScript-AJAX stuff. What we first need to do is create the function and place it right after the <body> tag inside a <script> tag, of course. Then remember to add an id to your main column, in the following example it will be content.
<script type="text/javascript">
function getContent(pageName, ext){
var url = "pages/"+pageName+"."+ext, // gallery.php - news.html
xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function(){
if (xhttp.readyState == 4 && xhttp.status == 200) {
document.getElementById("content").innerHTML = xhttp.responseText;
}
};
xhttp.open("GET", url, true);
xhttp.send();
}
</script>
So now this function creates the request and gets the data from your URL and then places all the HTML in it inside your section. Of course, make sure that the HTML file contains only what you need inside the section.
Your main column in HTML should look like this:
<section class="main_col clearfix" id="content"></section>
- EDIT -
About the pre-made single file PHP gallery and resizing problem... I saw the demo and I think I know how it works... my advice is to make sure you set a width to your main_col section because the content given by the demo seems to be lots of div's with a class thumbbox which happens to be arranged by CSS display:inline-block so it should just work fine like that.
But the biggest problem I see is that once you load the content on your page, it will not work unless you include(); (PHP) the file or at least the source code for your single page PHP gallery, because you will only load the HTML and I also see that it uses the JavaScript onclick event just like my idea.
What I can say is that to help you solve this thing entirely, I should be able to see how you're implementing this library and many other things. I think you can work it out tho if you include the file like I said (so that the PHP code loads and hopefully prints the necessary JavaScript).
Also, the charset might be solved using PHP utf8_encode(); or utf8_decode();. Use the first one to encode from ISO-8859-1 to UTF8 and the second one for the other way round.
I'm using wkhtmltopdf to convert pages to pdf, through php. This works well on a windows and a ubuntu server, however, on a different linux server, it sometimes (~5 out of 6 times) doesn't execute the javascript (the pdf only contains data that wasn't generated/modified by javascript).
For instance, I'm using it to render some pages containing jqplot graphics.
The server having the issues seems to work well with external links, but when using a link pointing to itself, it fails to load the javascript most of the times.
I used the static binaries (v 0.9.9 and v0.11.0), and they both fail the same way. Using --javascript-delay (or --redirect-delay) doesn't have any effect (other than waiting for the pdf longer to generate).
On v0.11.0 I also used --window-status, which usually blocked the server for a short time (probably because javascript was never loaded, so window.status was not set).
Also, the output from wkhtml doesn't show any errors/warnings when javascript isn't loaded.
Any ideas or suggestions on what can cause this would help.
Edit:
<script type="text/javascript">
$(function(){
$.atk4(function(){ $('#myrealm_charts_jqplot').univ().jqplot(...pramas);
$('#myrealm_charts_jqplot_5').univ().jqplot(...params);
$('#myrealm_charts_jqplot_6').univ().jqplot(...params);
$('#myrealm_charts_jqplot_7').univ().jqplot(...params);
; });
});
</script>
...
<body class="atk-fullscreen gs-10-fluid atk-sticky">
<div class="gs-wrap atk-layout">
<div id="Content">
<div id="myrealm_charts" class="page_charts">
<div style="height: '' ;width:'600px';">
<div id="myrealm_charts_jqplot" class=" pdf-analytics-chart" style="">
</div>
</div>
...
</div>
</div>
</div>
</body>
The page doesn't have any errors reported by firebug.
I want to try and get the latest movie I checked on the IcheckMovies site and display it on my website. I don't know how, I've read about php_get_contents() and then getting an element but the specific element I want is rather deep in the DOM-structure. Its in a div in a div in a list in a ...
So, this is the link I want to get my content from: http://www.icheckmovies.com/profiles/robinwatchesmovies and I want to get the first title of the movie in the list.
Thanks so much in advance!
EDIT:
So using the file_get_contents() method
<?php
$html = file_get_contents('http://www.icheckmovies.com/profiles/robinwatchesmovies/');
echo $html;
?>
I got this html output. Now, I just need to get 'Smashed' so the content of the href link inside the h3 inside a div inside a div inside a list. This is where I don't know how to get it.
...
<div class="span-7">
<h2>Checks</h2>
<ol class="itemList">
<li class="listItem listItemSmall listItemMovie movie">
<div class="listImage listImageCover">
<a class="dvdCoverSmall" title="View detailed information on Smashed (2012)" href="/movies/smashed/"></a>
<div class="coverImage" style="background: url(/var/covers/small/10/1097928.jpg);"></div>
</div>
<h3>
<a title="View detailed information on Smashed (2012)" href="/movies/smashed/">Smashed</a>
</h3>
<span class="info">6 days ago</span>
</li>
<li class="listItem listItemSmall listItemMovie movie">
<li class="listItem listItemSmall listItemMovie movie">
</ol>
<span>
</div>
...
There are some libraries which could help you!
One I've used for the same purpose, a long time ago, is this: http://simplehtmldom.sourceforge.net/
I hope it help you!
follow steps to achieve this
STEP1:-
First get the contents using file_get_contents in a php file
ex: getcontent.php
<?php
echo file_get_contents("http://www.icheckmovies.com/movies/checked/?user=robinwatchesmovies ");
?>
STEP2:-
CALL the above script using ajax call and add the content to a visibility hidden field in the html.
ex:
$('#hidden_div').html(response);
html:-
<html>
<body>
<div id='hidden_div' style='visibility:hidden'>
</div>
</body>
</html>
STEP3:-
now extract the id what ever you want.
What you are asking for is called as web scraping ,I have done this a few months back, the process goes like this,
Make a HttpRequest to the site from which you need the content,check
the php class for it
Use a DOM parse library for handling the downloaded page (it would be in html),simple HTLM DOM would be a good choice
Extract your required information
Here are some tutorials for you,
HTML Parsing and Screen Scraping with the Simple HTML DOM
Library
Beginning web page scraping with php
SO Posts:
HTML Scraping in Php
And best of all Google is your friend just search for "PHP scraping"
i'm trying to get some attributes for HTML tags in web page for example
<html>
<head>
<title>test page</title>
</head>
<body>
<div id="header" class="clearit" role="banner">
<div id="headerWrapper">
<ul id="primaryNav" role="navigation">
<li id="musicNav" class="navItem">
Music
</li>
<li id="listenNav" class="navItem">
Radio
</li>
<li id="eventsNav" class="navItem">
Events
</li>
<li id="chartsNav" class="navItem">
Charts
</li>
<li id="communityNav" class="navItem">
Community
</li>
<li id="originalsNav" class="navItem">
Originals
</li>
</ul>
</div>
</div>
</body>
</html>
for example i need the actual Height and width for #headerWrapper and compare it with #musicNav in my PHP program , since php is server side i can't get these attribute so i'm thinking to append javascript code to calculate these attribute and store it in json file like this code
<script type="text/javascript">
document.ready(function() {
var JSONObject= {
"tagname":"headerWrapper",
"height":$("#headerWrapper").height(),
"width":$("#headerWrapper").width()
},
{
"tagname":"musicNav",
"height":$("#musicNav").height(),
"width":$("#musicNav").width()
}
});
});
</script>
then read it by php file contain my algorithm witch extract visual features from webpages.
but my problem is i need to render the webpage with appended javascript using some browser or rendering engine in PHP or java ... so dose any one have some thing like that? is my method right or there is better solution?
Incase you want to render a webpage given a url and need an api to walk through the rendered dom
Phantomjs and its api and examples will help you. Check out open render
PhantomJS is a headless WebKit with JavaScript API. It has fast and
native support for various web standards: DOM handling, CSS selector,
JSON, Canvas, and SVG.
If i understand you correctly, you need a means to control the browser from your java app.
This
seems to be relevant.
Things you may also want to account for --
Letting the app know about your browser(binary or otherwise).
Choosing from multiple available browsers on the host.
Account for cross-platform support.
Hi I was wondering what php code I can use that would allow my page to contain more than one image that changes. I would like the php code to output the HTML tag. Can anyone help me with this? Thanks!
you need to output all images to the browser from PHP, then use Javascpt to change the pictures. PHP is for server side scripts, the change you are talking about requires Client Side procxessing, ie Javascript. Do a search for jQuery image changer for some ideas
The kind of mechanism you are referring to is often called a slideshow or a carousel, and it is done with javascript. Google "jQuery slideshow" or "jQuery carousel" and you'll find plenty of those.
If you need something simple, I suggest you the tiny the jQuery plugin tiny carousel.
Scroll to the How To section to know how to set it up.
Then, to change the images with php, you will need to do something like this:
<div id="slider-code">
<a class="buttons prev" href="#">left</a>
<div class="viewport">
<ul class="overview">
<?php foreach(glob('slideshow/*.jpg') as $imagePath): ?>
<li><img src="$imagePath" /></li>
<?php endforeach; ?>
</ul>
</div>
<a class="buttons next" href="#">right</a>
</div>