var Kiosk = new Class({
    url       : 'http://www.dubsi.com',
    max_tags  : 10,
    images    : {},
    min_x     : 300,
    min_y     : 200,
    s_size    : 50,                         // Square size
    top_c     : null,                       // Top Corner of target image
    left_c    : null,                       // Left Corner of target image
    c_image   : null,                       // Current Image
    cmCount   : 0,
    page	  : 1,
    cmLimit   : 1,
    public_width : 0,
    login_via_add : 0,
    userID : 0,
    
    show      : function() {
                    new Asset.css(this.url+'/jscript/cm2.css');

                    var image_id = 1;
                    var top_c    = 1;
                    var left_c   = 1;
                    var comment_text_backup = '';
                    $$('img').each(function(image) {
                        var size = image.getSize();
                        if (size.x >= this.min_x && size.y >= this.min_y) {
                            image.store('image_id', image_id);
                            this.images[image_id] = {
                                img: image,
                                tags : {},
                                comments : {},
                                img_width : size.x,
                                img_height : size.y
                            };

                            var id_ = 'tag_div_' + image_id;
                            var tag_div = new Element('div', {id: id_, 'class':'cmtag'});
                            this.images[image_id]['tags'][top_c+ '-' + left_c] = {x: left_c, y: top_c};
                            
                            
//@@@@@@ View Link
                            var viewLink_container = new Element('span', {
                                Class: 'Dubsi_view_link_Container'
							});
                            var viewLink = new Element('a', {
                                id: 'Dubsi_view_link_' + image_id,
                                html: 'View Comments',
                                href: '#'
                            });
                            viewLink.store('show', 0);
                            viewLink.store('image_id', image_id);
                            viewLink.store('page', 1);
                            viewLink.addEvent('click', function(e){
                                e.stop();
                                if (e.target.retrieve('show')) {
                                    this.hideComments(e.target.retrieve('image_id'));
                                    e.target.set('html', 'View Comments');
                                } else {
                                    this.send_request(5, e.target.retrieve('image_id'), e.target.retrieve('page'), 1);
                                    e.target.set('html', 'Hide Comments');
                                }
                                e.target.store('show', !e.target.retrieve('show'));
                            }.bind(this));
                            viewLink_container.adopt(viewLink);
//@@@@@@ ADD Link
                            var addLink_container = new Element('span', {
                                Class: 'Dubsi_add_link_Container'
							});
                            var addLink = new Element('a', {
                                id: 'Dubsi_add_link_' + image_id,
                                html: 'Add',
                                href: '#'
                            });
                            addLink.store('image_id', image_id);
                            addLink.addEvent('click', function(e) {
                                e.stop();
                                image_id = e.target.retrieve('image_id');
                                //this.getContainer(image_id);//this.getContainer(e.target.retrieve('image_id'));
                                //this.showComments(image_id, 1, 1); // Changed
                                this.showForm(image_id);//this.showForm(e.target.retrieve('image_id'));
                                this.send_request(1, 0, 0, 0);
                            }.bind(this));
                            addLink_container.adopt(addLink);
                            
//@@@@@@ /ADD link
//@@@@@@ 					
							
							
							var tmptmp = this.img_container(image_id);
							this.showUpperLogo(image_id);
							
							
                            var ldesc = new Element('div', {id: 'Dubsi_main_bar_' + image_id, 'class': 'Dubsi_main_bar'});
                            ldesc.adopt(tag_div, viewLink_container, new Element('Span', {html:'&nbsp;|&nbsp;'}), addLink_container); //new Element('span', {id:'login-container', html:'login'})
                            var ldiv = new Element('div', {'class':'Dubsi_main_BOX', id: 'Dubsi_main_Container_' + image_id});//, {'class': 'imgteaser'});
                            ldiv.adopt(ldesc);
                            /*if(size.x < 1024){
                            	ldiv.setStyle('width', (size.x) / 2);
                            }else{
                            	ldiv.setStyle('width', 512);
                            }*/
                            /*

                            var co = image.getCoordinates();
                            var top = (co.top + co.height) + 'px';
                            var left = (co.left) + 'px';
                            

                            ldiv.setStyles({
                                'top':      top,
                                'left':     left
                            });*/
                            this.public_width = size.x;
                            ldiv.setStyle('width', this.public_width);
                            ldesc.setStyle('width', this.public_width);
                            tmptmp.grab(ldiv);
                            $$('body')[0].adopt(tmptmp);
                            //$('Dubsi_images_container_'+ image_id).grab(ldiv);
                            tmptmp.addEvent('mouseenter', function(e){
                            //$('Dubsi_images_container_'+ image_id).addEvent('mouseenter', function(e) {
                            //image.hover(function()
								e.stop();
								//this.getImage(c_image).setStyle('cursor', 'auto');
								//image.setStyle('cursor', 'crosshair');
								//document.id('cmlinks-' + image_id).setStyle('visibility','visible');
								//ldiv.setStyle('visibility', 'visible');
								//ldiv.setStyle('display', 'block');
								//ldiv.fadeIn(200);
								ldiv.fade(0.95);
								//viewLink.fireEvent('click', {target: $('Dubsi_view_link_' + image_id)});
								//alert(image_id);
								//this.send_request(5, image_id, 1, 1);
							}.bind(this));
							
							tmptmp.addEvent('mouseleave', function(e){
							//$('Dubsi_images_container_'+ image_id).addEvent('mouseleave', function(e){
								e.stop();
								//this.getImage(c_image).setStyle('cursor', 'auto');
								//image.setStyle('cursor', 'crosshair');
								//document.id('cmlinks-' + image_id).setStyle('visibility','visible');
								//ldiv.setStyle('visibility', 'hidden');
								//ldiv.setStyle('display', 'none');
								//ldiv.fadeTo("slow", 0.3);
								ldiv.fade('out');
							}.bind(this));

                            //$$('body')[0].adopt($('Dubsi_images_container_'+ image_id));
                            
                            
                            this.comment_Form_box(image_id);
                            this.login_Form_box(image_id);
                            this.positionTag(image_id);
                            image_id++;
                        }
                    }.bind(this));
                    //this.send_request(1, 0, 0, 0);
                    
                    ViewALlCommentsTEST = new Element('div', {
						'id': 'ViewALlComments'
					});
					$$('body')[0].adopt(ViewALlCommentsTEST);
                },



    getSrc     : function(img) {
        return this.getImage(img).get('src').toURI() + '';
    },

    getImage   : function(img) {
        return this.images[img]['img'];
    },

    login_Form_box : function(c_image){
        var email = new Element('input');
        email.set('type', 'text');
        email.set('name', 'email');
        email.set('id', 'Dubsi_email_field_' + c_image);
        var email_label = new Element('label');
        email_label.set('for', email.get('id'));
        email_label.set('html', 'Email&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;');
        var password = new Element('input');
        password.set('type', 'password');
        password.set('name', 'password');
        password.set('id', 'Dubsi_password_field_' + c_image);
        var password_label = new Element('label');
        password_label.set('for', password.get('id'));
        password_label.set('html', 'Password&nbsp;&nbsp;');
        
        var submit = new Element('input');
        submit.set('type', 'button');
        submit.set('value', 'Login');
        submit.set('id', 'Dubsi_loginsubmit_buttom_' + c_image);
        submit.store('c_image', c_image);
        submit.addEvent('click', function(e){
        	e.stop();
        	if(this.login_via_add){
        		this.send_request(4, e.target.retrieve('c_image'), 0, 0);
        	}else{
        		this.send_request(3, e.target.retrieve('c_image'), 0, 0);
        	}
        	}.bind(this));
        var cancel = new Element('input');
        cancel.set('type', 'button');
        cancel.set('value', 'Cancel');
        cancel.set('id', 'login_cancel-' + c_image);
        cancel.store('c_image', c_image);
        cancel.addEvent('click', this.hideLogin.bind(this));
		var login_container = new Element('div');
		login_container.set('class', 'Dubsi_login_BOX');
        login_container.setStyle('display', 'none');
        login_container.set('id', 'Dubsi_login_BOX_' + c_image);
        login_container.adopt(email_label, email,new Element('br'), new Element('br'), password_label, password, new Element('br'),new Element('br'), submit, cancel);
        document.id('Dubsi_main_Container_' + c_image).grab(login_container, 'top');
        return login_container;
        },
        
        
        doLogin : function(c_image){
        	if (Browser.ie){
        		
        	}
        	//var login_container = this.login_Form_box(c_image);//document.id('login_container-' + c_image);
        	$$('div[id$=BOX_'+c_image+']').each(function(box){
        		box.setStyle('display', 'none').setStyle('visibility', 'hidden');
        	}.bind(this));
        	document.id('Dubsi_view_link_' + c_image).set('html', 'View Comments');
        	document.id('Dubsi_view_link_' + c_image).store('show', 0);
        	//document.id('Dubsi_addcomment_BOX_' + c_image).setStyle('display', 'none');alert("OK2");
        	//document.id('Dubsi_showcomment_BOX_' + c_image).setStyle('display', 'none').setStyle('visibility', 'hidden');
        	//this.hideComments(c_image);
        	document.id('Dubsi_login_BOX_' + c_image).setStyle('display', 'block').setStyle('visibility', 'visible');
        	//document.id('login_container-' + c_image)
        	this.positionTag(c_image);
    	},

    	hideLogin : function(e) {
    		var c_image = e.target.retrieve('c_image');
        	document.id('Dubsi_login_BOX_' + c_image).setStyle('display', 'none');
        	this.positionTag(c_image);
    	},

	comment_Form_box : function(c_image) {
        var comment = new Element('textarea');
        comment.set('name', 'comment');
        comment.set('id', 'Dubsi_comment_field_' + c_image);
		comment.setStyle('width', '95%');
		comment.setStyle('heght', '80px');
		
        var label = new Element('label');
        label.set('for', comment.get('id'));
        label.set('html', '&nbsp;');
        
        var loginLink_container = new Element('span', {
			//id: 'Dubsi_login_link222_' + image_id,
            Class: 'Dubsi_login_link_Container'
		});
		if (Browser.safari){//javascript: return false;
        		var loginLink = new Element('a', {
                                id: 'Dubsi_login_link_' + c_image,
                                Class: 'Dubsi_login_link',
                                html: 'Login',
                                href: '#'
                                //rel: 'popup'
                            });
                            loginLink.store('logged', 0);
                            loginLink.store('c_image', c_image);
                            loginLink.addEvent('click', function(e) {
                                e.stop();
                                c_image = e.target.retrieve('c_image');
                                if (e.target.retrieve('logged')){
                                	this.send_request(2, c_image, 0, 0);
                                }else {
                                    window.open('http://www.dubsi.com/remotelogin.php','Login','width=820,height=400,screenX=350,screenY=100,scrollbars=no,toolbar=no,location=no,directories=no,status=no,menubar=no');
                                }
                            }.bind(this));
		}else{
							var loginLink = new Element('a', {
                                id: 'Dubsi_login_link_' + c_image,
                                Class: 'Dubsi_login_link',
                                html: 'Login',
                                href: '#'
                            });
		
                            loginLink.store('logged', 0);
                            loginLink.store('c_image', c_image);
                            loginLink.addEvent('click', function(e) {
                                e.stop();
                                c_image = e.target.retrieve('c_image');
                                if (e.target.retrieve('logged')){
                                	this.send_request(2, c_image, 0, 0);
                                    //this.hideComments(e.target.retrieve('image_id'));
                                    //do logout and then show the bar
                                    //this.hideLogin(image_id);
                                    //e.target.set('html', 'Login');// must be changed to login after logout successful
                                }else {
                                    //this.showComments(e.target.retrieve('image_id'), 1, 1);
                                    // show login container
                                    this.doLogin(c_image, 1, 1);
                                }
                                //e.target.store('logged', !e.target.retrieve('logged')); // must be changed after login | logout done
                            }.bind(this));
                            
		}//for else
							loginLink_container.adopt(loginLink);
							
        var guest_container = new Element('span' ,{'id' : 'Dubsi_guest_Container_' + c_image, 'class': 'Dubsi_guest_Container'});
        var guest_user = new Element('input');
        guest_user.set('type', 'checkbox');
        guest_user.set('name', 'guest_user');
        guest_user.set('value', 'checked');
        guest_user.set('id', 'Dubsi_guest_checkboox_' + c_image);
        var guest_user_label = new Element('label');
        guest_user_label.set('for', guest_user.get('id'));
        guest_user_label.set('html', 'Post&nbsp;Anonymously');
        /*guest_user.addEvent('click', function(){
        		if ( guest_user.get('checked') != '' ) {	
        		}
        		else {
        		}
        	});*/
        guest_container.adopt(guest_user, guest_user_label);
        var addcomment_buttons_container = new Element('span' ,{'id' : 'Dubsi_addcomment_buttons_Container' + c_image, 'class': 'Dubsi_addcomment_buttons_Container'});
        var submit = new Element('input');
        submit.set('type', 'button');
        submit.set('value', 'Add');
        submit.set('id', 'Dubsi_submit_button_' + c_image);
        submit.store('c_image', c_image);
        submit.addEvent('click', function(e){
        		e.stop();
        		/*if(Browser.safari){
        		//var tt = ;
        		this.send_request(1, 0, 0, 0);
        			if(!this.userID){
        				window.open('http://www.dubsi.com/remotelogin.php','Login','width=820,height=400,screenX=350,screenY=100,scrollbars=no,toolbar=no,location=no,directories=no,status=no,menubar=no');
        			}else{
        				this.send_request(4, e.target.retrieve('c_image'), 0, 0);
        			}
        		}else{
        			this.send_request(4, e.target.retrieve('c_image'), 0, 0);
        		}*/
        		this.send_request(4, e.target.retrieve('c_image'), 0, 0);
				/*if(Browser.safari){
					var i = 0;					
        		//while(i<=5){//alert(this.userID+' '+i);
        		 var perID = (function(){
        		 			alert(this.userID);
        		 			if(this.userID){
        		 				window.open('http://www.dubsi.com/remotelogin.php','Login','width=820,height=400,screenX=350,screenY=100,scrollbars=no,toolbar=no,location=no,directories=no,status=no,menubar=no');
        						//this.userID = 0;
        						clearInterval(perID);
        		 			}
        		 		}).periodical(2000);
        			//i += 1;
				//}
				//}*/
        	}.bind(this));
        var cancel = new Element('input');
        cancel.set('type', 'button');
        cancel.set('value', 'Cancel');
        cancel.set('id', 'Dubsi_cancel_buttom_' + c_image);
        cancel.store('c_image', c_image);
        cancel.addEvent('click', this.hideForm.bind(this));
        /*
        // Buggy because of 'e', when we fire click event, there is no e.retrieve!
        comment.addEvent('keypress', function(e) {
            if (e.key == 'enter') {
                document.id('Dubsi_submit_button_' + c_image).fireEvent('click');
            }
        });
        */
        addcomment_buttons_container.adopt(submit, cancel)
        var cmform = new Element('div', {'class':'Dubsi_addcomment_BOX'});
        //cmform.setStyle('visibility', 'hidden');
        cmform.setStyle('display', 'none');
        cmform.set('id', 'Dubsi_addcomment_BOX_' + c_image);
        cmform.adopt(label, new Element('br'), comment, new Element('br'), guest_container, addcomment_buttons_container, loginLink_container);
        document.id('Dubsi_main_Container_' + c_image).grab(cmform, 'top');
        return cmform;
    },

    showForm   : function(c_image) {
    	$$('div[id$=BOX_'+c_image+']').each(function(box){
        	box.setStyle('display', 'none').setStyle('visibility', 'hidden');
        }.bind(this));
        document.id('Dubsi_view_link_' + c_image).set('html', 'View Comments');
        document.id('Dubsi_view_link_' + c_image).store('show', 0);
    	//var comment_form = this.comment_Form_box(c_image);
    	//document.id('Dubsi_main_Container_' + c_image).grab(comment_form, 'top');
        document.id('Dubsi_comment_field_' + c_image).set('value', '');
        //container = this.getContainer(this.c_image);
        //form_container = container.getChildren('.cmformcontainer')[0];
        //form_container.setStyle('visibility', 'visible');
        document.id('Dubsi_addcomment_BOX_' + c_image).setStyle('visibility', 'visible').setStyle('display', 'block');
        this.positionTag(c_image);
    },

    hideForm   : function(e){
    	var c_image = e.target.retrieve('c_image');
        document.id('Dubsi_comment_field_' + c_image).set('value', '');
        document.id('Dubsi_addcomment_BOX_' + c_image).setStyle('display', 'none').setStyle('visibility', 'hidden');
        this.positionTag(c_image);
    },

    img_container : function(c_image){
    	var img_container = new Element('div', {'id' : 'Dubsi_images_container_' + c_image, 'class': 'Dubsi_images_container'});
    	var image_co = this.getImage(c_image).getCoordinates();
    	$$('body')[0].adopt(img_container);
    	document.id('Dubsi_images_container_' + c_image).setStyles({
            'top': (image_co.top + + image_co.height - 150) + 'px',
            'left':(image_co.left) + 'px',
            'width': (image_co.width+1) +'px',
            'height' : (150) + 'px'
            //'z-index' : 9999
        });
        return img_container;
    },
    	
    
    showUpperLogo : function(c_image) {
    	var upperLogo_container = new Element('div', {'id' : 'Dubsi_UpperLogo_' + c_image, 'class': 'Dubsi_UpperLogo'});
    	var image_co = this.getImage(c_image).getCoordinates();
    	$$('body')[0].adopt(upperLogo_container);
    	document.id('Dubsi_UpperLogo_' + c_image).setStyles({
    	//upperLogo_container.setStyles({
            'top': (image_co.top + image_co.height - 20) + 'px',
            'left':(image_co.left + image_co.width - 90) + 'px'
            //'z-index' : 9998
        });
    },

    positionTag   : function(c_image) {
        var image_co = this.getImage(c_image).getCoordinates();
        var co = document.id('Dubsi_main_Container_' + c_image).getCoordinates();
        var edited_height=co.height;
        if (co.height < 32 ) {
        	edited_height=37;
        }
        document.id('Dubsi_main_Container_' + c_image).setStyles({
        	'margin-top':(150 - edited_height) +'px'
        });
    },

    cancelComment : function(e) {
        e.stop();
        var image2  = e.target.retrieve('c_image');
        container = this.getContainer(image2);
        if (!container.getChildren('.Dubsi_comment_Container')[0].getChildren().length) {
            container.dispose();
            document.id('tag_div_' + image2 + '_' ).dispose();
            delete this.images[image2]['tags'][1+ '-' + 1];
        } else {
            this.hideForm(image2);
        }
    },












    send_request: function(actionTodo, c_image, page, cmLimit){//c_image , c_image, page, cmLimit
    //actionTodo 1=> check login   2=> logout   3=> login   4=> add comment   5=> show comment
    	if (!c_image){var c_image = 0; } //var c_image = e.target.retrieve('c_image');}
    	if (!page) {var page = 0; }
    	if (!cm_cmLimit) {var cm_cmLimit = 0; }
        var login_email = '';
        var login_password = '';
        var img_src = '';
        var comment_text = '';
        var guest_user_checkbox = '';
        var current_page_url = '';
        var img_width = '';
        var img_height = '';
        var cm_offset = '';
    	//alert(actionTodo); 
    	if (actionTodo == 3 || (actionTodo == 4 && this.login_via_add)){
    		login_email = document.id('Dubsi_email_field_' + c_image).get('value');
    		login_password = document.id('Dubsi_password_field_' + c_image).get('value');
    	}
    	if (actionTodo == 4){
    		img_src = this.getSrc(c_image);
    		//c_image = //e.target.retrieve('c_image');//add
        	img_width = this.images[c_image]['img_width'];
        	img_height = this.images[c_image]['img_height'];
        	current_page_url = document.location.href;
        	guest_user_checkbox = document.id('Dubsi_guest_checkboox_' + c_image).get('checked');
        	comment_text = document.id('Dubsi_comment_field_' + c_image).get('value');
    	}else if (actionTodo == 5){
    		img_src = this.getSrc(c_image);
    		cm_offset = (page-1)*cmLimit;
    		cm_cmLimit = cmLimit;
    	}
    		var request = new Request.JSONP({
    			url: this.url+'/do.php',
    			//callbackKey: 'callback',
    			//timeout: 000000,
    			data:{
                	actTodo: actionTodo,
                	email: login_email,
                	password: login_password,
                	src: img_src,
                	comment: comment_text,
                	guest_user: guest_user_checkbox,
                	pageURL: current_page_url,
                	width :  img_width,
                	height : img_height,
                	offset: cm_offset,
                	cmLimit: cm_cmLimit
            	},
            	
            	onSuccess: function(data){//alert('success');
            		var act = parseInt(data.action); // act
            		var stat = parseInt(data.status); // stat
            		//alert(act);
            		//alert(stat);
            		
            		switch(act){
            			case 1: //alert('10'); //userID
            				//var userID = parseInt(data.userID);
            				this.userID = stat;//alert(userID);
                			if ( this.userID ){ // userID changed to stat
        						$$('a[class=Dubsi_login_link]').each(function(box){
        							box.set('html', 'Logout').store('logged', 1);
        						}.bind(this));
        						$$('input[id^=Dubsi_guest_checkboox]').each(function(box){
        							box.set('disabled', 'disabled');
        						}.bind(this));
        						
                			}else{
                				$$('a[class=Dubsi_login_link]').each(function(box){
        							box.set('html', 'Login').store('logged', 0);
        						}.bind(this));
        					}
        					//return userID;
            				break;
            				
            				
            				
            				
            				
            				
            				
            				
            				
            				
            			case 2: //alert('20');
                if ( stat == 1 ){ // logout successful
                    //this.getImage(c_image).removeEvents();
                    //this.getImage(c_image).setStyle('cursor', 'auto');
                    //document.id('Dubsi_add_link_' + c_image).store('has_click', false);
                    //$$('div[class$=BOX]').each(function(box){
        			//	box.setStyle('display', 'none').setStyle('visibility', 'hidden');
        			//}.bind(this));
        			$$('a[class=Dubsi_login_link]').each(function(box){
        				box.set('html', 'Login').store('logged', 0);
        			}.bind(this));
        			$$('input[id^=Dubsi_guest_checkboox]').each(function(box){
        				box.set('disabled', '');
        			}.bind(this));
        			//document.id('Dubsi_view_link_' + c_image).set('html', 'View');
        			//document.id('Dubsi_login_link_' + c_image).set('html', 'Login');
        			//document.id('Dubsi_login_link_' + c_image).store('logged', 0);
                    //this.showComments(c_image, 1, 1);
                }else if ( stat == 2 ){
                    //this.doLogin(c_image);
                }
                this.positionTag(c_image); // take a look
            				break;
            				
            				
            				
            				
            				
            				
            				
            			case 3: //alert('30');
                if ( stat == 3 ){// login successful
                    $$('div[id$=BOX_'+c_image+']').each(function(box){
        				box.setStyle('display', 'none').setStyle('visibility', 'hidden');
        			}.bind(this));
        			$$('a[class=Dubsi_login_link]').each(function(box){
        				box.set('html', 'Logout').store('logged', 1);
        			}.bind(this));
        			$$('input[id^=Dubsi_guest_checkboox]').each(function(box){
        				box.set('disabled', 'diabled');
        			}.bind(this));
        			if(this.comment_text_backup != ''){
        				this.showForm(c_image);
        				document.id('Dubsi_comment_field_' + c_image).set('value', this.comment_text_backup);
        				this.comment_text_backup = '';
        			}
        			var messageStack = new NXC.MessageStack(); 
    				messageStack.showMessage( 
        				'Welcome', 
       					'notice', 
        				{ 'hideTimeout': 3000 } 
    				);
                    //this.(c_image, 1, 1);
                }else if ( stat == 4 ){ // user & pass wrong
                    this.doLogin(c_image);
                }else if ( stat == 5 ){ // conection problem

                }
                document.id('Dubsi_email_field_' + c_image).set('value', '');
                document.id('Dubsi_password_field_' + c_image).set('value', '');
            				break;
            				
            				
            				
            				
            				
            				
            				
            				
            				
            			case 4:
            			//alert('40');
            				if ( stat == 6 ){
                    //this.getImage(c_image).removeEvents();
                    //this.getImage(c_image).setStyle('cursor', 'auto');
                    //document.id('Dubsi_add_link_' + c_image).store('has_click', false);
                    $$('div[id$=BOX_'+c_image+']').each(function(box){
        				box.setStyle('display', 'none').setStyle('visibility', 'hidden');
        			}.bind(this));
        			this.login_via_add = 0;
                	this.send_request(5, c_image, 1, 1);
                }else if ( stat == 7 ){ //add comment failed
                	if (Browser.safari){//javascript: return false;
                	alert('Please Login first!');
                	//this.userID = 1;
                    	//window.open('http://www.dubsi.com/remotelogin.php','Login','width=820,height=400,screenX=350,screenY=100,scrollbars=no,toolbar=no,location=no,directories=no,status=no,menubar=no');
					}else{
						this.doLogin(c_image);// after login the written comment must be post or not?
					}
                	this.login_via_add = 1;
                	this.comment_text_backup = comment_text;
                    
                    //document.id('Dubsi_comment_field_' + c_image).set('value', this.comment_text_backup);
        			//this.comment_text_backup = '';
                }else if ( stat == 8 ){ //post url not ok                	
                }
                document.id('Dubsi_guest_checkboox_' + c_image).set('checked', '');
            				break;
            				
            				
            				
            				
            				
            				
            				
            			case 5: //alert("50");
            				if (stat == 9){
                    //this.images[c_image]['tags'][top_c+ '-' + left_c]['comments'] = data;
                    this.images[c_image]['comments'] = data.comments;
                    cmCount = this.images[c_image]['comments'][0]['cmCount'];
                    container = this.getContainer(c_image);
                    comments22 = container.getChildren('.Dubsi_comment_Container')[0];
                    comments22.empty();
                    var i=1;
                    data.comments.each(function(comment) {
                    	if ( comment.id != 0 ) {
                    		var userProfileURL = this.url+"/profile.php?UID="+comment.user_id;
                    		var span_id="Dubsi_username_Container_"+i;//why changing ID for user name??
                        	comments22.adopt(new Element('span', {'html': "<span class='Dubsi_username_Container' id=\""+span_id+"\"><a target='_blank' href=\""+userProfileURL+"\">" + comment.user + " </a>Says:</span>" + comment.comment}));
                        	
                        	var imageURL = this.getSrc(c_image);
                        	var fb_link_text = "http://www.facebook.com/sharer.php?s=100&p[title]=Commented With Dubsi&p[summary]="+comment.comment+"&p[url]="+this.url+"/imagecomments.php?image="+imageURL+"&p[images][0]="+imageURL;
                        	document.id('Dubsi_fb_link_' + c_image).set('href', fb_link_text);
                    		i++;
                    	}
                    	else {
                    		comments22.adopt(new Element('span', {'html': "<span class='Dubsi_username_Container'>Be the first to comment on this Picture</span>"}));
                    	}
                    }.bind(this));
                    container.getChildren('.Dubsi_cmcount_Container')[0].set('html', page + '&nbsp;/&nbsp;' + cmCount);
        			container.getChildren('.Dubsi_pagination_Container')[0].getChildren('a').store('page', page).store('cmLimit', cmLimit).store('cmCount', cmCount).store('c_image', c_image);
        			if(cmCount == 1){
        				document.id('Dubsi_next_link_' + c_image).setStyle('color', 'gray');
        			}
                    $$('div[id$=BOX_'+c_image+']').each(function(box){
        				box.setStyle('display', 'none').setStyle('visibility', 'hidden');
        			}.bind(this));
        			document.id('Dubsi_view_link_' + c_image).store('page', page);
                    container.setStyle('visibility', 'visible');
                    container.setStyle('display', 'block');
                    this.positionTag(c_image);
                }else{
                // if stat == 10	
                }
            				break;









            			default:
            				//
            		}//alert('100');
            	}.bind(this),
            	onFailure: function(e){
            		alert("failed");
            		e.stop();
                	$$('a[class=Dubsi_login_link]').each(function(box){
        				box.set('html', 'Login').store('logged', 0);
        			}.bind(this));
            	}
            	//onRequest: {},
            	//onComplete: {},
            	//onCancel: {},
            	//onTimeout: {}
        }).send();
        
    },
    
    hideComments : function(c_image) {
        container = this.getContainer(c_image);
        //comments33  = container.getChildren('.Dubsi_comment_Container')[0];
        //container.getChildren('.Dubsi_pagination_Container')[0].setStyle('display', 'none');
        //comments33.empty();
        container.setStyle('display', 'none');
        this.positionTag(c_image);
    },
    
    getContainer : function(c_image) {
    	var top_c =1;
    	var left_c =1;
        if (this.images[c_image]['tags'][top_c + '-' + left_c] &&
		this.images[c_image]['tags'][top_c + '-' + left_c]['container'] == undefined) {
			container = new Element('div', {
				'id': 'Dubsi_showcomment_BOX_' + c_image,
				'class': 'Dubsi_showcomment_BOX'
			});
			//container.setStyle('visibility', 'hidden');
		
		
			var imgsize = this.getImage(c_image).getSize();
			/*if(imgsize.x < 2000 && imgsize.x > 350){
            	public_width = (imgsize.x) * 0.8 ;
            }else if (imgsize > 2000){
				public_width = 2000 * 0.8;
			}*/
			var public_width = imgsize.x;
			
			container.setStyle('visibility', 'hidden').setStyle('width', public_width);
			
			comment_container = new Element('div', {
				'id': 'Dubsi_comment_Container_' + c_image, //ID
				'class': 'Dubsi_comment_Container'
			});
			
			pagination_container = new Element('div', {
				'id': 'Dubsi_pagination_Container_' + c_image,
				'class': 'Dubsi_pagination_Container'
			});
			
			//@@@@@@ Preview & Next
			
				prevLink = new Element('a', {
					id: 'Dubsi_prev_link_' + c_image,
					'class': 'Dubsi_prev_link',
					html: '&nbsp;',
					href: '#'
				});
				prevLink.setStyle('color', 'gray');
                prevLink.addEvent('click', function(e){
					e.stop();
					if (e.target.retrieve('page') > 1){
						this.send_request(5, c_image, e.target.retrieve('page') -1, 1);
						e.target.setStyle('color', '#0099FF');
						document.id('Dubsi_next_link_' + e.target.retrieve('c_image')).setStyle('color', '#0099FF');
						if(e.target.retrieve('page') == 2){
							e.target.setStyle('color', 'gray');
						}
					}
						else{
							this.send_request(5, e.target.retrieve('c_image'), e.target.retrieve('cmCount'), 1);
							document.id('Dubsi_next_link_' + e.target.retrieve('c_image')).setStyle('color', 'gray');	
							if( e.target.retrieve('cmCount') > 1) {
								e.target.setStyle('color', '#0099FF');
							}
						}
					}.bind(this));

				
				nextLink = new Element('a', {
					id: 'Dubsi_next_link_' + c_image,
					'class': 'Dubsi_next_link',
					html: '&nbsp;',
					href: '#'
				});
				nextLink.addEvent('click', function(e){
						e.stop();
						if (e.target.retrieve('page') * e.target.retrieve('cmLimit') < e.target.retrieve('cmCount')){
							this.send_request(5, e.target.retrieve('c_image'), e.target.retrieve('page') + 1, 1);
							e.target.setStyle('color', '#0099FF');
							document.id('Dubsi_prev_link_' + e.target.retrieve('c_image')).setStyle('color', '#0099FF');
							if(e.target.retrieve('page') * e.target.retrieve('cmLimit') == e.target.retrieve('cmCount') -1){
								e.target.setStyle('color', 'gray');
							}
						}
						else{
							this.send_request(5, e.target.retrieve('c_image'), 1, 1);
							e.target.setStyle('color', '#0099FF');
							document.id('Dubsi_prev_link_' + e.target.retrieve('c_image')).setStyle('color', 'gray');	
						}
					}.bind(this));


				
			pagination_container.adopt(prevLink, nextLink);

			commentsCount_container = new Element('div', {
				'id': 'Dubsi_cmcount_Container_' + c_image,
				'class': 'Dubsi_cmcount_Container'
			});
			fb_link = new Element('a', {
				id: 'Dubsi_fb_link_' + c_image,
				Class: 'Dubsi_fb_link',
				target: '_blank',
				alt: "Share on Facebook",
				href: '#'
			});
			fb_container = new Element('div', {
				'id': 'Dubsi_fb_Container_' + c_image,
				'class': 'Dubsi_fb_Container'
			});
			
			fb_link.adopt(fb_container);

			showall_link = new Element('a', {
				id: 'Dubsi_showall_link_' + c_image,
				href: '#'
			});
			
			
			showall_container = new Element('div',{
				id: 'Dubsi_showall_Container_' + c_image,
				Class: 'Dubsi_showall_Container',
				html: '&nbsp;'
			});
			var tmpurl = this.url+"/cmlist.php?src="+ this.getSrc(c_image);
			showall_container.store('showallURL', tmpurl);
			showall_container.addEvent('click', function(e){
				e.stop();
				light = new LightFace.IFrame({ height:400, width:500, url: e.target.retrieve('showallURL'), title: 'Dubsi' }).addButton('Close', function() { light.close(); },true).open();
			}.bind(this));
			
			showall_link.adopt(showall_container);	
			
			container.adopt(comment_container, pagination_container, fb_link, commentsCount_container, showall_link);
			document.id('Dubsi_main_Container_' + c_image).grab(container, 'top');
			this.images[c_image]['tags'][top_c + '-' + left_c]['container'] = container;
		}else {
			container = this.images[c_image]['tags'][top_c + '-' + left_c]['container'];	
		}
        return container;
    }
    });
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
var LightFace = new Class({
	
	Implements: [Options,Events],
	
	options: {
		width: 'auto',
		height: 'auto',
		draggable: true,
		title: '',
		buttons: [],
		fadeDelay: 400,
		fadeDuration: 400,
		keys: { 
			esc: function() { this.close(); } 
		},
		content: '<p>Message not specified.</p>',
		zIndex: 9001,
		pad: 100,
		overlayAll: false,
		constrain: false,
		resetOnScroll: true,
		baseClass: 'lightface',
		errorMessage: '<p>The requested file could not be found.</p>'/*,
		onOpen: $empty,
		onClose: $empty,
		onFade: $empty,
		onUnfade: $empty,
		onComplete: $empty,
		onRequest: $empty,
		onSuccess: $empty,
		onFailure: $empty
		*/
	},
	
	
	initialize: function(options) {
		this.setOptions(options);
		this.state = false;
		this.buttons = {};
		this.resizeOnOpen = true;
		this.ie6 = typeof document.body.style.maxHeight == "undefined";
		this.draw();
	},
	
	draw: function() {
		
		//create main box
		this.box = new Element('table',{
			'class': this.options.baseClass,
			styles: {
				'z-index': this.options.zIndex,
				opacity: 0
			},
			tween: {
				duration: this.options.fadeDuration,
				onComplete: function() {
					if(this.box.getStyle('opacity') == 0) {
						this.box.setStyles({ top: -9000, left: -9000 });
					}
				}.bind(this)
			}
		}).inject(document.body,'bottom');

		//draw rows and cells;  use native JS to avoid IE7 and I6 offsetWidth and offsetHeight issues
		var verts = ['top','center','bottom'], hors = ['Left','Center','Right'], len = verts.length;
		for(var x = 0; x < len; x++) {
			var row = this.box.insertRow(x);
			for(var y = 0; y < len; y++) {
				var cssClass = verts[x] + hors[y], cell = row.insertCell(y);
				cell.className = cssClass;
				if (cssClass == 'centerCenter') {
					this.contentBox = new Element('div',{
						'class': 'lightfaceContent',
						styles: {
							width: this.options.width
						}
					});
					cell.appendChild(this.contentBox);
				}
				else {
					document.id(cell).setStyle('opacity',0.4);
				}
			}
		}
		
		//draw title
		if(this.options.title) {
			this.title = new Element('h2',{
				'class': 'lightfaceTitle',
				html: this.options.title
			}).inject(this.contentBox);
			if(this.options.draggable && window['Drag'] != null) {
				this.draggable = true;
				new Drag(this.box,{ handle: this.title });
				this.title.addClass('lightfaceDraggable');
			}
		}
		
		//draw message box
		this.messageBox = new Element('div',{
			'class': 'lightfaceMessageBox',
			html: this.options.content || '',
			styles: {
				height: this.options.height
			}
		}).inject(this.contentBox);
		
		//button container
		this.footer = new Element('div',{
			'class': 'lightfaceFooter',
			styles: {
				display: 'none'
			}
		}).inject(this.contentBox);
		
		//draw overlay
		this.overlay = new Element('div',{
			html: '&nbsp;',
			styles: {
				opacity: 0
			},
			'class': 'lightfaceOverlay',
			tween: {
				link: 'chain',
				duration: this.options.fadeDuration,
				onComplete: function() {
					if(this.overlay.getStyle('opacity') == 0) this.box.focus();
				}.bind(this)
			}
		}).inject(this.contentBox);
		if(!this.options.overlayAll) {
			this.overlay.setStyle('top',(this.title ? this.title.getSize().y - 1: 0));
		}
		
		//create initial buttons
		this.buttons = [];
		if(this.options.buttons.length) {
			this.options.buttons.each(function(button) {
				this.addButton(button.title,button.event,button.color);
			},this);
		}
		
		//focus node
		this.focusNode = this.box;
		
		return this;
	},
	
	// Manage buttons
	addButton: function(title,clickEvent,color) {
		this.footer.setStyle('display','block');
		var focusClass = 'lightfacefocus' + color;
		var label = new Element('label',{
			'class': color ? 'lightface' + color : '',
			events: {
				mousedown: function() {
					if(color) {
						label.addClass(focusClass);
						var ev = function() {
							label.removeClass(focusClass);
							document.id(document.body).removeEvent('mouseup',ev);
						};
						document.id(document.body).addEvent('mouseup',ev);
					}
				}
			}
		});
		this.buttons[title] = (new Element('input',{
			type: 'button',
			value: title,
			events: {
				click: (clickEvent || this.close).bind(this)
			}
		}).inject(label));
		label.inject(this.footer);
		return this;
	},
	showButton: function(title) {
		if(this.buttons[title]) this.buttons[title].removeClass('hiddenButton');
		return this.buttons[title];
	},
	hideButton: function(title) {
		if(this.buttons[title]) this.buttons[title].addClass('hiddenButton');
		return this.buttons[title];
	},
	
	// Open and close box
	close: function(fast) {
		if(this.isOpen) {
			this.box[fast ? 'setStyles' : 'tween']('opacity',0);
			this.fireEvent('close');
			this._detachEvents();
			this.isOpen = false;
		}
		return this;
	},
	
	open: function(fast) {
		if(!this.isOpen) {
			this.box[fast ? 'setStyles' : 'tween']('opacity',1);
			if(this.resizeOnOpen) this._resize();
			this.fireEvent('open');
			this._attachEvents();
			(function() {
				this._setFocus();
			}).bind(this).delay(this.options.fadeDuration + 10);
			this.isOpen = true;
		}
		return this;
	},
	
	_setFocus: function() {
		this.focusNode.setAttribute('tabIndex',0);
		this.focusNode.focus();
	},
	
	// Show and hide overlay
	fade: function(fade,delay) {
		this._ie6Size();
		(function() {
			this.overlay.setStyle('opacity',fade || 1);
		}.bind(this)).delay(delay || 0);
		this.fireEvent('fade');
		return this;
	},
	unfade: function(delay) {
		(function() {
			this.overlay.fade(0);
		}.bind(this)).delay(delay || this.options.fadeDelay);
		this.fireEvent('unfade');
		return this;
	},
	_ie6Size: function() {
		if(this.ie6) {
			var size = this.contentBox.getSize();
			var titleHeight = (this.options.overlayAll || !this.title) ? 0 : this.title.getSize().y;
			this.overlay.setStyles({
				height: size.y - titleHeight,
				width: size.x
			});
		}
	},
	
	// Loads content
	load: function(content,title) {
		if(content) this.messageBox.set('html',content);
		if(title && this.title) this.title.set('html',title);
		this.fireEvent('complete');
		return this;
	},
	
	// Attaches events when opened
	_attachEvents: function() {
		this.keyEvent = function(e){
			if(this.options.keys[e.key]) this.options.keys[e.key].call(this);
		}.bind(this);
		this.focusNode.addEvent('keyup',this.keyEvent);
		
		this.resizeEvent = this.options.constrain ? function(e) { 
			this._resize(); 
		}.bind(this) : function() { 
			this._position(); 
		}.bind(this);
		window.addEvent('resize',this.resizeEvent);
		
		if(this.options.resetOnScroll) {
			this.scrollEvent = function() {
				this._position();
			}.bind(this);
			window.addEvent('scroll',this.scrollEvent);
		}
		
		return this;
	},
	
	// Detaches events upon close
	_detachEvents: function() {
		this.focusNode.removeEvent('keyup',this.keyEvent);
		window.removeEvent('resize',this.resizeEvent);
		if(this.scrollEvent) window.removeEvent('scroll',this.scrollEvent);
		return this;
	},
	
	// Repositions the box
	_position: function() {
		var windowSize = window.getSize(), 
			scrollSize = window.getScroll(), 
			boxSize = this.box.getSize();
		this.box.setStyles({
			left: scrollSize.x + ((windowSize.x - boxSize.x) / 2),
			top: scrollSize.y + ((windowSize.y - boxSize.y) / 2)
		});
		this._ie6Size();
		return this;
	},
	
	// Resizes the box, then positions it
	_resize: function() {
		var height = this.options.height;
		if(height == 'auto') {
			//get the height of the content box
			var max = window.getSize().y - this.options.pad;
			if(this.contentBox.getSize().y > max) height = max;
		}
		this.messageBox.setStyle('height',height);
		this._position();
	},
	
	// Expose message box
	toElement: function () {
		return this.messageBox;
	},
	
	// Expose entire modal box
	getBox: function() {
		return this.box;
	},
	
	// Cleanup
	destroy: function() {
		this._detachEvents();
		this.buttons.each(function(button) {
			button.removeEvents('click');
		});
		this.box.dispose();
		delete this.box;
	}
});


LightFace.IFrame = new Class({
	Extends: LightFace,
	options: {
		url: ''
	},
	initialize: function(options) {
		this.parent(options);
		if(this.options.url) this.load();
	},
	load: function(url,title) {
		this.fade();
		if(!this.iframe) {
			this.messageBox.set('html','');
			this.iframe = new IFrame({
				styles: {
					width: '100%',
					height: '100%'
				},
				events: {
					load: function() {
						this.unfade();
						this.fireEvent('complete');
					}.bind(this)
				},
				border: 0
			}).inject(this.messageBox);
			this.messageBox.setStyles({ padding:0, overflow:'hidden' });
		}
		if(title) this.title.set('html',title);
		this.iframe.src = url || this.options.url;
		this.fireEvent('request');
		return this;
	}
});
///////////////////////////////////////
///////////////////////////////////////
///////////////////////////////////////
var NXC = NXC || {};
NXC.MessageStack = new Class( {

	Implements: [Options, Events],

	options:{
		'stackBlockClass' : 'nxc-message-stack'
	},

	stackBlock : false,

	initialize: function( options ) {
		this.setOptions( options );

		this.images = $$( this.options.imagesSelector );
		this.createStackBlock();
	},

	createStackBlock: function() {
		this.stackBlock = new Element( 'div', { 'class': this.options.stackBlockClass } ).inject( document.body );
	},

	showMessage: function( text, type, options ) {
		var messageInstance = new NXC.NotifyMessage( text, type, options )
		messageInstance.getMessageElement().inject( this.stackBlock );
	}
} );



var NXC = NXC || {};
NXC.NotifyMessage = new Class( {

	Implements : [Options, Events],

	options:{
		'tag'              : 'div',
		'hideTimeout'      : 5000,
		'hideTweenOptions' : {
			'property': 'opacity',
			'duration': 500
		},
		'closButtonClass'  : 'nxc-message-close-button',
		'typesClasses'     : {
			'notice'  : 'nxc-message-notice',
			'warning' : 'nxc-message-warning',
			'error'   : 'nxc-message-error'
		}
	},

	message : false,
	
	initialize: function( text, type, options ) {
		this.setOptions( options );
		
		this.message = new Element( this.options.tag, {
			'class' : $defined( this.options.typesClasses[ type ] ) ? this.options.typesClasses[ type ] : type,
			'html'  : text
		} );
		
		if( this.options.hideTimeout.toInt() > 0 ) {
			this.message.store(
				'hideFunctionTimeout',
				this.hide.delay( this.options.hideTimeout, this, [] )
			);
		}

		var closeButton = new Element( 'a', {
			'class'  : this.options.closButtonClass,
			'html'   : '&nbsp',
			'href'   : '#',
			'events' : {
				'click' : function( event ) {
					event.stop();
					this.hide();
				}.bind( this )
			}
		} ).inject( this.message, 'top' );
	},

	hide: function() {
		var hideFunctionTimeout = this.message.retrieve( 'hideFunctionTimeout', false );
		if( hideFunctionTimeout !== false ) {
			$clear( hideFunctionTimeout );
		}

		this.message.get( 'tween', this.options.hideTweenOptions ).start( 0 ).chain(
			function() { this.message.setStyle( 'display', 'none' ); }.bind( this )
		);
	},

	getMessageElement: function() {
		return this.message;
	}
} );

///////////////////////////////////////
///////////////////////////////////////
///////////////////////////////////////
IsLoaded = false;
var Load = function() {
	if (IsLoaded) {
		return ;
	}
    KioskInstance = new Kiosk;
	KioskInstance.show();
};

window.addEvent('load', Load);
