praxis 0.16.1 → 0.17.0

data/lib/api_browser/app/js/directives/type_placeholder.js

@@ -0,0 +1,21 @@
+/**
+ * This directive replaces itself with a specialised type template based on the
+ * type it is displaying.
+ */
+app.directive('typePlaceholder', function(templateFor, $stateParams) {
+  return {
+    restrict: 'EA',
+    scope: {
+      type: '=',
+      template: '@',
+      details: '=?',
+      name: '=?'
+    },
+    link: function(scope, element) {
+      scope.apiVersion = $stateParams.version;
+      templateFor(scope.type, scope.template).then(function(templateFn) {
+        element.replaceWith(templateFn(scope));
+      });
+    }
+  };
+});

data/lib/api_browser/app/js/factories/Configuration.js

@@ -0,0 +1,13 @@
+// Use this to provide settings for the doc browser
+app.provider('Configuration', function() {
+  this.title = 'API Browser';
+  this.versionLabel = 'API Version';
+  this.expandChildren = true;
+
+  this.$get = function() {
+    return this;
+  };
+}).run(function(Configuration, $rootScope, $document) {
+  _.extend($rootScope, _.omit(Configuration, '$get'));
+  $document[0].title = Configuration.title;
+});

data/lib/api_browser/app/js/factories/Documentation.js

@@ -8,9 +8,6 @@
     },
     getType: function(version, name) {
       return $http.get('api/' + version + '/types/' + name + '.json', { cache: true });
-    },
-    getTemplates: function(version) {
-      return $http.get('api/' + version + '/templates.json', { cache: true });
     }
   };
 });

data/lib/api_browser/app/js/factories/normalize_attributes.js

@@ -0,0 +1,19 @@
+app.factory('normalizeAttributes', function() {
+  function normalize(type, attributes, parent) {
+    _.forEach(attributes, function(attribute, name) {
+      var path = parent.concat([name]);
+      var example = JSON.stringify(_.get(type.example, path), null, 2);
+      if (!attribute.options) attribute.options = {};
+      if (example) attribute.options.example = example;
+      if (attribute.values != null) attribute.options.values = attribute.values;
+      if (attribute.default != null) attribute.options.default = attribute.default;
+      if (attribute.type && attribute.type.attributes) {
+        normalize(type, attribute.type.attributes, path);
+      }
+    });
+  }
+
+  return function(type, attributes) {
+    normalize(type, attributes, []);
+  };
+});

data/lib/api_browser/app/js/factories/template_for.js

@@ -0,0 +1,113 @@
+/**
+ * Allows dynamic UI based on resolvers. You can customise the way templates
+ * work in the doc browser by registering your own template resolver.
+ *
+ * A template resolver is dependency injected function that has several special
+ * arguments that can be injected. These are:
+ *
+ * Name                | Type    | Description
+ * --------------------|---------|----------------------------------------------
+ * $type               | String  | The name of a type.
+ * $family             | String  | The family or group of types this type belongs to.
+ * $typeDefinition     | Object  | The full definition of the type as available.
+ * $requestedTemplate  | String  | This is the kind of template that we want. Possible values are: standalone, embedded and label. Embedded templates represent types that are attributes of another type. The template thus should assume that it is being rendered in a table row. Label templates display a human readable name of a type. Standalone templates are used when a type is displayed by itself (i.e. a request payload).
+ *
+ * The type resolver should return either a $compiled template, or a url of a
+ * template or a promise for one of those. In that case the template resolution
+ * procedure will halt and the returned template will be displayed. If `undefined`
+ * is passed, the next resolver will be invoked. A promise for undefined is currently
+ * not supported.
+ */
+app.provider('templateFor', function() {
+
+  var resolvers = [];
+  /**
+   * Register a custom template resolver.
+   * @param {function} resolver
+   *    A function that returns undefined or a promise for a compiled template or a template url.
+   */
+  this.register = function(resolver) {
+    resolvers.unshift(resolver);
+  };
+
+  this.register(/*ngInject*/function payloadResolver($family, $requestedTemplate) {
+    if ($requestedTemplate === 'standalone') {
+      switch ($family) {
+        case 'hash':
+          return 'views/types/standalone/struct.html';
+        default:
+          return 'views/types/standalone/default.html';
+      }
+    }
+  });
+
+  this.register(/*ngInject*/function typeResolver($family, $type, $requestedTemplate) {
+    if ($requestedTemplate === 'embedded') {
+      if ($type === 'Links') {
+        return 'views/types/embedded/links.html';
+      }
+      switch ($family) {
+        case 'hash':
+          return 'views/types/embedded/struct.html';
+        default:
+          return 'views/types/embedded/default.html';
+      }
+    }
+  });
+
+  this.register(/*ngInject*/function labelResolver($typeDefinition, $requestedTemplate, primitives) {
+    if ($requestedTemplate === 'label') {
+      if (_.contains(primitives, $typeDefinition.name)) {
+        return 'views/types/label/primitive.html';
+      } else if ( $typeDefinition.member_attribute !== undefined ) {
+        if ( _.contains(primitives, $typeDefinition.member_attribute.type.name)){
+          return 'views/types/label/primitive_collection.html';
+        } else{
+          return 'views/types/label/type_collection.html';
+        }
+      } else if ($typeDefinition.link_to) {
+        return 'views/types/label/link.html';
+      }
+      return 'views/types/label/type.html';
+    }
+  });
+
+  this.$get = function($q, $http, $injector, $compile, $templateCache) {
+    return function(type, templateType) {
+      for (var i = 0; i < resolvers.length; i++) {
+        var result = $injector.invoke(resolvers[i], this, {
+          $type: type.name,
+          $typeDefinition: type,
+          $family: type.family || type.name,
+          $requestedTemplate: templateType
+        });
+        if (result) {
+          return $q.when(result).then(function(template) {
+            if (_.isFunction(template)) {
+              return template;
+            } else if (_.isString(template)) {
+              return $http.get(template, {cache: $templateCache}).then(function(response) {
+                return $compile(response.data);
+              });
+            } else {
+              throw 'Resolver returned an unknown type';
+            }
+          });
+        }
+      }
+      throw 'Template did not match any resolver.';
+    };
+  };
+})
+.constant('primitives', [
+  'Boolean',
+  'CSV',
+  'DateTime',
+  'Float',
+  'Hash',
+  'Ids',
+  'Integer',
+  'Object',
+  'String',
+  'Struct'
+]);

data/lib/api_browser/app/sass/modules/_body.scss

@@ -11,8 +11,30 @@ body {
 }
 
 .content {
-	dl {
-		margin-top: 0;
-		margin-bottom: 0;
-	}
+  dl {
+    margin-top: 0;
+    margin-bottom: 0;
+  }
+}
+
+.verb.get {
+  background: $get-color;
+}
+.verb.post {
+  background: $post-color;
+}
+.verb.delete {
+  background: $delete-color;
+}
+.verb.put {
+  background: $put-color;
+}
+.verb.patch {
+  background: $patch-color;
+}
+
+.action-divider {
+  border-top: 2px solid darken($hr-border, 4);
+  margin-bottom: 3rem;
+  margin-top: 3rem;
 }

data/lib/api_browser/app/sass/modules/_sidebar.scss

@@ -20,7 +20,74 @@
 }
 
 .sidebar {
+  .list-group {
+    margin-bottom: 0;
+    margin-top: 0;
+  }
   .list-group-item {
+    border-width: 1px 0;
     word-break: break-word;
+    &:first-of-type {
+      border-radius: 0;
+      border-top: 0 none;
+    }
+    &:last-of-type {
+      border-bottom: 0 none;
+    }
+    &.child-resource {
+      padding-left: 2.5em;
+    }
+    &.group-selected {
+      border-left: 2px solid $link-color;
+    }
   }
-}
+}
+
+.tab-list-group {
+  border: 1px solid $nav-tabs-border-color;
+  border-radius: 3px;
+  margin-top: 1rem;
+}
+
+.sidebar {
+  .nav-tabs {
+    border: 1px solid $nav-tabs-border-color;
+    border-width: 0 0 1px 0;
+    li {
+      &:first-of-type {
+        a,
+        a:hover,
+        a:focus {
+          border-left: 0 none;
+          border-radius: 2px 2px 0 0;
+        }
+      }
+      &:last-of-type {
+        a,
+        a:hover,
+        a:focus {
+          border-radius: 2px 2px 0 0;
+          border-right: 0 none;
+        }
+      }
+      a {
+        border-bottom: 0;
+        font-size: 12px;
+        &:hover {
+          background-color: #fff;
+          border-color: transparent;
+          color: $link-hover-color;
+        }
+      }
+    }
+    .active a,
+    .active a:hover,
+    .active a:focus {
+      border-top: 2px solid $link-color;
+      color: $link-color;
+      font-weight: bold;
+      margin-bottom: -1px;
+    }
+
+  }
+}

data/lib/api_browser/app/sass/praxis.scss

@@ -5,7 +5,7 @@
 // Bootstrap and Bootstrap variables
 
 @import "variables/bootstrap-variables";
-@import "../bower_components/bootstrap-sass/lib/bootstrap";
+@import "../bower_components/bootstrap-sass/vendor/assets/stylesheets/bootstrap";
 
 // Modules
 
@@ -31,10 +31,6 @@
   color: #aaa;
 }
 
-rs-attribute-description dt {
-  text-transform: capitalize;
-}
-
 .attribute-table {
   div[class*='col-'] {
     padding: $table-cell-padding;

data/lib/api_browser/app/sass/variables/_bootstrap-variables.scss

@@ -46,10 +46,10 @@ $font-size-base:                              13px !default;
 $font-size-large:                             ceil(($font-size-base * 1.25)) !default; // ~18px
 $font-size-small:                             ceil(($font-size-base * 0.85)) !default; // ~12px
 
-$font-size-h1:                                floor(($font-size-base * 2.6)) !default; // ~36px
-$font-size-h2:                                floor(($font-size-base * 2.15)) !default; // ~30px
-$font-size-h3:                                ceil(($font-size-base * 1.7)) !default; // ~24px
-$font-size-h4:                                ceil(($font-size-base * 1.25)) !default; // ~18px
+$font-size-h1:                                floor(($font-size-base * 2.6)) !default; // ~33px
+$font-size-h2:                                floor(($font-size-base * 2.2)) !default; // ~28px
+$font-size-h3:                                ceil(($font-size-base * 1.4)) !default; // ~19px
+$font-size-h4:                                ceil(($font-size-base * 1.1)) !default; // ~15px
 $font-size-h5:                                $font-size-base !default;
 $font-size-h6:                                ceil(($font-size-base * 0.85)) !default; // ~12px
 
@@ -763,3 +763,12 @@ $hr-border:                                   $gray-lighter !default;
 
 // horizontal offset for forms and lists.
 $component-offset-horizontal:                 180px !default;
+
+// Praxis Specific Variables
+
+// HTTP verbs
+$get-color:                                   #85c630 !default;
+$post-color:                                  #8640b5 !default;
+$put-color:                                   #e88a3c !default;
+$delete-color:                                #b8321e !default;
+$patch-color:                                 #58b587 !default;

data/lib/api_browser/app/views/action.html

@@ -1,16 +1,14 @@
-<!-- Action -->
-
 <div ng-if="error" class="alert alert-danger">
   <p>The requested action could not be found.</p>
 </div>
 <div ng-if="action">
   <div class="row">
     <div class="col-lg-12">
-      <h1>
+      <h2>
         {{ action.name }}
-      </h1>
+      </h2>
       <p ng-repeat="url in action.urls">
-        {{ url.verb }} {{ url.path }}
+        <span class="label label-default verb" ng-class="url.verb | lowercase">{{ url.verb }}</span> <b>{{ url.path }}</b>
       </p>
       <p ng-bind-html="action.description | markdown"></p>
     </div>
@@ -18,33 +16,30 @@
 
   <div class="row" ng-if="action.headers.type.attributes">
     <div class="col-lg-12">
-      <h2>Request Headers</h2>
-      <rs-request-headers headers="action.headers"></rs-request-headers>
-      <!--<rs-attribute-table attributes="action.headers.type.attributes" show-groups="true"></rs-attribute-table>-->
+      <h3>Request Headers</h3>
+      <type-placeholder details="action.headers.type.attributes" type="action.headers.type" template="standalone"></type-placeholder>
     </div>
   </div>
 
   <div class="row" ng-if="action.params.type.attributes">
     <div class="col-lg-12">
-      <h2>Request Parameters</h2>
-      <rs-request-parameters parameters="action.params"></rs-request-parameters>
-      <!--<rs-attribute-table attributes="action.params.type.attributes" show-groups="true"></rs-attribute-table>-->
+      <h3>Request Parameters</h3>
+      <type-placeholder details="action.params.type.attributes" type="action.params.type" template="standalone"></type-placeholder>
     </div>
   </div>
 
   <div class="row" ng-if="action.payload.type">
     <div class="col-lg-12">
-      <h2>Request Body</h2>
-      <rs-request-body payload="action.payload"></rs-request-body>
-      <!--<rs-attribute-table attributes="action.payload.type.attributes" show-groups="true"></rs-attribute-table>-->
+      <h3>Request Body</h3>
+      <type-placeholder type="action.payload.type" template="standalone" details="action.payload.type.attributes"></type-placeholder>
     </div>
   </div>
 
   <div class="row" ng-if="hasResponses()">
     <div class="col-lg-12">
-      <h2>Responses</h2>
+      <h3>Responses</h3>
       <div class="table-responsive">
-        <table class="table table-striped">
+        <table class="table table-striped table-bordered">
           <thead>
             <tr>
               <th>Code</th>
@@ -68,7 +63,7 @@
                 {{response.media_type.id || response.media_type.identifier}}
               </td>
               <td>
-                <rs-attribute-description attribute="response"></rs-attribute-description>
+                <attribute-description attribute="response"></attribute-description>
               </td>
             </tr>
           </tbody>
@@ -77,3 +72,4 @@
     </div>
   </div>
 </div>
+<hr class="action-divider" />

data/lib/api_browser/app/views/controller.html

@@ -1,5 +1,3 @@
-<!-- Controller -->
-
 <div ng-if="error" class="alert alert-danger">
   <p>The requested controller could not be found.</p>
 </div>
@@ -15,10 +13,40 @@
   <div class="row" ng-if="controller.actions.length">
     <div class="col-lg-12">
       <h2>Actions</h2>
-      <ng-include src="'views/resource/_actions.html'" />
+      <div class="table-responsive">
+      <table class="table table-striped table-bordered">
+        <thead>
+          <tr>
+            <th>Name</th>
+            <th>Route</th>
+            <th>Description</th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr ng-repeat="action in controller.actions">
+            <td>
+              <a ui-sref="root.controller.action({action: action.name, controller: controllerName, version: apiVersion})">{{ action.name }}</a>
+            </td>
+            <td>
+              <div ng-repeat="url in action.urls">
+                <div class="label label-default verb" ng-class="url.verb | lowercase">{{ url.verb }}</div>
+                <strong>{{ url.path }}</strong>
+              </div>
+            </td>
+            <td style="font-size: 110%;">
+              <p ng-bind-html="action.description | markdown"></p>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
     </div>
   </div>
   <div ng-if="controller.media_type" ng-controller="TypeCtrl">
-    <ng-include src="'views/type/_details.html'" />
+    <ng-include src="'views/type/details.html'" />
+  </div>
+  <h1>Actions</h1>
+  <div ng-controller="ActionCtrl" ng-repeat="action in controller.actions">
+    <div id="action-{{action.name}}" ng-include="'views/action.html'"></div>
   </div>
 </div>