# Source: src/js/views/portals/PortalMembersView.js

    define(["jquery",
        "underscore",
        "backbone",
        "text!templates/metadata/EMLPartyDisplay.html",
        "views/portals/PortalSectionView",
        "views/portals/PortalLogosView",
        "text!templates/portals/portalAcknowledgements.html",
        "text!templates/portals/portalAwards.html"],
        function($, _, Backbone, EMLPartyDisplayTemplate, PortalSectionView,
            PortalLogosView, AcknowledgementsTemplate, AwardsTemplate){

        /**
        * @class PortalMembersView
        * @classdesc The PortalMembersView is a view to render the
         * portal members tab (within PortalSectionView)
         * @classcategory Views/Portals
         * @extends PortalSectionView
         * @constructor
         */
         var PortalMembersView = PortalSectionView.extend(
            /** @lends PortalMembersView.prototype */{
            type: "PortalMembers",

            /**
            * The display name for this Section
            * @type {string}
            */
            uniqueSectionLabel: "Members",

          //   /* The list of subview instances contained in this view*/
          //   subviews: [], // Could be a literal object {}

          //   /* Renders the compiled template into HTML */
            partyTemplate: _.template(EMLPartyDisplayTemplate),
            acknowledgementsTemplate: _.template(AcknowledgementsTemplate),
            awardsTemplate: _.template(AwardsTemplate),

          //   /* The events that this view listens to*/
          //   events: {

          //   },

          //   /* Construct a new instance of PortalMembersView */
          //   initialize: function() {

          //   },

          //   /* Render the view */
            render: function() {

              if( this.id ){
                this.$el.attr("id", this.id);
              }

                var parties = this.model.get("associatedParties");
                var thisview = this;
                // Group parties into sets of 2 to do 2 per row
                var row_groups = _.groupBy(parties, function(parties, index) {
                    return Math.floor(index / 2);
                });

                _.each(row_groups, function(row_group){
                    // Create a new bootstrap row for each set of 2 parties
                    var newdiv = $('<div class="row-fluid"></div>');
                    // Put the empty row into the portal members container
                    thisview.$el.append(newdiv);
                    // iterate for the 2 parties in this row
                    _.each(row_group, function(party) {

                      //Get the party info in JSON form
                      var partyInfo = party.toJSON();

                      // Create html links from the urls
                      var regex = /(.+)/gi;
                      var urlLink = [];
                      _.each(party.get("onlineUrl"), function(url){
                          urlLink.push(url.replace(regex, '<a href="$&">$&</a>'));
                      });
                      partyInfo.urlLink = urlLink;

                      //Set the ORCIDs as a blank string
                      partyInfo.orcids = "";

                      //Get the UserIds so we can display ORCIDs
                      if( Array.isArray(partyInfo.userId) && partyInfo.userId.length ){

                        //FInd the user ids that are ORCIDs
                        _.each( partyInfo.userId, function(userId){
                          //If this user id is an ORCID,
                          if( party.isOrcid(userId) ){
                            //Display it with the icon and as a link
                            partyInfo.orcids += "<img src=\"" + MetacatUI.root + "/img/orcid_64x64.png\" " +
                                      "class=\"icon orcid-logo icon-on-left\" />" +
                                      "<a href=\"" + userId + "\" target=\"_blank\">" + userId + "</a>";
                          }
                        });
                      }

                      // render party into its row
                      newdiv.append(thisview.partyTemplate(partyInfo));
                    });
                });

                var acknowledgements = this.model.get("acknowledgments") || "";
                var awards = this.model.get("awards") || "";

                //Add a container element
                if(acknowledgements || awards.length){
                  var ack_div = $('<div class="well awards-info"></div>');
                  this.$el.append(ack_div);

                  //Add the awards
                  if( awards.length ) {

                      ack_div.append(this.awardsTemplate({awards: awards}));
                  }

                  //Add the acknowledgments
                  if( acknowledgements ) {

                    ack_div.append(this.acknowledgementsTemplate(acknowledgements.toJSON()));

                  }
                }

                this.$el.data("view", this);

            },

          //   onClose: function() {

          //   }

         });

         return PortalMembersView;
    });