var flickrScript = null
var head = null
var N_PICTURES = 9

function jsonFlickrFeed(json) {
    var flickrImages = []
    var dragStuff = document.getElementById('dragStuff')

    while (dragStuff.childNodes.length) { dragStuff.removeChild(dragStuff.firstChild) }

    for (var i = 0; i < N_PICTURES && i < json.items.length; ++i) {
        // why no media.s immdiately?
        var thumb = json.items[i].media.m.replace(/_m.jpg$/, '_s.jpg')
        var img = new Image()
        img.src = thumb
        img.id = 'd' + i
        flickrImages.push(img)
        dragStuff.appendChild(img)
    }

    createDragPushGroup(flickrImages, null, { 
        dragBeforeClass: 'dragBefore', 
        dragAfterClass: 'dragAfter',
        proxyClass: 'dragProxy',
        removeDimensions: true
    })
}

function loadImagesFromFlickr(tag) {
    if (flickrScript) {
        // remove existing from head
        head.removeChild(flickrScript)
    }

    flickrScript = document.createElement('script')
    flickrScript.type = 'text/javascript'
    flickrScript.src = 'http://www.flickr.com/services/feeds/photos_public.gne?format=json&tags=' + tag
    head.appendChild(flickrScript)
}

function productsAndServicesInit() {
    head =   document.getElementsByTagName("head")[0]
    loadImagesFromFlickr('colorful')
}