adding support for different parameter types

This commit is contained in:
Jonathan Chan 2014-06-17 00:10:34 -04:00 committed by William DURAND
parent b124824a8d
commit 210596eae9
2 changed files with 81 additions and 5 deletions

View File

@ -101,6 +101,39 @@
});
{% if enableSandbox %}
var setParameterType = function ($context,setType) {
// no 2nd argument, use default from parameters
if (typeof setType == "undefined") {
setType = $context.parent().attr("data-dataType");
$context.val(setType);
}
$context.parent().find('.value').remove();
var placeholder = "";
if ($context.parent().attr("data-dataType") != "" && typeof $context.parent().attr("data-dataType") != "undefined") {
placeholder += "[" + $context.parent().attr("data-dataType") + "] ";
}
if ($context.parent().attr("data-format") != "" && typeof $context.parent().attr("data-format") != "undefined") {
placeholder += $context.parent().attr("data-dataType");
}
if ($context.parent().attr("data-description") != "" && typeof $context.parent().attr("data-description") != "undefined") {
placeholder += $context.parent().attr("data-description");
} else {
placeholder += "Value";
}
switch(setType) {
case "boolean":
$('<select class="value"><option value=""></option><option value="1">True</option><option value="0">False</option></select>').insertAfter($context);
break;
case "file":
$('<input type="file" class="value" placeholder="'+ placeholder +'">').insertAfter($context);
break;
default:
$('<input type="text" class="value" placeholder="'+ placeholder +'">').insertAfter($context);
}
};
var toggleButtonText = function ($btn) {
if ($btn.text() === 'Default') {
$btn.text('Raw');
@ -369,8 +402,30 @@
e.preventDefault();
});
$('.pane.sandbox').on('click', '.add', function() {
var html = $(this).parents('.pane').find('.tuple_template').html();
// sets the correct parameter type on load
$('.pane.sandbox .tuple_type').each(function() {
setParameterType($(this));
});
// handles parameter type change
$('.pane.sandbox').on('change', '.tuple_type', function() {
setParameterType($(this),$(this).val());
});
$('.pane.sandbox').on('click', '.add_parameter', function() {
var html = $(this).parents('.pane').find('.parameters_tuple_template').html();
$(this).before(html);
return false;
});
$('.pane.sandbox').on('click', '.add_header', function() {
var html = $(this).parents('.pane').find('.headers_tuple_template').html();
$(this).before(html);

View File

@ -228,14 +228,20 @@
<h4>Parameters</h4>
{% for name, infos in data.parameters %}
{% if not infos.readonly %}
<p class="tuple">
<p class="tuple" data-dataType="{% if infos.dataType %}{{ infos.dataType }}{% endif %}" data-format="{% if infos.format %}{{ infos.format }}{% endif %}" data-description="{% if infos.description %}{{ infos.description }}{% endif %}">
<input type="text" class="key" value="{{ name }}" placeholder="Key" />
<span>=</span>
<select class="tuple_type">
<option value="">Type</option>
<option value="string">String</option>
<option value="boolean">Boolean</option>
<option value="file">File</option>
</select>
<input type="text" class="value" placeholder="{% if infos.dataType %}[{{ infos.dataType }}] {% endif %}{% if infos.format %}{{ infos.format }}{% endif %}{% if infos.description %}{{ infos.description }}{% else %}Value{% endif %}" {% if infos.default is defined %} value="{{ infos.default }}" {% endif %}/> <span class="remove">-</span>
</p>
{% endif %}
{% endfor %}
<button type="button" class="add">New parameter</button>
<button class="add_parameter">New parameter</button>
{% endif %}
</fieldset>
@ -257,7 +263,7 @@
<input type="text" class="value" placeholder="Value" /> <span class="remove">-</span>
</p>
<button type="button" class="add">New header</button>
<button type="button" class="add_header">New header</button>
</fieldset>
<fieldset class="request-content">
@ -282,10 +288,25 @@
<p class="tuple">
<input type="text" class="key" placeholder="Key" />
<span>=</span>
<select class="tuple_type">
<option value="">Type</option>
<option value="string">String</option>
<option value="boolean">Boolean</option>
<option value="file">File</option>
</select>
<input type="text" class="value" placeholder="Value" /> <span class="remove">-</span>
</p>
</script>
<script type="text/x-tmpl" class="headers_tuple_template">
<p class="tuple">
<input type="text" class="key" placeholder="Key" />
<span>=</span>
<input type="text" class="value" placeholder="Value" /> <span class="remove">-</span>
</p>
</script>
<div class="result">
<h4>Request URL</h4>
<pre class="url"></pre>