photo thumbnails won't show

[CoolMama]

I have placed a Photo Album on my hosted web server, but the thumbnails of the photos aren't showing up. Originally I placed these files in my root directory because of where the web.config file had to be. But I got an error and couldn't see the page. The files were mixed up with the other files in my root directory which display my portfolio. So then my hosting service set up a subweb for the photo album (megan). Now there are no errors, but you can't see the thumbnails for the photos. It worked on my IIS. Here is the offending page:

http://www.dawningdesigns.net/megan/photos.aspx

There does not seem to be a permissions problem with the photos folder because you can see the pics with a direct link.

http://www.dawningdesigns.net/megan/photos/2001/Aunt Kathy.jpg

Here is how the photos folder works:

photos
2000
Christmas Elf.jpg
Mommy and Me.jpg
2001
etc...
2002
2003

Here is my ASP code:

private void Page_Load(object sender, System.EventArgs e){
string[] files = Directory.GetDirectories(MapPath("./photos"));
			if(files.Length <= 0)
			{
				drpdwnPhotos.Items.Add("No Albums Available");
				hasFiles = false;
				return;
			}
			hasFiles = true;
			int names = 1 + files[0].LastIndexOf(@"\");
			foreach (string file in files)
			{
				ListItem item = new ListItem();
				item.Value = file;
				item.Text = file.Substring(names);
				drpdwnPhotos.Items.Add(item);
			}

			hasAlbum = (Request.Cookies["albumName"] != null);
			if(hasAlbum) 
				albumNamestr = Request.Cookies["albumName"].Value;
			else
				albumNamestr = files[0];

			photoFiles = Directory.GetFiles(albumNamestr);
			photoCount = photoFiles.Length;
			if (photoCount <= 0) return;

			int nameIndex = 1 + albumNamestr.LastIndexOf(@"\");
			string albumStr = "<b>Album Year:</b> " + albumNamestr.Substring(nameIndex);
			lblAlbumName.Text = albumStr;

			dataAlbum.DataSource = photoFiles;
			dataAlbum.DataBind();

			HttpCookie MyCookie = new HttpCookie("albumName");
			MyCookie.Value = albumNamestr;
			MyCookie.Expires = DateTime.Now.AddDays(1);
			Response.Cookies.Add(MyCookie);
		}
		protected void ShowFullImageHandler(object sender, System.Web.UI.WebControls.CommandEventArgs e)
		{
			string photoPath = ((ImageButton)sender).CommandName;
			Session["photoPath"] = photoPath;
			Session["photoFiles"] = photoFiles;
			Session["photoIndex"] = photoIndex(photoPath);
			Session["albumName"] = albumNamestr;

			Server.Transfer("imageView.aspx");
		}

		public int photoIndex(string photoPath)
		{
			return Array.IndexOf(photoFiles, photoPath);
		}

Dawn

http://www.dawningdesigns.net

 

[adamroof]

forgot to comment...

in your page load
also added if (!Page.IsPostBack){

and where u set your Album Year
folderStr = albumNamestr.Substring(nameIndex);

Also

ill take that down as soon as we wrap up here, just want u to have a live example.

 

[CoolMama]

OK, first of all, I have to object to the photo of a gun pointed at a cat. As much as I appreciate your help, I'll have to dock you points on that one.

Second, we're definitely closer. My thumbnails are showing. However, in the table cells where there are no pics left to display, it's showing the X-boxes for missing pics. And, just like with your example, if you click on a thumbnail, you get the following error. But I think it's just a case of figuring out how to handle the NULL factor.

[red]Value cannot be null. Parameter name: array
Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.

Exception Details: System.ArgumentNullException: Value cannot be null. Parameter name: array

Source Error:


Line 100: public int photoIndex(string photoPath)
Line 101: {
Line 102: [blue]return Array.IndexOf(photoFiles, photoPath);[/blue]
Line 103: }
Line 104:

[/red]

Dawn

http://www.dawningdesigns.net

 

[adamroof]

yeah, but did u see his paws up...i was roflmao when i first saw that one.

for the empty ones...we'll have to see it live to see why its doing that. maybe you have some files in there that are not pics? in that case we will have to filter for only jpgs and gifs and bmps, ie.

what are u sending in and how are u using the photoIndex within the imageview.aspx? Do u need to adjust the photoPath variable too?

 

[CoolMama]

I would love to show it live, but when it's placed on my outside server, I get an error. Like there's some deployment procedure I'm not aware of.

[red]Compilation Error
Description: An error occurred during the compilation of a resource required to service this request. Please review the following specific error details and modify your source code appropriately.

Compiler Error Message: CS0103: The name 'getRelative' does not exist in the class or namespace 'ASP.photos_aspx'

Source Error:



Line 41: BackColor="Azure" CellPadding="6" HorizontalAlign="Left" RepeatDirection="Horizontal">
Line 42: <ItemTemplate>
Line 43: [blue]<asp:ImageButton ID="ibThumbs" Runat="server" ImageUrl="<%# getRelative(Container.DataItem.ToString()) %>" Width="115" Height="115" OnCommand="ShowFullImageHandler" CommandName="<%# getRelative(Container.DataItem.ToString()) %>">[/blue]
Line 44: </asp:ImageButton>
Line 45: </ItemTemplate>
[/red]

I'll have to take a look at ImageView.aspx to see where things need help.

Dawn

http://www.dawningdesigns.net

 

[CoolMama]

OK, I got rid of the extra autogenerated files that were interfering with the thumbnails (on IIS). But still getting the same error when selecting a thumbnail.

[blue]return Array.IndexOf(photoFiles, photoPath);[/blue]

But can't tell from imageView file what I would need to change. (I decided to go back to the Visual Studio 2003 version to figure this all out.)

front end...

<form id="Form1" method="post" runat="server">
			<P align="center"><IMG alt="Megan" src="images/top.jpg"></P>
			<P align="center">
				<asp:Label id="lblAlbum" runat="server" Width="456px"></asp:Label></P>
			<P align="center">
				<asp:Label id="lblPhoto" runat="server" Width="480px"></asp:Label></P>
			<P align="center">
				<asp:Button id="butBack" runat="server" Text="Back" BackColor="MidnightBlue" BorderColor="MidnightBlue"
					ForeColor="White"></asp:Button>&nbsp;&nbsp;
				<asp:Button id="butReturn" runat="server" Text="Return to Album List" BackColor="White" BorderColor="White"
					ForeColor="MidnightBlue"></asp:Button>&nbsp;&nbsp;
				<asp:Button id="butForward" runat="server" Text="Forward" BackColor="MidnightBlue" BorderColor="MidnightBlue"
					ForeColor="White"></asp:Button></P>
			<P align="center">
				<asp:Image id="imgPhoto" runat="server" Width="450px"></asp:Image></P>
		</form>

back end...

public class imageView : System.Web.UI.Page
	{
      protected string albumName = "";
      protected string photoName = "";
      protected string photoPath;
      protected string[] photoFiles = null;
      protected int photoIndex = -1;
      protected int photoFileLength = 0;

      protected System.Web.UI.WebControls.Label lblAlbum;
      protected System.Web.UI.WebControls.Image imgPhoto;
      protected System.Web.UI.WebControls.Button butBack;
      protected System.Web.UI.WebControls.Button butReturn;
      protected System.Web.UI.WebControls.Button butForward;
      protected System.Web.UI.WebControls.Label lblPhoto;
  
	  private void Page_Load(object sender, System.EventArgs e)
	  {
		if(Session["albumName"] != null) albumName = Session["albumName"].ToString();
		lblAlbum.Text = "<b>Album Year:</b> " + StripPath(albumName);

		if(Session["photoIndex"] == null) return;
		photoIndex = (int)Session["photoIndex"];

		if (Session["photoFiles"] == null) return;
		photoFiles = (string[])Session["photoFiles"];
		photoFileLength = photoFiles.Length;
		if(photoFileLength <= 0) return;

		//while(photoIndex >= photoFileLength) photoIndex -= photoFileLength;
		//while(photoIndex < 0) photoIndex += photoFileLength;
		if( photoIndex >= photoFileLength ) photoIndex = photoFileLength - 1;
		if( photoIndex < 0 ) photoIndex = 0;

		photoPath = photoFiles[photoIndex];
		photoName = StripPath(photoPath);

		lblPhoto.Text = "<b>Photo Name:</b> " + photoName;
		imgPhoto.ImageUrl = photoPath;
		} // Page_Load

    string StripPath(string filePath)
    {
      int nameDex = -1;
      if(null == filePath) return "";

      nameDex = filePath.LastIndexOf(@"\");
      if(nameDex == -1) return filePath;
      return filePath.Substring(nameDex + 1);
    } // StripPath

		#region Web Form Designer generated code
		override protected void OnInit(EventArgs e)
		{
			//
			// CODEGEN: This call is required by the ASP.NET Web Form Designer.
			//
			InitializeComponent();
			base.OnInit(e);
		}
		
		/// <summary>
		/// Required method for Designer support - do not modify
		/// the contents of this method with the code editor.
		/// </summary>
		private void InitializeComponent()
		{    
			this.butBack.Click += new System.EventHandler( this.butBack_Click);
			this.butForward.Click += new System.EventHandler( this.butForward_Click);
			this.butReturn.Click += new System.EventHandler(this.butReturn_Click);
			this.Load += new System.EventHandler(this.Page_Load);
		}
		#endregion

    private void butReturn_Click(object sender, System.EventArgs e)
    {
      Server.Transfer("photos.aspx");
    } // butReturn_Click

    private void butBack_Click(object sender, System.EventArgs e)
    {
      photoIndex -= 1;
      if(photoIndex < 0) photoIndex = photoFileLength -1; // Wrap around
			Session["photoIndex"] = photoIndex;
      Server.Transfer("imageView.aspx");
    } // butBack_Click

    private void butForward_Click(object sender, System.EventArgs e)
    {
      photoIndex += 1;
      if(photoIndex >= photoFileLength) photoIndex = 0; // Wrap around
			Session["photoIndex"] = photoIndex;
      Server.Transfer("imageView.aspx");    
    } // butForward_Click
	} // class

Dawn

http://www.dawningdesigns.net

 

[adamroof]

ahhh ha!

you are trying to get the index position of the picuture within the array photoFiles, but since we changed the path to be able to view the pics on the internet...we need to change the path either

1. back to the way it is in the array at time of click (within the showfullimagehandler)
2. set a command argument that can be passed into the image, then use the e.CommandArgument within the imagehandler event.

i chose #2

lets see if this will work...it works on my link above, but i dont have the imageView.aspx

                    <asp:DataList ID="dataAlbum" runat="server" RepeatColumns="5" BorderStyle="Ridge"
                        BorderColor="SkyBlue" BackColor="Azure" CellPadding="6" HorizontalAlign="Left"
                        RepeatDirection="Horizontal" [b]OnItemDataBound="dlPics_IDB"[/b]>
                        <ItemTemplate>
                            <asp:ImageButton ID="ibThumbs" runat="server" ImageUrl="<%# getRelative(Container.DataItem.ToString()) %>"
                                Width="115" Height="115" OnCommand="ShowFullImageHandler" CommandName="<%# getRelative(Container.DataItem.ToString()) %>">
                            </asp:ImageButton>
                        </ItemTemplate>
                    </asp:DataList>

    protected void dlPics_IDB(object sender, DataListItemEventArgs e)
    {
        if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
        {
            ((ImageButton)e.Item.FindControl("ibThumbs")).CommandArgument = Convert.ToString(1 + e.Item.ItemIndex);
        }

    }

    protected void ShowFullImageHandler(object sender, System.Web.UI.WebControls.CommandEventArgs e)
    {
        string photoPath = e.CommandName;
        Session["photoPath"] = photoPath;
        Session["photoFiles"] = photoFiles;
        Session["photoIndex"] = e.CommandArgument;
        Session["albumName"] = albumNamestr;

        Server.Transfer("imageView.aspx");
    }

 

[CoolMama]

Yes, it does seem to have a new error because of a mismatch in the imageView.aspx code, which is seen above. The error is:

[red]Specified cast is not valid.
Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.

Exception Details: System.InvalidCastException: Specified cast is not valid.

Source Error:

Line 37:
Line 38: if(Session["photoIndex"] == null) return;
[blue]Line 39: photoIndex = (int)Session["photoIndex"];[/blue]
Line 40:
Line 41: if (Session["photoFiles"] == null) return;[/red]

Dawn

http://www.dawningdesigns.net

 

[adamroof]

on your first error..

Compiler Error Message: CS0103: The name 'getRelative' does not exist in the class or namespace 'ASP.photos_aspx'

did you recompile your site and then republish? Was that done with .Net 2003? the code behind wasnt updated???

also...

((ImageButton)e.Item.FindControl("ibThumbs")).CommandArgument = Convert.ToString(1 + e.Item.ItemIndex);

i think u dont need to increment by 1, the itemIndex should be 0 for the first picture right?


also...

Line 38: if(Session["photoIndex"] == null) return;
Line 39: photoIndex = (int)Session["photoIndex"];
Line 40:
Line 41: if (Session["photoFiles"] == null) return;


lets do this...

photoIndex = int.Parse(Session["photoIndex"]);


this is getting complex, but its a complex dynamic page! if you had a static list of pics this would be a whole lot easier, and again, im learning alot from this, and i hope we all are.

 

[CoolMama]

You're right this is getting way too complicated. I'm almost tempted to go simpler. But my designer nature won't let me yet.

photoIndex = int.Parse(Session["photoIndex"]);

I got 2 build errors for this...

[red]C:\Inetpub\

http://wwwroot\MeganWeb\imageView.aspx.cs(39):

The best overloaded method match for 'int.Parse(string)' has some invalid arguments[/red]

and

[red]C:\Inetpub\

http://wwwroot\MeganWeb\imageView.aspx.cs(39):

Argument '1': cannot convert from 'object' to 'string'
[/red]

Dawn

http://www.dawningdesigns.net

 

[adamroof]

hey its back up! but path wrong still...

<input type="image" name="dataAlbum:_ctl0:ibThumbs" id="dataAlbum__ctl0_ibThumbs" src="f:\

http://wwwroot\dawningdesigns\megan\photos\2000\Christmas

Elf.jpg" alt="" border="0" style="height:115px;width:115px;" />

can we just to a string replacement using the rest exactly as you have it?

ImageUrl='<%# Container.DataItem.ToString().Replace("f:\\wwwroot\\dawningdesigns\\megan\\photos\\","[URL unfurl="true"]http://www.dawiningdesings.net/megan/photos/")[/URL] %>'

the \\ are escape characters for c#
you might need to adjust the http address, but i got my version working this way.

if this works, lemme tell you... grrrrr

on your imageView.aspx.cs...

Page_Load
...
imgPhoto.ImageUrl = photoPath.Replace("f:\\

http://wwwroot\\dawningdesigns\\megan\\photos\\",

"

http://www.dawiningdesings.net/megan/photos/");

...

i dont see anyother way in the aspx file for this one

 

[ca8msm]

You are still persisting with the same code that I told you was wrong (and I pointed out why it was wrong) in my first post dated "26 Jun 06 4:20" and I told you how to fix it in my post dated "26 Jun 06 15:11" (both over a month ago!).

If you want to fix your problem, I'd suggest you read and listen to the advice offered.


____________________________________________________________

Need help finding an answer?

Try the Search Facility or read FAQ222-2244 on how to get better results.

 

[Foamcow]

<option value="f:\[URL unfurl="true"]wwwroot\dawningdesigns\megan\photos\2000">2000</option>[/URL]

There's the problem.

I don't know .Net but I do have experience in other server side languages.

To me it looks like,

string[] files = Directory.GetDirectories(MapPath("./photos"));

is referring to a system path rather than a web visible path. The HTML delivered to the user must contain a path that is either relative to web root directory OR is an absolute path (i.e.

http://www.blah.com/some/path/)

You somehow need to translate the system path to one that means something to the person viewing your site.



<honk>*:O)</honk>
Foamcow Heavy Industries - Web site design in Cheltenham and Gloucester
Earl & Thompson Marketing - Marketing Agency Services in Gloucesterhire

 

[adamroof]

Nice! You are almost there...

but you misspelled your domain name on the imageView.aspx.cs side...

View Source on the pics...
...
http://www.dawiningdesings.net/megan/photos/2000

1 - and I pointed out why it was wrong) in my first post dated "26 Jun 06 4:20"
2 - and I told you how to fix it in my post dated "26 Jun 06 15:11" (both over a month ago!).

1. As did others
2. I cant see anywhere you offered "how", both were why

If you want to fix your problem, I'd suggest you read and listen to the advice offered.

Hmmm, not very kind


Recap
...

The getRelative function provides the same as the replace function, but moves the action to the frontend. Issue had to be that your project wasnt recompiled into the bin/.dll when published to the Internet

When databinding in the aspx page, it seems when using double quotes within the function, you'll need to use single quotes to wrap the tag.(wasnt the case in the first run, didnt have double quotes)

ImageUrl="<%# Container.DataItem %>" 'is okay

'in other usage context
ImageUrl="<%# DataBinder.Eval(Container.DataItem,"Item") %>"
'would return an error on server tag not well formed
'this would need to be

ImageUrl='<%# DataBinder.Eval(Container.DataItem,"Item") %>'

'so this is correct
ImageUrl='<%# Container.DataItem.ToString().Replace("f:\\wwwroot\\dawningdesigns\\megan\\photos\\","[URL unfurl="true"]http://www.dawiningdesings.net/megan/photos/")[/URL] %>'

Well, you are getting close to working here! Cant wait to see the design scheme put back in, looks like your layouts are really cool.

 

[ca8msm]

2. I cant see anywhere you offered "how", both were why

I offered how when I said:

It should read:

http://www.example.com/myfile.jpg

Hmmm, not very kind

Well, I've been kind enough to offer my advice, point out the problem and suggest a solution. This advice has been ignored and as such the thread has gone onto having over 30 posts with the issue still not being resolved (and worse, it's been over complicated to a state where any future reader who have the same problem will end up simply closing the thread rather than reaching what is a simple solution). The thread could have been answered in one post really and should have gone something like:

Q. I can't see my images which have a source of f:\myimages\myimage.jpg
A. Change f:\myimages\myimage.jpg to

http://www.example.com/images/myimage.jpg

but instead it has become clouded with unnessary, bloated code and advice. My suggestions were supposed to avoid all of this and if you don't deem them as kind then that's your prerogative.



____________________________________________________________

Need help finding an answer?

Try the Search Facility or read FAQ222-2244 on how to get better results.

 

[CoolMama]

well thanks to all of you who helped out with this. the problem (or problems) have been solved and the site now looks wonderful and functional online.

there were many suggestions to this problem. unfortunately due to my limited experience, i chose to follow advice that I could understand. if advice was overly simple, then i looked for something that gave me a lot more direction in how to do something.

adamroof was very patient in helping me along every step and stumble, which i greatly needed and appreciated. I apologize if this thread took up more time than was needed, but the project is done and I am very greatful.

thanks again!

Dawn

http://www.dawningdesigns.net

 

[ca8msm]

You should probably have a look at the implentation you have used as users who are not using Internet Explorer will not be able to use the photo album.


____________________________________________________________

Need help finding an answer?

Try the Search Facility or read FAQ222-2244 on how to get better results.

 

[CoolMama]

Yes, I know. Which is why I placed a statement on the page telling them to use IE. I know this is not the best solution, but for now it works and I can move on to other projects. Thanks!

Dawn

http://www.dawningdesigns.net

 

[ca8msm]

OK, you're in the best position to decide what level to bring your site up to so we'll leave that with you.

If in the future you decide to revisit it, a simple fix to render it correctly in FireFox would have just been to output simple HTML such as:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "[URL unfurl="true"]http://www.w3.org/TR/html4/strict.dtd">[/URL]
<html>
	<head>
		<title>Megan's Photos</title>
		<style type="text/css">
		  img {
		    width: 100px;
		    height: 100px;
		    }
		  #imagesContainer {
		    width: 520px;
		    }
		</style>
	</head>
	<body>
				
		
	<div id="imagesContainer">
		<img id="Image1" src="[URL unfurl="true"]http://www.dawningdesigns.net/megan/photos/2000/Christmas[/URL] Elf.jpg" alt="Image 1" />
		<img id="Image2" src="[URL unfurl="true"]http://www.dawningdesigns.net/megan/photos/2000/First[/URL] Day with Daddy.jpg" alt="Image 2" />
		<img id="Image3" src="[URL unfurl="true"]http://www.dawningdesigns.net/megan/photos/2000/First[/URL] Day with Mommy.jpg" alt="Image 3" />
		<img id="Image4" src="[URL unfurl="true"]http://www.dawningdesigns.net/megan/photos/2000/Four[/URL] First Daughters.jpg" alt="Image 4" />
		<img id="Image5" src="[URL unfurl="true"]http://www.dawningdesigns.net/megan/photos/2000/Grandma[/URL] Maestas.jpg" alt="Image 5" />
		<img id="Image6" src="[URL unfurl="true"]http://www.dawningdesigns.net/megan/photos/2000/Mommy[/URL] and Me.jpg" alt="Image 6" />
		<img id="Image7" src="[URL unfurl="true"]http://www.dawningdesigns.net/megan/photos/2000/Shes[/URL] a Model.jpg" alt="Image 7" />
		<img id="Image8" src="[URL unfurl="true"]http://www.dawningdesigns.net/megan/photos/2000/Sleeping[/URL] Beauty.jpg" alt="Image 8" />
	</div>

	</body>
</html>

There are other validation errors on the existing site as well (

http://validator.w3.org/check?verbose=1&uri=http://www.dawningdesigns.net/megan/photos.aspx)

if you do decide to do anymore work on it.


____________________________________________________________

Need help finding an answer?

Try the Search Facility or read FAQ222-2244 on how to get better results.

 

[CoolMama]

Yes, I saw that the path had to be fixed. I know I needed to replace the absolute path with the URL (which I did) and to replace all "\" with "/". I just couldn't (at that moment) think of how to attach BOTH those methods to the "(Container.DataItem)".

Dawn

http://www.dawningdesigns.net