|
@@ -25,194 +25,176 @@ ${ commonheader(_('Query'), app_name, user) | n,unicode }
|
|
|
${ common.navbar('editor') }
|
|
${ common.navbar('editor') }
|
|
|
|
|
|
|
|
<div class="container-fluid">
|
|
<div class="container-fluid">
|
|
|
|
|
+
|
|
|
<div class="row-fluid">
|
|
<div class="row-fluid">
|
|
|
<div class="card card-small">
|
|
<div class="card card-small">
|
|
|
- <ul class="nav nav-pills hueBreadcrumbBar" id="breadcrumbs">
|
|
|
|
|
- <li>
|
|
|
|
|
- <div style="display: inline" class="dropdown">
|
|
|
|
|
- ${_('App name')}
|
|
|
|
|
- <!-- ko if: $root.appNames().length == 0 -->
|
|
|
|
|
- <a class="uploadAppModalBtn" href="javascript:void(0);">
|
|
|
|
|
- ${ _("Missing, add one?") }
|
|
|
|
|
- </a>
|
|
|
|
|
- <!-- /ko -->
|
|
|
|
|
- <a data-bind="if: $root.appName" data-toggle="dropdown" href="javascript:void(0);">
|
|
|
|
|
- <strong data-bind="text: $root.appName().nice_name"></strong>
|
|
|
|
|
- <i class="fa fa-caret-down"></i>
|
|
|
|
|
- </a>
|
|
|
|
|
- <ul data-bind="foreach: $root.appNames" class="dropdown-menu">
|
|
|
|
|
- <li data-bind="click: $root.chooseAppName, text: nice_name" class="selectable"></li>
|
|
|
|
|
- </ul>
|
|
|
|
|
- </div>
|
|
|
|
|
- </li>
|
|
|
|
|
- <li> </li>
|
|
|
|
|
- <li>
|
|
|
|
|
- ${_('Class path')}
|
|
|
|
|
- <input type="text" data-bind="value: $root.classPath" class="input-xlarge" placeholder="spark.jobserver.WordCountExample"></input>
|
|
|
|
|
- </li>
|
|
|
|
|
- <li> </li>
|
|
|
|
|
- <li>
|
|
|
|
|
- <div style="display: inline" class="dropdown">
|
|
|
|
|
- ${_('Context')}
|
|
|
|
|
- <input type="checkbox" data-bind="checked: $root.autoContext" />
|
|
|
|
|
- <span data-bind="visible: $root.autoContext">
|
|
|
|
|
- ${ _('auto') }
|
|
|
|
|
- </span>
|
|
|
|
|
-
|
|
|
|
|
- <span data-bind="visible: ! $root.autoContext()">
|
|
|
|
|
- <!-- ko if: $root.contexts().length == 0 -->
|
|
|
|
|
- <a class="createContextModalBtn" href="javascript:void(0);">
|
|
|
|
|
- ${ _("Create one?") }
|
|
|
|
|
- </a>
|
|
|
|
|
- <!-- /ko -->
|
|
|
|
|
- <a data-bind="if: $root.context" data-toggle="dropdown" href="javascript:void(0);">
|
|
|
|
|
- <strong data-bind="text: $root.context().nice_name"></strong>
|
|
|
|
|
- <i class="fa fa-caret-down"></i>
|
|
|
|
|
- </a>
|
|
|
|
|
- <ul data-bind="foreach: $root.contexts" class="dropdown-menu">
|
|
|
|
|
- <li data-bind="click: $root.chooseContext, text: nice_name" class="selectable"></li>
|
|
|
|
|
- </ul>
|
|
|
|
|
- </span>
|
|
|
|
|
- </div>
|
|
|
|
|
- </li>
|
|
|
|
|
- % if can_edit_name:
|
|
|
|
|
- <li style="padding-left:50px">
|
|
|
|
|
- ${ _("Script") }
|
|
|
|
|
|
|
+ <div style="margin-bottom: 10px">
|
|
|
|
|
+ <h1 class="card-heading simple">
|
|
|
<a href="javascript:void(0);"
|
|
<a href="javascript:void(0);"
|
|
|
id="query-name"
|
|
id="query-name"
|
|
|
data-type="text"
|
|
data-type="text"
|
|
|
data-name="name"
|
|
data-name="name"
|
|
|
data-value="${design.name}"
|
|
data-value="${design.name}"
|
|
|
- data-original-title="${ _('Script name') }"
|
|
|
|
|
|
|
+ data-original-title="${ _('App name') }"
|
|
|
data-placement="right">
|
|
data-placement="right">
|
|
|
</a>
|
|
</a>
|
|
|
- <a href="javascript:void(0);"
|
|
|
|
|
|
|
+ </h1>
|
|
|
|
|
+ % if can_edit_name:
|
|
|
|
|
+ <p style="margin-left: 20px">
|
|
|
|
|
+ <a href="javascript:void(0);"
|
|
|
id="query-description"
|
|
id="query-description"
|
|
|
data-type="textarea"
|
|
data-type="textarea"
|
|
|
data-name="description"
|
|
data-name="description"
|
|
|
data-value="${design.desc}"
|
|
data-value="${design.desc}"
|
|
|
- data-original-title="${ _('Script description') }"
|
|
|
|
|
|
|
+ data-original-title="${ _('App description') }"
|
|
|
data-placement="right">
|
|
data-placement="right">
|
|
|
</a>
|
|
</a>
|
|
|
- </p>
|
|
|
|
|
- </li>
|
|
|
|
|
- %endif
|
|
|
|
|
-
|
|
|
|
|
- <span class="pull-right">
|
|
|
|
|
- <button type="button" class="btn btn-primary uploadAppModalBtn">${ _('Upload app') }</button>
|
|
|
|
|
- <button type="button" class="btn btn-primary createContextModalBtn">${ _('Create context') }</button>
|
|
|
|
|
- </span>
|
|
|
|
|
- </ul>
|
|
|
|
|
- </div>
|
|
|
|
|
- </div>
|
|
|
|
|
|
|
+ </p>
|
|
|
|
|
+ % endif
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div class="card-body">
|
|
|
|
|
+ <p>
|
|
|
|
|
+ <span class="pull-right">
|
|
|
|
|
+ <button type="button" class="btn btn-primary uploadAppModalBtn">${ _('Upload app') }</button>
|
|
|
|
|
+ <button type="button" class="btn btn-primary createContextModalBtn">${ _('Create context') }</button>
|
|
|
|
|
+ </span>
|
|
|
|
|
+ <form class="form-inline">
|
|
|
|
|
+ <span class="dropdown">
|
|
|
|
|
+ ${_('App name')}
|
|
|
|
|
+ <!-- ko if: $root.appNames().length == 0 -->
|
|
|
|
|
+ <a class="uploadAppModalBtn" href="javascript:void(0);">
|
|
|
|
|
+ ${ _("Missing, add one?") }
|
|
|
|
|
+ </a>
|
|
|
|
|
+ <!-- /ko -->
|
|
|
|
|
+ <a data-bind="if: $root.appName" data-toggle="dropdown" href="javascript:void(0);"><strong data-bind="text: $root.appName().nice_name"></strong>
|
|
|
|
|
+ <i class="fa fa-caret-down"></i></a>
|
|
|
|
|
+ <ul data-bind="foreach: $root.appNames" class="dropdown-menu">
|
|
|
|
|
+ <li data-bind="click: $root.chooseAppName, text: nice_name" class="selectable"></li>
|
|
|
|
|
+ </ul>
|
|
|
|
|
+ </span>
|
|
|
|
|
|
|
|
- <div class="row-fluid">
|
|
|
|
|
- <div class="span12">
|
|
|
|
|
- <div id="query">
|
|
|
|
|
- <div class="card card-small">
|
|
|
|
|
-
|
|
|
|
|
- <div class="card-body">
|
|
|
|
|
- <div class="tab-content">
|
|
|
|
|
- <div id="queryPane">
|
|
|
|
|
-
|
|
|
|
|
- <div data-bind="css: {'hide': query.errors().length == 0}" class="hide alert alert-error">
|
|
|
|
|
- <p><strong>${_('Your query has the following error(s):')}</strong></p>
|
|
|
|
|
- <div data-bind="foreach: query.errors">
|
|
|
|
|
- <p data-bind="text: $data" class="queryErrorMessage"></p>
|
|
|
|
|
- </div>
|
|
|
|
|
- </div>
|
|
|
|
|
|
|
+ <label style="margin-left: 20px; margin-right: 20px">
|
|
|
|
|
+ ${_('Class path')}
|
|
|
|
|
+ <input type="text" data-bind="value: $root.classPath" class="input-xlarge" placeholder="spark.jobserver.WordCountExample" />
|
|
|
|
|
+ </label>
|
|
|
|
|
|
|
|
- <div class="control-group">
|
|
|
|
|
- <label class="control-label" style="padding-right:50px">${ _('Parameters') }</label>
|
|
|
|
|
- <div class="controls">
|
|
|
|
|
- <table class="table-condensed">
|
|
|
|
|
- <thead data-bind="visible: query.params().length > 0">
|
|
|
|
|
- <tr>
|
|
|
|
|
- <th>${ _('Name') }</th>
|
|
|
|
|
- <th>${ _('Value') }</th>
|
|
|
|
|
- <th/>
|
|
|
|
|
- </tr>
|
|
|
|
|
- </thead>
|
|
|
|
|
- <tbody data-bind="foreach: query.params">
|
|
|
|
|
- <tr>
|
|
|
|
|
- <td><input type="text" class="span6 required propKey" data-bind="value: name" /></td>
|
|
|
|
|
- <td><input type="text" class="span6 required pathChooserKo" data-bind="fileChooser: $data, value: value" /></td>
|
|
|
|
|
- <td>
|
|
|
|
|
- <a class="btn" href="#" data-bind="click: $root.removeParam">${ _('Delete') }</a>
|
|
|
|
|
- </td>
|
|
|
|
|
- </tr>
|
|
|
|
|
- </tbody>
|
|
|
|
|
- </table>
|
|
|
|
|
- <button class="btn" data-bind="click: $root.addParam">${ _('Add') }</button>
|
|
|
|
|
- </div>
|
|
|
|
|
- </div>
|
|
|
|
|
- </div>
|
|
|
|
|
|
|
+ ${_('Context')}
|
|
|
|
|
+ <label class="radio" style="margin-left: 5px;margin-top:-2px">
|
|
|
|
|
+ ${ _('Automatic') }
|
|
|
|
|
+ <input type="radio" name="autoContext" value="true" data-bind="checked:$root.autoContext.forEditing" />
|
|
|
|
|
+ </label>
|
|
|
|
|
+ <label class="radio" style="margin-left: 5px;margin-top:-2px">
|
|
|
|
|
+ <span class="dropdown" style="padding-left: 5px">
|
|
|
|
|
+ <!-- ko if: $root.contexts().length == 0 -->
|
|
|
|
|
+ <a class="createContextModalBtn" href="javascript:void(0);">
|
|
|
|
|
+ ${ _("Create one?") }
|
|
|
|
|
+ </a>
|
|
|
|
|
+ <!-- /ko -->
|
|
|
|
|
+ <a data-bind="if: $root.context" data-toggle="dropdown" href="javascript:void(0);">
|
|
|
|
|
+ <strong data-bind="text: $root.context().nice_name"></strong>
|
|
|
|
|
+ <i class="fa fa-caret-down"></i>
|
|
|
|
|
+ </a>
|
|
|
|
|
+ <ul data-bind="foreach: $root.contexts" class="dropdown-menu">
|
|
|
|
|
+ <li data-bind="click: $root.chooseContext, text: nice_name" class="selectable"></li>
|
|
|
|
|
+ </ul>
|
|
|
|
|
+ </span>
|
|
|
|
|
+ <input type="radio" name="autoContext" value="false" data-bind="checked:$root.autoContext.forEditing"/>
|
|
|
|
|
+ </label>
|
|
|
|
|
+ </form>
|
|
|
|
|
+ </p>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
|
|
+
|
|
|
<div class="row-fluid">
|
|
<div class="row-fluid">
|
|
|
- <div class="span12">
|
|
|
|
|
<div class="card card-small">
|
|
<div class="card card-small">
|
|
|
- <div class="actions">
|
|
|
|
|
- <button data-bind="click: tryExecuteQuery, enable: $root.appNames().length > 0 && $root.classPath()"
|
|
|
|
|
- type="button" id="executeQuery" class="btn btn-primary disable-feedback"
|
|
|
|
|
- tabindex="2" data-loading-text="${ _("Executing...") }">
|
|
|
|
|
- ${_('Execute')}
|
|
|
|
|
- </button>
|
|
|
|
|
- <button data-bind="click: trySaveQuery, css: {'hide': !$root.query.id() || $root.query.id() == -1}" type="button" class="btn hide">${_('Save')}</button>
|
|
|
|
|
- <button data-bind="click: trySaveAsQuery" type="button" class="btn">${_('Save as...')}</button>
|
|
|
|
|
- ${_('or create a')} <a type="button" class="btn" href="${ url('spark:editor') }">${_('New query')}</a>
|
|
|
|
|
- <span class="pull-right">
|
|
|
|
|
- <a type="button" class="btn" data-bind="visible: rows().length != 0, attr: {'href': '${ url('spark:download_result') }' + $root.query.jobId()}">${_('Download')}</a>
|
|
|
|
|
- </span>
|
|
|
|
|
- </div>
|
|
|
|
|
- </div>
|
|
|
|
|
|
|
+ <h1 class="card-heading simple">${_('Parameters')}</h1>
|
|
|
|
|
+ <div class="card-body">
|
|
|
|
|
+ <p>
|
|
|
|
|
+ <div data-bind="css: {'hide': query.errors().length == 0}" class="hide alert alert-error">
|
|
|
|
|
+ <p><strong>${_('Your app configuration has the following error(s):')}</strong></p>
|
|
|
|
|
+ <div data-bind="foreach: query.errors">
|
|
|
|
|
+ <p data-bind="text: $data" class="queryErrorMessage"></p>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
- </div>
|
|
|
|
|
- </div>
|
|
|
|
|
- </div>
|
|
|
|
|
|
|
|
|
|
- <div data-bind="css: {'hide': rows().length == 0}" class="hide">
|
|
|
|
|
- <div class="card card-small scrollable">
|
|
|
|
|
- <table class="table table-striped table-condensed resultTable" cellpadding="0" cellspacing="0" data-tablescroller-min-height-disable="true" data-tablescroller-enforce-height="true">
|
|
|
|
|
- <thead>
|
|
|
|
|
- <tr>
|
|
|
|
|
- <th>${ _('Key') }</th>
|
|
|
|
|
- <th>${ _('Value') }</th>
|
|
|
|
|
- </tr>
|
|
|
|
|
- </thead>
|
|
|
|
|
- </table>
|
|
|
|
|
- </div>
|
|
|
|
|
- </div>
|
|
|
|
|
|
|
+ <div data-bind="visible: query.params().length == 0">${_('There currently no parameters defined.')}</div>
|
|
|
|
|
+
|
|
|
|
|
+ <table class="table-condensed">
|
|
|
|
|
+ <thead data-bind="visible: query.params().length > 0">
|
|
|
|
|
+ <tr>
|
|
|
|
|
+ <th>${ _('Name') }</th>
|
|
|
|
|
+ <th>${ _('Value') }</th>
|
|
|
|
|
+ <th/>
|
|
|
|
|
+ </tr>
|
|
|
|
|
+ </thead>
|
|
|
|
|
+ <tbody data-bind="foreach: query.params">
|
|
|
|
|
+ <tr>
|
|
|
|
|
+ <td><input type="text" class="span6 required propKey" data-bind="value: name" /></td>
|
|
|
|
|
+ <td><input type="text" class="span6 required pathChooserKo" data-bind="fileChooser: $data, value: value" /></td>
|
|
|
|
|
+ <td>
|
|
|
|
|
+ <a class="btn" href="#" data-bind="click: $root.removeParam">${ _('Delete') }</a>
|
|
|
|
|
+ </td>
|
|
|
|
|
+ </tr>
|
|
|
|
|
+ </tbody>
|
|
|
|
|
+ </table>
|
|
|
|
|
+
|
|
|
|
|
+ <a class="btn" href="#" data-bind="click: $root.addParam">${ _('Add parameter') }</a>
|
|
|
|
|
+
|
|
|
|
|
+ <div class="actions">
|
|
|
|
|
+ <button data-bind="click: tryExecuteQuery, enable: $root.appNames().length > 0 && $root.classPath()"
|
|
|
|
|
+ type="button" id="executeQuery" class="btn btn-primary disable-feedback"
|
|
|
|
|
+ tabindex="2" data-loading-text="${ _("Executing...") }">
|
|
|
|
|
+ ${_('Execute')}
|
|
|
|
|
+ </button>
|
|
|
|
|
+ <button data-bind="click: trySaveQuery, css: {'hide': !$root.query.id() || $root.query.id() == -1}" type="button" class="btn hide">${_('Save')}</button>
|
|
|
|
|
+ <button data-bind="click: trySaveAsQuery" type="button" class="btn">${_('Save as...')}</button>
|
|
|
|
|
+ ${_('or create a')} <a type="button" class="btn" href="${ url('spark:editor') }">${_('New app configuration')}</a>
|
|
|
|
|
+ <span class="pull-right">
|
|
|
|
|
+ <a type="button" class="btn" data-bind="visible: rows().length != 0, attr: {'href': '${ url('spark:download_result') }' + $root.query.jobId()}">${_('Download')}</a>
|
|
|
|
|
+ </span>
|
|
|
|
|
+ </div>
|
|
|
|
|
|
|
|
- <div data-bind="css: {'hide': !resultsEmpty()}" class="hide">
|
|
|
|
|
- <div class="card card-small scrollable">
|
|
|
|
|
- <div class="row-fluid">
|
|
|
|
|
- <div class="span10 offset1 center empty-wrapper">
|
|
|
|
|
- <i class="fa fa-frown-o"></i>
|
|
|
|
|
- <h1>${_('The server returned no results.')}</h1>
|
|
|
|
|
- <br/>
|
|
|
|
|
|
|
+ <div data-bind="css: {'hide': rows().length == 0}" class="hide">
|
|
|
|
|
+ <div class="card card-small scrollable">
|
|
|
|
|
+ <table class="table table-striped table-condensed resultTable" cellpadding="0" cellspacing="0" data-tablescroller-min-height-disable="true" data-tablescroller-enforce-height="true">
|
|
|
|
|
+ <thead>
|
|
|
|
|
+ <tr>
|
|
|
|
|
+ <th>${ _('Key') }</th>
|
|
|
|
|
+ <th>${ _('Value') }</th>
|
|
|
|
|
+ </tr>
|
|
|
|
|
+ </thead>
|
|
|
|
|
+ </table>
|
|
|
|
|
+ </div>
|
|
|
</div>
|
|
</div>
|
|
|
- </div>
|
|
|
|
|
- </div>
|
|
|
|
|
- </div>
|
|
|
|
|
|
|
|
|
|
- <div id="wait-info" class="hide">
|
|
|
|
|
- <div class="card card-small scrollable">
|
|
|
|
|
- <div class="row-fluid">
|
|
|
|
|
- <div class="span10 offset1 center" style="padding: 30px">
|
|
|
|
|
- <!--[if !IE]><!--><i class="fa fa-spinner fa-spin" style="font-size: 60px; color: #DDD"></i><!--<![endif]-->
|
|
|
|
|
- <!--[if IE]><img src="/static/art/spinner.gif" /><![endif]-->
|
|
|
|
|
|
|
+ <div data-bind="css: {'hide': !resultsEmpty()}" class="hide">
|
|
|
|
|
+ <div class="card card-small scrollable">
|
|
|
|
|
+ <div class="row-fluid">
|
|
|
|
|
+ <div class="span10 offset1 center empty-wrapper">
|
|
|
|
|
+ <i class="fa fa-frown-o"></i>
|
|
|
|
|
+ <h1>${_('The server returned no results.')}</h1>
|
|
|
|
|
+ <br/>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </div>
|
|
|
</div>
|
|
</div>
|
|
|
- </div>
|
|
|
|
|
|
|
+
|
|
|
|
|
+ <div id="wait-info" class="hide">
|
|
|
|
|
+ <div class="card card-small scrollable">
|
|
|
|
|
+ <div class="row-fluid">
|
|
|
|
|
+ <div class="span10 offset1 center" style="padding: 30px">
|
|
|
|
|
+ <!--[if !IE]><!--><i class="fa fa-spinner fa-spin" style="font-size: 60px; color: #DDD"></i><!--<![endif]-->
|
|
|
|
|
+ <!--[if IE]><img src="/static/art/spinner.gif" /><![endif]-->
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </p>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
-
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
- </div>
|
|
|
|
|
-</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div id="saveAsQueryModal" class="modal hide fade">
|
|
<div id="saveAsQueryModal" class="modal hide fade">
|
|
@@ -451,7 +433,7 @@ ${ common.createContextModal() }
|
|
|
success: function(response, newValue) {
|
|
success: function(response, newValue) {
|
|
|
viewModel.query.name(newValue);
|
|
viewModel.query.name(newValue);
|
|
|
},
|
|
},
|
|
|
- emptytext: "${ _('Query name') }"
|
|
|
|
|
|
|
+ emptytext: "${ _('App configuration name') }"
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
$("#query-description").editable({
|
|
$("#query-description").editable({
|
|
@@ -464,7 +446,7 @@ ${ common.createContextModal() }
|
|
|
|
|
|
|
|
// Events and datatables
|
|
// Events and datatables
|
|
|
$(document).on('saved.query', function() {
|
|
$(document).on('saved.query', function() {
|
|
|
- $.jHueNotify.info("${_('Query saved successfully!')}")
|
|
|
|
|
|
|
+ $.jHueNotify.info("${_('App saved successfully!')}")
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
var dataTable = null;
|
|
var dataTable = null;
|
|
@@ -533,9 +515,14 @@ ${ common.createContextModal() }
|
|
|
$("#executeQuery").button("reset");
|
|
$("#executeQuery").button("reset");
|
|
|
resultsTable();
|
|
resultsTable();
|
|
|
});
|
|
});
|
|
|
- $(document).on('created.context', function() {
|
|
|
|
|
- $('#createContextModal').modal('hide');
|
|
|
|
|
- });
|
|
|
|
|
|
|
+
|
|
|
|
|
+ $(document).on("created.context", function() {
|
|
|
|
|
+ $("#createContextModal").modal("hide");
|
|
|
|
|
+ $("#createContextBtn").button("reset");
|
|
|
|
|
+ $("input[data-default]").each(function(){
|
|
|
|
|
+ $(this).val($(this).data("default"));
|
|
|
|
|
+ });
|
|
|
|
|
+ });
|
|
|
|
|
|
|
|
// Server error handling.
|
|
// Server error handling.
|
|
|
$(document).on('server.error', function(e, data) {
|
|
$(document).on('server.error', function(e, data) {
|