Good Morning,
I'm trying to build a TW plugin with additional support for images.
The ultimate plan is to display the image, some info about the image
(height, width, etc), and buttons to display the image at several
different sizes. This is still in proof of concept, so if this
already exists, let me know.
I found javascript code that will extract the image info, and I
built a simple HTML page to test the code. It looks like it works.
The link to the blog entry is
http://blog.nihilogic.dk/2008/08/imageinfo-reading-image-metadata-with.html
and the link to the example is http://www.nihilogic.dk/labs/imageinfo/
I also worked through several how-to-build-a-TW-plugin tutorials and
made a simple TW plugin that works up to the point where it interfaces
with the image info code. That's where the problems start.
I often get an error message that something is undefined. I think
I've got those issues fixed, although I'm sure some of them are
related to how and where I place some of the code.
This current code runs without an error message but also without
placing any image info into the tiddler.
Thanks for any and all ideas.
--GandyDancer
p.s. Here's my code.
Here is my MarkupPreHead ...
<!--{{{-->
<link rel='alternate' type='application/rss+xml' title='RSS'
href='index.xml' />
<!-- include these files fro ImageInfo -->
<script type="text/javascript" src="./ImageInfo/binaryajax.js"></
script>
<script type="text/javascript" src="./ImageInfo/imageinfo.js" ></
script>
<script type="text/javascript" src="./ImageInfo/exif.js" ></script>
<script type="text/javascript" src="ImageInfo/mycallback.js"></script>
<!--}}}-->
<style type="text/css">#contentWrapper {display:none;}</style><div
id="SplashScreen" style="border: 3px solid #ccc; display: block; text-
align: center; width: 320px; margin: 100px auto; padding: 50px;
color:#000; font-size: 28px; font-family:Tahoma; background-
color:#eee;"><b>Zyxwythe Photo Album</b> is loading<br><img src="./
images/ZM_Logo_Green.gif"><br><blink> ...</blink><br><br><span
style="font-size: 14px; color:red;">Requires Javascript.</span></div>
Here is my plugin ...
//{{{
config.macros.ImageData = {};
config.macros.ImageData.handler = function
(place,macroName,params,wikifier,paramString,tiddler) {
// this will run when macro is called from a tiddler
<script type="text/javascript" src="ImageInfo/mycallback.js"></script>
//debugger;
var filepath = params.length > 0 ? params[0] : "world";
wikify("ImageDataPlugin attempting to display for " +filepath +".
Did it work? "+ "\r\n", place);
// define your own callback function
function prettyExif(exif) {
var str = "";
for (var a in exif) {
if (exif.hasOwnProperty(a)) {
if (typeof exif[a] == "object")
str += " " + a + " : [" + exif[a].length
+ " values]\r\n";
else
str += " " + a + " : " + exif[a] +
"\r\n";
}
}
return str;
}
function imageStats(src1) {
var file = src1;
//var out = document.getElementById("output");
//out.value = "Loading file '" + file + "'...\r\n";
function callback() {
var info = ImageInfo.getAllFields(file);
outvalue += "Statistics for '" + file + "'...\r\n";
+ "format: " + info["format"] + "\r\n"
+ "version: " + info["version"] + "\r\n"
+ "width: " + info["width"] + "\r\n"
+ "height: " + info["height"] + "\r\n"
+ "bpp: " + info["bpp"] + "\r\n"
+ "alpha: " + info["alpha"] + "\r\n"
+ "mimeType: " + info["mimeType"] + "\r\n"
+ "byteSize: " + info["byteSize"] + "\r\n"
+ "exif: " + prettyExif(info["exif"])
;
wikify(outvalue,place);
}
ImageInfo.loadInfo(file, callback);
}
wikify(imageStats(filepath), place);
};
//}}}
Here is the test tiddler ...
| A | B | C |h
| 1 | 2 | [img(145px+,93px+)[images/picture_002.png]] | <<ImageData
images/picture_002.png>> |
| 4 | 5 | [img(100px+,154px+)[file:///C:/xampp/htdocs/encaps-2.3.18.3/
rwx/12-17-2009_019_thumb.png]] | [[2X|http://localhost/Image_Resizer/
image_resizer.php?fp=C:/xampp/htdocs/encaps-2.3.18.3/rwx/
12-17-2009_019_thumb.png]] |
| 7 | 8 | [img(200px+,58px+)[./images/ZM_Logo_Green.gif]] |
<<ImageData images/ZM_Logo_Green.gif>> |
--
You received this message because you are subscribed to the Google Groups
"TiddlyWiki" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/tiddlywiki?hl=en.
