var Site = {
    start: function(){
        Site.externalLinks();
	Site.flashPage();
        Site.appearText.delay(0, Site.appearText, '');
        new eip( $$('#left .textholder'), '/update.php', {update: '1', updatecontent: '1'});
	
    },
    
    flashPage : function() {
        var delay =0;
        $$('.f').each(function(link,index) {
            if (index == 0) { index = 1; }
            delay += (250 - index * 20);
            link.setStyle('opacity', '0');
            var myeffect = new Fx.Style(link, 'opacity', {duration:750});
            myeffect.start.delay(delay, myeffect, [0,1]);
        });
    },
    
    talk : function() {
        var periodical;
        
        var fx = new Fx.Style('talk', 'border-width', {duration:100});
        
        var url = "raidchan.txt";
        var ajax = new Ajax(url, {
            method: 'get',
            //update: $('talk'),
            onComplete : function(resp) {
                fx.start.delay(100, fx, 1);
                //fx.start.delay(200,fx,{'background': #000'});
                //fx.start({'background': '#000'});
                $('talk').setHTML(resp);
                fx.start({
                    'height': 220,
                    'width': 600
                });
            }
        });
        
        var refresh = (function() {
            fx.start(0,5);
            //fx.start({'background': '#000 url(images/loader.gif) no-repeat 50% 50%'});
            ajax.request(); 
        });
        
        periodical = refresh.periodical(5000, this); 
        ajax.request(); 

    },
    
    pop: function(i) {
	window.open("/getimg.php?img="+i,'_blank', 'height=750,left=75,location=0,resizable=1,toolbar=0,top=100,width=820,scrollbars=1',false);
    },
    
    externalLinks : function() {
        $$('a.external').each(function(link) {
            link.target = '_blank';
        });
    },
    
    appearText: function(){
	var timer = 0;
	var sideblocks = $$('#links a');
	var slidefxs = [];
	var colorfxs = [];
	
        if (!window.ie6 && window.location.href.split(".com/")[1] == '') {
            sideblocks.each(function(el, i){
	    el.setStyle('margin-left', '-155px');
            el.setStyle('opacity', '0');
	    timer += 150;
	    slidefxs[i] = new Fx.Styles(el, {
		duration: 250,
		transition: Fx.Transitions.backOut,
		wait: true,
		onComplete: Site.createOver.pass([el, i])
	    });
	    //slidefxs[i].start.delay(timer, slidefxs[i], 0);
            slidefxs[i].start.delay(timer,  slidefxs[i], {
                'margin-left': 0,
                'opacity': 1
            });
            }, this);
        }
        else {
            sideblocks.each(function(el, i) {
                Site.createOver(el, i);
            },this);
        }
                
    },	
    
    createOver: function(el, i){
        var first = el;
	if (!first || first.getTag() != 'a') return;
	var overfxs = new Fx.Styles(first, {'duration': 200, 'wait': false});
	el.mouseouted = true;
	
        el.addEvent('mouseenter', function(e){
	    overfxs.start({
		'margin-left': 10
            });
        });
	el.addEvent('mouseleave', function(e){
	    overfxs.start({
		'margin-left': 0
	    });
	});
    }
};


var eip = new Class({
    /**
     * Initialize
     * @param elements els An array of elements.
     * @param string action the path to the file to target with form.
     * @param object params (optional) Any extra parameters you would like to send with the AJAX call.
     * @param object options (optional) Override the default classes with this.
     */
    initialize: function(els, action, params, options) {
        // Handle array of elements or single element
        if ($type(els) == 'array') {
                els.each(function(el){
                        this.prepForm(el);
                }.bind(this));
        } else if ($type(els) == 'element') {
                this.prepForm(els);
        } else {
                return;
        }

        // Store the action (path to file) and params
        this.action = action;
        this.params = params;

        // Default options
        this.options = Object.extend({
                overCl: 'over',
                hiddenCl: 'hidden',
                editableCl: 'edittextarea',
                textareaCl: 'textarea'
        }, options || {} );
    },
    
    /**
     * Add events to element
     * @param element el Your target element.
     */
    prepForm: function(el) {
        var obj = this;
        el.addEvents({
                'mouseover': function(){this.addClass(obj.options.overCl);this.setProperty('title','Double click to edit. Last Updated: '+this.getProperty('lastedited'))},
                'mouseout': function(){this.removeClass(obj.options.overCl);},
                'dblclick': function(){obj.showForm(this);}
        });
    },


    /**
    * Build and/or show form
    * @param element el Your target element.
    */
    showForm: function(el) {
        var classes = el.getProperty('class').split(" ");
        for (i=classes.length-1;i>=0;i--) {
            if (classes[i].contains('type:')) {
                var target = classes[i].split(":")[1];
            }
            else if (classes[i].contains('id:')) {
                var id = classes[i].split(":")[1];
            }
        }
        var height = el.getStyle('height').toInt();
        height = height + 42 + 'px';
        
        
        // Hide target element
        el.addClass(this.options.hiddenCl);

        // If the form exists already, let's show that
        if (el.form) {
            el.form.removeClass(this.options.hiddenCl);
            //el.form[target].focus();
            //this.ajaxGet(id,$('content'),target);
            //el.form.focus();
	    el.form.remove();
            //return;
        }

        // Create new form
        var form = new Element('form', {
            'id': 'form_' + id,
            'action': this.action,
            'class': this.options.editableCl
        });

        // Store new form in the element
        el.form = form;
        
        // Need this to pass to the buttons
        var obj = this;

        var divholder = new Element('div', {
            'style': 'display:block;width: 750px !important',
            'class': 'editboxholder'
        }).injectInside(form);

        // Add a submit button
        new Element('input', {
            'type': 'submit',
            'value': 'save',
            'class': 'submitbutton',
            'style': 'font-weight: bold',
            'events': {
                'click': function(evt){
                    (new Event(evt)).stop();
                    el.empty();
                    el.appendText('saving...');
                    obj.hideForm(form, el);
                    form.send({update: el});
                },
		'keydown': function(evt){
			var event = new Event(evt);
			if (event.key == 's' && event.control) {
				el.empty();
				el.appendText('saving...');
				obj.hideForm(form, el);
				form.send({update: el});
			}
		}
            }
        }).injectInside(divholder);
        

        // Add a cancel button
        new Element('input', {
            'type': 'button',
            'value': 'cancel',
            'class': 'submitbutton',
            'style': 'margin-left:4px;',
            'events': {
                'click': function(form, el){
                    obj.hideForm(form, el);
                    //alert("form: "+form+" el: "+el);
                    //(new Event(form,el)).stop();
                }.pass([form, el])
            }
        }).injectInside(divholder);

        
        var big = 0;
        var oldstyles;
        new Element('input', {
            'type': 'button',
            'value': '<->',
            'class': 'submitbutton',
            'style': 'margin-left:4px;',
            //'style': 'margin:0;margin: 0 0 0 305px; padding: 0',
            'title': 'Expand/Contract width of EditBox',
            'events': {
                'click': function(form, el){
                    (new Event(form,el)).stop();
                    if (big == 0) {
                        // change to big
                        var neww = $('container').getStyle('width').toInt();
                        neww = neww - 20;
                        input.setStyles({
                        'position': 'absolute',
                        'display': 'block',
                        'width': neww +"px",
                        'overflow': 'visible',
                        'z-index': '5000'
                        });
                        big = 1;
                        return 0;
                    }
                    else if (big == 1) {
                        //change to normal
                        input.setStyles(oldstyles);
                        big = 0;
                        return 0;
                    }
                    return 0; // will never get here
                }
            }
        }).injectInside(divholder);
        
        var myselect = new Element('select', {
                'class': 'submitbutton',
                'name': 'images',
                'style': 'width:140px;padding:0;margin:0;',
                'class': 'submitbutton',
                'title': 'Insert an image'
            }).injectInside(divholder);
            
            var ninput = $('textbox-'+id);
            for (var i=0; i<picsarray.length; i++) {
                new Element('option', {
                    'name': i,
                    'events': {
                        'click': function(form,el) {
                            var ninput = $('textbox-'+id);
                            if (this.getText().contains("t_:")) {
                                var name = this.getText().split(":")[1];
                                ninput.insertAtCursor('<a onclick="Site.pop(\''+name+'\');return false" href="/files/'+name+'"><img src="/files/thumb_'+name+'" alt="'+name+'" /></a>');
                            } else {
                                ninput.insertAroundCursor({before:'<a onclick="Site.pop(\''+this.getText()+'\');return false" href="/files/'+this.getText()+'">',after:'</a>'});
                            }
                        }
                    }
                }).setText(picsarray[i]).injectInside(myselect);
            }
            
        /*new Element('span', {
            'style': 'color: #adadad;font-size:9px;padding-left:15px;width:120px;'
        }).setHTML('Last Updated: '+$('content').getProperty('lastedited') + ' ago').injectInside(divholder);*/
        
        
        new Element('a', {
            'href' : '#',
            'id': 'helplink',
            'style': 'margin:0;margin-left:40px;padding-left:20px;width:80px;background:url(/images/icons/lightbulb.png) no-repeat 0% 0%;',
            'events': {
                'click': function(link) {
                    (new Event(link)).stop();
                    if ($('helpbox') && $('helpbox').getStyle('display') != 'none') {
                        $('helplink').setHTML('Show Help');
                        $('helpbox').setStyle('display', 'none');
                    }
                    else if ( $('helpbox') && $('helpbox').getStyle('display') == 'none') {
                        $('helpbox').setStyle('display', 'block');
                        $('helplink').setHTML('Hide Help');
                    }
                    else {
                        $('helplink').setHTML('Hide Help');
                        new Element('div', {
                            'id' : 'helpbox',
                            'style': 'position: relative;width:750px;height:auto;'
                        }).setHTML('<style type="text/css">table.help { background-color:#fff;width:560px; border:1px solid #333333}table.help th {font-size:14px;font-style:italic;color:#888; background-color:#333333 }table.help td { padding: 5px;background: #DCDAC9; }</style><table class="help"><tr><th>You Type:</th><th>You See:</th></tr>  <tr><td>===Sub Title===</td><td><div class="subtitle">Sub Title</div></td></tr><tr><td>***Mini Title***</td><td><div class="minititle">Mini Title</div></td></tr><tr><td>[Click here to visit the About Us Page](/About_Us)</td><td><a href="/About_Us">Click here to visit the About Page</a></td></tr><tr><td>&lt;b&gt;This is important&lt/b&gt;</td><td><b>This is important</b></td></tr><tr><td>&lt;i&gt;"Difficulties mastered are opportunities won." - Winston Churchill&lt;/i&gt;</td><td><i>"Difficulties mastered are opportunities won." - Winston Churchill</i></td></tr><tr><td>He\'s &lt;u&gt;NOT&lt;/u&gt; the Messiah, He\'s a &lt;u&gt;very&lt;/u&gt; naughty boy!</td><td>He\'s <u>NOT</u> the Messiah, He\'s a <u>very</u> naughty boy!</td></tr><tr><td>[list]<br />These are..<br />some<br />bullet points...<br />[/list]</td><td><span style="font-size:9px"><ul><li>these are..</li><li>some</li><li>bullet points...</li></ul></td></tr><tr><td>[count]<br />one<br />two<br />three<br />[/count]</td><td><ol><li>one</li><li>two</li><li>three</li></ol></td></tr></table>').injectAfter(divholder);
                    }
                }
            }
        }).setHTML('Show Help').injectInside(divholder);
                        
        new Element('input', {
            'type': 'button',
            'value': '-',
            'class': 'submitbutton',
            'style': 'margin:0;margin-left:100px;margin-right:4px;padding: 0',
            'title': 'Decrease EditBox Size',
            'events': {
                'click': function(form, el){
                    (new Event(form,el)).stop();
                    var h = input.getStyle('height').toInt();
                    var nh = h - 60;
                    if (nh <17) { nh = 17; }
                    var myH = new Fx.Style(input, 'height', {duration: 250}).start(h, nh);
                }
            }
        }).injectInside(divholder);
        
        new Element('input', {
            'type': 'button',
            'value': '+',
            'class': 'submitbutton',
            'style': 'padding: 0;margin:0;',
            'title': 'Increase EditBox Size',
            'events': {
                'click': function(form, el){
                    (new Event(form,el)).stop();
                    var h = input.getStyle('height').toInt();
                    var nh = h + 60;
                    var myH = new Fx.Style(input, 'height', {duration: 250}).start(h, nh);
                }
            }
        }).injectInside(divholder);

        // For every param, add a hidden input
        for (param in this.params) {
            new Element('input', {
                'type': 'hidden',
                'name': param,
                'value': this.params[param]
            }).injectInside(form);
        }

        //
        new Element('input', {
            'type': 'hidden',
            'name': 'id',
            'value': id
        }).injectInside(form);
        
        // inject our target
        new Element('input', {'type': 'hidden','name': 'target','value': target }).injectInside(form);

        // Add the form after the target element
        form.injectAfter(el);

        // Create a textarea or input for user
        var input = new Element('textarea', {
            'name': 'content',
            'style': 'width:560px;height: '+height,
            'class': 'editbox',
            'id' : 'textbox-'+id
        }).appendText('Getting content from server...').injectInside(form);
        
        this.ajaxGet(id,input,target);
        
        oldstyles = input.getStyles('position','display','width','overflow','z-index');

        // Focus on the input
        input.focus();
    },
    
    /**
     * Ajax Get
     * @param id to pass to php script
     * @param element to update with content
     */
    ajaxGet: function(id, el, target) {
        if (!el) { el = $('content'); }
        $$('form input.submitbutton').each(function(i, c) { i.setProperty('disabled', 'true'); });
        el.setProperty('disabled', 'true');
        url = "?getcontent=1&id="+id+"&target="+target;
        var rq = new Ajax("/update.php"+url, {
            method: 'get',
            onComplete:function(resp){
                var content = resp;
                el.setText(resp);
                $$('form input.submitbutton').each(function(i, c) { i.setProperty('disabled', ''); });
                el.setProperty('disabled', '');
            }
        }).request();
    },

    /**
     * Hide form
     * @param element form Your target form.
     * @param element el Your target element.
     */
    hideForm: function(form, el) {
            form.addClass(this.options.hiddenCl);
	    el.removeClass(this.options.hiddenCl);
    }

});

// needs to be domready instead of load for ie6
window.addEvent('domready', Site.start);