PHP Based Test of Getting Website Info and Thumbnails Dynamically Using Separate Links Per URL
To learn the most from these 6 test pages, first test each of the test scripts below, and then read the Info on each of these tests.
- test1.php: getting website info dynamically
- test2.php: getting website thumbnails dynamically
- test3.php: getting website info and thumbnails dynamically using one link per URL
- test4.php: getting website info and thumbnails dynamically using separate links per URL
- test5.php: getting website info dynamically using Ajax
- test6.php: getting website info and thumbnails dynamically using separate links per URL and Ajax
- INFO on test1.php: getting website info dynamically
- INFO on test2.php: getting website thumbnails dynamically
- INFO on test3.php: getting website info and thumbnails dynamically using one link per URL
- INFO on test4.php: getting website info and thumbnails dynamically using separate links per URL
- INFO on test5.php: getting website info dynamically using Ajax
- INFO on test6.php: getting website info and thumbnails dynamically using separate links per URL and Ajax
Note the websnapr.js JavaScript script and websnapr.css CSS stying files loaded in before the action starts. These are Websnapr's files to support their pop-up thumbnail scripts. Note also the attribution giving credit where credit is due—THEY created the automatic pop-up thumbnails scripts, not us. For more on getting website info and thumbnails dynamically see INFO on test1.php: getting website info dynamically and INFO on test2.php: getting website thumbnails dynamically.
This test shows the viability of the Websnapr system to give thumbnail pop-ups and the use of the various PHP functions to get info dynamically from websites, on the fly. However, it also shows that even though the script catfight has been stopped (that was happening in test3 because the same links were being used to run both thumbnails and info), the page reloads are still a huge problem. The oppressive way the page reloads occur make it obvious that even though the link hovering produces the correct script functioning, there HAS to be a better way! Happily, there is. Keep reading about the next 2 tests.
Note that the final HTML code below is the displaying of the links themselves, and they're in the code twice, since the Websnapr thumbnail links and the info box links have been separated. This test page worked to prove that getting website info and thumbnails dynamically—on the fly—is viable. If this was a regular website directory, it would of course be using MySQL databases and other elements of the CMS configuration protocol, not a few sample links. It would of course be faster to store your own thumbnails rather than relying on a service. But free is free!
<?php
session_start();
$_SESSION['flag'] = "0";
if(!isset($f)){$f="0";}
?>
<html>
<head>
<meta http-equiv="imagetoolbar" content="no">
<style type="text/css" media="screen">
BODY {margin-left:0; margin-right:0; margin-top:0;text-align:left}
p, li {font:13px Verdana; color:black;text-align:left;margin-top:0.2em;margin-bottom:0}
h1 {font:bold 28px Verdana; color:black;text-align:center}
h2 {font:bold 24px Verdana;text-align:center}
.d {position:absolute; left:700px; width:300px; margin:0; padding:10px; background-color:#ddd; border:1px solid #000; font: 11px Verdana;}
.e {position:absolute; left:700px; width:300px; margin:0; padding:10px; background-color:transparent; border:none; font: 11px Verdana;}
.f {position:absolute; left:330px; width:350px; top:70px; padding:10px; background-color:#eee; border:1px solid black; font: 13px Verdana;}
.g {position:absolute; left:228px; width:101px; top:70px; padding:10px; background-color:#bbb; border:1px solid black; font: 13px Verdana;}
.t {position:absolute; left:228px; width:451px; top:44px; padding:3px; background-color:#bbb; border:1px solid black; font:bold 15px Verdana;text-align:left}
.b {font:bold 13px Verdana;}
</style>
<style type="text/css" media="screen">@import "websnapr.css";</style>
<script type="text/javascript" src="websnapr.js"></script>
<SCRIPT LANGUAGE="JavaScript">
<!--
var f = <?php echo $f; ?>;
function meta(){e=document.getElementById('k');e.style.display='none';}
var q = 0;
var yy = 0;
var x = 0;
var y = 0;
var url='';
var urls=new Array("http://www.theliquidateher.com/","http://www.css-resources.com/","http://www.mcsii.biz/", "http://www.aglasshalffull.org/","http://www.bicycleclothing.com/", "http://fireprotection.name/","http://www.criegergoodwin.com/",
"http://4homedesign.wordpress.com/", "http://www.aglasshalffull.org/webhatchers/webhatchers.html",
"http://theliquidateher.com/squirrel-valley/squirrel-valley-railroad-demo.htm");
mactest=(navigator.userAgent.indexOf("Mac")!=-1) //My browser sniffers
Netscape=(navigator.appName.indexOf("Netscape") != -1)
msafari=(navigator.userAgent.indexOf("Safari")!= -1)
wsafari=0; if(!mactest&&msafari){wsafari=1;msafari=0}
is_opera = 0; if(window.opera){is_opera=1}
is_ie_mac = 0; is_ie=0;if(document.all){is_ie=1}
if(is_ie&&mactest){is_ie_mac=1}
function startmouse() {if(Netscape) {document.captureEvents(Event.MOUSEMOVE);}
document.onmousemove=getCoords;}
function getCoords(e){
if (!e) var e = window.event;
if (e.pageX){x = e.pageX;y = e.pageY;}
else if (e.clientX){x = e.clientX + document.body.scrollLeft;y = e.clientY + document.body.scrollTop;}
if (y<115&&y>85){yy=y;q=0;}else{q=parseInt((y-80)/32);yy=y-q*32;}
if (y>400){return;}
if (x<670&&x>340&&yy>85&&yy<100&&f==0){f=1;window.location='test4.php?url='+urls[q]+'&f=1&y='+(y-20);}
if ((x>670||x<340||yy<85||yy>100)&&f==1){f=0;meta();window.location='test4.php?url=0&f=0&y='+(y-20);}
}
// -->
</script>
</head>
<body onLoad="startmouse()">
<?php
$f = $_GET['f'];
$y = $_GET['y'];if($f=="0"){$_SESSION['flag'] = "0";echo "<div id='k' class='e' style='top:".$y."px'>";}
$url = $_GET['url'];
if(isset($y)){
if($f=="1" && $_SESSION['flag'] == "0"){ $f="2"; $_SESSION['flag'] = "1";
echo "<div id='k' class='d' style='top:".$y."px'>";
$t = file_get_contents($url);
preg_match('/<title>([^>]*)<\/title>/si',($t), $m);
echo "<span class='b'>"; echo $m[1]; echo "<BR></span>";
$a = get_meta_tags($url);$d=$a['description'];
if(mb_detect_encoding($d, 'UTF-8, ISO-8859-1', true) != 'ISO-8859-1'){$d = utf8_decode($d);}
$d = strtr($d, get_html_translation_table(HTML_ENTITIES));
echo $d; echo "<BR>";$o = html_entity_decode($t);$w = array();
preg_match_all("|<[^>]+>(.*)</[^>]+>|", $o, $v, PREG_PATTERN_ORDER);
for ($x = 0; $x < 10; $x++) {
if (preg_match('<p>i', $v[0][$x])) {$g = strip_tags($v[0][$x]);
if (preg_match("/\./", $g)){$w[] = $g;}}
if (isset($w[0])){preg_match("/([^.]+.)/", $g,$e);
$z=$e[1]; echo $z;}}
echo "</div>";}}
?>
</div>
<!--
link-preview v1.4 by frequency-decoder.com is used in this page
Released under a creative commons Attribution-ShareAlike 2.5 license (http://creativecommons.org/licenses/by-sa/2.5/)
Please credit frequency-decoder in any derivative work - like this page is.
You are free:
* to copy, distribute, display, and perform the work
* to make derivative works
* to make commercial use of the work
Under the following conditions:
by Attribution.
--------------
You must attribute the work in the manner specified by the author or licensor.
sa
--
Share Alike. If you alter, transform, or build upon this work, you may distribute the resulting work only under a license identical to this one.
* For any reuse or distribution, you must make clear to others the license terms of this work.
* Any of these conditions can be waived if you get permission from the copyright holder.
References:
Wesnapr: http://www.websnapr.com
Dustan Diaz: http://www.dustindiaz.com/sweet-titles-finalized
Arc90: http://lab.arc90.com/2006/07/link_thumbnail.php
-->
<div class='t'>Thumbnail
Info</div>
<div class='g'><a HREF="http://www.theliquidateher.com/" target="_blank" class="websnapr">Thumbnail</a>
<br><br><a HREF="http://www.css-resources.com/" target="_blank" class="websnapr">Thumbnail</a>
<br><br><a HREF="http://www.mcsii.biz/" target="_blank" class="websnapr">Thumbnail</a>
<br><br><a HREF="http://www.aglasshalffull.org/" target="_blank" class="websnapr">Thumbnail</a>
<br><br><a HREF="http://www.bicycleclothing.com/" target="_blank" class="websnapr">Thumbnail</a>
<br><br><a HREF="http://fireprotection.name/" target="_blank" class="websnapr">Thumbnail</a>
<br><br><a HREF="http://www.criegergoodwin.com/" target="_blank" class="websnapr">Thumbnail</a>
<br><br><a HREF="http://4homedesign.wordpress.com/" target="_blank" class="websnapr">Thumbnail</a>
<br><br><a HREF="http://www.aglasshalffull.org/webhatchers/webhatchers.html" target="_blank" class="websnapr">Thumbnail</a>
<br><br><a HREF="http://theliquidateher.com/squirrel-valley/squirrel-valley-railroad-demo.htm" target="_blank" class="websnapr">Thumbnail</a></div>
<div class='f'>
<a HREF="http://www.theliquidateher.com/" target="_blank">http://www.theliquidateher.com</a>
<BR><BR><a HREF="http://www.css-resources.com/" target="_blank">http://www.css-resources.com</a>
<BR><BR><a HREF="http://www.mcsii.biz/" target="_blank">http://www.mcsii.biz</a>
<BR><BR><a HREF="http://www.aglasshalffull.org/" target="_blank">http://www.aglasshalffull.org</a>
<BR><BR><a HREF="http://www.bicycleclothing.com/" target="_blank">http://www.bicycleclothing.com</a>
<BR><BR><a HREF="http://fireprotection.name/" target="_blank">http://fireprotection.name</a>
<BR><BR><a HREF="http://www.criegergoodwin.com/" target="_blank">http://www.criegergoodwin.com</a>
<BR><BR><a HREF="http://4homedesign.wordpress.com/" target="_blank">http://4homedesign.wordpress.com</a>
<BR><BR><a HREF="http://www.aglasshalffull.org/webhatchers/webhatchers.html" target="_blank">http://www.aglasshalffull.org/webhatchers/webhatchers.html</a>
<BR><BR><a HREF="http://theliquidateher.com/squirrel-valley/squirrel-valley-railroad-demo.htm" target="_blank">http://theliquidateher.com/squirrel-valley/squirrel-valley-railroad-demo.htm</a>
</div>
</body>
</html>