[RC] Highslide 4.1.8 Zoom/Slideshow/Watermark (Gallery)

A place for MOD Authors to post and receive feedback on MODs still in development. No MODs within this forum should be used within a live environment!
Anti-Spam Guide
User avatar
shortmort37
Registered User
Posts: 656
Joined: Sat Aug 26, 2006 8:40 pm
Location: Upper Darby, PA, USA
Name: Dan Morton
Contact:

Re: [RC] Highslide 4.1.8 Zoom/Slideshow/Watermark (Gallery)

Post by shortmort37 »

shortmort37 wrote:
shortmort37 wrote:There's still a <div> in there between thumbs that's flummoxing up the works. The <div> is coming from inline-attachment. But, this is what is in content.css:

Code: Select all

/* Inline image thumbnails */
div.inline-attachment dl.thumbnail, div.inline-attachment dl.file {
	display: inline;
	margin-bottom: 4px;
}
"inline", not "block" - the latter resulting in a <div>. So, where is it coming from?! tweaks.css, I bet...
Nope. That's not it, either. At a loss.

Dan
At a loss no more! If you want to use Johnni's most excellent Highslide Gallery with inline attachments, instead of within an attachbox, make the changes below (I worked with the prosilver theme only). Inline attachments have the advantage that, after you load your attachments, you can reorder their position by changing the location of the

[attachment=N]IMG_0712.JPG[/attachment]

within the posting textbox. Note that as you attach images, all [attachment=N]...[/attachment] pairs appear on a separate line in the posting textbox; after you reorder, you need to place all pairings on a single line, to prevent an offset occurring in the displayed result for each image as you move across the row.

content.css in the prosilver/theme subdir - change this:

Code: Select all

/* Inline image thumbnails */
div.inline-attachment dl.thumbnail, div.inline-attachment dl.file {
	display: block;
	margin-bottom: 4px;
}
to this:

Code: Select all

/* Inline image thumbnails */
div.inline-attachment dl.thumbnail, div.inline-attachment dl.file, div.inline-attachment {
	display: inline;
	float: left;
	margin-bottom: 4px;
}
highslide.css in the highslide subdir - change this:

Code: Select all

.highslide-gallery ul li {
display: block;
to this:

Code: Select all

.highslide-gallery ul li {
display: inline;
Have fun!

Dan
Muppi
Registered User
Posts: 11
Joined: Tue Sep 21, 2010 7:12 am

Re: [RC] Highslide 4.1.8 Zoom/Slideshow/Watermark (Gallery)

Post by Muppi »

I have an Question.
If I take the pictures you can leave your menu stand still and I can not close it. Can you tell me why?
Image

I can niot Remove Controls Button !!!!!!!
Last edited by Muppi on Mon Nov 15, 2010 8:40 pm, edited 1 time in total.
User avatar
shortmort37
Registered User
Posts: 656
Joined: Sat Aug 26, 2006 8:40 pm
Location: Upper Darby, PA, USA
Name: Dan Morton
Contact:

Re: [RC] Highslide 4.1.8 Zoom/Slideshow/Watermark (Gallery)

Post by shortmort37 »

jonnilaumann wrote:
shortmort37 wrote:Is there a way to get inline thumbnails to display horizontally, instead of inline?
surely..i will try to see what can be done, but my php coding skills isnt that good, like you I mostly just try changing code. I know there is some BBcode Mod that lets you place inline picture anywhere, but thats another way to do it...
Hi Jonni, you know from this thread that I was able to "mod your mod" so that I can put inline attachments in a gallery style - this permits me to reorder the placement. Now I'd like to be able to incorporate the JW Player within highslide as well. I know that, without my modifications (i.e., all inline attachments in a single column), you can mix images with multimedia, and highslide will present only the images. That's fine - but, I'd like to be able to put the .flv in the gallery as well. I just don't know how to integrate JWP/Highslide with phpBB.

I've posted on the Highslide forum about it, but Hilde says she's not able to help:
http://www.highslide.com/forum/viewtopi ... 607#p38607

Got any ideas about how to do this?

Dan
Muppi
Registered User
Posts: 11
Joined: Tue Sep 21, 2010 7:12 am

Re: [RC] Highslide 4.1.8 Zoom/Slideshow/Watermark (Gallery)

Post by Muppi »

Sorry can yours help by my Question ?
sevenalive
Registered User
Posts: 437
Joined: Thu Feb 07, 2008 4:45 am

Re: [RC] Highslide 4.1.8 Zoom/Slideshow/Watermark (Gallery)

Post by sevenalive »

I don't have any issue, but I am having trouble understanding your problem.
Muppi
Registered User
Posts: 11
Joined: Tue Sep 21, 2010 7:12 am

Re: [RC] Highslide 4.1.8 Zoom/Slideshow/Watermark (Gallery)

Post by Muppi »

When i close the picture than the Toolbar from highslide remains
Pro Picture 1 Tollbar they will not close
:lol:
betteryouthanme
Registered User
Posts: 5
Joined: Mon Nov 15, 2010 9:49 am

Re: [RC] Highslide 4.1.8 Zoom/Slideshow/Watermark (Gallery)

Post by betteryouthanme »

Hello,

Great mod!

But I got some issues..
http://www.royalpararegiment.com/www/in ... p=516#p516

Like you see there are no buttons, no dimmed background, ..
What's wrong?
Thank you very much for your help.
Need any additional infos?
Muppi
Registered User
Posts: 11
Joined: Tue Sep 21, 2010 7:12 am

Re: [RC] Highslide 4.1.8 Zoom/Slideshow/Watermark (Gallery)

Post by Muppi »

I have my Problem Locatet:
In the head tags of the page i have first this:

Code: Select all

<script type="text/javascript" src="./gallery/plugins/highslide/highslide-full.js"></script>
   <link rel="stylesheet" type="text/css" href="./gallery/plugins/highslide/highslide.css" />
   <script type="text/javascript">
      hs.graphicsDir = './gallery/plugins/highslide/graphics/';
      hs.align = 'center';
      hs.transitions = ['expand', 'crossfade'];
      hs.fadeInOut = true;
      hs.dimmingOpacity = 0.8;
      hs.outlineType = 'rounded-white';
      hs.captionEval = 'this.thumb.title';
      // This value needs to be set to false, to solve the issue with the highly increasing view counts.
      hs.continuePreloading = false;

      // Add the slideshow providing the controlbar and the thumbstrip
      hs.addSlideshow({
         interval: 5000,
         repeat: false,
         useControls: true,
         fixedControls: 'fit',
         overlayOptions: {
            opacity: .75,
            position: 'top center',
            hideOnMouseOut: true
         }
      });
   </script>
And then this:

Code: Select all

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

<link rel="stylesheet" type="text/css" href=".//highslide/highslide.css" />      
<script type="text/javascript">
   hs.graphicsDir = 'highslide/graphics/';
   hs.align = 'center';
   hs.transitions = ['expand', 'crossfade'];
   hs.fadeInOut = false;
   hs.dimmingOpacity = 0.75;
   hs.wrapperClassName = 'borderless';
   hs.captionOverlay.hideOnMouseOut = true;
   hs.marginLeft = 85;
   hs.marginBottom = 0;
   hs.marginTop = 0;
   hs.numberPosition = 'caption';

   

   // Adding the controlbar
   if (hs.addSlideshow) hs.addSlideshow({
      //slideshowGroup: 'group1',
      interval: 3000,
      repeat: false,
      useControls: true,
      fixedControls: true,
      overlayOptions: {
         opacity: .6,
         position: 'top center',
         hideOnMouseOut: true
      }
   });
</script>
I need to remove one of them to avoid the duplicated controlbars in upper left corner of the page.
My Question on you
what file that holds the head tags in the forum setup iam are using? :shock:
Muppi
Registered User
Posts: 11
Joined: Tue Sep 21, 2010 7:12 am

Re: [RC] Highslide 4.1.8 Zoom/Slideshow/Watermark (Gallery)

Post by Muppi »

Can you help me ?
rocker84
Registered User
Posts: 1
Joined: Fri Nov 19, 2010 6:00 pm

Re: [RC] Highslide 4.1.8 Zoom/Slideshow/Watermark (Gallery)

Post by rocker84 »

GREAT mod! is there any way it can include the previous pages attachments ? ej" 2 previous pages" or "1 previous page and 1 next page"
User avatar
jonnilaumann
Registered User
Posts: 56
Joined: Mon Nov 30, 2009 12:32 am

Re: [RC] Highslide 4.1.8 Zoom/Slideshow/Watermark (Gallery)

Post by jonnilaumann »

To muppi
<script type="text/javascript" src="./gallery/plugins/highslide/highslide-full.js"></script>
..looks like you have some kind of "gallery mod" installed.that also uses the "highslide" script. placed in your gallery/plugins/ folder. So you dont need to install My Mod also, because its only the highslide script.

So if you still need to use your gallery Mod you use the first, delete the second(and delete my mod if installed)..If you want gallery funktions you maybe need to change:
<script type="text/javascript" src="./gallery/plugins/highslide/highslide-full.js"></script>
to:
<script type="text/javascript" src="./gallery/plugins/highslide/highslide-with-gallery.js"></script>
depending if your version of highslide in your gallery mod is 4.1.8 or above.

And maybe decide if you have to update the higslide folder with newer higslide version .I dont know the size or how komplex your other gallery MOD is. So to Move higslide folder to forum root like i have done in My mod, and then find and replace all directions within Your gallery Mod, could be a larger task, depending your skills

If you dont use that gallary mod, then delete the hole Mod... and use only my mod , and make the tweaks to get a gallery(see tweaks). Gallery meaning small thumbnails side by side. Higslide script is just a viewer
betteryouthanme
Registered User
Posts: 5
Joined: Mon Nov 15, 2010 9:49 am

Re: [RC] Highslide 4.1.8 Zoom/Slideshow/Watermark (Gallery)

Post by betteryouthanme »

@jonnilaumann (PM):

Am allowed to send pm's only to you until I got 5 posts :ugeek:

Thanks a lot for your help.

I've fixed double //.
But the graphics folder still won't work.
jonnilaumann wrote:try change to
hs.graphicsDir = 'phpBB3/highslide/graphics/
or:
hs.graphicsDir = 'www/phpBB3/highslide/graphics/
Tried both.. Also tried full URL, "../" in-front but nothing helped.
sevenalive
Registered User
Posts: 437
Joined: Thu Feb 07, 2008 4:45 am

Re: [RC] Highslide 4.1.8 Zoom/Slideshow/Watermark (Gallery)

Post by sevenalive »

it should just be:
graphicsDir : 'highslide/graphics/',
betteryouthanme
Registered User
Posts: 5
Joined: Mon Nov 15, 2010 9:49 am

Re: [RC] Highslide 4.1.8 Zoom/Slideshow/Watermark (Gallery)

Post by betteryouthanme »

Won't work lads..
This is what I got now:

Code: Select all

<!-- IF SCRIPT_NAME == "viewtopic" or SCRIPT_NAME == "posting" or SCRIPT_NAME == "ucp" or SCRIPT_NAME == "search" -->
<script type="text/javascript" src="{ROOT_PATH}highslide/highslide-with-gallery.js"></script>
<link rel="stylesheet" type="text/css" href="{ROOT_PATH}highslide/highslide.css" />      
<script type="text/javascript">
	hs.graphicsDir = 'highslide/graphics/';
	hs.align = 'center';
	hs.transitions = ['expand', 'crossfade'];
	hs.fadeInOut = false;
	hs.dimmingOpacity = 0.75;
	hs.wrapperClassName = 'borderless';
	hs.captionOverlay.hideOnMouseOut = true;
	hs.marginLeft = 85;
	hs.marginBottom = 0;
	hs.marginTop = 0;
	hs.numberPosition = 'caption';

	// Adding the Watermark
	hs.registerOverlay({
	html: '<div class="watermark" onclick="return hs.close(this)" title="Close" style="width:120px; height: 120px; background: url(highslide/graphics/watermark.png)"></div>',
	hideOnMouseOut: true,
	opacity: 0.4,
	repeat: false,
	position: 'top right',
	fade: 2 // fading the semi-transparent overlay looks bad in IE
	})

	// Adding the controlbar
	if (hs.addSlideshow) hs.addSlideshow({
		//slideshowGroup: 'group1',
		interval: 3000,
		repeat: false,
		useControls: true,
		fixedControls: true,
		overlayOptions: {
			opacity: .6,
			position: 'top center',
			hideOnMouseOut: true
		},
		thumbstrip: {
			position: 'middle left',
			mode: 'vertical',
			relativeTo: 'viewport'
		}
	});
</script>
<!-- ENDIF -->
The double // is fixed

Code: Select all

{ROOT_PATH}/highslide/highslide-with-gallery.js
changed to

Code: Select all

{ROOT_PATH}highslide/highslide-with-gallery.js
But the graphics folder is still not found..
sevenalive
Registered User
Posts: 437
Joined: Thu Feb 07, 2008 4:45 am

Re: [RC] Highslide 4.1.8 Zoom/Slideshow/Watermark (Gallery)

Post by sevenalive »

Well you got a few issues, first why is your site root: http://www.royalpararegiment.com/www/ instead of http://www.royalpararegiment.com/, why the www folder, you can get rid of that.

try these, but make sure you clear you browser cache before testing and changing them or you might miss the one that will work

hs.graphicsDir = '{ROOT_PATH}highslide/graphics/';
hs.graphicsDir = www/highslide/graphics/';
hs.graphicsDir = /highslide/graphics/';
hs.graphicsDir = /www/highslide/graphics/';
Locked

Return to “[3.0.x] MODs in Development”