// Place your application-specific JavaScript functions and classes here
// This file is automatically included by javascript_include_tag :defaults
var Application = Class.create({

  ensureFBPermissions : function(permissions) {
    if (!permissions) {
      permissions = 'publish_stream'
    }
    FB.ensureInit(function() {
      FB.Facebook.apiClient.users_hasAppPermission(permissions,function(res,ex){
        if(res) {
          other_perms = 'offline_access'
          if (permissions!=other_perms) {
            app.ensureFBPermissions(other_perms)
          } else {
            app.redirectToLinkLogin()
          }
        } else {
          app.requestFBPermissions()
        }
      });
    })
  },
  
  requestFBPermissions : function() {
    FB.ensureInit(function() {
      FB.Connect.showPermissionDialog("offline_access,publish_stream", function(permissions) {
        if (permissions!='offline_access,publish_stream') {
          alert('Sorry! we require you to allow extended permissions!');
        } else {
          this.redirectToLinkLogin()
        }
      })
    })
  },
  
  redirectToLinkLoginUrl : "/users/link_account",
  
  redirectToLinkLogin : function() {
    // Do something with successful result
    window.location = this.redirectToLinkLoginUrl
  },
  
  mapMarkers : [{name: 'All NYC Parks', url: '/districts/all/locations/all.js'}],
  
  addGEventsToMarkers : function() {
    this.mapMarkers.each(function(marker) {
      if (!marker.dom_id) return false;
      
      GEvent.addListener(eval(marker.dom_id), 'click', function() {
        this.fetchMapPark(marker)
  		}.bind(this))
    }.bind(this))
  },
  
  fetchMapPark : function(marker) {
    var comment_list = $('comments_list')
    var loading_class = 'loading'
    
    $('comments_location_name').update(marker.name)
		new Ajax.Request(marker.url, {
		  asynchronous:true, 
		  evalScripts:true, 
		  method:'get', 
		  onLoading:function(request){comment_list.addClassName(loading_class)},
		  onSuccess:function(request){comment_list.removeClassName(loading_class)},
		  onError:function(request){
		    comment_list.removeClassName(loading_class)
		    comment_list.update('Error loading Dog Talk. Please try again.')
		  }
		})
  },

  disableShareBtn : function(input) {
    var share_btn = $('share_btn')
    if (!share_btn) return false
    share_btn.disabled = (input.value=="" || input.value==this[input.id+"_default_value"])
    var form = share_btn.up('form')
    if (!form) return false
    share_btn.disabled ? form.addClassName('disabled') : form.removeClassName('disabled')
  },
  
  // From: http://gist.github.com/2663
  distanceOfTimeInWords : function(fromTime, toTime, includeSeconds) {
    var fromSeconds = fromTime.getTime();
    var toSeconds = toTime.getTime();
    var distanceInSeconds = Math.round(Math.abs(fromSeconds - toSeconds) / 1000)
    var distanceInMinutes = Math.round(distanceInSeconds / 60)
    if (distanceInMinutes <= 1) {
      if (!includeSeconds)
        return (distanceInMinutes == 0) ? 'less than a minute' : '1 minute'
      if (distanceInSeconds < 5)
        return 'less than 5 seconds'
      if (distanceInSeconds < 10)
        return 'less than 10 seconds'
      if (distanceInSeconds < 20)
        return 'less than 20 seconds'
      if (distanceInSeconds < 40)
        return 'half a minute'
      if (distanceInSeconds < 60)
        return 'less than a minute'
      return '1 minute'
    }
    if (distanceInMinutes < 45)
      return distanceInMinutes + ' minutes'
    if (distanceInMinutes < 90)
      return "about 1 hour"
    if (distanceInMinutes < 1440)
      return "about " + (Math.round(distanceInMinutes / 60)) + ' hours'
    if (distanceInMinutes < 2880)
      return "1 day"
    if (distanceInMinutes < 43200)
      return (Math.round(distanceInMinutes / 1440)) + ' days'
    if (distanceInMinutes < 86400)
      return "about 1 month"
    if (distanceInMinutes < 525600)
      return (Math.round(distanceInMinutes / 43200)) + ' months'
    if (distanceInMinutes < 1051200)
      return "about 1 year"
    return "over " + (Math.round(distanceInMinutes / 525600)) + ' years'
  },

  animateCanvas : function() {

    // IE is not allowed into this party!
    if (Prototype.Browser.IE) return false
    
    var clouds_canvas = $('clouds_canvas')
    if (!clouds_canvas || !$doodle) return false

    clouds_canvas.width = document.viewport.getWidth()
    var oo = $doodle;
    oo.canvas(clouds_canvas);

    var a = 0;
    var clouds = [
    {src: '/images/cloud_01.png', x: 20, y: -25, accel: 0.9, obj: null},
    {src: '/images/cloud_02.png', x: -250, y: 8, accel: 1.1, obj: null},
    {src: '/images/cloud_03.png', x: -450, y: -40, accel: 1, obj: null},
    {src: '/images/cloud_02.png', x: -700, y: 5, accel: 0.9, obj: null},
    {src: '/images/cloud_03.png', x: -900, y: -15, accel: 1, obj: null},
    {src: '/images/cloud_02.png', x: -1100, y: -25, accel: 0.8, obj: null}
    ];
    var cloud = null;
    for(i = 0; i < clouds.length; i++) {
      cloud = clouds[i]
      cloud.obj = oo.image({src:cloud.src, x: cloud.x, y: cloud.y, alpha: 0.25}).draw()
    }

    oo.animate(function() {
      for(i = 0; i < clouds.length; i++) {
        var cloud = clouds[i]
        cloud.obj.modify({
          x: function (o,p) { 
            return (p > (oo.canvas().width+o.width)) ? (0-o.width) : p+(0.5*cloud.accel)
          }
        }).draw()
      }
    }, '40fps', true)
  },

  animateDogEyes : function(e) {
    // IE is not allowed into this party!
    if (Prototype.Browser.IE) return false

    var coords = Event.pointer(e)
    // console.debug(coords)
  },

  applyBehaviours : function() {
    
    var body = $(document.body)
    if (Prototype.Browser.Gecko) {
      css = 'firefox'
    } else if (Prototype.Browser.IE) {
      css = 'ie'
    } else if (Prototype.Browser.WebKit) {
      css = 'safari'
    } else {
      css = 'other'
    }
    body.addClassName(css)
    
    
    // Set selected nav item
    if ($('nav')) {
      var sel_li = $$("#nav li").detect(function(li){return !li.down('a')})
      if (sel_li)
        sel_li.addClassName('selected')
    }

    // Auto-hide flash messages
    $$("#flash").each(function(el) {
      function fadeFlash(el) { if (el.visible()) el.fade() }
      fadeFlash.delay(5, el);
      el.observe('click', function() {fadeFlash(el)})
    })    
    
    // Contribute auto-hide text field's content
    $$("input.auto-hide-text").each(function(input) {
      this[input.id+"_default_value"] = input.value
      input.observe('focus', function() {
        if (input.value==this[input.id+"_default_value"])
          input.value = ""
      }.bind(this, input))

      input.observe('blur', function() {
        if (input.value=="")
          input.value = this[input.id+"_default_value"]
      }.bind(this, input))

    }.bind(this))
    
    // Resize map
    var map_cont = $('map_container')
    var map_footer = $('map_footer')
    var map_top_left = $('map_top_left')
    var map_top_right = $('map_top_right')
    if (map_cont) {
      var bottom_obj = map_footer ? map_footer : map_cont
      bottom_obj = map_cont
      var vh = document.viewport.getHeight()
      var my = bottom_obj.viewportOffset().top
      var mh = bottom_obj.getHeight()
      var mb = my + mh
      if (map_footer) {
        mb = mb + map_footer.getHeight() + 20
      }
      var diff = vh-mb;
      var new_h = mh + diff;
      // Change map height
      if (new_h < vh)
        map_cont.setStyle({height: new_h+'px'})
        
      // Change top corners top positioning
      map_top_left.setStyle({top: (Number(map_top_left.getStyle('top').gsub(/px/,'')) - diff - 2)+'px'})
      map_top_right.setStyle({top: (Number(map_top_right.getStyle('top').gsub(/px/,'')) - diff - 2)+'px'})
    }
    
    // Comment form button behaviours
    $$("form input#comment_body").each(function(input){
      this.disableShareBtn(input)
      new Form.Element.Observer(input, 0.5, function() {
        this.disableShareBtn(input)
      }.bind(this, input))
    }.bind(this))

    // Insert rounded overlays
    $$('.comment_profile_pic span, .comment_media a').each(function(el) {
      if (!el.down('div.overlay'))
        el.insert({bottom: new Element('div', {'class':'overlay'})})
    })
    
    // Change comment times to distance in time
    $$('.comment_time').each(function(el) {
      var t1 = new Date();
      var t2 = new Date(el.innerHTML);
      if (isNaN(t2))
        return false
      var str = this.distanceOfTimeInWords(t1, t2, true)+" ago."
      el.update(str)
    }.bind(this))
    
    // Make forms add loading class name when 
    $$('form').each(function(form) {
      form.observe('submit', function() {
        form.addClassName('loading');
      })
    })
    
    if (typeof(Cookies)!='undefined') {
      var user_name = Cookies.read('user_name')
      var user_profile = Cookies.read("user_profile_pic")
      var current_user_pic = $('current_user_pic');
      var current_user_greeting = $('current_user_name')
      if (user_name && current_user_greeting) {
        current_user_greeting.update(decodeURIComponent(user_name))
      }
      if (user_profile && current_user_pic && current_user_pic.down('img')) {
        current_user_pic.down('img').src = decodeURIComponent(user_profile)
      }
    }
    
  }
  
})

var app = new Application()

// hide the pagination links
document.observe("dom:loaded", function(e) {
  app.applyBehaviours()
  app.animateCanvas()
});

// document.observe("mousemove", function(e) {
//   app.animateDogEyes(e)
// });