public/js/views/policy.js in conjur-asset-ui-1.3.0 vs public/js/views/policy.js in conjur-asset-ui-1.3.1

@@ -1,43 +1,70 @@
 /** @jsx React.DOM */
+/* global conjur, React, ReactBootstrap, _ */
 
-var Policy = React.createClass({
-  mixins: [conjur.views.mixins.Tab],
-  render: function() {
-    var policy = this.props.data.policy;
-    var id = policy.id.split(':')[2];
+(function(conjur, React, ReactBootstrap, _) {
+    'use strict';
 
-    //TODO: policy loader
-    //TODO in CLI: why not save text of policy as an annotation?
-    var overview_tab =
-            <TabPane key="overview" tab="Overview">
-            <dl className="dl-horizontal">
-              <dt>Owner</dt>
-              <dd><RoleLink id={policy.id}/></dd>
-            </dl>
-            </TabPane>;
+    var TabbedArea = ReactBootstrap.TabbedArea,
+        TabPane = ReactBootstrap.TabPane,
+        Tab = conjur.views.mixins.Tab,
+        RoleLink = conjur.views.RoleLink,
+        AuditBox = window.AuditBox;
 
-    var permissions_tab = this.permissions_tab(policy.id);
-    var memberships_tab = this.memberships_tab(policy.id);
-    var annotations_tab = this.annotations_tab();
-    var owned_tab       = this.owned_tab();
+    this.Policy = React.createClass({
+        mixins: [Tab],
 
-    var audit_tab =
-            <TabPane key="audit" tab="Recent Activity">
+        render: function() {
+            var policy = this.props.data.policy,
+                id = policy.id.split(':')[2];
+
+            //TODO: policy loader
+            //TODO in CLI: why not save text of policy as an annotation?
+            var overviewTab = (
+              <TabPane key="overview" tab="Overview">
+                <dl className="dl-horizontal">
+                  <dt>Owner</dt>
+                  <dd><RoleLink id={policy.id}/></dd>
+                </dl>
+              </TabPane>
+            );
+
+            var permissionsTab = this.permissionsTab(policy.id),
+                membershipsTab = this.membershipsTab(policy.id),
+                annotationsTab = this.annotationsTab(),
+                ownedTab = this.ownedTab();
+
+            var auditTab = (
+              <TabPane key="audit" tab="Recent Activity">
                 <div className="audit auditGroup">
                   <AuditBox roles={[policy.id]} tabview={true} />
                 </div>
-            </TabPane>;
-    var tabs = _.compact( [ overview_tab, owned_tab, memberships_tab, permissions_tab,
-                            annotations_tab, audit_tab
-                          ] );
+              </TabPane>
+            );
 
-    return (
-      <div className="policy">
-        <h2>Policy {id}</h2>
-        <TabbedArea defaultActiveKey="overview">
-            {tabs}
-        </TabbedArea>
-      </div>
-    );
-  }
-});
+            var tabs = _.compact([
+                overviewTab,
+                ownedTab,
+                membershipsTab,
+                permissionsTab,
+                annotationsTab,
+                auditTab
+            ]);
+
+            return (
+              <div className="policy">
+                <h2>Policy {id}</h2>
+                <TabbedArea defaultActiveKey="overview">
+                  {tabs}
+                </TabbedArea>
+              </div>
+            );
+        }
+    });
+
+}).bind(conjur.views)
+(
+    conjur,
+    React,
+    ReactBootstrap,
+    _
+);