Fix #8 and #9

Author: SMillerDev

src/PHPDraft/Model/DataStructureElement.php

@@ -120,7 +120,7 @@ function __toString()
     {
         if ($this->value === NULL && $this->key === NULL)
         {
-            return '{ ... }';
+            return '<span class="example-value pull-right">{ ... }</span>';
         }
 
         if (is_array($this->value))

src/PHPDraft/Model/HTTPRequest.php

@@ -103,9 +103,11 @@ private function parse_structure($objects)
      *
      * @param string $base_url URL to the base server
      *
+     * @param array  $additional Extra options to pass to cURL
+     *
      * @return string An executable cURL command
      */
-    public function get_curl_command($base_url)
+    public function get_curl_command($base_url, $additional = [])
     {
         $options = [];
 
@@ -120,7 +122,8 @@ public function get_curl_command($base_url)
         {
             $options[] = '-H "'.$header.': '.$value. '"';
         }
-        $options[] = '-v';
+        $options = array_merge($options, $additional);
+
         return htmlspecialchars('curl '.join(' ', $options). ' "'.$this->parent->build_url($base_url).'"');
     }
 

src/PHPDraft/Model/Transition.php

@@ -169,10 +169,12 @@ public function get_method()
      *
      * @param string $base_url base URL of the server
      *
+     * @param array  $additional additional arguments to pass
+     *
      * @return string A cURL CLI command
      */
-    public function get_curl_command($base_url)
+    public function get_curl_command($base_url, $additional = [])
     {
-        return $this->request->get_curl_command($base_url);
+        return $this->request->get_curl_command($base_url, $additional);
     }
 }

src/PHPDraft/Out/HTML/default.css

@@ -7,17 +7,6 @@ var.url-value {
     padding: 2px;
 }
 
-div.main-url.fixed {
-    position: fixed;
-    bottom: -5px;
-    left: 10px;
-    z-index: 999;
-    background: #fff;
-    border-radius: 5px;
-    padding: 5px;
-    box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.5);
-}
-
 div.main-url {
     text-align: justify;
     line-break: loose;
@@ -77,44 +66,58 @@ body .col-md-10 h2:first-of-type {
     line-height: 22px;
 }
 
-.POST .panel-heading, span.POST {
+.POST > .panel-heading, span.POST {
     background: #62c462;
 }
 
-.GET .panel-heading, span.GET {
+.GET > .panel-heading, span.GET {
     background: #5bc0de;
 }
 
-.DELETE .panel-heading, span.DELETE {
+.DELETE > .panel-heading, span.DELETE {
     background: #ee5f5b;
 }
 
-.PUT .panel-heading, span.PUT {
+.PUT > .panel-heading, span.PUT {
     background: #f89406;
 }
 
-.row dl.dl-horizontal dt {
-    width: 80px;
-    line-height: 30px;
-}
-.row dl.dl-horizontal dd {
-    line-height: 30px;
-    margin-left: 100px;
-}
-
-.row dl.dl-horizontal dd a.code,
-.row dl.dl-horizontal dd code{
-    margin-right: 5px;
-}
-
-.example-value{
-    color: rgba(0,0,0,0.4);
+.example-value {
+    color: rgba(0, 0, 0, 0.4);
+    text-align: right;
 }
 
 a.code {
     padding: 2px 4px;
     font-size: 90%;
     background-color: #f9f2f4;
     border-radius: 4px;
-    font-family: Menlo,Monaco,Consolas,"Courier New",monospace;
+    font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
+}
+
+.popover {
+    width: auto;
+    max-width: 50%;
+}
+
+.popover-content {
+    width: auto;
+    max-width: 100%;
+    line-break: normal;
+    white-space: pre-wrap;
+}
+
+.panel-body {
+    position: relative;
+}
+
+.curl.btn {
+    z-index: 999;
+    position: absolute;
+    right: 15px;
+    top: 15px;
+}
+
+h5.response-body, h4.request {
+    cursor: pointer;
 }

src/PHPDraft/Out/HTML/default.js

@@ -3,4 +3,22 @@
  */
 $(function () {
     $('[data-toggle="popover"]').popover()
-})
+})
+
+$('.collapse.request-panel').on('shown.bs.collapse', function () {
+    $(this).parent().find("h4.request .glyphicon.indicator").removeClass("glyphicon-menu-up").addClass("glyphicon-menu-down");
+}).on('hidden.bs.collapse', function () {
+    $(this).parent().find("h4.request .glyphicon.indicator").removeClass("glyphicon-menu-down").addClass("glyphicon-menu-up");
+});
+
+$('.collapse.response-panel').on('shown.bs.collapse', function () {
+    $(this).parent().find("h4.response .glyphicon.indicator").removeClass("glyphicon-menu-up").addClass("glyphicon-menu-down");
+}).on('hidden.bs.collapse', function () {
+    $(this).parent().find("h4.response .glyphicon.indicator").removeClass("glyphicon-menu-down").addClass("glyphicon-menu-up");
+});
+
+$('pre.collapse.response-body').on('shown.bs.collapse', function () {
+    $(this).parent().find("h5.response-body .glyphicon.indicator").removeClass("glyphicon-menu-up").addClass("glyphicon-menu-down");
+}).on('hidden.bs.collapse', function () {
+    $(this).parent().find("h5.response-body .glyphicon.indicator").removeClass("glyphicon-menu-down").addClass("glyphicon-menu-up");
+});