if (typeof(Hatena) == 'undefined') {
    Hatena = {};
}

Hatena.LangSelector = new Ten.Class({
    initialize: function (args) {
        var self = this;

        this.button   = args.button;
        new Ten.Observer(this.button, 'onclick', this, 'toggleLangSelector');
        
        this.selector = args.selector;
        var links = this.selector.getElementsByTagName('a');
        for (var i = 0; i < links.length; i++) {
            new Ten.Observer(links[i], 'onclick', this, 'selectLang');
        }

        new Ten.Observer(this.selector, 'onclick', function (ev) {
            ev.stop();
        });
        new Ten.Observer(document.body, 'onclick', function (ev) {
            self.hideLangSelector(ev);
        });
        var headerUsername = document.getElementById('header-username');
        if (headerUsername) {
            new Ten.Observer(headerUsername, 'onclick', function (ev) {
                self.hideLangSelector(ev);
            });
            var button = Ten.DOM.getElementsByClassName('header-dropdown', headerUsername)[0];
            if (button) {
                new Ten.Observer(button, 'onclick', function (ev) {
                    self.hideLangSelector(ev);
                });
            }
        }
        var headerNotify = document.getElementById('header-notify');
        if (headerNotify) {
            new Ten.Observer(headerNotify, 'onclick', function (ev) {
                self.hideLangSelector(ev);
            });
            var button = Ten.DOM.getElementsByClassName('header-dropdown', headerNotify)[0];
            if (button) {
                new Ten.Observer(button, 'onclick', function (ev) {
                    self.hideLangSelector(ev);
                });
            }
        }
    }
}, {
    toggleLangSelector: function (event) {
        event.stop();
        
        if (!self.NR) { // For compat
            var mousePosition = event.mousePosition();
            this.selector.style.position = 'absolute';
            this.selector.style.top = (mousePosition.y + 10) + 'px';
            this.selector.style.left = (mousePosition.x - 200) + 'px';
            this.selector.style.display == 'none'
                ? Ten.DOM.show(this.selector) : Ten.DOM.hide(this.selector);
            return;
        }

        if (this.selector.style.display == 'none') {
          if (!this.selector.style.top) {
            var vb = NR.View.getViewportRects(window).icb;
            var bb = NR.Element.getRects(this.button, window).borderBox;
            this.selector.style.position = 'absolute';
            this.selector.style.top = bb.bottom + 'px';
            this.selector.style.right = (vb.right - bb.right) + 'px';
          }
          Ten.DOM.show(this.selector);
          Ten.DOM.removeClassName(document.body, 'body-username');
          Ten.DOM.removeClassName(document.body, 'body-notify');
          var usernameWindow = document.getElementById('username-window');
          if (usernameWindow) Ten.DOM.hide(usernameWindow);
          var notifyWindow = document.getElementById('notify-window');
          if (notifyWindow) Ten.DOM.hide(notifyWindow);
        } else {
          Ten.DOM.hide(this.selector);
        }
    },
    hideLangSelector: function (event) {
        //event.stop();
        Ten.DOM.hide(this.selector);
    },
    selectLang: function (event) {
        event.stop();
        var lang = event.target.id;
        if (!lang) return;
        Hatena.Locale.setAcceptLang(lang);
        Hatena.Locale.reload({preserve: {'locale.country': true}});
    }
});

Ten.DOM.addEventListener('DOMContentLoaded', function() {
    var button   = document.getElementById('langselector-button');
    if (!button) return;
    var selector = document.getElementById('langselector');
    if (!selector) return;
    new Hatena.LangSelector({button: button, selector: selector});
});