Add tokens to generate unique namespace IDs when applications are pushed or imported to a Script Portlet V 1.3

Associating JavaScript variable names and HTML IDs with a unique portlet namespace prevents portlets from colliding with each other and uniquely identifies HTML element ID values and JavaScript variables. To use a unique portlet namespace, you can prefix or suffix any imported JavaScript, HTML, CSS, or JSON variable or ID with the token __SPNS__. It is automatically replaced with the Web Content Manager ScriptPortletNamespace plug-in at import or push time, which generates the unique namespace for the portlet at render time.

When you use the __SPNS__ token as a placeholder for the namespace in the external application representation, you can locally test applications that do not otherwise rely on WebSphere® Portal and portlet artifacts and markup.

In the following example, the __SPNS__ token represents a pattern that is replaced by the Script Portlet namespace plug-in markup when the application is pushed or imported to a Script Portlet from a local file system.

$(function() {
      $(app_js1).html("<div>hi from app_js1 with namespace: __SPNS__</div>");
      var myVar__SPNS__ = '__SPNS__';
      alert("Namespace: " + myVar__SPNS__);
  });

When the application is stored as a Web Content Manager content item, that pattern is replaced with the Script Portlet Namespace plug-in markup [Plugin:ScriptPortletNamespace]. The following example shows the markup.

$(function() {
          $(app_js1).html("<div>hi from app_js1 with namespace: [Plugin:ScriptPortletNamespace]</div>");
          var myVar[Plugin:ScriptPortletNamespace] = '[Plugin:ScriptPortletNamespace]';
          alert("Namespace: " + myVar[Plugin:ScriptPortletNamespace]);
    });

When the application is rendered, the Script Portlet Namespace plug-in replaces the plug-in markup with unique portlet namespace IDs. The following example shows the unique portlet namespace IDs:

 $(function() {
      $(app_js1).html("<div>hi from app_js1 with namespace: ns_Z7_4HD81440LG4710AAJ7HDH910L2_</div>");
      var myVarns_Z7_4HD81440LG4710AAJ7HDH910L2_ = 'ns_Z7_4HD81440LG4710AAJ7HDH910L2_';
      alert("Namespace: " + myVarns_Z7_4HD81440LG4710AAJ7HDH910L2_);
  });

When you export the portlet to a compressed file, the Script Portlet Namespace plug-in markup replaces the __SPNS__ token again so the application can be tested outside of the WebSphere Portal environment.