FeelingLucky = function() {
    this.url = new URL(window.location.href);
    this.baseImageUrl =  new URL(window.location.href);
    this.baseImageUrl.setPathName('/getImage');
    this.baseImageUrl.setQueryString('');
    this.baseImageUrl.setFragment('');

    this.titleElement_ = _gel('title');
    this.titleLoading_ = _gel('titleLoading');
    this.image_ = _gel('image');
    this.zoom_ = _gel('zoom');
    this.zoomContainer_ = _gel('zoomContainer');
    this.imageContainer_ = _gel('imageContainer');
    this.ownerUrl_ = _gel('ownerUrl');
    this.dimensions_ = _gel('dimensions');
    this.loading_ = _gel('loading');
    this.theCode_ = _gel('theactualcode');
    this.query = _gel('q');

    this.origW = null;
    this.origH = null;

    this.groupIdElement_ = _gel('imageSource');
    this.groupId_ = this.url.getQueryStringParam('groupId') || '65811237@N00';
    this.setSelectBox(this.groupId_);
    this.size_ = this.url.getQueryStringParam('size') || '';
    this.title_ = '';
};

FeelingLucky.prototype.setSelectBox = function(groupId) {
    for (var i=0, option; option = this.groupIdElement_.options[i]; i++) {
        if (option.value == groupId) {
            this.groupIdElement_.selectedIndex = i;
            return;
        }
    }
    this.groupIdElement_.selectedIndex = 0;
};

FeelingLucky.ImageSize = {
  Small : 't',
  SmallSquare : 's',
  Medium : '',
  Huge : 'o'
};

FeelingLucky.prototype.getImage = function(opt_groupId) {
    this.hideZoom();
    this.setIsLoading(true);

    this.groupId_ = opt_groupId || this.groupId_;

    if (this.groupId_ == 0) {
        this.groupId_ = prompt('Please enter a public Flickr group ID');
    }

    if (this.image_ && this.image_.parentNode) {
        this.image_.parentNode.removeChild(this.image_);
    }

    var myRequest = new ajaxObject(
            this.baseImageUrl.getPathName(),
            bind(this.onGotImageDetails, this));

    this.url = new URL(this.baseImageUrl.toString());
    if (this.query.value != "") {
        this.url.addQueryStringParam('q', this.query.value);
    } else {
        this.url.addQueryStringParam('groupId', this.groupId_);
    }
    myRequest.update(this.url.getQueryString());
};

FeelingLucky.prototype.getImageElement = function(src) {
    var img = new Image();
    img.src = src;
    img.setAttribute('title', 'Click to load another random image');
    img.className = 'click';
    img.onload = bind(function() { this.onGotImage(); }, this);
    img.onclick = bind(function() {window.location = this.image_.src; }, this);
    return img;
};

FeelingLucky.prototype.onGotImageDetails = function(response, statusCode) {
    if (statusCode == 200) {
        var photoDetails;
        eval(response);
        this.photoDetails_ = photoDetails;

        if (!this.photoDetails_) {
            alert('Failed to obtain photo details');
        } else {

            this.setImageSize(this.size_);

            this.title_ = photoDetails.title;
            this.titleElement_.innerHTML = this.title_
            this.imageContainer_.style.height = '';
            this.ownerUrl_.href = photoDetails.ownerUrl;
        }
    } else {
        alert('Something went wrong :(' + response);
    }
};

FeelingLucky.prototype.setImageSize = function(size) {
    this.hideZoom();
    this.setIsLoading(true);

    this.size_ = size;
    this.titleElement_.innerHTML = this.title_;

    this.origW = null;
    this.origH = null;
    
    var imageUrl = this.getImageUrl(size);
    this.image_ = this.getImageElement(imageUrl);
    this.imageContainer_.innerHTML = '';
    this.imageContainer_.appendChild(this.image_);

    this.updateCode();
};

FeelingLucky.prototype.getImageUrl = function(size) {
    var url = this.photoDetails_.urlNoSize;
    url += size == FeelingLucky.ImageSize.Huge ? this.photoDetails_.originalSecret : this.photoDetails_.secret;
    if (size) {
        url += '_' + size;
    }
    url += this.photoDetails_.fileType;
    return url;
};

FeelingLucky.prototype.setIsLoading = function(isLoading) {
    this.loading_.style.display = isLoading ? 'inline' : 'none';
    if (isLoading) {
        this.titleElement_.innerHTML = '';
        this.titleLoading_.innerHTML = 'Loading ';
        this.dimensions_.innerHTML = '';
    } else {
        this.titleLoading_.innerHTML = '';
        this.addDimensionInfo(this.image_);
    }
};

FeelingLucky.prototype.addDimensionInfo = function(img) {
    this.dimensions_.innerHTML = '(' + img.width + ' x ' + img.height + 'px)';
};

FeelingLucky.prototype.onGotImage = function() {
    this.setIsLoading(false);
    this.resizeImage();
    //this.imageContainer_.style.height = this.image_.height + 'px';

    this.setupZoom();
};

FeelingLucky.prototype.resizeImage = function() {
    var elem = this.image_;

    if (elem) {

        this.origW = this.origW || elem.width;
        this.origH = this.origH || elem.height;

        var ratio = this.origH / this.origW;

        var maxWidth = document.body.clientWidth || innerWidth;
        maxWidth -= this.size_ == FeelingLucky.ImageSize.Huge ? 300 : 10;

        if ((elem.width > elem.height) ||
                (elem.width == 0) || (elem.height == 0))  {
            if (elem.width > maxWidth) {
                elem.width = maxWidth;
                elem.height = maxWidth * ratio;
            } else {
                elem.width = Math.min(this.origW, maxWidth);
                elem.height = elem.width     * ratio;
            }
        } else {
            if (elem.height > maxWidth) elem.height = maxWidth;
        }
        this.setupZoom();
    }
};

FeelingLucky.prototype.setupZoom = function() {
    if (this.size_ == FeelingLucky.ImageSize.Huge) {
        this.zoom_.innerHTML = '';
        this.zoomContainer_.style.display = '';
        this.imageContainer_.className = 'container';
        MojoZoom.makeZoomable(this.image_, this.image_.src, this.zoom_, 256, this.image_.height, true);
    } else {
        this.hideZoom();
    }
};

FeelingLucky.prototype.hideZoom = function() {
    this.zoomContainer_.style.display = 'none';
    this.imageContainer_.className = '';
};

FeelingLucky.prototype.updateCode = function() {
    var url = new URL(this.url.toString());
    url.setPathName('/image');
    url.addQueryStringParam('size', this.size_);
    
    this.theCode_.value = '<img src="' + url.toString() + '" title="Feeling Lucky by Bonstio"/>';
};

FeelingLucky.prototype.getTheCode = function() {
    document.getElementById('thecode').style.display = 'block';
};