diff options
Diffstat (limited to 'tools/ws.htm')
| -rw-r--r-- | tools/ws.htm | 251 |
1 files changed, 139 insertions, 112 deletions
diff --git a/tools/ws.htm b/tools/ws.htm index f77d9ba59..1c55b59cb 100644 --- a/tools/ws.htm +++ b/tools/ws.htm @@ -1,20 +1,18 @@ <!DOCTYPE html> -<html xmlns="http://www.w3.org/1999/xhtml" lang="en" dir="ltr"> +<html lang="en" dir="ltr"> <head> - <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> + <meta charset="utf-8"> <title>Piwigo web API (web-services) explorer</title> - - <link rel="stylesheet" type="text/css" href="http://cdn.jsdelivr.net/tiptip/1.3/tipTip.css"> - <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script> - <script type="text/javascript" src="https://cdn.jsdelivr.net/tiptip/1.3/jquery.tipTip.minified.js"></script> - - <style type="text/css"> + + <link rel="stylesheet" href="http://cdn.jsdelivr.net/tiptip/1.3/tipTip.css"> + + <style> /* BEGIN CSS RESET http://meyerweb.com/eric/tools/css/reset v2.0 | 20110126 | License: none (public domain) */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, - fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, + fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline;} @@ -28,29 +26,25 @@ html {font-family:"Corbel","Lucida Grande","Verdana",sans-serif;color:#222;font-size:13px;} a {color:#247EBF;text-decoration:none;} - a:hover {color:#EB9C39;border-bottom-width:1px;border-style:dotted; - text-shadow:1px 1px 0 #ddd;-moz-text-shadow:1px 1px 0 #ddd;-webkit-text-shadow:1px 1px 0 #ddd; - } + a:hover {color:#EB9C39;border-bottom-width:1px;border-style:dotted;text-shadow:1px 1px 0 #ddd;} + blockquote {border:1px solid #cdcdcd;background:#F9F9F9;padding:8px;} hr {margin:10px 30px;color:#fff;} ul {margin-left:25px;} p {margin:8px 0;} - h1 {color:#fff;font-size:26px;padding:10px 15px; - text-shadow:1px 1px 0 #999;-moz-text-shadow:1px 1px 0 #999;-webkit-text-shadow:1px 1px 0 #999; - background:#45484d;background:-moz-linear-gradient(top, #45484d 0%, #333333 100%);background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#45484d), color-stop(100%,#333333));background:-webkit-linear-gradient(top, #45484d 0%,#333333 100%);background:-o-linear-gradient(top, #45484d 0%,#333333 100%);background:-ms-linear-gradient(top, #45484d 0%,#333333 100%);background:linear-gradient(to bottom, #45484d 0%,#333333 100%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#45484d', endColorstr='#333333',GradientType=0 ); + h1 {color:#fff;font-size:26px;padding:10px 15px;text-shadow:1px 1px 0 #999; + background:#45484d;background:linear-gradient(to bottom, #45484d 0%,#333333 100%); } - h2 {color:#fff;font-size:20px;padding:5px 10px; - text-shadow:1px 1px 0 #555;-moz-text-shadow:1px 1px 0 #555;-webkit-text-shadow:1px 1px 0 #555; - background:#f2a841;background:-moz-linear-gradient(top, #f2a841 0%, #ef6b13 100%);background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2a841), color-stop(100%,#ef6b13));background:-webkit-linear-gradient(top, #f2a841 0%,#ef6b13 100%);background:-o-linear-gradient(top, #f2a841 0%,#ef6b13 100%);background:-ms-linear-gradient(top, #f2a841 0%,#ef6b13 100%);background:linear-gradient(to bottom, #f2a841 0%,#ef6b13 100%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2a841', endColorstr='#ef6b13',GradientType=0 ); + h2 {color:#fff;font-size:20px;padding:5px 10px;text-shadow:1px 1px 0 #555; + background:#f2a841;background:linear-gradient(to bottom, #f2a841 0%,#ef6b13 100%); } h2#errorWrapper {color:#F42C00;font-weight:normal; - background:#eaeaea;background:-moz-linear-gradient(top, #eaeaea 0%, #afafaf 100%);background:-webkit-gradient(linear, lefttop, leftbottom, color-stop(0%,#eaeaea), color-stop(100%,#afafaf));background:-webkit-linear-gradient(top, #eaeaea 0%, #afafaf 100%);background:-o-linear-gradient(top, #eaeaea 0%, #afafaf 100%);background:-ms-linear-gradient(top, #eaeaea 0%, #afafaf 100%);background:linear-gradient(tobottom, #eaeaea 0%, #afafaf 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#eaeaea', endColorstr='#afafaf', GradientType=0); + background:#eaeaea;background:linear-gradient(to bottom, #eaeaea 0%, #afafaf 100%); } h3 {display:inline-block;padding:5px 10px;color:#555;font-weight:bold;text-align:center; - border-radius:8px 8px 0 0;-moz-border-radius:8px 8px 0 0;-webkit-border-radius:8px 8px 0 0; - text-shadow:1px 1px 0 #bbb;-moz-text-shadow:1px 1px 0 #bbb;-webkit-text-shadow:1px 1px 0 #bbb; - background:#f2f2f2;background:-moz-linear-gradient(top, #f2f2f2 0%, #cecece 100%);background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f2f2), color-stop(100%,#cecece));background:-webkit-linear-gradient(top, #f2f2f2 0%,#cecece 100%);background:-o-linear-gradient(top, #f2f2f2 0%,#cecece 100%);background:-ms-linear-gradient(top, #f2f2f2 0%,#cecece 100%);background:linear-gradient(to bottom, #f2f2f2 0%,#cecece 100%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#cecece',GradientType=0 ); + border-radius:8px 8px 0 0;text-shadow:1px 1px 0 #bbb; + background:#f2f2f2;background:linear-gradient(to bottom, #f2f2f2 0%,#cecece 100%); } #the_header {border-bottom:1px solid #cdcdcd;margin-bottom:1px;} @@ -59,14 +53,14 @@ #the_methods {width:250px;float:left;border-style:solid;border-color:#cdcdcd;border-width:1px 1px 0 0; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAADCAIAAADZSiLoAAAAH0lEQVQImSXHMQEAMAwCMOrfK0jIjuVL2gLBzyHJtgd7wBdU3Vt/7AAAAABJRU5ErkJggg==); } - #the_methods ul {font-size:1.1em;margin:5px 0 10px 10px;list-style:none;} - #the_methods li:before {content:"\203A\00A0";font-weight:bold;color:#EB9C39;font-size:1.1em;} - #the_methods li:hover:before {content:"\00A0\203A";} + #methodsList {font-size:1.1em;margin:5px 0 10px 10px;list-style:none;} + #methodsList li:before {content:"\203A\00A0";font-weight:bold;color:#EB9C39;font-size:1.1em;} + #methodsList li:hover:before {content:"\00A0\203A";} #the_page {margin-left:252px;border-style:solid;border-color:#cdcdcd;border-width:1px 0 0 1px;} #the_content {padding:10px;} - #methodParams {display:inline-block;} + #methodParams {margin-right:230px;} #methodParams thead td {background:#DEE3E9;font-weight:bold;padding:2px 5px;} #methodParams td {padding:2px;border:1px solid #cdcdcd;vertical-align:middle;} #methodParams tbody tr:nth-child(even) {background:#f7f7f7;} @@ -74,36 +68,39 @@ #methodParams td.mini {width:0px;text-align:center;} #methodParams tfoot {font-size:0.95em;} #methodParams td.input {text-align:center;} - #methodParams td.input input[type="text"] {width:97%;font-size:0.9em;background:#f7f7f7;border:1px solid #ccc; - border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px; - } + #methodParams td.input input[type="text"] {width:97%;font-size:0.9em;background:#f7f7f7;border:1px solid #ccc;border-radius:2px;} #methodParams td.input input[type="text"]:hover, #methodParams td.input input[type="text"]:focus {border-color:#C7E2F1;border-top-color:#96BCD7;background:#fff;} + #methodParams .type {display:inline-block;width:16px;height:16px;font-size:12px;line-height:16px;background:#ddd;border-radius:8px;font-weight:bold;text-align:center;color:#222;} + #methodParams .subtype {vertical-align:super;} - #testForm {display:inline-block;margin-left:15px;} + #testForm {float:right;} #testForm td {padding:2px 0;} #testForm tr:last-child td {padding:8px 0 5px 0;} #testForm blockquote {width:200px;} - + #introMessage {font-size:1.1em;} #urlForm {margin-bottom:10px;} a.button {color:#fff;padding:3px 8px;border:1px solid #91bb5c;font-size:0.9em;margin-right:3px;display:inline-block; - border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px; - text-shadow:1px 1px 0 #666;-moz-text-shadow:1px 1px 0 #666;-webkit-text-shadow:1px 1px 0 #666; - background:#84bb3c;background:-moz-linear-gradient(top, #84bb3c 0%, #3f5a1d 100%);background:-webkit-gradient(linear, lefttop, leftbottom, color-stop(0%,#84bb3c), color-stop(100%,#3f5a1d));background:-webkit-linear-gradient(top, #84bb3c 0%, #3f5a1d 100%);background:-o-linear-gradient(top, #84bb3c 0%, #3f5a1d 100%);background:-ms-linear-gradient(top, #84bb3c 0%, #3f5a1d 100%);background:linear-gradient(tobottom, #84bb3c 0%, #3f5a1d 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#84bb3c', endColorstr='#3f5a1d', GradientType=0); + border-radius:5px;text-shadow:1px 1px 0 #666; + background:#84bb3c;background:linear-gradient(to bottom, #84bb3c 0%, #3f5a1d 100%); } a.button:hover {color:#E5FF00;} - + .methodInfo {float:right;display:inline-block;width:16px;height:16px;font-size:12px;line-height:16px;background:#555;border-radius:8px;font-family:"Times New Roman",sans-serif;font-style:italic;font-weight:bold;text-align:center;color:#fff;} .methodInfo:hover {border:none;text-shadow:none;background:#888;cursor:pointer;color:#fff;} - + #tiptip_content { font-size:12px; } + #iframeWrapper {width:100%;height:300px;padding:3px 3px 20px 3px;background:#F9F9F9;border:1px solid #cdcdcd;overflow:hidden;position:relative;} iframe {width:100%;height:100%;background:#fff;} + + div.onlys {background:#faa;color:#fff;border:1px solid #f22;padding:.25em .5em;display:table;border-radius:4px;margin-bottom:0.5em;} </style> - + </head> <body> +<a name="top"></a> <div id="the_header"> <h1>Piwigo web API (web-services) explorer</h1> @@ -111,7 +108,7 @@ <div id="the_methods"> <h2>Available methods</h2> - + <ul id="methodsList"> </ul> </div> <!-- the_methods --> @@ -119,13 +116,13 @@ <div id="the_page"> <h2 id="methodName" style="display:none;"></h2> <h2 id="errorWrapper" style="display:none;"></h2> - + <div id="the_content"> <form id="urlForm" style="display:none;"> <input type="text" name="ws_url" size="60"> <input type="submit" value="Go!"> </form> - + <blockquote id="introMessage"> <p> <b>API = Application Programming Interface.</b><br> @@ -156,30 +153,7 @@ </blockquote> <br> </div> <!-- methodDescription --> - - <div id="methodParams"> - <h3>Method parameters</h3> - <table> - <thead> - <tr> - <td style="width:150px;">Name</td> - <td class="mini">Extra</td> - <td style="width:300px;">Value</td> - <td class="mini">Send</td> - </tr> - </thead> - - <tbody> - </tbody> - - <tfoot> - <tr> - <td colspan="4"><b>*</b>: required parameter, <b>?</b>: optional parameter, <b>[]</b>: parameter can be an array (use a pipe | to split values)</td> - </tr> - </tfoot> - </table> - </div> <!-- methodParams --> - + <div id="testForm"> <h3>Test</h3> <blockquote> @@ -188,7 +162,7 @@ <td>Request format :</td> <td> <select id="requestFormat"> - <option value="get" selected="selected">GET</option> + <option value="get" selected>GET</option> <option value="post">POST</option> </select> </td> @@ -197,7 +171,7 @@ <td>Response format :</td> <td> <select id="responseFormat"> - <option value="rest" selected="selected">REST (xml)</option> + <option value="rest" selected>REST (xml)</option> <option value="json">JSON</option> <option value="php">PHP serial</option> <option value="xmlrpc">XML RPC</option> @@ -213,20 +187,48 @@ </table> </blockquote> </div> <!-- testForm --> - + + <div id="methodParams"> + <h3>Method parameters</h3> + <table> + <thead> + <tr> + <td style="width:150px;">Name</td> + <td class="mini">Extra</td> + <td class="mini">Type</td> + <td style="width:300px;">Value</td> + <td class="mini">Send</td> + </tr> + </thead> + + <tbody> + </tbody> + + <tfoot> + <tr> + <td colspan="5"> + <b>*</b>: required, <b>?</b>: optional, <b>[]</b>: can be an array (use a pipe | to split values)<br> + <b>B</b>: boolean, <b>I</b>: integer, <b>F</b>: float, <b>+</b>: positive, <b>ø</b>: not null + </td> + </tr> + </tfoot> + </table> + </div> <!-- methodParams --> + <br><br> - + <h3>Result</h3> <div id="iframeWrapper"> <iframe src="" id="invokeFrame" name="invokeFrame"></iframe> - <a href="#bottom" id="increaseIframe"><b>↓</b> increase height</a> • <a href="#bottom" id="decreaseIframe"><b>↑</b> decrease height</a> - <a name="bottom"></a> + <a href="#iframe-bottom" id="increaseIframe"><b>↓</b> increase height</a> • + <a href="#iframe-bottom" id="decreaseIframe"><b>↑</b> decrease height</a> + <a name="iframe-bottom"></a> </div> </form> <!-- iframeWrapper --> - + <!-- hidden form for POST submition --> <form method="post" action="" target="" id="invokeForm" style="display:none;"></form> - + </div> <!-- the_content --> </div> <!-- the_page --> @@ -235,8 +237,10 @@ Copyright © 2002-2013 <a href="http://piwigo.org">Piwigo Team</a> </div> <!-- the_footer --> +<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> +<script src="https://cdn.jsdelivr.net/tiptip/1.3/jquery.tipTip.minified.js"></script> -<script type="text/javascript"> +<script> // global vars var cachedMethods = new Array; var ws_url = "http://"; @@ -286,6 +290,7 @@ function resetDisplay() { $("#methodWrapper").hide(); $("#methodName").hide(); $("#urlForm").hide(); + $("#methodDescription blockquote").empty(); $("#methodDescription").hide(); $("#invokeFrame").attr('src',''); } @@ -295,10 +300,10 @@ function adaptHeight() { $("#the_page").css('height', 'auto'); $("#the_methods").css('height', 'auto'); - + min_h = $(window).height()-$("#the_header").outerHeight()-$("#the_footer").outerHeight()-3; h = Math.max(min_h, Math.max($("#the_methods").height(), $("#the_page").height())); - + $("#the_page").css('height', h); $("#the_methods").css('height', h); } @@ -312,11 +317,11 @@ function displayError(error) { // display ws_url form function askForUrl() { + displayError("can't contact web-services, please give absolute url to 'ws.php'"); if ($("#urlForm input[name='ws_url']").val() == "") { $("#urlForm input[name='ws_url']").val(ws_url); } $("#urlForm").show(); - displayError("can't contact web-services, please give absolute url to 'ws.php'"); } // parse Piwigo JSON @@ -331,37 +336,36 @@ function parsePwgJSON(json) { displayError("unable to parse JSON string"); resp = {"stat": "ko", "result": "null"}; } - + return resp.result; } // fetch methods list function getMethodList() { resetDisplay(); - + $.ajax({ type: "GET", url: ws_url, data: { format: "json", method: "reflection.getMethodList" } }).done(function(result) { result = parsePwgJSON(result); - + if (result!=null) { methods = result.methods; - + var ml = ''; for (var i=0; i<methods.length; i++) { - ml += '<li><a href="#">'+ methods[i]+'</a></li>'; + ml += '<li><a href="#top">'+ methods[i]+'</a></li>'; } $("#methodsList").html(ml).show(); - + adaptHeight(); - + // trigger method selection $("#methodsList li a").click(function() { selectMethod($(this).html()); - return false; }); } }).error(function(jqXHR, textStatus, errorThrown) { @@ -372,7 +376,8 @@ function getMethodList() { // select method function selectMethod(methodName) { $("#introMessage").hide(); - + $("#tiptip_holder").fadeOut(200); + if (cachedMethods[ methodName ]) { fillNewMethod(methodName); } @@ -381,10 +386,22 @@ function selectMethod(methodName) { type: "GET", url: ws_url, data: { format: "json", method: "reflection.getMethodDetails", methodName: methodName } - }).done(function(result) { + }).done(function(result) { result = parsePwgJSON(result); - + if (result!=null) { + if (result.options.post_only || result.options.admin_only) { + var onlys = '<div class="onlys">'; + if (result.options.post_only) { + onlys+= 'POST only. '; + } + if (result.options.admin_only) { + onlys+= 'Admin only. '; + } + onlys+= '</div>'; + + result.description = onlys + result.description; + } cachedMethods[ methodName ] = result; fillNewMethod(methodName); } @@ -397,32 +414,43 @@ function selectMethod(methodName) { // display method details function fillNewMethod(methodName) { resetDisplay(); - + method = cachedMethods[ methodName ]; - + $("#methodName").html(method.name).show(); - + if (method.description != "") { $("#methodDescription blockquote").html(method.description); $("#methodDescription").show(); } - + + $("#requestFormat").val(method.options.post_only ? 'post' : 'get'); + var methodParams = ''; if (method.params && method.params.length>0) { for (var i=0; i<method.params.length; i++) { - var isOptional = method.params[i].optional; - var acceptArray = method.params[i].acceptArray; - var defaultValue = method.params[i].defaultValue == null ? '' : method.params[i].defaultValue; - var info = method.params[i].info == null ? '' : '<a class="methodInfo" title="'+ method.params[i].info + '">i</a>'; - + var param = method.params[i], + isOptional = param.optional, + acceptArray = param.acceptArray, + defaultValue = param.defaultValue == null ? '' : param.defaultValue, + info = param.info == null ? '' : '<a class="methodInfo" title="'+ param.info.replace(/"/g, '"') + '">i</a>', + type = ''; + + if (param.type.match(/bool/)) type+= '<span class=type>B</span>'; + if (param.type.match(/int/)) type+= '<span class=type>I</span>'; + if (param.type.match(/float/)) type+= '<span class=type>F</span>'; + if (param.type.match(/positive/)) type+= '<span class=subtype>+</span>'; + if (param.type.match(/notnull/)) type+= '<span class=subtype>ø</span>'; + // if an array is direclty printed, the delimiter is a comma where we use a pipe if (typeof defaultValue == 'object') { defaultValue = defaultValue.join('|'); } methodParams+= '<tr>'+ - '<td>'+ method.params[i].name + info +'</td>'+ + '<td>'+ param.name + info +'</td>'+ '<td class="mini">'+ (isOptional ? '?':'*') + (acceptArray ? ' []':'') +'</td>'+ + '<td class="mini">'+ type +'</td>'+ '<td class="input"><input type="text" class="methodParameterValue" data-id="'+ i +'" value="'+ defaultValue +'"></td>'+ '<td class="mini"><input type="checkbox" class="methodParameterSend" data-id="'+ i +'" '+ (isOptional ? '':'checked="checked"') +'></td>'+ '</tr>'; @@ -431,20 +459,19 @@ function fillNewMethod(methodName) { else { methodParams = '<tr><td colspan="4">This method takes no parameters</td></tr>'; } - + $("#methodParams tbody").html(methodParams); - $("#methodWrapper").show(); - + $("#methodWrapper").show(); + adaptHeight(); - + // trigger field modification $("input.methodParameterValue").change(function() { $("input.methodParameterSend[data-id='"+ $(this).data('id') +"']").attr('checked', 'checked'); }); - + // tiptip $(".methodInfo").tipTip({ - activation:"click", maxWidth:"300px", defaultPosition:"right", delay:0 @@ -456,18 +483,18 @@ function invokeMethod(methodName, newWindow) { var method = cachedMethods[ methodName ]; var reqUrl = ws_url +"?format="+ $("#responseFormat").val(); - + // GET if ($("#requestFormat").val() == 'get') { reqUrl+= "&method="+ methodName; - + for (var i=0; i<method.params.length; i++) { if (! $("input.methodParameterSend[data-id='"+ i +"']").is(":checked")) { continue; } var paramValue = $("input.methodParameterValue[data-id='"+ i +"']").val(); - + var paramSplitted = paramValue.split('|'); if (method.params[i].acceptArray && paramSplitted.length > 1) { $.each(paramSplitted, function(v) { @@ -478,7 +505,7 @@ function invokeMethod(methodName, newWindow) { reqUrl+= '&'+ method.params[i].name +'='+ paramValue; } } - + if (newWindow) { window.open(reqUrl); } @@ -490,9 +517,9 @@ function invokeMethod(methodName, newWindow) { else { var form = $("#invokeForm"); form.attr('action', reqUrl); - + var t = '<input type="hidden" name="method" value="'+ methodName +'">'; - + for (var i=0; i<method.params.length; i++) { if (! $("input.methodParameterSend[data-id='"+ i +"']").is(":checked")) { continue; @@ -510,15 +537,15 @@ function invokeMethod(methodName, newWindow) { t+= '<input type="hidden" name="'+ method.params[i].name +'" value="'+ paramValue +'">'; } } - + form.html(t); form.attr('target', newWindow ? "_blank" : "invokeFrame"); form.submit(); } - + return false; } </script> </body> -</html> +</html>
\ No newline at end of file |