[IMP] doc: simplify webservice api doc

* remove ZeroClipboard, pain to test locally and deployment didn't work
  right due to needing absolute path to the swf always
* remove the clipboard alteration on the fly, behaves oddly and can be
  confusing
* add an explicit button to expand and collapse the setup content
* fixup some styling

doc/_themes/odoodoc/layout.html

@@ -6,7 +6,6 @@
   '_static/bootstrap/js/tooltip.js',
   '_static/bootstrap/js/collapse.js',
   '_static/bootstrap/js/dropdown.js',
-  '_static/zeroclipboard-2.1.6/ZeroClipboard.min.js',
   '_static/app.js'
 ] %}
 

doc/_themes/odoodoc/static/app.js

@@ -25,40 +25,6 @@ $(function () {
         });
     }, 100);
 
-    /*
-    for clipboard:
-    * add per-language setup code to document, hidden
-    * adds button to each switchable language block except when they're setup
-      stuff because fuck'em
-    * per-language, add clipboard hook to prefix with setup bit on-copy
-    * setup bit is... ?
-    * actually not all blocks because we don't want to add the setup bits to
-      the setup bits, so that's kinda shit
-     */
-
-    document.addEventListener('copy', copyCode);
-
-    ZeroClipboard.config({
-        swfPath: '../_static/zeroclipboard-2.1.6/ZeroClipboard.swf',
-        flashLoadTimeout: 3e3,
-    });
-    var zc = new ZeroClipboard();
-    zc.on('ready', function () {
-        var $highlighted = $('.switchable:not(.setup) .highlight').addClass('with-btn-clipboard');
-        var $clipboard_buttons =
-            $('<button type="button" class="btn-clipboard">Copy</button>')
-            .on('transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd', function () {
-                $(this).removeClass('active');
-            })
-            .prependTo($highlighted);
-        zc.clip($clipboard_buttons);
-    });
-    zc.on('copy', function (e) {
-        // yellow flash
-        $(e.target).addClass('active');
-        copyCode(e);
-    });
-
     // stripe page stuff
     if ($('div.document-super').hasClass('stripe')) { (function () {
         // iterate on highlighted PL blocks (but not results because that'd
@@ -95,38 +61,31 @@ $(function () {
                 sheet.insertRule(sel + '{' + content + '}', lastIndex);
             });
         $switcher.affix();
+
+        $('<button type="button" class="btn-show-setup">Toggle Setup Code</button>')
+            .prependTo('.switchable:not(.setup) .highlight');
+        $(document).on('click', '.btn-show-setup', function (e) {
+            var $target = $(e.target);
+            var target = $target.closest('.switchable:not(.setup)').get(0);
+            // not in a switchable (???)
+            if (!target) { return; }
+            var lang = getHighlightLanguage(target);
+            if (!lang) {
+                // switchable without highlight (e.g. language-specific notes),
+                // don't munge
+                return;
+            }
+
+            var $setup_code = $target.prev();
+            if ($setup_code.length) {
+                // remove existing setup code
+                $setup_code.remove();
+            } else {
+                $('.setupcode.highlight-' + lang + ' pre').clone().insertBefore($target);
+            }
+        });
     })(); }
 
-
-    function copyCode(e) {
-        // works for both C-c and "Copy" button if copy button is injected
-        // inside highlighted code section
-        var target = $(e.target).closest('.switchable:not(.setup)').get(0);
-        // not in a switchable
-        if (!target) { return; }
-        var lang = getHighlightLanguage(target);
-        if (!lang) {
-            // switchable without highlight (e.g. language-specific notes),
-            // don't munge
-            return;
-        }
-
-        // get generic setup code
-        var setup_selector = '.setupcode.highlight-' + lang + ' pre';
-        var setup = document.querySelector(setup_selector).textContent;
-
-        // prepend setup code to current snippet, get all of current snippet
-        // in case only part of it was selected. Ensure we don't get e.g.
-        // button text around snippet itself
-        var data = setup + '\n' + target.querySelector('pre').textContent;
-        // sane browsers & ZeroClipboard
-        e.clipboardData.setData('text/plain', data);
-        // MSIE
-        e.clipboardData.setData('Text', data);
-
-        // no preventDefault on ZC event
-        e.preventDefault && e.preventDefault();
-    }
     /**
      * @param {Node} node highlight node to get the language of
      * @returns {String|null} either the highlight language or null

doc/_themes/odoodoc/static/style.css

@@ -4076,7 +4076,7 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
   }
 }
 .navbar-default {
-  background-color: #ffffff;
+  background-color: white;
   border-color: 0;
 }
 .navbar-default .navbar-brand {
@@ -6663,49 +6663,43 @@ div.section > h2 {
 .admonition.exercise > .admonition-title {
   color: #555555;
 }
-/*
+.highlight {
- * Code snippets
+  position: relative;
- *
+  color: #333333;
- * Generated via Pygments
+  background: #eeeeee none !important;
- */
+  border: 1px solid #777777;
+  border-radius: 4px 0 4px 4px;
+  margin: 10px 0;
+}
 .highlight pre {
-  padding: 4px;
+  padding: 0;
+  margin: 10px;
   font-size: 75%;
   word-break: normal;
   word-wrap: normal;
+  background: none;
+  border: none;
 }
-.switchable .highlight.with-btn-clipboard pre {
+.highlight:hover .btn-show-setup {
-  padding-right: 50px;
+  display: block;
 }
-/*
+.highlight .btn-show-setup {
- * ZeroClipboard styles
+  display: none;
- */
-.highlight {
-  position: relative;
-}
-.btn-clipboard {
   position: absolute;
-  top: 0;
+  bottom: 100%;
   right: 0;
   z-index: 3;
-  display: block;
   padding: 5px 8px;
   font-size: 12px;
-  color: #777;
+  color: #777777;
   cursor: pointer;
-  background-color: #fff;
+  border: 1px solid #777777;
-  border: 1px solid #e1e1e8;
+  border-radius: 4px 4px 0 0;
-  border-radius: 0 4px 0 4px;
+  background: inherit;
 }
-.btn-clipboard:focus {
+.highlight .btn-show-setup:focus {
   outline: none;
 }
-.btn-clipboard.active {
-  background-color: #ffffad;
-  -webkit-transition: background-color 0.5s linear;
-  -o-transition: background-color 0.5s linear;
-  transition: background-color 0.5s linear;
-}
 img.align-center {
   display: block;
   margin: 0 auto;
@@ -6843,20 +6837,14 @@ td.field-body > ul {
     border-bottom-color: #777777;
     border-right-color: #777777;
   }
-  .stripe .section > .force-right pre,
-  .stripe .section > [class*=highlight] pre {
-    padding: 0;
-    margin: 10px;
-    background: none;
-    border: none;
-  }
   .stripe .section > .force-right .highlight,
   .stripe .section > [class*=highlight] .highlight {
     border-color: #555555;
     border-style: solid;
     border-width: 1px 0;
+    border-radius: 0;
     color: #cccccc;
-    background: none;
+    background: none !important;
     /* Line Numbers */
     /* Comment */
     /* Error */
@@ -7243,14 +7231,12 @@ td.field-body > ul {
   .stripe .highlight pre {
     white-space: pre-wrap;
   }
-  .stripe .btn-clipboard {
+  .stripe .btn-show-setup {
     background-color: transparent;
     color: #eeeeee;
     border-color: #777777;
-    border-top: none;
-    border-top-right-radius: 0;
   }
-  .stripe .btn-clipboard.active {
+  .stripe .btn-show-setup.active {
     background-color: #555555;
     -webkit-transition: background-color 0.5s linear;
     -o-transition: background-color 0.5s linear;

doc/_themes/odoodoc/static/style.less

@@ -465,50 +465,50 @@ div.section > h2 {
   }
 }
 
-/*
- * Code snippets
- *
- * Generated via Pygments
- */
-.highlight pre {
-  padding: 4px;
-  font-size: 75%;
-  // don't break lines within words
-  word-break: normal;
-  word-wrap: normal;
-}
-.switchable .highlight.with-btn-clipboard pre {
-  // avoid copy button overlapping with even long lines
-  padding-right: 50px;
-}
-
-/*
- * ZeroClipboard styles
- */
 .highlight {
   position: relative;
-}
-.btn-clipboard {
-  position: absolute;
-  top: 0;
-  right: 0;
-  z-index: 3;
-  display: block;
-  padding: 5px 8px;
-  font-size: 12px;
-  color: #777;
-  cursor: pointer;
-  background-color: #fff;
-  border: 1px solid #e1e1e8;
-  border-radius: 0 4px 0 4px;
 
-  &:focus {
+  // move styling from pre to highlight so can have multiple pre elements in
-    outline: none;
+  // a single "code block" for ease of adding and removing setup code &al
+  color: @gray-dark;
+  // force override of pygments yellow background background
+  background: @gray-lighter none !important;
+  border: 1px solid @gray-light;
+  border-radius: @border-radius-base 0 @border-radius-base @border-radius-base;
+  margin: 10px 0;
+
+  pre {
+    padding: 0;
+    margin: 10px;
+    font-size: 75%;
+    // don't break lines within words
+    word-break: normal;
+    word-wrap: normal;
+
+    background: none;
+    border: none;
   }
 
-  &.active {
+  &:hover .btn-show-setup {
-    background-color: #ffffad;
+    display: block;
-    .transition(background-color .5s linear);
+  }
+  .btn-show-setup {
+    display: none;
+    position: absolute;
+    bottom: 100%;
+    right: 0;
+    z-index: 3;
+    padding: 5px 8px;
+    font-size: 12px;
+    color: @gray-light;
+    cursor: pointer;
+    border: 1px solid @gray-light;
+    border-radius: @border-radius-base @border-radius-base 0 0;
+    background: inherit;
+
+    &:focus {
+      outline: none;
+    }
   }
 }
 
@@ -638,22 +638,14 @@ td.field-body {
         border-bottom-color: @separator-right;
         border-right-color: @separator-right;
       }
-      pre {
-        // padding leads to overflow scrollbar in safari for no reason I understand,
-        // margin does not have that issue
-        padding: 0;
-        margin: 10px;
-
-        background: none;
-        border: none;
-      }
       .highlight {
         border-color: @gray;
         border-style: solid;
         border-width: 1px 0;
+        border-radius: 0;
         // solarized-ish from https://gist.github.com/qguv/7936275
         color: @color-right-code;
-        background: none;
+        background: none !important;
         .lineno { color: #586e75 } /* Line Numbers */
         .c { color: #586e75 } /* Comment */
         .err { color: @color-right-code } /* Error */
@@ -761,12 +753,10 @@ td.field-body {
       white-space: pre-wrap;
     }
 
-    .btn-clipboard {
+    .btn-show-setup {
       background-color: transparent;
       color: @color-right;
       border-color: @separator-right;
-      border-top: none;
-      border-top-right-radius: 0;
 
       &.active {
         background-color: @gray;