универсальный код disqus с магистралью

Я работаю над базовым веб-сайтом, который использует disqus в качестве системы комментариев, я использую базовый шаблон, и я зарегистрировал модуль для комментария, я включил в него js, предоставленный DISQUS

мой модуль выглядит так:

define([
'namespace',
'use!backbone'
], function(namespace, Backbone) {

var Comment = namespace.module();

Comment.Views.CommentView = Backbone.View.extend({
    template: "app/tpl/comment/main.html",
    render: function(done) {
        var view = this;
        namespace.fetchTemplate(this.template, function(tmpl) {
            view.el.innerHTML = tmpl();
            if (_.isFunction(done)) {
                done(view.el);
            }
        });
    },
    commentScript: function() {
        console.log('Comment Script INIT.');
        var disqus_identifier = 'a unique identifier for each page where Disqus is present';
        var disqus_title = 'a unique title for each page where Disqus is present';
        var disqus_url = 'a unique URL for each page where Disqus is present';
        var disqus_developer = 1;
        var disqus_shortname = 'dandin95'; // required: replace example with your forum shortname
        /* * * DON'T EDIT BELOW THIS LINE * * */
        (function() {
            var dsq = document.createElement('script');
            dsq.type = 'text/javascript';
            dsq.async = true;
            dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';

            (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
        })();
    }
});

return Comment;

});

мой main.html содержит только div с идентификатором 'disqus_thread', который использовался для просмотра поля комментариев

Моя проблема: при рендеринге моего представления ничего не делается, и консоль Chrome показывает Uncaught TypeError: невозможно вызвать метод toLowerCase для null embed.js: 65

при добавлении этого скрипта в шаблон все работает хорошо.

Любой совет ????


person Mohamed Gaber    schedule 23.05.2013    source источник


Ответы (1)


По сути, похоже, что вы создаете магистральное представление для инициализации и рендеринга виджета DISQUS в DIV #disqus_thread, а затем повторно рендерите в зависимости от состояния страницы:

define('disqus', [], function(){

    var disqus_shortname = DISQUS_SHORTNAME,
        disqus_identifer = INDEX_IDENT,
        disqus_title = DISCOVERY_TITLE,
        disqus_url = URL_HERE,
        disqus_developer = '1';  // could be deprecated?

    var DisqusView = Backbone.View.extend({
        el: '#disqus_thread',
        initialize: function() {
            // DISQUS universal code:
            var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
            dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
            (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
        },

        render: function(options) {

            DISQUS.reset({
                options: options,
                reload: true,
                config: function(){
                    this.page.identifer = options.identifer;
                    this.page.title = options.title;
                }
            });

        }
    });

    var disqusView = new DisqusView();

    return disqusView;
});

OK! поэтому давайте предположим, что элемент #disqus_thread уже существует на странице (отсюда установка el). Когда модуль загружен, DISQUS выполнит инициализацию.

Скажем, произошло событие, требующее загрузки нового потока Disqus:

$('.article_title').on('click', function(e) {
    var $post = $(e.target).attr('id');
    disqus.render({
        identifier: $post,  // OR however you decide to determine these attributes
        title: $post
    });
});

Затем iFrame в элементе #disqus_thread будет перезагружен в соответствующий поток. Это очень малоуровневый пример, но представьте себе вызов disqus.render({...}) в хеше событий или маршрутизаторе.

Фрагмент сброса DISQUS Ajax

person emran    schedule 02.09.2013