if (!ww) ww={}
function imagepopup_lightwindow(id, rcFile) {
  var popwin = new Ext.ww.LightWindow({
    width: 670,
    hidedestroy: true,
    animateTarget: 'rcImgLink_'+id,
    resourceID: id,
    html: '<div id="rcPopBody" style="width:660;height:530;overflow:auto;"><img id="rcPopImg_' + id + '" src="/resize_image.v2.aspx?FilePath=' + rcFile + '&m=t&mwidth=630&mheight=500" style="display:none;"/>'
          + '</div>'
  });
  popwin.on('show', function() {
    store = ww.dbStore.JSON(zoomKey, ['title', 'description'], {params: id});
    store.resourceID = this.resourceID;
    store.on('load', function() {
      this.zoomdata = (this.data.items.length!=1)?({title: '', description: ''}):this.getAt(0).json;
      Ext.fly('rcPopImg_' + this.resourceID).setVisible(true, {duration: .3, scope: this,
        callback: function () {
          oZoom = ww.el.create('div', {style: 'padding-top: 10px;width: 640px'}, 'rcPopBody');
          oZoom.dom.innerHTML = '<div class="zoomtitle">' + this.zoomdata.title + '</div>'
                              + '<br/>' + this.zoomdata.description;
        }
      });
    });
    store.load();
  });
  popwin.show();
}

function getObject_resourcesLink(data) {
  var lnkImg = '#';
  var lnkTitle = '#';
  switch (data.catid) {
    case '1':    //image
      lnkImg = '/learning/imagepopup.asp?resourceID=' + data.id;
      lnkImg = 'javascript:imagepopup_lightwindow(\'' + data.id + '\', \'' + data.filelink + '\');';
      break;
    case '2':    //video
      lnkImg = '/students/videoPlay.asp?id=' + data.id;
      break;
    case '5':    //audio Tour
      lnkImg = '/students/audioTours.asp?id=' + data.id;
      break;
    default:   //direct link to resource file [download if no plugin]
      lnkImg = data.filelink;
      break;
  }
  var oReturn = {img: lnkImg, title: lnkImg}
  return oReturn;
}

function viewMore_onclick(obj, id) {
  var collapsed = obj.getAttribute('collapsed');
  var oCont = Ext.get('rcCont_' + id);
  obj.innerHTML = '<img src="/admin/img/ext/tree/loading.gif" border="0"/>';
  if (collapsed=='true') {
    var iHeight = parseInt(oCont.getSize().height) + parseInt(obj.getAttribute('divHeight'));
    Ext.fly('rcDescShort_' + id).dom.style.display = 'none';
  } else {
    var iHeight = 46;
  }

  oCont.descID = id;
  oCont.funcOnMoreClick = obj.onclick;
  oCont.setHeight(iHeight, {duration: 0.5, scope: oCont,
    callback: function () {
      var obj = Ext.get('rcViewMore_' + this.descID).dom;
      var collapsed = (obj.getAttribute('collapsed')=='true')?'false':'true';
      obj.setAttribute('collapsed', collapsed);
      if (collapsed == 'true') {
        obj.innerHTML = 'more...';
        document.getElementById('rcDescShort_' + this.descID).style.display = '';
      } else {
        obj.innerHTML = 'hide...';
      }
      obj.onclick = this.funcOnMoreClick;
    }
  });
}

Ext.onReady(function () {
  var pageSize = 6;
  var resultTpl = new Ext.XTemplate(
    '<tpl for=".">',
      '<div id="rc_{id}" class="resourceItem">',
        '<div class="panelLeft" style="text-align: center;">',
          '<a id="rcImgLink_{id}" href="#" target="_BLANK"><img src="/resize_image.v2.aspx?m=t&mwidth=84&mheight=60&FilePath={thumb}" border="0"/></a>',
        '</div>',
        '<div id="rcCont_{id}" class="panelRight">',
          '<div style="font-weight: bold;"><a id="rcTitleLink_{id}" href="#" target="_BLANK">{title}</a></div>',
          '<div style="font-size: 7.5pt; ">{lastmod:date("M j, Y")} - {category}</div>',
          '<div id="rcDescShort_{id}"></div>',
          '<div id="rcDesc_{id}">{description}</div>',
        '</div>',
        '<div class="viewMore" id="rcMoreCont_{id}"><a id="rcViewMore_{id}" style="cursor: pointer;" onclick="javascript:viewMore_onclick(this, \'{id}\');">more...</a></div>',
      '</div>',
    '</tpl>'
  );

  var store = ww.dbStore.JSON(submitKey, [
      {name:'id', type: 'float'},
      'title', 'thumb', 'category', 'description',
      {name:'lastmod', type:'date'}
    ], (window.distinct)?{limit: pageSize, distinct: window.distinct||''}:{limit: pageSize}
  );
  store.on('load', function() {
    store.each(function (obj) {
      var iHeight = Ext.fly('rcDesc_'+obj.json.id).getSize().height - 15;
      var sHTML = ww.el.removeHTML(obj.json.description);
      if (sHTML.length > 70) {
        var shortHTML = sHTML.substring(0, 70) + '...';
        Ext.fly('rcDescShort_' + obj.json.id).dom.innerHTML = shortHTML;
        Ext.fly('rcViewMore_' + obj.json.id).set({divHeight: iHeight, collapsed: 'true'});
      } else {
        Ext.fly('rcDescShort_' + obj.json.id).dom.innerHTML = sHTML;
        Ext.fly('rcMoreCont_' + obj.json.id).dom.innerHTML = '';
      }
      var oLink = getObject_resourcesLink(obj.json);
      Ext.fly('rcImgLink_' + obj.json.id).dom.href = oLink.img;
      if (oLink.img.indexOf('javascript:') > -1) Ext.fly('rcImgLink_' + obj.json.id).dom.target = '';
      Ext.fly('rcTitleLink_' + obj.json.id).dom.href = oLink.title;
      if (oLink.title.indexOf('javascript:') > -1) Ext.fly('rcTitleLink_' + obj.json.id).dom.target = '';

      if (obj.json.catid == 5) {
        Ext.fly('rcImgLink_' + obj.json.id).dom.target = '';
        Ext.fly('rcTitleLink_' + obj.json.id).dom.target = '';
      }
    })
  });
  store.load();

  new Ext.Panel({
    renderTo: 'resourcesListing',
    autoHeight:true,
    autoWidth: true,
    border: false,
    items: new Ext.DataView({
      tpl: resultTpl,
      store: store,
      loadingText: 'Loading. . .',
      emptyText: '<div>No article to display<br>&nbsp;</div>',
      itemSelector: 'div.resourceItem'
    }),
    bbar: new Ext.PagingToolbar({
      id: '_vprctool', 
      cls: 'x-toolbar-blank',
      store: store,
      pageSize: pageSize,
      displayInfo: true,
      displayMsg: 'Resources {0} - {1} of {2}',
      emptyMsg: ''
    })
  });
  
  var _vprc = Ext.getCmp('_vprctool');
  _vprc.loading.hide();
  if (Ext.fly('db_RSSFeed')) Ext.fly('db_RSSFeed').dom.style.display = 'none';
  var els = new Ext.ww.ExpandCollapse();
});