Print

[Tranz]

I'm trying to use Highslide JS to show the cpmFetched image in my blog. I added the following window target conditional and nothing happened:

Code: [Select]

} elseif ($this->optionHash['windowtarget'] == '_blank-highslide') {
$htmlOut .= " href=\"$target\" class=\"highslide\" onclick=\"return hs.expand(this)\"";

}
I then found that when I chose _blank-js or _blank-cfshow, nothing happened either. I added the cpmfetch.js to the blog file.

Here is the cpmfetch code I placed in my blog's sidebar:

Code: [Select]

<?php
include "../cpmfetch/cpmfetch.php";
$objCpm = new cpm("/");
$options = array( 'subtitle' => 'Album: %a<br/>
<i>%t</i><br/>
<a href="http://takethu.com/displayimage.php?pos=-%i" target="_blank">Details</a>', 
'windowtarget' => "_blank-highslide");
$objCpm->cpm_viewRandomMedia(1,1, $options); 
$objCpm->cpm_close();
?>


[Tranz]

Nevermind.

Huh, in trying to figure out a different setting, I fixed the above issue. I assigned large to imagelink.

[vuud]

Nevermind.

Huh, in trying to figure out a different setting, I fixed the above issue. I assigned large to imagelink.

Hey TnD,

I did not check but I think that maybe the code for windowtarget does not accept more than the documented options.  You can pretty much pass whatever you wanted with linkattributes (?).  Like I said, I am not sure - been a long time since I saw that chunk of code.

Later

[Tranz]

Oh, cool, the linkstyle option worked. It enabled me to undo the change I made to cpmfetch.php... making it easier to upgrade in the future.

Thanks for the tip!

[vuud]

Oh, cool, the linkstyle option worked. It enabled me to undo the change I made to cpmfetch.php... making it easier to upgrade in the future.

Thanks for the tip!

Well, I added in a bunch of stuff that lets you change HTML attributes, but they were specifically a one to one thing.  Later I added a catchall that you could put anything in...  the [cell|link|table|row]attributes setting.  You can break things much faster this way.

Take care!

[nickfzx]

hi

I would love to do exactly what you got done...have cpmfetch and highslide working together...

I wan't the cpmfetch bit undernieth my forum:
http://www.amateurillustrator.com/forums/

I already have cpmfetch here:
http://www.amateurillustrator.com/

but would like people to be able to view random images while using the forum and not having to leave the forum....thought this would be neat.

I couldn't really make sense of exactly what you did to get this working in the end.

Any help would be great

All the best

Nick

[Tranz]

I don't know if this will work, but in the cpm fetch code in the $options variable, add these options to the array:

Code: [Select]

'imagelink' => 'large',
"linkstyle" => 'highslide" onclick="return hs.expand(this)" onmouseover="self.status=\'Click to enlarge thumbnail\'; return true;',
Then you need to follow the instructions from highslide about adding the highslide code. It's a bit trickier since you'll be working with an app's templating system instead of a straight html file.

[nickfzx]

thanks for getting back

here is my current code:

Code: [Select]

<script type="text/javascript"
    src="my-highslide-dir/highslide.js"></script>
   
<script type="text/javascript">
    hs.graphicsDir = 'highslide/graphics/';
    hs.outlineType = 'outer-glow';
   
    // internationalization:
    hs.fullExpandTitle = 'Utvid til full storleik';
    hs.restoreTitle = 'Klikk for å gjenoppretta småbilete';
    hs.focusTitle = 'Klikk for å plassera øvst';
    hs.loadingText = 'Lastar...';
</script>

<?php
include "cpmfetch/cpmfetch.php";
$objCpm = new cpm("galleries/");
$options = array( 'subtitle' => 'Album: %a<br/>
<i>%t</i><br/>
<a href="http://amateurillustrator.com.s2734.gridserver.com/galleries/displayimage.php?pos=-%i" target="_blank">Details</a>', 
'imagelink' => 'large',
"linkstyle" => 'highslide" onclick="return hs.expand(this)" onmouseover="self.status=\'Click to enlarge thumbnail\'; return true;',
$objCpm->cpm_viewRandomMedia(1,1, $options); 
$objCpm->cpm_close();
?>
I have put this as a file called slide.php here:
http://amateurillustrator.com.s2734.gridserver.com/slide.php

I am getting syntax errors at the moment.

It would help me a lot if you post the updated code that you pasted into your blog.

Thankyou for your help

[Tranz]

There's no closing parenthesis for the $options array. You need to add:

Code: [Select]

);

[nickfzx]

cool, thanks done that..

it work now and goes straight to the large file...it doesn't use highslide yet...I guess I have to install this using the instructions off the hgihslide website...I was hoping that it somehow used the highslide plugin for coppermine but I am guessing this isn't possible.

Thanks for the pointers.

Nick

[vuud]

cool, thanks done that..

it work now and goes straight to the large file...it doesn't use highslide yet...I guess I have to install this using the instructions off the hgihslide website...I was hoping that it somehow used the highslide plugin for coppermine but I am guessing this isn't possible.

Thanks for the pointers.

Nick

Whoa.... that is friggin cool!  I am going to have to play with that a bit...

Wow though... and it works in firefox / linux at that...

[nickfzx]

hi Vuud

how do you link through to the intermediate picture

I saw this thread and have spent around an hour trying to do this:

http://forum.coppermine-gallery.net/index.php?topic=12679.msg59885#msg59885

but it doesn't seem to work...is there and easy way of haveing the 'imagelink' => 'intermediate'

btw I have the highslide working as a tester with cpmfetch here:
http://amateurillustrator.com.s2734.gridserver.com/highslide2.2.5/example-no-border.php

Cheers
Nick

[vuud]

hi Vuud

how do you link through to the intermediate picture

I saw this thread and have spent around an hour trying to do this:

http://forum.coppermine-gallery.net/index.php?topic=12679.msg59885#msg59885

but it doesn't seem to work...is there and easy way of haveing the 'imagelink' => 'intermediate'

btw I have the highslide working as a tester with cpmfetch here:
http://amateurillustrator.com.s2734.gridserver.com/highslide2.2.5/example-no-border.php

Cheers
Nick

Its in the docs, but I think i called the intermidaite "normal"

I also got one working last night with highslide, but barely.  One of my goals is to rig something in cpmfetch to make it very very easy to do high slide... its way to cool to not have.

[nickfzx]

I tried normal and its not working...I looked in the documentation and I could only find large, none and album.

[nickfzx]

got what i wanted to o working:
http://amateurillustrator.com.s2734.gridserver.com/forums/

thanks for all the help

except i would like to link to the normal not large image and can't seem to figure this one out...could you point to the docs where it says this?

[nickfzx]

fixed the intermediate image thing...now i get the smaller images coming up instead of the fullsize

to do this i just added a couple of line to cpmfetch_dao.php

changed it from:

Code: [Select]

//function createlink($row) {
function createlink($filepath, $filename, $aid, $pos, $imagelink="int") {

$link= $this->partialUrltocpm;

if ($imagelink == 'album' || $imagelink == 'thumb') {
$link .= 'thumbnails.php?album=' . $aid;
} elseif ($imagelink == 'int') {
$link .= 'displayimage.php?pos=-' . $pos;
} elseif ($imagelink == 'large') {
$link .= 'albums/' . $filepath . $filename;
} elseif ($imagelink == 'none') {
$link = '';
} else {
$link .=  'displayimage.php?pos=-' . $pos;
}

return ($link);

} //end function
to:

Code: [Select]

//function createlink($row) {
function createlink($filepath, $filename, $aid, $pos, $imagelink="int") {

$link= $this->partialUrltocpm;

if ($imagelink == 'album' || $imagelink == 'thumb') {
$link .= 'thumbnails.php?album=' . $aid;
} elseif ($imagelink == 'int') {
$link .= 'displayimage.php?pos=-' . $pos;
} elseif ($imagelink == 'large') {
$link .= 'albums/' . $filepath . $filename;
}

elseif ($imagelink == 'normal') {
$link .= 'albums/' . $filepath . "normal_" . $filename;
}

elseif ($imagelink == 'none') {
$link = '';
} else {
$link .=  'displayimage.php?pos=-' . $pos;
}

return ($link);

} //end function
and the used 'imagelink' => 'normal',

[nickfzx]

I am trying now to get a caption working but don't seem to be able to...

here is the test page:
http://amateurillustrator.com.s2734.gridserver.com/highslide2.2.5/example-no-border.php


I have tried the same method used in the example files for adding captions but that doesn't seem to work at all.

All i want is a link to the intermediate page with all the file info and voting etc...this is available in the highslide plugin for coppermine but I looked through that code an could not make sense of it.

Any help here would be much apreciated.

[nickfzx]

Hi Vuud

so i think you might be able to help me with this one...I want to have information about the image in the caption...I have worked out how to get captions but I can't use the information cpmfetch is providing inside a caption.

Here is my code:  (ignore all the css stuff...the good stuff is at the bottom)

Code: [Select]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "xhtml11.dtd">
<html>
<head>

<script type="text/javascript" src="highslide/highslide.js"></script>

<script type="text/javascript">
    hs.graphicsDir = 'highslide/graphics/';
    window.onload = function() {
    hs.preloadImages(5);
    }
</script>

<style type="text/css">
* {
    font-family: Verdana, Helvetica;
    font-size: 10pt;
}
.highslide {
cursor: url(highslide/graphics/zoomin.cur), pointer;
    outline: none;
}
.highslide img {
border: 2px solid gray;
}
.highslide:hover img {
border: 2px solid silver;
}

.highslide-image {
    border-bottom: 1px solid white;
}
.highslide-image-blur {
}
.highslide-caption {
    display: none;
   
    border-bottom: 1px solid white;
    font-family: Verdana, Helvetica;
    font-size: 10pt;
    padding: 5px;
    background-color: silver;
}
.highslide-loading {
    display: block;
color: white;
font-size: 9px;
font-weight: bold;
text-transform: uppercase;
    text-decoration: none;
padding: 3px;
border-top: 1px solid white;
border-bottom: 1px solid white;
    background-color: black;
   
    padding-left: 22px;
    background-image: url(highslide/graphics/loader.gif);
    background-repeat: no-repeat;
    background-position: 3px 1px;
   
}

a.highslide-credits,
a.highslide-credits i {
    padding: 2px;
    color: silver;
    text-decoration: none;
font-size: 10px;
}
a.highslide-credits:hover,
a.highslide-credits:hover i {
    color: white;
    background-color: gray;
}
.highslide-display-block {
    display: block;
}
.highslide-display-none {
    display: none;
}
</style>

</head>

<body>

<div id="highslide-container"></div>
<?php
include "../cpmfetch/cpmfetch.php";
$objCpm = new cpm("../galleries/");


$options = array( "cellattributes" => array('align' => 'center', 'width' => '100', 'height' => '100'),
'<href="http://amateurillustrator.com.s2734.gridserver.com/galleries/displayimage.php?pos=-%i" class="highslide">
<img src="http://amateurillustrator.com.s2734.gridserver.com/galleries/displayimage.php?pos=-%i" alt="Highslide JS"
</a>', 
'imagelink' => 'normal',
'subtitle' => 'Album: %a',
"linkstyle" => 'highslide" id="thumb2" onclick="return hs.expand(this)" onmouseover="self.status=\'Click to enlarge thumbnail\'; return true;');

$objCpm->cpm_viewRandomMedia(1,7, $options); 

echo "<div class='highslide-caption' id='caption-for-thumb2'>".$options['subtitle']."This cssaption can be styled using CSS.</div>";

$objCpm->cpm_close();
?>
</body>
</html>
you can see what the code does here: http://amateurillustrator.com.s2734.gridserver.com/highslide2.2.5/example-no-border.php

if you click on a thumbnail you will see that the captions are coming up but instead of the information being shown about the album name it simple says %a.  Is there a way of getting round this issue...I have tried a few things but with no luck.


Cheers

nick

[vuud]

Yeah, I don't think there was anything in there to get a link to the normal size photos...

Sorry about that.  I will add it into the next release if I remember it.

[vuud]

Hi Vuud

so i think you might be able to help me with this one...I want to have information about the image in the caption...I have worked out how to get captions but I can't use the information cpmfetch is providing inside a caption.

Here is my code:  (ignore all the css stuff...the good stuff is at the bottom)

Code: [Select]

<div id="highslide-container"></div>
<?php
include "../cpmfetch/cpmfetch.php";
$objCpm = new cpm("../galleries/");


$options = array( "cellattributes" => array('align' => 'center', 'width' => '100', 'height' => '100'),
'<href="http://amateurillustrator.com.s2734.gridserver.com/galleries/displayimage.php?pos=-%i" class="highslide">
<img src="http://amateurillustrator.com.s2734.gridserver.com/galleries/displayimage.php?pos=-%i" alt="Highslide JS"
</a>', 
'imagelink' => 'normal',
'subtitle' => 'Album: %a',
"linkstyle" => 'highslide" id="thumb2" onclick="return hs.expand(this)" onmouseover="self.status=\'Click to enlarge thumbnail\'; return true;');

$objCpm->cpm_viewRandomMedia(1,7, $options); 

echo "<div class='highslide-caption' id='caption-for-thumb2'>".$options['subtitle']."This cssaption can be styled using CSS.</div>";

$objCpm->cpm_close();
?>
</body>
</html>

The $options['subtitle'] is only going to set what you put into the $options tag before the call.  It has nothing to do with the photos being displayed.

I've played with this a bit at home and so far think the best way to work with the highslide stuff is to get the results back from cpmfetch and build your own listing.  I also toyed with some other ideas, but for now that seems to be the best route.

I can post the code I have later on tonight, it sucks, but it could get you started.  This is one of the weaknesses of cpmfetch - you get basically one output mechanism.  HTML (or xHTML if you are lucky).  I'd like to be able to extend it so that I you can select the output mechanism and it would produce something useful based on the same inputs.

So you could get

* Text
* DHTML
* CSS
* HTML
* Highslide

etc...

But that aint gonna happen this week, and won't even be looked at till after the bridging issues are resolved, the docs are updated and I get some sleep.

It would also be cool to do a callback... you submit a function name and cpmfetch calls it for each image it needs to display - but the learning curve gets steep there and I don't think I want to inflict that on people

Vuud