anchor.diff:  -->
       
   <!-- Portlet -->
  -<div class="fl-widget portlet" role="section">
  +<div id="${n}portletBrowser" class="fl-widget portlet" role="section">
   <form id="${n}form">
     
     <!-- Portlet Title -->
     <div class="fl-widget-titlebar portlet-title" role="sectionhead">
  -  	<h2 role="heading"><spring:message code="most.frequently.added"/></h2>
  +    <h2 role="heading"><spring:message code="most.frequently.added"/></h2>
     </div> <!-- end: portlet-title -->
     
     <!-- Portlet Toolbar -->
  
positive.code:     </select>
    </div> <!-- end: portlet-toolbar -->
          
  	<!-- Portlet Body -->
    <div class="fl-widget-content portlet-body" role="main">
    
    	<!-- Portlet Messages -->
    	<div class="portlet-msg-info" role="status" id="${n}loadingMessage">
      	<h3><spring:message code="loading.information"/></h3>
      	<p><spring:message code="please.wait.while.the.system.finishes.loading.the.requested.data"/></p>
      </div> <!-- end: portlet-msg -->
      
      <!-- Portlet Section -->
      <div id="${n}popularPortlets" class="portlet-section fl-pager" role="region">      
        <!-- Portlet Section Options -->
        <div class="view-pager flc-pager-top portlet-section-options">
          <ul id="pager-top" class="fl-pager-ui">
            <li class="flc-pager-previous"><a href="#">&lt; <spring:message code="previous"/></a></li>
            <li>
              <ul class="fl-pager-links flc-pager-links" style="margin:0; display:inline">
                <li class="flc-pager-pageLink"><a href="javascript:;">1</a></li>
                <li class="flc-pager-pageLink-disabled">2</li>
                <li class="flc-pager-pageLink"><a href="javascript:;">3</a></li>
              </ul>
            </li>
            <li class="flc-pager-next"><a href="#"><spring:message code="next"/> &gt;</a></li>
            <li>
              <span class="flc-pager-summary"><spring:message code="show"/></span>
              <span> <select class="pager-page-size flc-pager-page-size">
              <option value="5">5</option>
              <option value="10">10</option>
              <option value="20">20</option>
              <option value="50">50</option>
              <option value="100">100</option>
              </select></span> <spring:message code="per.page"/>
            </li>
          </ul>
        </div><!-- end: portlet-section-options -->
  
        <div class="portlet-section-body">
          <table id="${n}portletsTable" summary="" xmlns:rsf="http://ponder.org.uk" style="width:100%;">
            <thead>
              <tr rsf:id="header:">
                <th id="${n}portletTitle" class="flc-pager-sort-header"><a rsf:id="title" title="Click to sort" href="javascript:;"><spring:message code="title"/></a></th>
                <th id="${n}portletCount" class="flc-pager-sort-header"><a rsf:id="count" title="Click to sort" href="javascript:;"><spring:message code="number.times"/></a></th>
              </tr>
            </thead>
            <tbody id="${n}portletsBody">
              <tr rsf:id="row:">
                <td headers="${n}portletTitle" rsf:id="title"></td>
                <td headers="${n}portletCount" rsf:id="count"></td>
              </tr>
            </tbody>
          </table>
        </div>
        
        <div id="${n}noneAdded" style="display: none;">
          <p><spring:message code="no.apps.have.been.added.by.users.in.the.specified.time.period"/></p>
        </div> 
  
        <c:if test="${showAdminFeatures}">
          <!-- Portlet Buttons -->
          <div class="portlet-button-group">
  
negative.code: 
      var $ = up.jQuery;
      var portletDeepLinkUrl = '<c:url value="/p/PORTLETFNAME"/>';
  
      var portletList_configuration = {
          column: {
              title: 0,
              times: 1
          },
          main: {
              table : null,
              pageSize: 10
          }
      };
  
      var getDeepLinkAnchorTag = function(portletFName, portletDescription, portletTitle) {
          var url = portletDeepLinkUrl.replace("PORTLETFNAME", portletFName);
          return '<a href="' + url + '" title="' + portletDescription + '">' + portletTitle + '</a>';
      };
  
      var initializeTable = function() {
          // To allow the datatable to be repopulated to search multiple times
          // clear and destroy the original
          if (portletList_configuration.main.table != undefined && typeof portletList_configuration.main.table.fnClearTable !== 'undefined') {
              portletList_configuration.main.table.fnClearTable();
              portletList_configuration.main.table.fnDestroy();
          }
          portletList_configuration.main.table = $("#${n}portletsTable").dataTable({
              iDisplayLength: portletList_configuration.main.pageSize,
              aLengthMenu: [5, 10, 20, 50],
              bServerSide: false,
              sAjaxSource: '${popularPortletCountsUrl}',
              sAjaxDataProp: "counts",
              bDeferRender: false,
              bProcessing: true,
              bAutoWidth:false,
              sPaginationType: 'full_numbers',
              oLanguage: {
                  sLengthMenu: '<spring:message code="datatables.length-menu.message" htmlEscape="false" javaScriptEscape="true"/>',
                  oPaginate: {
                      sPrevious: '<spring:message code="datatables.paginate.previous" htmlEscape="false" javaScriptEscape="true"/>',
                      sNext: '<spring:message code="datatables.paginate.next" htmlEscape="false" javaScriptEscape="true"/>'
                  }
              },
              aoColumns: [
                  { mData: 'portletFName', sType: 'string', sWidth: '50%' },  // Name
                  { mData: 'count', sType: 'string', sWidth: '50%' }  // Times 
              ],
              fnInitComplete: function (oSettings) {
                  portletList_configuration.main.table.fnDraw();
              },
              fnServerData: function (sUrl, aoData, fnCallback, oSettings) {
                  oSettings.jqXHR = $.ajax({
                      url: sUrl,
                      data: $("#${n}form").serialize(),
                      dataType: "json",
                      cache: false,
                      type: oSettings.sServerMethod,
                      success: function (json) {
                          if (json.sError) {
                              oSettings.oApi._fnLog(oSettings, 0, json.sError);
                          }
  
                          $(oSettings.oInstance).trigger('xhr', [oSettings, json]);
                          fnCallback(json);
                      },
                      error: function (xhr, error, thrown) {
                          lib.handleError(xhr, error, thrown);
                      }
                  });
              },
              fnInfoCallback: function( oSettings, iStart, iEnd, iMax, iTotal, sPre ) {
                  var infoMessage = '<spring:message code="datatables.info.message" htmlEscape="false" javaScriptEscape="true"/>';
                  var iCurrentPage = Math.ceil(oSettings._iDisplayStart / oSettings._iDisplayLength) + 1;
                  infoMessage = infoMessage.replace(/_START_/g, iStart).
                                        replace(/_END_/g, iEnd).
                                        replace(/_TOTAL_/g, iTotal).
                                        replace(/_CURRENT_PAGE_/g, iCurrentPage);
                  return infoMessage;
              },
              // Add links to the proper columns after we get the data
              fnRowCallback: function (nRow, aData, iDisplayIndex, iDisplayIndexFull) {
                  // get deeplink anchor tag
                  $('td:eq(0)', nRow).html( getDeepLinkAnchorTag(aData.portletFName, aData.portletDescription, aData.portletTitle) );
              },
              // Setting the top and bottom controls
              sDom: 'r<"row alert alert-info view-filter"<"dataTables-inline"W><"dataTables-inline dataTables-right"l><"dataTables-inline dataTables-right"i><"dataTables-inline dataTables-right"p>><"row"<"span12"t>>>',//'<"top row-fluid"W<"pull-right pagination"l><"pull-right pagination"p>>rt<"bottom"i><"clear">',
              // Filtering
              oColumnFilterWidgets: { }
          });
      };
  
      initializeTable();
      $("#${n}days").change(initializeTable);
  
  });
  </script>
  