webForumDet fria alternativet
Logga in

Preloada en hel mapp?

17 svar · 655 visningar · startad av Troll

TrollMedlem sedan dec. 2003229 inlägg
#1

Nu vet jag inte om ASP är det bästa sättet att lösa detta på så om ni kommer på något effektivare så kom gärna med tips :) Nåväl, nu till frågan... Är det möjligt att på något sett preloada en mapp på servern som innehåller ett antal mindre .gif/.jpg bilder?

De exempel på preloaders som jag har tittat på tidigare [JavaScript] så är man tvugen att skriva in bilderna manuellt och jag tänkte att det skulle bli bra mycket smidigare att istället köra igenom en hel mapp så att man bara behöver lägga in bilderna i mappen istället för att sitta och skriva in filnamnen som ska laddas.

Någon som har några tips/förslag?

@ndersMedlem sedan juni 200032 969 inlägg
#2

Jodå, har du ett preload-javascript ska det inte vara några problem att knyta ihop det med lite asp-kod som slänger in alla bilder i en mapp.

Så: hitta ett preloadscript som du trivs med så ska det nog gå att ordna. :)

mvh

joohnMedlem sedan jan. 200463 inlägg
#3

Skulle gärna vilja ha ett sånt script jag.
Här är ett scriptexempel som fungerar bra.

<script language="JavaScript1.1">
<!--
/*
preloader by marcin wojtowicz [one_spook@hotmail.com])
*/

	var locationAfterPreload = "index_2.htm"
	var lengthOfPreloadBar = 150
	var heightOfPreloadBar = 3
	var yourImages = new Array("images/index_01.jpg","images/index_02.jpg","images/index_03.jpg","images/index_04.jpg","images/index_05.jpg","images/index_06.jpg","images/spacer.gif","images/index_08.jpg","images/index_09.jpg","images/index_10.jpg","images/index_11.jpg","images/index_12.jpg","images/index_13.jpg","images/b.jpg","images/b1.jpg","images/b2.jpg","img/00.gif","img/01.jpg","img/02.jpg","img/03.jpg","img/04.jpg","img/05.jpg","img/06.jpg","img/07.jpg","img/08.jpg","img/09.jpg","img/10.jpg","img/11.jpg","img/12.jpg","img/13.gif","img/13.jpg","img/14.jpg","img/15.jpg","img/16.jpg","img/17.jpg","img/18.jpg","img/19.jpg","img/20.jpg","img/21.jpg","img/22.jpg","img/23.jpg","img/24.jpg","img/25.jpg")

if (document.images) {
	var dots = new Array() 
	dots[0] = new Image(1,1)
	dots[0].src = "images/2.gif"
	dots[1] = new Image(1,1)
	dots[1].src = "images/1.gif"
	var preImages = new Array(),coverage = Math.floor(lengthOfPreloadBar/yourImages.length),currCount = 0
	var loaded = new Array(),i,covered,timerID
	var leftOverWidth = lengthOfPreloadBar%coverage
}
function loadImages() { 
	for (i = 0; i < yourImages.length; i++) { 
		preImages[i] = new Image()
		preImages[i].src = yourImages[i]
	}
	for (i = 0; i < preImages.length; i++) { 
		loaded[i] = false
	}
	checkLoad()
}
function checkLoad() {
	if (currCount == preImages.length) { 
		location.replace(locationAfterPreload)
		return
	}
	for (i = 0; i <= preImages.length; i++) {
		if (loaded[i] == false && preImages[i].complete) {
			loaded[i] = true
			eval("document.img" + currCount + ".src=dots[1].src")
			currCount++
		}
	}
	timerID = setTimeout("checkLoad()",10) 
}
//-->
</script>

</head>

<body bgcolor="#303030">
<script language="JavaScript1.1">
<!--
if (document.images) {
	var preloadBar = ''
	for (i = 0; i < yourImages.length-1; i++) {
		preloadBar += '<img src="' + dots[0].src + '" width="' + coverage + '" height="' + heightOfPreloadBar + '" name="img' + i + '" align="absmiddle">'
	}
	preloadBar += '<img src="' + dots[0].src + '" width="' + (leftOverWidth+coverage) + '" height="' + heightOfPreloadBar + '" name="img' + (yourImages.length-1) + '" align="absmiddle">'
	document.write(preloadBar)
	loadImages()
}
// document.write('<p><small><a href="javascript:window.location=locationAfterPreload">)
// -->
</script>
</body>
</html>
Jesper TMedlem sedan nov. 20017 144 inlägg
#4

Testa detta:

<script type="text/javascript">
<!--
window.onload = function() {
<%
Dim bildmapp : bildmapp="images/" 'Din mapp med dina bilder

Set FSO = Server.CreateObject("Scripting.FileSystemObject")
Set Folder = FSO.GetFolder(Server.Mappath(bildmapp))
set Files = Folder.Files

	For each Item In Files

		Select Case LCase(Right(Item.Name, 3)) 
                Case "jpg", "gif", "bmp", "png" 'Kollar att det är bilder
			myImages = myimages & """"& bildmapp & Item.Name &""","
		end select
	Next

Set FSO = nothing
myImages  = left(myImages , len(myImages) - 1) 'Tar bort sista kommatecknet för att inte få javascriptfel

Response.Write "preloadImages("& myImages &");"& vbcr 'Skriver ut det hela
%>
};
function preloadImages() {
	for (var i = 0; i < arguments.length; i++)
		document.createElement("img").src = arguments[i];
}
//-->
</script>
joohnMedlem sedan jan. 200463 inlägg
#5

JesperT, om man vill ha med en progressbar, hur kan koden se ut då?

Jesper TMedlem sedan nov. 20017 144 inlägg
#6

Så här kanske:

<script type="text/javascript">
<!--
window.onload = function() {
<%
Dim bildmapp : bildmapp="images/" 'Din mapp med dina bilder
Set FSO = Server.CreateObject("Scripting.FileSystemObject")
Set Folder = FSO.GetFolder(Server.Mappath(bildmapp))
set Files = Folder.Files

	For each Item In Files
		Select Case LCase(Right(Item.Name, 3))  'Kollar att det är bilder
		case "bmp","jpg","gif","png"
			myImages = myimages & """"& bildmapp & Item.Name &""","
		end select
	Next

Set FSO = nothing
myImages  = left(myImages , len(myImages) - 1) 'Tar bort sista kommatecknet för att inte få javascriptfel

Response.Write "preloadImages("& myImages &");"& vbcr 'Skriver ut det hela
%>};
function preloadImages() {
	for (var i = 0; i < arguments.length; i++)
		document.images["progressbar"].style.width=i * parseInt(150/arguments.length) +"px";
		document.createElement("img").src = arguments[i];
}
//-->
</script>
<img src="progress.gif" height="10px" style="border:1px solid black;" name="progressbar">
Jesper TMedlem sedan nov. 20017 144 inlägg
#7

Bahhh, den kanske inte var så bra.
Här har du en länk att knåpa ihop ngt. med.
http://scriptasylum.com/misc/progressbar/progressbar.html

Response.Write "var imagenames=["& myImages &"];"& vbcr 'Skriver ut det hela
joohnMedlem sedan jan. 200463 inlägg
#8

Det här ser ut att fungera men bilderna preloadas inte? En sa att createElement inte är standard utan att man ska använda av sig array, och lägga till (new Image()).src="..."; vad menas?

Sen så skulle det vara trevligt med siffror som räknar upp till 100% och då ska det inte vara så att det hoppar från 1 till 55 utan det räknar snabbt som 1 2 3 4 5 6 7 8 till 55 om någon har 10mbit tex.
Sidan ska redirecta också efteråt


<html>
<head>
</head>
<body>

<script type="text/javascript">
<!--
window.onload = function() {
<%
Dim bildmapp : bildmapp="photo/" 'Din mapp med dina bilder
Set FSO = Server.CreateObject("Scripting.FileSystemObject")
Set Folder = FSO.GetFolder(Server.Mappath(bildmapp))
set Files = Folder.Files

	For each Item In Files
		Select Case LCase(Right(Item.Name, 3))  'Kollar att det är bilder
		case "bmp","jpg","gif","png"
			myImages = myimages & """"& bildmapp & Item.Name &""","
		end select
	Next

Set FSO = nothing
myImages  = left(myImages , len(myImages) - 1) 'Tar bort sista kommatecknet för att inte få javascriptfel

Response.Write "preloadImages("& myImages &");"& vbcr 'Skriver ut det hela
%>};
function preloadImages() {
	for (var i = 0; i < arguments.length; i++)
		document.images["progressbar"].style.width=parseInt(100*i/arguments.length) +"px";
		document.createElement("img").src = arguments[i];
}
//-->
</script>
<img src="progress.gif" height="10px" style="border:1px solid black;" name="progressbar">

<body>
</html>
Jesper TMedlem sedan nov. 20017 144 inlägg
#9
<script type="text/javascript">
<!--
<%
Dim bildmapp : bildmapp="photo/" 'Din mapp med dina bilder

Set FSO = Server.CreateObject("Scripting.FileSystemObject")
Set Folder = FSO.GetFolder(Server.Mappath(bildmapp))
set Files = Folder.Files

	For each Item In Files
		Select Case LCase(Right(Item.Name, 3))  'Kollar att det är bilder
		case "bmp","jpg","gif","png"
			myImages = myimages & """"& bildmapp & Item.Name &""","
		end select
	Next

Set FSO = nothing
myImages  = left(myImages , len(myImages) - 1) 'Tar bort sista kommatecknet för att inte få javascriptfel

Response.Write "var imagesSrc=["& myImages &"];"& vbcr 'Skriver ut det hela

%>	
var imagesOnLoad="document.getElementById('status1').innerHTML='Laddar bilder, '+parseInt(images.loaded/images.toload*100)+'% klart.'";
var imagesOnAllLoaded="document.getElementById('status2').innerHTML='Alla bilder laddade på '+images.loadtime/1000+'s.';setTimeout('window.open(\"http://www.sl.se\",\"_self\")',1500)";

var images=new Object();
images.loaded=0;
images.starttime=new Date();
images.toload=imagesSrc.length;
for(i in imagesSrc){
	images[i]=new Image();
	images[i].onload=function(){
		images.loaded++;
		document.getElementById("progressbar").style.width=images.loaded * parseInt(150/imagesSrc.length) +"px";
		if(imagesOnLoad.length>0){ eval(imagesOnLoad); }
		if(images.loaded==images.toload&&imagesOnAllLoaded.length>0){
			images.stoptime=new Date();
			images.loadtime=images.stoptime.getTime()-images.starttime.getTime();
			eval(imagesOnAllLoaded);
		}
	}
	images[i].src=imagesSrc[i];
}
//-->
</script>

<div style="height:10px;width:150px;border:1px solid black;padding:0;margin:0;"><div style="background:blue;width:2px;height:5px;" id="progressbar"></div></div>
<div id="status1"></div>
<div id="status2"></div>

Tack till jojoxx!

joohnMedlem sedan jan. 200463 inlägg
#10

Det där verkar inte fungera heller? ( http://www.mongo.nu/portfolio/preloader.asp )
Hmm, fungerar det för dig?

Jesper TMedlem sedan nov. 20017 144 inlägg
#11

Du har trollat bort ett \ efter index.asp där sidan skall redirectas.

setTimeout('window.open(\"index.asp[b]\[/b]",\"_self\")',1500)";
joohnMedlem sedan jan. 200463 inlägg
#12

Nu funkar det prima :) Najs najs

Tack så mycket

joohnMedlem sedan jan. 200463 inlägg
#13

Förresten har en fråga till hihi

Nu har man det här javascriptet

<script language=\"javascript\" type=\"text/javascript\" src=\"js/mozInnerHTML.js\"></script>

<!-- Använder sig av mozInnerHTML från http://webfx.eae.net/ -->
<script language="javascript" type="text/javascript" src="js/dtdfade.js"></script>

<script language="javascript" type="text/javascript">

<!--

picArray = new Array("fader_pic_adresser_ver2.gif", "fader_pic_vitklass.gif", "fader_pic_vi_har.gif");
linkArray = new Array("http://mattiasnordin.net", "http://mattiasnordin.net", "http://mattiasnordin.net");
createSlideShow( linkArray, "_blank", picArray, "http://mattiasnordin.net/ju-jutsu/designen/", 420, 110, 1500, 1000, 2);
/*
Parametrar:

  1. Array med länkar
  2. target. ("_blank" för nytt fönster)
  3. Array med bilder
  4. Basadress till bilderna. Alt. lämna denna tom ("") och använd
    full adress för parameter 3
  5. Bredd
  6. Höjd
  7. Hur länge varje bild ska visas (millisekunder)
  8. Hur lång tid en övergång ska ta
  9. Hur många bilder som ska förladdas innan övergångarna börjar
    (Första bilden visas fram till dess)
    */

--></script>

Kan man ersätta picArray = new Array("fader_pic_adresser_ver2.gif", "fader_pic_vitklass.gif", "fader_pic_vi_har.gif");
linkArray = new Array("http://mattiasnordin.net", "http://mattiasnordin.net", "http://mattiasnordin.net");
createSlideShow( linkArray, "_blank", picArray, "http://mattiasnordin.net/ju-jutsu/designen/", 420, 110, 1500, 1000, 2);

mot någonting som tar alla bilder från en mapp, så man bara behöver uploada bilden i mappen för att den ska komma upp och visas.

Jesper TMedlem sedan nov. 20017 144 inlägg
#14

Ja visst. Använd samma princip som förut.
Byt ut:
Response.Write "var imagesSrc=["& myImages &"];"& vbcr
mot:
Response.Write "picArray = new Array("& myImages &");"& vbcr

joohnMedlem sedan jan. 200463 inlägg
#15

Lagt in men hur behåller man javascriptseffekten? Det är ett fadescript..


<script language=\"javascript\" type=\"text/javascript\" src=\"js/mozInnerHTML.js\"></script>

<!-- Använder sig av mozInnerHTML från [url]http://webfx.eae.net/[/url] -->
<script language="javascript" type="text/javascript" src="js/dtdfade.js"></script>

<%
Dim bildmapp : bildmapp="photo/" 'Din mapp med dina bilder

Set FSO = Server.CreateObject("Scripting.FileSystemObject")
Set Folder = FSO.GetFolder(Server.Mappath(bildmapp))
set Files = Folder.Files

	For each Item In Files
		Select Case LCase(Right(Item.Name, 3))  'Kollar att det är bilder
		case "bmp","jpg","gif","png"
			myImages = myimages & """"& bildmapp & Item.Name &""","
		end select
	Next

Set FSO = nothing
myImages  = left(myImages , len(myImages) - 1) 'Tar bort sista kommatecknet för att inte få javascriptfel

Response.Write "picArray = new Array("& myImages &");"& vbcr 'Skriver ut det hela

%>	

/*
Parametrar:
1) Array med länkar
2) target. ("_blank" för nytt fönster)
3) Array med bilder
4) Basadress till bilderna. Alt. lämna denna tom ("") och använd
   full adress för parameter 3
5) Bredd
6) Höjd
7) Hur länge varje bild ska visas (millisekunder)
8) Hur lång tid en övergång ska ta
9) Hur många bilder som ska förladdas innan övergångarna börjar 
   (Första bilden visas fram till dess)
*/

--></script>
Jesper TMedlem sedan nov. 20017 144 inlägg
#16

Föreslår att du klipper ut det som du får i källkoden och fortsätter ditt inlägg i javascriptforumet eftersom att det nu är en javascriptfråga.
;)

joohnMedlem sedan jan. 200463 inlägg
#17

Hehe okej, postade just ett inlägg där. Tack så mycket för hjälpen. Det där har man nog stor nytta av :) Speciellt om man vill ha nya bilder varje gång.
Men förresten när javascriptsproblemet är löst och att man ska kunna klicka på next / back så undrar jag om det är i namnordning dom går efter varandra?

Jesper TMedlem sedan nov. 20017 144 inlägg
#18

Ja, filerna skall listas i bokstavsordning.

138 ms totalt · 3 externa anrop · v20260731065814-full.30151723
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
136 ms — hämta tråd, inlägg och bilagor (db)