Create multiple HTML file from directory of images
I have a large body of technical illustrat开发者_开发知识库ions that I need to Map area to form an online manual. I have already made the base engine for linking each file together and navigating forward and backwards. But due to the large amount of images I wanted to create a group of base HTML files that I could then go through and edit the relevant sections.
What I wanted was to search the directory (images/schematic/) and create a HTML file for each image (imagefilename.png). The file would use the name of the image (imagefilename). The body of the html file would be similar to as follows.
$html='
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>'.$imageFileName.'</title>
</head>
<body>
<div id="image-holder">
<div class="img-title">changeMeLater</div>
<img src="'.$imageDir .$FullImageFileName.'" width="640" height="751" alt="'.$imageFileName.'-diagram" usemap="#mapFor-'.$imageFileName.'">
<map name="'.$imageFileName.'-imageMap" id="mapFor-'.$imageFileName.'">
</map>
</div>
<div id="partsDescription-tabContent" class="content"></div>
<div id="instructions-tabContent" class="content"></div>
<div id="notes-tabContent" class="content"></div>
<div id="stockControl-tabContent" class="content"></div>
</body>
</html> ';
I found this code which did display a list of the files, and found out that it is the 'basename' that is removing the directory name.
<?php
$directory = "./images/schematic/";
$directory = (!strstr($directory,"*") || $directory =="./" ) ? $directory."*" : $directory;
$files = glob($directory);
for($i=0;$i<sizeof($files) ; $i++){
echo basename($files[$i])."<br/>\n";
}?>
But I do not understand how to do something to each return value from the image file search. As you can probably tell I have little to no idea when it comes to php but I am trying. If someone could point me in the right direction explaining how and why I would appreciate it.
Ok I have had a bit of a breakthrough. This code does work. Now I would like to tweek it. Suggestions on how to improve it are more than welcome.
<?php
$directory = "./images/schematic/";
$directory = (!strstr($directory,"*") || $directory =="./" ) ? $directory."*" : $directory;
$files = glob($directory);
for($i=0;$i<sizeof($files) ; $i++)
{
$fileTitle= basename($files[$i], ".png");
$imageSrc= $files[$i];
$html='<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>'.$pageTitle.'</title>
</head>
<body>
<div id="image-holder">
<div class="img-title">'.$fileTitle.'</div>
<img src=".'.$imageSrc.'" width="640" height="751" style="border: none;" alt="'.$fileTitle.'-diagram" usemap="#mapFor-'.$fileTitle.'">
<map name="'.$fileTitle.'-imageMap" id="mapFor-'.$fileTitle.'">
<!-------------------------------- '.$pageTitle.' Mapping ------------------------------------->
</map>
</div>
<div id="partsDescription-tabContent" class="content"></div>
<div id="instructions-tabContent" class="content"></div>
<div id="notes-tabContent" class="content"></div>
<div id="stockControl-tabContent" class="content"></div>
</body>
</html>';
$myfile = fopen ('./newdirectory/'.$fileTitle.'.html', 'w') or die("Can not open file");
$outputFile = $html;
fputs($myfile, $outputFile);
fclose($myfile);
};
echo ("OK Files created")
?>
I have cobbled this together from various tutorials I found across the web. I would like it to only look image files, preferably .png and .jpeg. Can I get it to skip a file that exists (I am thinking for further down the line in case I have area mapped the images and it is overwritten.) I realize this may look messy but I am a complete newb to this.
Ok I think I managed to get it all to work here it is for anyone trying to do something similar for any reason, Any further suggestions or improvements welcomed.
<?php
$dir = opendir ("./images"); //the image directory to read
while (false !== ($file = readdir($dir))) {
if (strpos($file, '.png',1)) {
$fileTitle= basename($file, ".png");
$imageSrc= "./images/schematic/".$file;
$html='<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>'.$fileTitle.'</title>
</head>
<body>
<div id="image-holder">
<div class="img-title">'.$fileTitle.'</div>
<img src=".'.$imageSrc.'" width="640" height="751" style="border: none;" alt="'.$fileTitle.'-diagram" usemap="#mapFor-'.$fileTitle.'">
<map name="'.$fileTitle.'-imageMap" id="mapFor-'.$fileTitle.'">
<!-------------------------------- '.$fileTitle.' Mapping ------------------------------------->
</map>
</div>
<div id="partsDescription-tabContent" class="content"></div>
<div id="instructions-tabContent" class="content"></div>
<div id="notes-tabContent" class="content"></div>
<div id="stockControl-tabContent" class="content"></div>
</body>
</html>';
$url= './DirectoryForHTMLfiles/'.$fileTitle.'.html';
$f=@fopen($url,"r"); //check to see if file already exists, if it does then close
if($f)
{
fclose($f);
$stat= ' existing'; // this is for the list of files displayed in your browser window simply displaying file exists
}
else {
$myfile = fopen ($url, 'w') or die("Can not open file"); // else if file does not exist create it
$outputFile = $html;
fputs($myfile, $outputFile);
fclose($myfile);
$stat= ' created'; // this is for the list of files displayed in your browser window simply displaying file created
}
echo '<a href="'.$url.'" target="_new">'.$fileTitle.'.html'.$stat.'</a><br/>'; //displays a link to each file hyperlink to page (opens in new window)
}
}
echo ('<br/><h2>Files created from shcematic image file folder.</h2>');
?>
Well it works, I am sure it is not the most elegant way of doing it but there you go.
The supplied code is giving you the file name. You just need to change the line.
echo basename($files[$i])."<br/>\n";
and replace it with something like this.
echo "<img src='/images/schematic/" . basename($files[$i]) . "'></img><br />\n";
That would then output your images one below the other.
加载中,请稍侯......
精彩评论