YUI3 Plugin.base не отображается

Я пытаюсь использовать плагин yui, который извлекает из файла json и заполняет div на странице. Однако все должно пройти, поскольку плагин никогда не доходит до стадии рендеринга, остальная часть его не запускается. В противном случае он успешно загружается (если я втыкаю алерт или console.log в начале события, он работает нормально).

Вот код:

YUI.add('events', function(Y) {

   var urlEvents = //"/cgi-bin/eventview-json/?cal=admissions/events&days=10";
                       "/admissions/events/events.json";

   //var eventContainer = $("#insert-events");
   /* EventList class constructor */
   var EventList = function(config) {
      EventList.superclass.constructor.apply(this, arguments);
   };

   /*
    * Required NAME static field, to identify the class and
    * used as an event prefix, to generate class names etc. (set to the
    * class name in camel case).
    */
   EventList.NAME = "EventList";

   /*
    * Required NS static field, to identify the property on the host which will,
    * be used to refer to the plugin instance ( e.g. host.feature.doSomething() )
    */
   EventList.NS = "EventList";

   /*
    * The attribute configuration for the plugin. This defines the core user facing state of the plugin
    */
   EventList.ATTRS = {};


   var convertYYYYMMDDtoJS = function(s) {

      var a, jsdate = null;

      try {

         a = /^(\d\d\d\d)(\d\d)(\d\d)$/.exec(s);

         if (a) {
            jsdate = new Date(a[1], a[2]-1, a[3]);
         }
      } catch (ex) {
         /* Nothing */
      }

      return jsdate;
   };


   var insertEvents = function(id, response, e) {
    alert('hello');
      var i, resp, events, event, html, jsdate, label, seenevent, yyyymmdd;
      var maxevents = 5, eventcount;

      try {
         resp = Y.JSON.parse(response.responseText);
         events = resp.results;

         html = "";
         seenevent = {};
         eventcount = 0;
         yyyymmdd = "";
         for (i = 0; i < events.length; i++) {
            event = events[i];
            if (seenevent[event.title]) {
               continue;
            }
            seenevent[event.title] = true;

            if (event.date !== yyyymmdd) {
               // This is the first event on this date.

               // If we've seen maxevents events, then bail before starting a new day.
               if (eventcount >= maxevents) {
                  break;
               }

               // Put out a new label for this day.
               jsdate = convertYYYYMMDDtoJS(event.date);
               label = Y.DataType.Date.format(jsdate, {format: "%b %e %a"});

               /*
                * The first empty div below, "<div class='clear'></div>" is only needed for IE 7.
                * IE 7 does not properly clear both left and right floats when "clear: both" is specified
                * if the element itself is floated.  The extra div clears the floats, but isn't floated
                * itself.  The extra div doesn't cause any grief in newer browsers, so I add it always.
                */
               html += "<div class='clear'></div><div class='event-datelabel'>" + label + "</div>\n";
               yyyymmdd = event.date;
            }

            html += "<div class='event-text'>" + event.html + "</div>\n";
                        eventcount++;
         }
         this.get('host').setContent(html + "<div id='events-footer'><a href='/calendar/'>all events</a></div>");


      } catch(ex) {
         console.log("Error", ex);
         this.get('host').setContent("Event list not available");
         return;
      }
   };


var insertEventList = function(yyyy, mm, dd) {

   var url = urlEvents;

   if (yyyy) {
      url += '&yyyy=' + yyyy;
   }
   if (mm) {
      url += '&mm=' + mm;
   }
   if (dd) {
      url += '&dd=' + dd;
   }

   Y.io(url, {on: {success: insertEvents}, context: this});

};

   /* EventList extends the base Plugin.Base class */
   Y.extend(EventList, Y.Plugin.Base, {
        render: function() {
        insertEventList.call(this);
    }

   });
   //console.log("assigning", EventList);
   Y.namespace("Plugin").EventList = EventList;

}, '1.0.0' ,{requires:['node', 'base', 'plugin', "json-parse", "datatype-date"]});

Вот выдержка из кода с битом рендеринга:

Y.extend(EventList, Y.Plugin.Base, {
        render: function() {
        insertEventList.call(this);
    }

Правда, YUI3 меня смущает, и я бы предпочел другие библиотеки, но в данной ситуации у меня нет выбора. Вероятно, есть одна вещь, которую я только что полностью просмотрел.

Спасибо, парни


person Paul    schedule 08.06.2011    source источник
comment
Только что пришло в голову, не нужно ли вызывать init() или что-то подобное после создания объекта?   -  person chrisfrancis27    schedule 08.06.2011
comment
Можете ли вы опубликовать код, который использует плагин? Кажется, вы создали его, но на самом деле ни к чему не «подключили»! :)   -  person chrisfrancis27    schedule 08.06.2011
comment
Да. Извините, что не ответил раньше. Я изучал бизнес инициализации, потому что это действительно имеет смысл. Там много кода, который не имеет отношения к этому плагину, но у меня есть YUI.use("node", "node-load", "events", "anim", "transition", "history", function(Y) { ... } В противном случае нет инициализации для событий... Или, я думаю, EventList.   -  person Paul    schedule 08.06.2011


Ответы (1)


Раньше я использовал плагины YUI3, и их немного сложно понять, но я постараюсь помочь, если смогу. После того, как вы создали плагин, который, насколько я могу судить, вы уже сделали так успешно, вы подключаете его к объекту где-то еще в своем коде:

someObj.plug(Y.Plugin.EventList, cfg);

После этого вы можете получить доступ к методам плагина из пространства имен плагина объекта. В вашем случае вы бы сделали это так:

someObj.EventList.render();

Надеюсь, я правильно понял ваш вопрос, и я надеюсь, что это поможет вам прояснить некоторые вещи. Удачи! :)

person Chris    schedule 08.06.2011
comment
Итак, просто var eventsPanel, потом eventsPanel.plug(Y.Plugin.EventList, cfg);, потом eventsPanel.render();? А если мне нечего настраивать, наличие там cfg ничего странного не сделает? - person Paul; 08.06.2011
comment
Верно. На самом деле, если у вас нет каких-либо атрибутов конфигурации для передачи, вы можете просто полностью их исключить: eventsPanel.plug(Y.Plugin.EventList); Вам нужен объект cfg только в том случае, если он нужен вашему плагину, а вашему, похоже, не нужен. - person Chris; 08.06.2011
comment
подождите, на самом деле во второй части чего-то не хватает. Было бы eventsPanel.EventList.render();. Методы плагина будут находиться в пространстве имён плагина в объекте, а не в самом объекте. - person Chris; 08.06.2011
comment
О, хороший улов. По какой-то причине я получал «eventsPanel is null», я попытался установить его в div, в который я вставляю... Теперь я получаю, что eventsPanel.plug не является функцией. Хм... Спасибо за помощь. - person Paul; 08.06.2011
comment
Неважно! Я заработал. var eventlist = $("#insert-eventlist"); eventlist.plug(Y.Plugin.EventList); eventlist.EventList.render(); Я только что сделал это в нижней части YUI.use {}. Вроде бы то же самое, что было у меня раньше, только на несколько строк ниже, но теперь работает. На самом деле, я понимаю, что одна из этих строк как-то связана с панелью, в которую я их вставляю. Вероятно, где произошла путаница. - person Paul; 08.06.2011
comment
Ах... Опять моя вина. Вы бы подключили его к div, который вы хотите заполнить, используя узел YUI. Итак, если бы вы хотели заполнить div <div id="populate-me"></div>, вы бы назвали: var div = Y.one('#populate-me'); div.plug(Y.Plugin.EventList); div.EventList.render(); Извините за всю неверную информацию, но я думаю, что на этот раз это действительно должно работать. ;) - person Chris; 08.06.2011
comment
Он отлично работает. Просто нужно сделать некоторую укладку, и все будет идеально. Спасибо еще раз. Я пытался проголосовать за ваш ответ, но не могу, так как я новый пользователь и у меня еще нет репутации 15. Какая куча придурков! хех В любом случае, поскольку я еще не могу голосовать, я просто делаю этот пост, чтобы сообщить вам, что я очень ценю вашу помощь. - person Paul; 08.06.2011
comment
Ха-ха, без проблем. Я все еще получаю репутацию за то, что вы принимаете мой ответ. :P Удачного кодирования! - person Chris; 08.06.2011