PDA

View Full Version : dynamic photo gallery with out postback



hamed_bostan
سه شنبه 30 مرداد 1386, 10:22 صبح
با سلام
احتمالا همه دوستان photo gallery ای که فرانت پیج می سازه و جاوا اسکریپتی کار می کنه رو دیدن
اون آدرس عکسها رو داخل خودش داره استاتیک و عکس ها رو نشون میده و وقتی روی هر tumbnail هر عکس کلید می کنی عکس کامل رو بدون پست بک شدن صفحه میاده . من می خوام عکس هام رو از دیتابیس بخونم و به صورت tumbnail نشون بدم و موقع کلید روشون بدون پست بک همونطور سریع عکس رو نشون بده اما از طریق asp.net . ضمنا ممکنه کاربر درقسمت مدیریت عکسی رو پاک یا اضافه کنه.
ممنون می شم اگه راه حلی بدین یا نمونه sample یا source ای بهم بدین
ممنون

nazaninam
چهارشنبه 31 مرداد 1386, 02:31 صبح
1- برای نمایش عکس ها از داخل بانک مثلا از یک دیتالیست استفاده می کنیم
2- یک HttpHandler از نوع Generic به پروژه اضافه کن که ماکسیمیم اندازه و نام فایل رو به وسیله Querystring بگیره و عکس Thumbnail شده را بر گردونه .
4- در موقع بایند کردن داخل دیتالیست به جای آدرس دهی مستقیم از این HttpHandler استفاده کن. که اندازه های کوچک توسط QueryString به اون پاس میشه
3- حالا وقتی روی هر عکس کلیک کردید به کمک یک تابع جاوا اسکریپت یک تگ Div روی صفحه باز میشه که توسط همان Generic HttpHandler عکس داخل اون نمایش داده میشه . البته عکسی که اندازه های بزرگ به اون پاس شده.

مهم ترین کار شما ساخت این HttpHandler هست که سورس آماده داخل اینترنت زیاد هست .

موفق باشید

hamed_bostan
چهارشنبه 31 مرداد 1386, 08:43 صبح
میشه بیشتر ببت این روش توضیح بدین؟ سورسی چیزی؟؟؟ من تا به حال با httphandler ها کار نکردم

nazaninam
چهارشنبه 31 مرداد 1386, 18:50 عصر
حامد جان در مورد HttpHandler ها و HttpModule ها در سایت خیلی بحث شده و همین الان یک اعلان داخل سایت هست !
من این برنامه که می خواستی رو برات نوشتم :
1- ابتدا یک فایل Generic Handler (از طریق منوی Add New Item)به پروژه اضافه کن و اسم انونو HPicturer.ashx بگذار
کد های زیر را داخل این فایل کپی کن :



<%@ WebHandler Language="VB" Class="HPicturer" %>

Imports System
Imports System.Web
Imports System.Drawing
Imports System.Drawing.Imaging
Imports System.Drawing.Drawing2D
Imports System.IO
Imports System.Text
'CopyRight By Ali Delshad Http://faradade.com
Public Class HPicturer : Implements IHttpHandler

Public Sub ProcessRequest(ByVal context As HttpContext) Implements IHttpHandler.ProcessRequest


Dim Response As HttpResponse = context.Response
Dim Request As HttpRequest = context.Request


Dim imgHeight, imgWidth As Integer
Dim maxwidth As String = Request.QueryString("w")
Dim maxheight As String = Request.QueryString("h")


'Get information about the image
Dim imageUrl As String = Request.QueryString("path") + "/" + Path.GetFileName(Request.QueryString("img"))
Dim fullSizeImg As System.Drawing.Image
fullSizeImg = System.Drawing.Image.FromFile(context.Server.MapPa th(imageUrl))


imgHeight = fullSizeImg.Height
imgWidth = fullSizeImg.Width
If imgWidth > maxwidth Or imgHeight > maxheight Then
'Determine what dimension is off by more
Dim deltaWidth As Integer = imgWidth - maxwidth
Dim deltaHeight As Integer = imgHeight - maxheight
Dim scaleFactor As Double

If deltaHeight > deltaWidth Then
'Scale by the height
scaleFactor = maxheight / imgHeight
Else
'Scale by the Width
scaleFactor = maxwidth / imgWidth
End If

imgWidth *= scaleFactor
imgHeight *= scaleFactor
End If


Dim bmPhoto As New Bitmap(imgWidth, imgHeight, PixelFormat.Format24bppRgb)

bmPhoto.SetResolution(72, 72)

Dim grPhoto As Graphics = Graphics.FromImage(bmPhoto)

grPhoto.SmoothingMode = SmoothingMode.HighQuality
grPhoto.InterpolationMode = InterpolationMode.HighQualityBicubic
grPhoto.PixelOffsetMode = PixelOffsetMode.HighQuality
grPhoto.DrawImage(fullSizeImg, New Rectangle(0, 0, imgWidth, imgHeight), 0, 0, fullSizeImg.Width, fullSizeImg.Height, GraphicsUnit.Pixel)

Dim mm As New MemoryStream()
bmPhoto.Save(mm, System.Drawing.Imaging.ImageFormat.Jpeg)
Response.ContentType = "image/jpeg"
Response.Cache.SetCacheability(HttpCacheability.Pu blic)
Response.BufferOutput = False
Response.OutputStream.Write(mm.GetBuffer(), 0, mm.GetBuffer().Length)



End Sub
Function ThumbnailCallback() As Boolean
Return False

End Function
Public ReadOnly Property IsReusable() As Boolean Implements IHttpHandler.IsReusable
Get
Return False
End Get
End Property

End Class



2- داخل صفحه Default.aspx کد های زیر را کپی کن :




<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>CopyRight By Ali Delshad Http://faradade.com</title>

<script>
function EnlargegMe(ID)
{
document.getElementById('big').src='HPicturer.ashx ?img='+ID+'&w=800&h=800&path=~/Images/';
}
</script>

</head>
<body>
<form id="form1" runat="server">
<table border="0">
<tr>
<td>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<img onclick="EnlargegMe('<%# Container.DataItem %>')" src='HPicturer.ashx?img=<%# Container.DataItem %>&w=100&h=100&path=~\Images\' />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</td>
<td style="width: 582px">
<img id="big" src="" /></td>
</tr>
</table>
</form>
</body>
</html>





داخل صفحه Default.aspx.cs هم کد های زیر را قرار بده :




using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.IO;
using System.Collections;

public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
string[] Images = Directory.GetFiles(Server.MapPath("Images"));
ArrayList ImgArray = new ArrayList();


for (int i = 0; i < Images.Length; i++)
{
ImgArray.Add(Path.GetFileNameWithoutExtension(Imag es[i]) + Path.GetExtension(Images[i]));
}
GridView1.DataSource = ImgArray;
GridView1.DataBind();
}
}





خوب حالا یه پوشه به نام Images بساز .
این کد هر عکسی که داخل این پوشه باشه رو میاد داخل گرید ویوو نشون میده .
فایل ضمیمه رو هم میتونید دانلود کنید
موفق باشی

hamed_bostan
چهارشنبه 31 مرداد 1386, 22:40 عصر
نمی دونم چطوری تشکر کنم
ممنون

nazaninam
پنج شنبه 01 شهریور 1386, 10:59 صبح
البته حامد جان این روش علاوه بر این که Thumbnail میکنه میاد حجم عکس رو هم پایین میاره !
اگر نیاز به کاهش حجم نداشته باشی می تونی از این Hpicturer.ashx هم استفاده نکنی و با چند خط کد نویسی جاوا اسکریپت ( مثل FrontPage ) این کار را انجام بدی .

hamed_bostan
پنج شنبه 01 شهریور 1386, 21:07 عصر
بله زمانی که تستش کردم متوجه کاهش حجم عکس شدم . ممنونم
ایا این کاهش حجم سرعت لود فرم رو پایین میاره؟

nazaninam
جمعه 02 شهریور 1386, 12:47 عصر
نه چندان ولی بالاخره یک پروسه سمت سرور داره صورت میگیره ! به نظر من ارزشش رو داره.
البته داخل کدی که بنده نوشتم برای کوچک نمایی تصویر میتونید کیفیت تصویر کوچک شده را نیز تنظیم نمایید.

hamed_bostan
یک شنبه 04 شهریور 1386, 23:11 عصر
با تشکر مجدد از nazaninam (http://barnamenevis.org/forum/member.php?u=13502)
اما اجراش که می کنم روی این خط ارور زیر رو میده :


fullSizeImg = System.Drawing.Image.FromFile(context.Server.MapPa th(imageUrl))


این error رو میده:




Out Of Memory

twelve
یک شنبه 26 آبان 1387, 12:10 عصر
با سلام
من برای ساخت thumbnail از روشی مشابه این آموزش آقای دلشاد استفاده میکنم
این روش عکس هایی رو که روی هارد دیسک سرور ذخیره شده رو به خوبی به صورت thumbnail نشون میده ، سوال من اینه که آیا میشه با ایجاد تغییراتی کاری کرد که یک عکس از روی سرور دیگه ای خونده بشه و بدون ذخیره شدنش روی هارد دیسک سرور سایت خودمون ، اون رو به صورت thumbnail نشون بدیم ؟!
البته فکر کنم شدنی هست چون گوگل هم داره همینکارو میکنه (ظاهرا)

twelve
یک شنبه 26 آبان 1387, 21:22 عصر
:متفکر: یعنی این سوال بی پاسخه ؟! هیچ نظری ، طرحی ، پیشنهادی ، چیزی؟!

الان من نمیدونم سوالم جواب داره یا نه !! یا اصلا طرح و برنامم درسته یا نه !! یکم اکتیو باشین بابا :بامزه:

iekrang
پنج شنبه 24 تیر 1389, 21:46 عصر
سلام.
من خیلی وقت پیش از این کد شما استفاده کردم و انصافاً هم خوب جواب میداد ممنون.
یه مشکلی الان پیش اومده اینکه سرور اون سایت رو عوض کردم و الان عکسهای مربوط به این قسمت باز نمیشه!
می خواستم سوال کنم آیا تنظیمی وجود داشت که باید انجام میشد چون کدها هیچ تغییری نکردند.
مرسی

vahid_dadaism
یک شنبه 27 تیر 1389, 11:29 صبح
دوستان عزیز بهترین راه که من خودم هم از اون استفاده کردم و کاملا جواب داد استفاده از نرم افزار DotNetGallery هست.تمام خواسته های شما رو جواب میده و آموزشش هم درون خودش هست.