Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

photo thumbnails won't show

Status
Not open for further replies.

CoolMama

Programmer
Jan 19, 2006
50
US
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:


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


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:

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
 
The hosting service confirms this is the correct path. There is no other URL reference in the HTML. It just makes no sense. But this isn't the first time I've created ASP.NET code that should work, but doesn't. I'm starting to think it's just a Windows server/.NET issue. Maybe I should have picked another platform/language to learn. [ponder]

Dawn
 
But this isn't the first time I've created ASP.NET code that should work, but doesn't
I don't think I agree that the code is correct in the first place. You have specified a local drive for the path to the image (i.e. the "F:\" drive) so when the page is rendered the browser will look for that file on the client's PC. If it doesn't find it, it won't display it.

Change your code to be either an absolute or relative path to the file and it should work.


____________________________________________________________

Need help finding an answer?

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

 
No, the code is already relative. But when you view the page in "VIEW-->Source" it reads it as an absolute path because it's turned into HTML.

The code as seen above reads

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

Dawn
 
No, the path that is output includes a local path not an absolute path for a web based file. It should read:
Code:
[URL unfurl="true"]http://www.example.com/myfile.jpg[/URL]
not
Code:
f:\files\myfile.jpg


____________________________________________________________

Need help finding an answer?

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

Code:
        DirectoryInfo dir = new DirectoryInfo(Server.MapPath(@"..\" + strDirectory + "\\"));

        FileInfo[] bmpfiles = dir.GetFiles("*.*");
 
Add a new function... this is what i have so far, im tryin to change directories to append to the string, and its a static entry, maybe toss that into a global var or somethin

Code:
string[] files = Directory.GetDirectories(MapPath("../pics/"));

    public static string getRelative(string serverPath)
    {
        int fileIndex = 1 + serverPath.LastIndexOf(@"\");
        string picStr = serverPath.Substring(fileIndex);
        string newPath = "[URL unfurl="true"]http://testserver/admin/pics/"[/URL] + picStr;
        return newPath;
    }

i used a datalist to recreate your scenario...dont know if this is exactly as u have it, but...
Code:
        <asp:DataList ID="dataAlbum" runat="server" RepeatColumns="4">
            <ItemTemplate>
                <asp:Image ID="img1" runat="server" Width="115" Height="115" 
                [b]ImageUrl='<%# getRelative(Container.DataItem.ToString()) %>'[/b] />
            </ItemTemplate>
        </asp:DataList>
 
wow! thank you guys for your suggestions. i've been on a long, well-deserved vacation and hopefully in a better frame of mind now. I will give your suggestions a try and let you know.

Dawn
 
OK, I tried adamroof's last suggestion. I'm closer. When I run this code from IIS, you still can't see the thumbnails, but you can click on them and the image viewer pops up and allows you to go forward and backward through the photos in the folder. So it's recognizing the photos somehow.

HOWEVER, when I run this on the outside web server, I get an error instead...

[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: [blue]The name 'getRelative' does not exist in the class or namespace 'ASP.photos_aspx'[/blue]

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


Source File: f:\ Line: 43 [/red]

Dawn
 
do you have the function in place?

public static string getRelative(string serverPath)

as in above post?

why are u setting the command name to that function?
-?? CommandName="<%# getRelative(Container.DataItem.ToString()) %>"> ??

shouldnt commandname = your OnCommand function name
 
Forgive me. I'm new to this web programming thing. So if you take any shortcuts in instructions, I'm liable to miss something. I did things exactly as you wrote them. :)

Since this function already exists...

Code:
OnCommand="ShowFullImageHandler"
(when thumbnail is clicked, you go to full size image with navigation buttons)

...then am I to assume you want me to include the getRelative function in with this existing function?

Dawn
 
im one that tries to be as un vague as possible, i apologize, its just been a while between posts, with you on vacation and all!

can you post your code as you have it now, and we will get that workin for you today!

i used your concept to build a simple no frills image viewer, so it can be done!

heres the link

 
I can't tell from your page now (as it now produces an error) but the only problem you originally had was that the file path that was outputted pointed to a local drive and not a web address (see my post dated "26 Jun 06 15:11").

I think you should go back to that version of the code as a fairly simple problem has now become quite complex.


____________________________________________________________

Need help finding an answer?

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

 
I like the photo album at the lococlan site. But it sooo doesn't go with my original design plan (i'm a designer first and foremost). Perhaps I should just accept that another way needs to be done. It's just so frustrating because I built this photo album in my ASP.NET class and it worked perfectly on IIS. And I can't think to haveall my hard work disappear because another web server won't behave. People keep telling me it's a Microsoft Windows thing and to just accept it.

Ok, enough ranting. [evil] Here is my present code. I just brought the project into Visual Web Developer Express to see if that would help. At least my software is updated.

Here's the front end...
Code:
<%@ Page language="c#" Inherits="MeganWeb.photos1" CodeFile="photos.aspx.cs" %>

...

<TD colspan="3" align="center"><asp:dropdownlist id="drpdwnPhotos" runat="server" Width="100px"></asp:dropdownlist>
						<asp:Button id="butSelect" runat="server" Text="Select Album" BackColor="MidnightBlue" BorderColor="MidnightBlue"
							ForeColor="White" onclick="butSelect_Click"></asp:Button></TD>
				</TR>
				<TR>
					<TD colspan="3" align="center"><asp:Label id="lblAlbumName" runat="server"></asp:Label></TD>
				</TR>
				<TR>
					<TD colspan="3"><asp:datalist id="dataAlbum" runat="server" RepeatColumns="5" BorderStyle="Ridge" BorderColor="SkyBlue"
							BackColor="Azure" CellPadding="6" HorizontalAlign="Left" RepeatDirection="Horizontal">
							<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>
					</TD>

Here's the backend...
Code:
public partial class photos1 : System.Web.UI.Page
	{
		protected bool hasFiles = false;
		protected bool hasAlbum = false;
		protected string[] allFiles;
		protected string[] photoFiles;
		protected int photoCount = -1;
		protected int rowCount = -1;
		protected string albumNamestr = "Album not selected";
		
	
		protected 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);
		}

		public static string getRelative(string serverPath) 
		{
			int fileIndex = 1 + serverPath.LastIndexOf(@"\");
			string picStr = serverPath.Substring(fileIndex);
			string newPath = "[URL unfurl="true"]http://www.dawningdesigns.net/megan/photos/"[/URL] + picStr;
			return newPath;
		}		

		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);
		}

		#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()
		{    

		}
		#endregion

		protected void butSelect_Click(object sender, System.EventArgs e)
		{
			HttpCookie AlbumCookie = new HttpCookie("albumName");
			AlbumCookie.Value = drpdwnPhotos.SelectedValue;
			AlbumCookie.Expires = DateTime.Now.AddDays(1);
			Response.Cookies.Add(AlbumCookie);

			Response.Redirect("photos.aspx");
		}
	}

Dawn
 
ca8msm is right, somtimes backing up lets you go forward further!

anyhoo,

lets change this..(ItemTemplate of your datalist)

<asp:ImageButton ID="ibThumbs" Runat="server" ImageUrl="<%# getRelative(Container.DataItem.ToString()) %>" Width="115" Height="115" OnCommand="ShowFullImageHandler" CommandName="<%# getRelative(Container.DataItem.ToString()) %>">


to

<asp:Image ID="ibThumbs" Runat="server" ImageUrl="<%# getRelative(Container.DataItem.ToString()) %>" Width="115" Height="115">

just to see if the images will display, then we'll hash out the click and session transfer if that works.
 
its your concept, so


those two files can be put in any folder and it works, just change the globalPath string in the pics.aspx.cs file, and some of the page titles in the html. (i added a filter for just jpgs in the codebehind, youll have to mod that if you have others)

structure example...
> Root Domain Name
> Pics
> Folder
> Other Folder
> index.aspx
> pics.aspx.cs
 
ImageUrl="<%# getRelative(Container.DataItem.ToString()) %>"

should be single quotes???

ImageUrl='<%# getRelative(Container.DataItem.ToString()) %>'

whilst databinding in the aspx page, i think you need single instead of double quotes.
 
Ok, i tried both single and double quotes. Neither one allows the thumbnails to show.

Code:
<ItemTemplate>
<asp:Image ID="ibThumbs" Runat="server" ImageUrl="<%# getRelative(Container.DataItem.ToString()) %>" Width="115" Height="115"></asp:Image></ItemTemplate>

Dawn
 
got this working, using what code you had above...

i made some minor changes and commented those..

Folder Structure
(> megan
> photos
> Folder Test 1
cat.gif
untitled.bmp
> Folder Test 2
> index.aspx
> pics.aspx.cs (yours per below)

one issue was the folder in the dropdown was not being added to the path. both folders are operational

Code:
<%@ Page Language="c#" Debug="true" Inherits="photos1" Src="pics.aspx.cs" %>

<html>
<head runat="server">
    <title>Picture Viewer Test</title>
</head>
<body topmargin="0" leftmargin="0">
    <form id="form1" runat="server">
        <table width="100%" border="0" cellpadding="0" cellspacing="0" class="hyper">
            <tr>
                <td colspan="3" align="center">
                    <asp:DropDownList ID="drpdwnPhotos" runat="server" Width="100px">
                    </asp:DropDownList>
                    <asp:Button ID="butSelect" runat="server" Text="Select Album" BackColor="MidnightBlue"
                        BorderColor="MidnightBlue" ForeColor="White" OnClick="butSelect_Click"></asp:Button></td>
            </tr>
            <tr>
                <td colspan="3" align="center">
                    <asp:Label ID="lblAlbumName" runat="server"></asp:Label></td>
            </tr>
            <tr>
                <td colspan="3">
                    <asp:DataList ID="dataAlbum" runat="server" RepeatColumns="5" BorderStyle="Ridge"
                        BorderColor="SkyBlue" BackColor="Azure" CellPadding="6" HorizontalAlign="Left"
                        RepeatDirection="Horizontal">
                        <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>
                </td>
            </tr>
        </table>
    </form>
</body>
</html>

Code:
using System;
using System.Data;
using System.IO;
using System.Text;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;

public class photos1 : System.Web.UI.Page
{
    protected bool hasFiles = false;
    protected bool hasAlbum = false;
    protected string[] allFiles;
    protected string[] photoFiles;
    protected int photoCount = -1;
    protected int rowCount = -1;
    protected string albumNamestr = "Album not selected";
    //added these items to get it working without a baseclass
    public DropDownList drpdwnPhotos;
    public Label lblAlbumName;
    public DataList dataAlbum;
//should leave this one here, sets the folder path
    static string folderStr = "";


    protected void Page_Load(object sender, System.EventArgs e)
    {
        if (!Page.IsPostBack)
        {
            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;
            folderStr = albumNamestr.Substring(nameIndex);
            
            dataAlbum.DataSource = photoFiles;
            dataAlbum.DataBind();

            HttpCookie MyCookie = new HttpCookie("albumName");
            MyCookie.Value = albumNamestr;
            MyCookie.Expires = DateTime.Now.AddDays(1);
            Response.Cookies.Add(MyCookie);
        }
    }

    public static string getRelative(string serverPath)
    {
        int fileIndex = 1 + serverPath.LastIndexOf(@"\");
        string picStr = serverPath.Substring(fileIndex);
        //added selected ddl name to path
        string newPath = "[URL unfurl="true"]http://www.lococlan.com/megan/photos/"[/URL] + folderStr + "/" + picStr;
        return newPath;
    }

    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);
    }

    protected void butSelect_Click(object sender, System.EventArgs e)
    {
        HttpCookie AlbumCookie = new HttpCookie("albumName");
        AlbumCookie.Value = drpdwnPhotos.SelectedValue;
        AlbumCookie.Expires = DateTime.Now.AddDays(1);
        Response.Cookies.Add(AlbumCookie);
        //changed for my example
        Response.Redirect("index.aspx");
    }
}


so... see if you can toss this into your site and we are good!!!
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top