Login

Slideshow (Random Image Display) - Using Jquery

Author:
veeravendhan
Posted:
July 25, 2009
Language:
Python
Version:
1.0
Score:
0 (after 0 ratings)

The above code contains the file name fetches random images from the database. Using the JQuery this image is displayer in the page

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
#This code fetches the file name stored in the database send to the simple json format
#Images are displayed in random way in a 5 place holder in the template
def getImages(request):
    from django.http import HttpResponse
    from django.utils import simplejson
    import random
    LAST_INDEX = -1
    NUMBER_OF_ADS = 5
    slide_show = <<modelsName>>.objects.all()
    slide_show_randomIMG = [random.choice(slide_show).adspath.name.split('/')[LAST_INDEX] for i in range(NUMBER_OF_ADS)]    
    json = simplejson.dumps(slide_show_randomIMG)
    return HttpResponse(json, mimetype='application/javascript')

#Template Code
var $ = jQuery.noConflict();
$(document).ready(function() {    
    setTimer();
});

function setTimer() {
    //Call the gallery function to run the slideshow, 7000 = change to next image after 7 seconds
    setInterval('changeImage()', 7000);
}

function changeImage() {   
    $.getJSON("/getImages/",
    function(json) {                
            for (j = json.length - 1; j >= 0; j--) {
                imagID = "addImg" + (j + 1);                
                document.getElementById(imagID).src = "/static/ads/" + json[j];                
            }        
        }
    );
}

More like this

  1. Template tag - list punctuation for a list of items by shapiromatron 8 months, 3 weeks ago
  2. JSONRequestMiddleware adds a .json() method to your HttpRequests by cdcarter 9 months ago
  3. Serializer factory with Django Rest Framework by julio 1 year, 3 months ago
  4. Image compression before saving the new model / work with JPG, PNG by Schleidens 1 year, 4 months ago
  5. Help text hyperlinks by sa2812 1 year, 5 months ago

Comments

Please login first before commenting.