$m.core.register('.pageSEOData', function (hub) {
    var title, titleLength, description, descriptionLength, url;

    return {
        construct: function () {
            title = hub.find('[id$=_tbPageSEODataTitleText]')[0];
            titleLength = hub.find('[id$=_lblPageSEODataTitleLength]')[0];
            description = hub.find('[id$=_tbPageSEODataDescriptionText]')[0];
            descriptionLength = hub.find('[id$=_lblPageSEODataDescriptionLength]')[0];
            url = hub.find('[id$=_tbPageSEODataURLText]')[0];

            hub.bind(title, 'change keyup', this.changeTitle);
            hub.bind(description, 'change keyup', this.changeDescription);
            hub.bind(url, 'change keyup', this.changeURL);
        },

        destruct: function () {
            hub.unbind(title, 'change keyup', this.changeTitle);
            hub.unbind(description, 'change keyup', this.changeDescription);
            hub.unbind(url, 'change keyup', this.changeURL);
        },

        changeTitle: function () {
            var text = title.value;

            if (text.length > 120) {
                text = title.value = text.substring(0, 119);
            }

            if (titleLength.firstChild) {
                titleLength.firstChild.nodeValue = text.length;
            } else {
                titleLength.appendChild(document.createTextNode(text.length));
            }

            if (text.length > 70) {
                text = text.substring(0, 70);
                text = text.substring(0, text.lastIndexOf(' ')) + '...';
            }

            hub.notify({
                type: 'changeTitle',
                data: text
            });
        },

        changeDescription: function () {
            var text = description.value;

            if (descriptionLength.firstChild) {
                descriptionLength.firstChild.nodeValue = text.length;
            } else {
                descriptionLength.appendChild(document.createTextNode(text.length));
            }

            if (text.length > 156) {
                text = text.substring(0, 156);
                text = text.substring(0, text.lastIndexOf(' ')) + '...';
            }

            hub.notify({
                type: 'changeDescription',
                data: text
            });
        },

        changeURL: function () {
            var text = url.value;

            hub.notify({
                type: 'changeURL',
                data: text
            });
        }
    };
});

$m.core.register('.pageSEOResult', function (hub) {
    var title, description, url;

    return {
        construct: function () {
            title = hub.find('[id$=_lblPageSEOResultTitle]')[0];
            description = hub.find('[id$=_lblPageSEOResultDescription]')[0];
            url = hub.find('[id$=_lblPageSEOResultURL]')[0];

            hub.listen({
                'changeTitle': this.changeTitle,
                'changeDescription': this.changeDescription,
                'changeURL': this.changeURL
            });
        },

        destruct: function () {
            hub.ignore(['changeTitle', 'changeDescription', 'changeURL']);
        },

        changeTitle: function (text) {
            if (title.firstChild) {
                title.firstChild.nodeValue = text;
            } else {
                title.appendChild(document.createTextNode(text));
            }
        },

        changeDescription: function (text) {
            if (description.firstChild) {
                description.firstChild.nodeValue = text;
            } else {
                description.appendChild(document.createTextNode(text));
            }
        },

        changeURL: function (text) {
            if (url.firstChild) {
                var domain = url.firstChild.nodeValue;

                domain = domain.substring(0, domain.lastIndexOf('/') + 1) + text;

                url.firstChild.nodeValue = domain;
            } else {
                url.appendChild(document.createTextNode(text));
            }
        }
    };
});