[2.0.11] Resize Posted Images Based on Max Width

The cleanup is complete. This forum is now read only.

Rating:

Excellent!
46
64%
Very Good
10
14%
Good
10
14%
Fair
3
4%
Poor
3
4%
 
Total votes: 72

spooky2280
Registered User
Posts: 142
Joined: Tue Jul 20, 2004 8:48 pm

Post by spooky2280 »

Make sure to test it in all major browsers. Did you try a negative right or left margin for the image instead (like -150%) (you would set it with javascript right in the js file)? I think the gap problem is only with IE so you can detect it with
if (window.ActiveXObject) {
obj.style.marginRight = '-150%';
}

As stated on the demo baord, my other MOD doesn't have this problem and doesn't have a fixed width either:
www.christianfecteau.com/mw3d
SweetLou
Registered User
Posts: 180
Joined: Thu Dec 23, 2004 2:49 am

Post by SweetLou »

No, I didn't test it in all major browsers. It works in IE based browsers and Firefox. I didn't try it in any other browser. Though, this is not a big concern for me, since the forum I am trying to make this is for an IE based browser. So, 99% of visits is with an IE based browser. There is a problem though, I have to work on it a bit more. I will remove the code until I correct it.
Yes, I know your other mod works great, but I just hate the scrollbar for long text.

Edit: The problem was with long topic titles. Since what I had removed a cell and made the button images and the subject and post date all in one cell instead of two. If there was a long subject, it would push the buttons causing them to go onto multiple lines. I fixed this by making the post date and the subject title be on their own lines. You can check out what I did at http://kevinmcnamee.com/test/viewtopic.php?t=2. You shouldn't need to register, but if needed, you can use
username: test
password: test
NightriderXP
Registered User
Posts: 1418
Joined: Sat Oct 09, 2004 8:17 am
Location: Florida, US
Contact:

Post by NightriderXP »

SweetLou, your little test forum doesn't seem to display the images within the display area when using Opera. This is what I see when the page is fully loaded...

Image

Edit: After your Edit, I went back to your test forum and found that it is displaying the images a bit better than before in Opera. This is what I see now. It is better, but it still isn't quite right. There shouldn't be a horizontal scroll bar showing when the page is fully loaded...

Image

99% of my members use an alternative browser to IE, so any change that I make to my board has to work correctly for all browsers. I won't promote one browser over another one by adding code that works only for the browser(s) that I prefer. Everyone should be able to have a choice of what browser they use and no code added to phpBB should exclude any browser simply because a very large company has managed to kill most of it's competition and has flooded the market with it's own proprietary browser, which by the way is full of security holes and bugs...

Whenever you submit code for phpBB which is IE specific, you should clearly specify that it is only IE compliant so that everyone will have a chance to decide whether they want to exclude all other browsers fron their communities. Hopefully most admins will avoid browser specific modifications to their boards and only add code that will work in ALL browsers...

:(
SweetLou
Registered User
Posts: 180
Joined: Thu Dec 23, 2004 2:49 am

Post by SweetLou »

It isn't only IE specific, it also works with Firefox. I also agree with you about having code that works for as many browsers as possible. I usually run Linux, so I don't use IE or IE based browsers that often. I was just trying to get this to work for an IE based browser website that is mostly visited by IE or one of its based browsers. Which, I did mention it my later post. Sorry for not making that more clear.
But, what I don't understand is that it displays just fine for me when I use Opera. Hmmm, I don't know. It is a work in progress, that is why I removed the code and I thought the link to the test site.
Though, I have noticed that at times, the images will not display properly. But, if I close the browser and come back, it will.

Edit: I just saw your edit. It might be the same thing that I get, where one time the images won't be resized. When I view it in Opera, I do get the resized images of 600 pixels.
spooky2280
Registered User
Posts: 142
Joined: Tue Jul 20, 2004 8:48 pm

Post by spooky2280 »

SweetLou, you should start a topic in the BETA forum for this and post the link here afterwards. I'm subscribed to this topic here so I can give support for my MOD and I don't have time to come back for each reply that this new discussion will generate. I will see if I can fix this gap problem right in the js file and if I can, I will release a new version of the MOD.
User avatar
Fr0zen
Registered User
Posts: 191
Joined: Tue Dec 21, 2004 6:26 am
Location: Chicago, Illinois
Contact:

Post by Fr0zen »

I have a problem when using html posts the mod does not resize the images anymore why is this so. ? Also is there a way to fix this. ?
spooky2280
Registered User
Posts: 142
Joined: Tue Jul 20, 2004 8:48 pm

Post by spooky2280 »

I believe you're looking for this (that I coded very fast):
http://www.phpbb.com/phpBB/viewtopic.ph ... 44#1402044
http://www.phpbb.com/phpBB/viewtopic.ph ... 74#1417674
and you should use a case insensitive preg_replace for the second str_replace:
http://www.phpbb.com/phpBB/viewtopic.ph ... 34#1426034
User avatar
Fr0zen
Registered User
Posts: 191
Joined: Tue Dec 21, 2004 6:26 am
Location: Chicago, Illinois
Contact:

Post by Fr0zen »

ahh thanks, Do I need to do all 3 of those ?

I did the first and this is what I got where images are posted I followed the steps exactly...

img resizemod="on" onload="rmw_img_loaded(this)" src="http://home.comcast.net/~jamesr316/bimmer01.jpg" border="0" />
img resizemod="on" onload="rmw_img_loaded(this)" src="http://home.comcast.net/~jamesr316/bimmer03.jpg" border="0" />
img resizemod="on" onload="rmw_img_loaded(this)" src="http://home.comcast.net/~jamesr316/bimmer04.jpg" border="0" />
img resizemod="on" onload="rmw_img_loaded(this)"
spooky2280
Registered User
Posts: 142
Joined: Tue Jul 20, 2004 8:48 pm

Post by spooky2280 »

HTML is like this:

<element_name attribute="value" attribute="value" attribute="value"></element_name>

The img element does not require a closing tag. Refer to this:
http://msdn.microsoft.com/workshop/auth ... ts/img.asp
spooky2280
Registered User
Posts: 142
Joined: Tue Jul 20, 2004 8:48 pm

Post by spooky2280 »

Do a Quote for this message to get the MOD files properly formatted in the textarea

For the gap, you remove width="100%" from the left cell and you add align="right" to the right cell. That's it.

Code: Select all

##############################################################
## MOD Title:          Resize Posted Images with HTML tag
## MOD Author:         spooky2280 < [email protected] > (Christian Fecteau) http://portfolio.christianfecteau.com/
## MOD Description:    This MOD makes "Resize Posted Images Based on Max Width MOD" processes
##                     images posted with HTML <img> tag
##
## MOD Version:        1.0.2
##
## Installation Level: Easy
## Installation Time:  5 Minutes
##
## Files To Edit:      4
##      viewtopic.php
##      posting.php
##      includes/topic_review.php
##      privmsg.php
##
## Included Files:     none
##
##############################################################
## For Security Purposes, Please Check: http://www.phpbb.com/mods/ for the
## latest version of this MOD. Downloading this MOD from other sites could cause malicious code
## to enter into your phpBB Forum. As such, phpBB will not offer support for MOD's not offered
## in our MOD-Database, located at: http://www.phpbb.com/mods/
##############################################################
## Author Notes:
##
## If the user specifies the width and height attributes,
## the script might fail or behave abnormally. The script assumes
## that width and height won't be set on the IMG element.
## If the members of your board are used to specify the width
## and height attributes when they post images with HTML,
## it is recommended to not install this add-on to the MOD.
## Disable the IMG tag for allowed HTML in the ACP instead
## of making the modifications below.
##
##############################################################
## MOD History:
##
##   2005-03-18 - Version 1.0.2
##      - case-insensitive replace
##
##   2005-01-19 - Version 1.0.1
##      - Fixed a OPEN
##
##   2005-01-19 - Version 1.0.0
##      - First release
##
##############################################################
## Before Adding This MOD To Your Forum, You Should Back Up All Files Related To This MOD
##############################################################
#
#-----[ OPEN ]------------------------------------------
#
viewtopic.php
#
#-----[ FIND ]------------------------------------------
#
# around line 1136
#
$message = str_replace("\n", "\n<br />\n", $message);
#
#-----[ AFTER, ADD ]------------------------------------------
#
	$message = str_replace('resizemod="on" onload="rmw_img_loaded(this)"','',$message);
	$message = preg_replace('#<img#is','<img resizemod="on" onload="rmw_img_loaded(this)"',$message);
#
#-----[ OPEN ]------------------------------------------
#
posting.php
#
#-----[ FIND ]------------------------------------------
#
# around line 699
#
$preview_message = str_replace("\n", '<br />', $preview_message);
#
#-----[ AFTER, ADD ]------------------------------------------
#
		$preview_message = str_replace('resizemod="on" onload="rmw_img_loaded(this)"','',$preview_message);
		$preview_message = preg_replace('#<img#is','<img resizemod="on" onload="rmw_img_loaded(this)"',$preview_message);
#
#-----[ OPEN ]------------------------------------------
#
includes/topic_review.php
#
#-----[ FIND ]------------------------------------------
#
# around line 181
#
$message = str_replace("\n", '<br />', $message);
#
#-----[ AFTER, ADD ]------------------------------------------
#
			$message = str_replace('resizemod="on" onload="rmw_img_loaded(this)"','',$message);
			$message = preg_replace('#<img#is','<img resizemod="on" onload="rmw_img_loaded(this)"',$message);
#
#-----[ OPEN ]------------------------------------------
#
privmsg.php
#
#-----[ FIND ]------------------------------------------
#
# around line 611
#
$private_message = str_replace("\n", '<br />', $private_message);
#
#-----[ AFTER, ADD ]------------------------------------------
#
	$private_message = str_replace('resizemod="on" onload="rmw_img_loaded(this)"','',$private_message);
	$private_message = preg_replace('#<img#is','<img resizemod="on" onload="rmw_img_loaded(this)"',$private_message);
#
#-----[ FIND ]------------------------------------------
#
# around line 1570
#
$preview_message = str_replace("\n", '<br />', $preview_message);
#
#-----[ AFTER, ADD ]------------------------------------------
#
		$preview_message = str_replace('resizemod="on" onload="rmw_img_loaded(this)"','',$preview_message);
		$preview_message = preg_replace('#<img#is','<img resizemod="on" onload="rmw_img_loaded(this)"',$preview_message);
#
#-----[ SAVE/CLOSE ALL FILES ]------------------------------------------
#
# EoM

Code: Select all

##############################################################
## MOD Title:          Fix IE gap bug with subSilver-like styles
## MOD Author:         spooky2280 < [email protected] > (Christian Fecteau) http://portfolio.christianfecteau.com/
## MOD Description:    This MOD fixes the invisible gap at the right of resized images in
##                     IE with the "Resize Posted Images Based on Max Width MOD"
##
## MOD Version:        1.0.0
##
## Installation Level: Easy
## Installation Time:  5 Minutes
##
## Files To Edit:      1
##      templates/subSilver/viewtopic_body.tpl
##
## Included Files:     none
##
##############################################################
## For Security Purposes, Please Check: http://www.phpbb.com/mods/ for the
## latest version of this MOD. Downloading this MOD from other sites could cause malicious code
## to enter into your phpBB Forum. As such, phpBB will not offer support for MOD's not offered
## in our MOD-Database, located at: http://www.phpbb.com/mods/
##############################################################
## Author Notes:
##
## Basically, what you do is to remove the width="100%" from the left cell
## and you add align="right" to the right cell. That's it.
##
##############################################################
## MOD History:
##
##   2005-03-18 - Version 1.0.0
##      - First release
##
##############################################################
## Before Adding This MOD To Your Forum, You Should Back Up All Files Related To This MOD
##############################################################
#
#-----[ OPEN ]------------------------------------------
#
templates/subSilver/viewtopic_body.tpl
#
#-----[ FIND ]------------------------------------------
#
# around line 32
#
				<td width="100%"><a href="{postrow.U_MINI_POST}"><img src="{postrow.MINI_POST_IMG}" width="12" height="9" alt="{postrow.L_MINI_POST_ALT}" title="{postrow.L_MINI_POST_ALT}" border="0" /></a><span class="postdetails">{L_POSTED}: {postrow.POST_DATE}<span class="gen">&nbsp;</span>&nbsp; &nbsp;{L_POST_SUBJECT}: {postrow.POST_SUBJECT}</span></td>
				<td valign="top" nowrap="nowrap">{postrow.QUOTE_IMG} {postrow.EDIT_IMG} {postrow.DELETE_IMG} {postrow.IP_IMG}</td>
#
#-----[ REPLACE WITH ]------------------------------------------
#
				<td><a href="{postrow.U_MINI_POST}"><img src="{postrow.MINI_POST_IMG}" width="12" height="9" alt="{postrow.L_MINI_POST_ALT}" title="{postrow.L_MINI_POST_ALT}" border="0" /></a><span class="postdetails">{L_POSTED}: {postrow.POST_DATE}<span class="gen">&nbsp;</span>&nbsp; &nbsp;{L_POST_SUBJECT}: {postrow.POST_SUBJECT}</span></td>
				<td valign="top" nowrap="nowrap" align="right">{postrow.QUOTE_IMG} {postrow.EDIT_IMG} {postrow.DELETE_IMG} {postrow.IP_IMG}</td>
#
#-----[ SAVE/CLOSE ALL FILES ]------------------------------------------
#
# EoM
n00bstorm
Registered User
Posts: 481
Joined: Sun Jan 30, 2005 7:52 pm

Post by n00bstorm »

Is there anyway this mod to work for the Photo Album Ad on? It says there is some kind of program called GD i balive but it looks WAY dificult to install so i was wondering if this would work?
spooky2280
Registered User
Posts: 142
Joined: Tue Jul 20, 2004 8:48 pm

Post by spooky2280 »

You just need to have the onload event and the resizemod attribute on the IMG elements that you want the mod to process. Edit the tpl files of this MOD like I do in bbcode.tpl
If the HTML for the IMG element is formatted inside a PHP script, edit the script then.
rosdahale
Registered User
Posts: 88
Joined: Tue Mar 29, 2005 4:01 pm

Post by rosdahale »

I am having trouble installing.....

These are the instructions:

Code: Select all

## Installation Level: Easy
## Installation Time:  5 Minutes (1 minute with EasyMod)
##
## Files To Edit:      7
##      templates/subSilver/bbcode.tpl
##      templates/subSilver/overall_header.tpl
##      templates/subSilver/overall_footer.tpl
##      templates/subSilver/simple_header.tpl
##      templates/subSilver/simple_footer.tpl
##      includes/page_header.php
##      language/lang_english/lang_main.php
##
## Included Files:     1
##      templates/rmw_jslib.js
##
##############################################################
## For Security Purposes, Please Check: http://www.phpbb.com/mods/ for the
## latest version of this MOD. Downloading this MOD from other sites could cause malicious code
## to enter into your phpBB Forum. As such, phpBB will not offer support for MOD's not offered
## in our MOD-Database, located at: http://www.phpbb.com/mods/
##############################################################
## Author Notes:
##
## This MOD uses Javascript and works in all W3C DOM browsers:
## NN6+, IE5+, Mozilla/Firefox/Camino, Safari, Opera7+, etc.
##
## To set a different max width than the 400 pixels default one:
##    1. OPEN overall_header.tpl and simple_header.tpl in templates/subSilver/
##    2. FIND rmw_max_width = 400
##    3. CHANGE 400 to the width in pixels that you want for this template
##    4. REPEAT steps 1 to 3 for each of your other templates (if any)
##
## Don't forget to edit all your templates and languages in addition to subSilver and lang_english
##
##############################################################
I am not using the subsilver style. I am using monkidream. I have copied the rmw_jslib.js file in to /templates BUT the line it says to edit (2. FIND rmw_max_width = 400) is not there any any of the files (overall_header ect...) Please what do I do to install this thing ??
andyjohnson
Registered User
Posts: 5
Joined: Sat Apr 23, 2005 5:46 pm

Post by andyjohnson »

dunno aint installeditis it free?
SamuraiNigel
Registered User
Posts: 19
Joined: Mon Mar 21, 2005 5:47 pm

Post by SamuraiNigel »

I installed this mod and it is making threads with images load very slowly. I'm using a very fast computer on a T1 connection, and my server has a fat bandwidth connection and is a fast machine. Threads with one picture aren't a big deal, but threads with as little as 4 or 5 pictures are just bogging way down, even when there is no resizing going on. What's happening here? Why are these threads so slow and is there any way to fix this?

Sometimes I'll click to open a thread and it won't even open at all, it just eventually times out. Speed of thread loading is my priority here, how do I fix this?
Post Reply

Return to “[2.0.x] MOD Database Cleanup”