moonrope 1.3.3 → 2.0.2

data/templates/basic/assets/style.css

@@ -0,0 +1,348 @@
+html {
+  font-family: Lato, Arial, sans-serif;
+  font-size:16px;
+}
+
+a {
+  text-decoration: none;
+}
+
+.sidebarBackground {
+  background:#2f3e4d;
+  width:200px;
+  position:fixed;
+  top:0;
+  bottom:0;
+  z-index:1;
+}
+
+.sidebar {
+  width:200px;
+  float:left;
+  z-index:10;
+  position:absolute;
+}
+.sidebar a {
+  display:block;
+  padding:7px 15px;
+  border-bottom:1px solid #394959;
+  color:#889db1;
+  font-size:85%;
+}
+
+.sidebar a:hover {
+  background-color:#26323f;
+}
+
+.sidebar a.active {
+  background-color:#1d2630;
+  color:#fff;
+}
+
+.footer {
+  margin-left:200px;
+  border-top:3px solid #efefef;
+  padding:20px 40px 100px 40px;
+  font-size:90%;
+  color:#999;
+}
+
+.content {
+  margin-left:200px;
+  padding:40px;
+  padding-right:15%;
+}
+
+
+.content h1 {
+  font-size:32px;
+  font-weight:900;
+  margin-bottom:15px;
+}
+
+.content h2 {
+  font-size:24px;
+  font-weight:700;
+  color:#f65552;
+  margin-bottom:10px;
+  margin-top:30px;
+}
+
+.content h3 {
+  font-size:18px;
+  font-weight:700;
+  color:#888;
+  margin-bottom:10px;
+  margin-top:30px;
+}
+
+.content p.text {
+  line-height:1.5;
+  margin-bottom:15px;
+}
+
+
+.content .standardList {
+  margin-bottom:15px;
+  line-height:1.5;
+}
+
+.content .standardList li {
+  list-style:square;
+  margin-bottom:15px;
+  margin-left:35px;
+}
+
+.content code {
+  font-family:'Droid Sans Mono', fixed;
+  color:#f65552;
+  padding:1px 2px;
+  font-size:90%;
+}
+
+.content pre.code {
+  font-family:'Droid Sans Mono', fixed;
+  white-space: pre;
+  background:#efefef;
+  padding:10px 10px 10px;
+  font-size:90%;
+  margin-bottom:15px;
+  border-radius:7px 7px 7px 7px;
+}
+
+.content pre.code span.jsonKey {
+  color:#7f55ad;
+  font-weight:bold;
+}
+
+.content pre.code span.jsonString {
+  color:#9eb503;
+}
+
+.content pre.code span.jsonComment {
+  color:#bbb;
+  font-style:italic;
+}
+
+.content a.link {
+  color:#2d80c8;
+  font-weight:700;
+  border-bottom:1px solid #2d80c8;
+}
+
+.content p.apiURL span {
+  color:#aaa;
+}
+
+.table {
+  width:100%;
+}
+
+.table th, .table td {
+  border-bottom:1px solid #ccc;
+  text-align: left;
+  padding:7px 0;
+}
+
+.table th {
+  border-bottom:2px solid #666;
+  font-size:90%;
+}
+
+.paramTable__req {
+  background:#ea4c89;
+  color:#fff;
+  font-weight:bold;
+  font-size:10px;
+  text-transform: uppercase;
+  padding:1px 3px;
+  border-radius: 2px;
+  vertical-align: 1px;
+  margin-left:5px;
+}
+
+.paramTable__field {
+  width:100%;
+  border:0;
+  padding:0;
+  font:inherit;
+  color:#7f55ad;
+}
+
+.paramTable__description {
+  font-size:90%;
+  color:#999;
+  margin-top:3px;
+}
+
+.paramTable__name {
+  font-family:'Droid Sans Mono', fixed;
+  font-size:90%;
+}
+
+.paramTable__restrictedList {
+  font-size:80%;
+  margin-top:7px;
+  background:url(lock.svg) no-repeat 0 1px;
+  background-size:14px;
+  color:#ed4300;
+  padding-left:20px;
+}
+
+.paramTable__nil {
+  color:#ccc;
+  font-size:90%;
+}
+
+.apiURLFull {
+  font-size:110%;
+  font-weight:bold;
+}
+
+.apiURLFull span {
+  color:#aaaaaa;
+  font-weight:normal;
+}
+
+.errorAttributeList {
+  font-size:80%;
+}
+
+.errorAttributeList li {
+  margin-bottom:8px;
+  list-style:square;
+  margin-left:16px;
+}
+.errorAttributeList li:last-child {
+  margin-bottom:0;
+}
+
+.errorAttributeList__name {
+  font-family:'Droid Sans Mono', fixed;
+}
+
+.errorAttributeList__desc {
+  color:#999;
+}
+
+/* Try Action Form */
+
+.tryForm {
+  display:none;
+  border:2px solid #ccc;
+  background:#f7f7f7;
+  border-radius:7px;
+  overflow: hidden;
+}
+
+.tryForm__header {
+  background:#ddd;
+  padding:15px 25px;
+  font-weight:700;
+  color:#999;
+
+}
+
+.tryForm__header input {
+  background:none;
+  border:0;
+  padding:0;
+  vertical-align:0px;
+  font:inherit;
+  font-weight:700;
+  color:#000;
+  width:auto;
+}
+
+.tryForm__output {
+  display:none;
+  background:#111;
+  color:#fff;
+  padding:15px;
+  font-family:'Droid Sans Mono', fixed;
+  white-space: pre;
+  word-wrap:normal;
+  font-size:90%;
+  overflow-x:auto;
+}
+
+.tryForm__output--success {
+  border-top:7px solid #68be28;
+}
+
+.tryForm__output--error {
+  border-top:7px solid #d4172e;
+}
+
+.tryForm__heading {
+  border-bottom:1px solid #ddd;
+  border-top:4px solid #aaa;
+  margin-bottom:15px;
+  padding:8px 25px;
+  background:#efefef;
+  font-weight:700;
+  font-size:80%;
+  text-transform: uppercase;
+  color:#888;
+}
+
+.tryForm__table {
+  font-size:90%;
+  width:calc(100% - 50px);
+  margin:0 25px;
+  margin-bottom:15px;
+}
+
+.tryForm__table td {
+  padding:5px 0;
+  background:#f8f8f8;
+}
+
+.tryForm__tableField {
+  border:0;
+  background:none;
+  border-bottom:1px solid #ccc;
+  padding:0;
+  padding-bottom:4px;
+  width:100%;
+  font:inherit;
+  color:#7f55ad;
+  font-weight:700;
+}
+
+.tryForm__tableField:focus {
+  border-color:#7f55ad;
+}
+
+.tryForm__button {
+  margin:15px 25px;
+  text-align: right;
+}
+
+.tryFormActivate {
+  margin:20px 0;
+}
+.tryFormActivate__button {
+  background:url(tool.svg) #fffce0 no-repeat 12px 7px;
+  background-size:12px;
+  border:1px solid #dad7bb;
+  color:#6c6a55;
+  border-radius:4px;
+  padding:6px 12px 6px 30px;
+  font-size:12px;
+  font-weight:700;
+}
+
+.tryForm__checkbox {
+  margin-bottom:4px;
+}
+
+.tryForm__checkbox:last-child {
+  margin-bottom:0;
+}
+
+.tryForm__checkbox input {
+  float:left;
+  margin-right:4px;
+  margin-top:4px;
+}

data/templates/basic/assets/tool.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="8" height="8" viewBox="0 0 8 8">
+  <path fill="#6c6a55" d="M5.5 0c-1.38 0-2.5 1.12-2.5 2.5 0 .32.08.62.19.91l-2.91 2.88c-.39.39-.39 1.05 0 1.44.2.2.46.28.72.28.26 0 .52-.09.72-.28l2.88-2.91c.28.11.58.19.91.19 1.38 0 2.5-1.12 2.5-2.5 0-.16 0-.32-.03-.47l-.97.97h-2v-2l.97-.97c-.15-.03-.31-.03-.47-.03zm-4.5 6.5c.28 0 .5.22.5.5s-.22.5-.5.5-.5-.22-.5-.5.22-.5.5-.5z"
+  />
+</svg>

data/templates/basic/assets/try.js

@@ -0,0 +1,157 @@
+$(document).ready(function() {
+
+  $form = $('form.tryForm')
+
+  // Get all fields which will be added as headers
+  var headerFields = $('input.headerField', $form)
+
+  // Add stored values to header fields
+  if(typeof(Storage) !== "undefined") {
+    headerFields.each(function() {
+      $field = $(this)
+      $field.val(localStorage.getItem("header__" + $(this).attr('name')))
+    })
+
+  }
+
+
+  //
+  // Form submission
+  //
+  $form.on('submit', function() {
+
+    // Gets values used to make up the URL which should be
+    // requested for this request.
+    var host = $("input[name=host]", $(this)).val()
+    var version = $("input[name=version]", $(this)).val()
+    var controller = $("input[name=controller]", $(this)).val()
+    var action = $("input[name=action]", $(this)).val()
+    var url = host + "/api/" + version + "/" + controller + "/" + action
+    // Get the output box ready for use
+    var outputBox = $('.tryForm__output', $(this))
+    // Create a hash fo all parameters which will be submitted
+    var parameters = {}
+    $('input.paramField').each(function(){
+      $this = $(this)
+      value = $this.val()
+      type = $this.data('type')
+      name = $this.attr('name')
+      if(value.length) {
+        if(type == 'Integer') {
+          parameters[name] = parseInt(value);
+        } else if (type == "Hash" || type == "Array") {
+          parameters[name] = JSON.parse(value);
+        } else {
+          parameters[name] = value;
+        }
+      }
+    });
+
+    // Include/exclude full attributes as needed
+    var fullAttrsCheckbox = $('#full_attrs')
+    if(fullAttrsCheckbox.length) {
+      parameters['_full'] = !!fullAttrsCheckbox.prop('checked')
+    }
+
+    // Include/exclude expansions
+    var expansionCheckboxes = $('.tryForm__expansions')
+    if(expansionCheckboxes.length) {
+      parameters['_expansions'] = []
+      expansionCheckboxes.each(function() {
+        $this = $(this)
+        name = $(this).attr('name')
+        if($(this).prop('checked')) {
+          parameters['_expansions'].push(name)
+        }
+      })
+    }
+
+    // Make the AJAX request
+    $.ajax({
+      url: url,
+      method: 'POST',
+      contentType: 'application/json',
+      data: JSON.stringify(parameters),
+      beforeSend: function(xhr) {
+        // Add any headers which have been added
+        headerFields.each(function() {
+          $field = $(this)
+          name = $field.attr('name')
+          value = $field.val()
+          if(typeof(Storage) !== "undefined") {
+            localStorage.setItem("header__" + name, value)
+          }
+          if(value.length) {
+            xhr.setRequestHeader(name, $field.val())
+          }
+        })
+      },
+      success: function(data) {
+        // Success means that we got a 200 OK which means we can be pretty
+        // sure that we've got a moonrope response.
+        if(data.status == "success") {
+          outputBox.addClass('tryForm__output--success').removeClass('tryForm__output--error')
+        } else {
+          outputBox.addClass('tryForm__output--error').removeClass('tryForm__output--success')
+        }
+        outputBox.text(JSON.stringify(data, null, 4))
+        outputBox.show()
+      },
+      error: function(xhr) {
+        // Errors which occurr aren't very well reported at the moment.
+        // They should be.
+        if(xhr.getResponseHeader('content-type') == 'application/json') {
+          var text = JSON.stringify(JSON.parse(xhr.responseText), null, 4)
+        } else {
+          var text = "Failed to make request."
+        }
+
+        outputBox.show()
+        outputBox.text(text)
+        outputBox.addClass('tryForm__output--error').removeClass('tryForm__output--success')
+      }
+    })
+    return false
+  });
+
+  //
+  // Open the try form
+  //
+  $('p.tryFormActivate a').on('click', function() {
+    $form = $('form.tryForm')
+    $parent = $(this).parents('p')
+    $form.show('fast')
+    $parent.hide()
+    return false
+  });
+
+  //
+  // Close the try form
+  //
+  $('button.tryFormCancel').on('click', function() {
+    $form = $('form.tryForm')
+    $parent = $('p.tryFormActivate')
+    $form.hide()
+    $parent.show()
+    return false
+  });
+
+  // http://stackoverflow.com/questions/8100770/auto-scaling-inputtype-text-to-width-of-value
+  // http://jsfiddle.net/MqM76/217/
+  $.fn.textWidth = function(text, font) {
+      if (!$.fn.textWidth.fakeEl) $.fn.textWidth.fakeEl =      $('<span>').hide().appendTo(document.body);
+      $.fn.textWidth.fakeEl.text(text || this.val() || this.text()).css('font', font || this.css('font'));
+      return $.fn.textWidth.fakeEl.width();
+  };
+
+  // Automatically ensure that the size for the header inputs is
+  // correct
+  function resizeInput() {
+    $this = $(this)
+    $this.css('width', $this.textWidth() + "px")
+    $this.attr('size', $this.val().length)
+  }
+
+  $('form.tryForm .tryForm__header input').on('input', resizeInput).trigger('input')
+
+});