datahub/docs/src/widget.queryeditor.html

185 lines
6.5 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<title>widget.queryeditor.js</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, target-densitydpi=160dpi, initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">
<link rel="stylesheet" media="all" href="docco.css" />
</head>
<body>
<div id="container">
<div id="background"></div>
<ul id="jump_to">
<li>
<a class="large" href="javascript:void(0);">Jump To &hellip;</a>
<a class="small" href="javascript:void(0);">+</a>
<div id="jump_wrapper">
<div id="jump_page_wrapper">
<div id="jump_page">
<a class="source" href="backend.dataproxy.html">
backend.dataproxy.js
</a>
<a class="source" href="backend.memory.html">
backend.memory.js
</a>
<a class="source" href="ecma-fixes.html">
ecma-fixes.js
</a>
<a class="source" href="model.html">
model.js
</a>
<a class="source" href="view.flot.html">
view.flot.js
</a>
<a class="source" href="view.graph.html">
view.graph.js
</a>
<a class="source" href="view.grid.html">
view.grid.js
</a>
<a class="source" href="view.map.html">
view.map.js
</a>
<a class="source" href="view.multiview.html">
view.multiview.js
</a>
<a class="source" href="view.slickgrid.html">
view.slickgrid.js
</a>
<a class="source" href="view.timeline.html">
view.timeline.js
</a>
<a class="source" href="widget.facetviewer.html">
widget.facetviewer.js
</a>
<a class="source" href="widget.fields.html">
widget.fields.js
</a>
<a class="source" href="widget.filtereditor.html">
widget.filtereditor.js
</a>
<a class="source" href="widget.pager.html">
widget.pager.js
</a>
<a class="source" href="widget.queryeditor.html">
widget.queryeditor.js
</a>
<a class="source" href="widget.valuefilter.html">
widget.valuefilter.js
</a>
</div>
</div>
</li>
</ul>
<ul class="sections">
<li id="title">
<div class="annotation">
<h1>widget.queryeditor.js</h1>
</div>
</li>
<li id="section-1">
<div class="annotation">
<div class="pilwrap ">
<a class="pilcrow" href="#section-1">&#182;</a>
</div>
</div>
<div class="content"><div class='highlight'><pre><span class="hljs-comment">/*jshint multistr:true */</span>
<span class="hljs-keyword">this</span>.recline = <span class="hljs-keyword">this</span>.recline || {};
<span class="hljs-keyword">this</span>.recline.View = <span class="hljs-keyword">this</span>.recline.View || {};
(<span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">($, my)</span> </span>{
<span class="hljs-pi"> "use strict"</span>;
my.QueryEditor = Backbone.View.extend({
className: <span class="hljs-string">'recline-query-editor'</span>,
template: <span class="hljs-string">' \
&lt;form action="" method="GET" class="form-inline" role="form"&gt; \
&lt;div class="form-group"&gt; \
&lt;div class="input-group text-query"&gt; \
&lt;div class="input-group-addon"&gt; \
&lt;i class="glyphicon glyphicon-search"&gt;&lt;/i&gt; \
&lt;/div&gt; \
&lt;label for="q"&gt;Search&lt;/label&gt; \
&lt;input class="form-control search-query" type="text" id="q" name="q" value="{{q}}" placeholder="Search data ..."&gt; \
&lt;/div&gt; \
&lt;/div&gt; \
&lt;button type="submit" class="btn btn-default"&gt;Go &amp;raquo;&lt;/button&gt; \
&lt;/form&gt; \
'</span>,
events: {
<span class="hljs-string">'submit form'</span>: <span class="hljs-string">'onFormSubmit'</span>
},
initialize: <span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">()</span> </span>{
_.bindAll(<span class="hljs-keyword">this</span>, <span class="hljs-string">'render'</span>);
<span class="hljs-keyword">this</span>.listenTo(<span class="hljs-keyword">this</span>.model, <span class="hljs-string">'change'</span>, <span class="hljs-keyword">this</span>.render);
<span class="hljs-keyword">this</span>.render();
},
onFormSubmit: <span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">(e)</span> </span>{
e.preventDefault();
<span class="hljs-keyword">var</span> query = <span class="hljs-keyword">this</span>.$el.find(<span class="hljs-string">'.search-query'</span>).val();
<span class="hljs-keyword">this</span>.model.set({q: query});
},
render: <span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">()</span> </span>{
<span class="hljs-keyword">var</span> tmplData = <span class="hljs-keyword">this</span>.model.toJSON();
<span class="hljs-keyword">var</span> templated = Mustache.render(<span class="hljs-keyword">this</span>.template, tmplData);
<span class="hljs-keyword">this</span>.$el.html(templated);
}
});
})(jQuery, recline.View);</pre></div></div>
</li>
</ul>
</div>
</body>
</html>