Merge branch 'master' into gh-pages
This commit is contained in:
Rufus Pollock
commit
ce111604ca
@ -1,33 +1,53 @@
|
||||
<link rel="stylesheet" href="vendor/leaflet/0.3.1/leaflet.css">
|
||||
<link rel="stylesheet" href="{{page.root}}vendor/leaflet/0.3.1/leaflet.css">
|
||||
<!--[if lte IE 8]>
|
||||
<link rel="stylesheet" href="vendor/leaflet/0.3.1/leaflet.ie.css" />
|
||||
<link rel="stylesheet" href="{{page.root}}vendor/leaflet/0.3.1/leaflet.ie.css" />
|
||||
<![endif]-->
|
||||
<link rel="stylesheet" href="vendor/slickgrid/2.0.1/slick.grid.css">
|
||||
<link rel="stylesheet" href="{{page.root}}vendor/slickgrid/2.0.1/slick.grid.css">
|
||||
|
||||
<!-- Recline CSS components -->
|
||||
<link rel="stylesheet" href="css/grid.css">
|
||||
<link rel="stylesheet" href="css/graph.css">
|
||||
<link rel="stylesheet" href="css/map.css">
|
||||
<link rel="stylesheet" href="css/multiview.css">
|
||||
<link rel="stylesheet" href="{{page.root}}css/grid.css">
|
||||
<link rel="stylesheet" href="{{page.root}}css/slickgrid.css">
|
||||
<link rel="stylesheet" href="{{page.root}}css/graph.css">
|
||||
<link rel="stylesheet" href="{{page.root}}css/transform.css">
|
||||
<link rel="stylesheet" href="{{page.root}}css/map.css">
|
||||
<link rel="stylesheet" href="{{page.root}}css/multiview.css">
|
||||
<!-- /Recline CSS components -->
|
||||
|
||||
<!-- 3rd party JS libraries -->
|
||||
<script type="text/javascript" src="vendor/jquery/1.7.1/jquery.js"></script>
|
||||
<script type="text/javascript" src="vendor/underscore/1.1.6/underscore.js"></script>
|
||||
<script type="text/javascript" src="vendor/backbone/0.5.1/backbone.js"></script>
|
||||
<script type="text/javascript" src="vendor/mustache/0.5.0-dev/mustache.js"></script>
|
||||
<script type="text/javascript" src="vendor/bootstrap/2.0.2/bootstrap.js"></script>
|
||||
<script type="text/javascript" src="vendor/jquery.flot/0.7/jquery.flot.js"></script>
|
||||
<script type="text/javascript" src="vendor/leaflet/0.3.1/leaflet.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}vendor/jquery/1.7.1/jquery.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}vendor/underscore/1.1.6/underscore.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}vendor/backbone/0.5.1/backbone.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}vendor/mustache/0.5.0-dev/mustache.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}vendor/bootstrap/2.0.2/bootstrap.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}vendor/jquery.flot/0.7/jquery.flot.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}vendor/leaflet/0.3.1/leaflet.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}vendor/slickgrid/2.0.1/jquery-ui-1.8.16.custom.min.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}vendor/slickgrid/2.0.1/jquery.event.drag-2.0.min.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}vendor/slickgrid/2.0.1/slick.grid.min.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}vendor/moment/1.6.2/moment.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}vendor/timeline/20120520/js/timeline.js"></script>
|
||||
|
||||
<!--
|
||||
The recline library itself - this includes all components at once.
|
||||
|
||||
You can include just the components you need e.g.
|
||||
|
||||
<script type="text/javascript" src="src/model.js"></script>
|
||||
<script type="text/javascript" src="src/backend/base.js"></script>
|
||||
<script type="text/javascript" src="src/backend/memory.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}dist/recline.js"></script>
|
||||
-->
|
||||
<script type="text/javascript" src="dist/recline.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}src/model.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}src/backend.memory.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}src/backend.dataproxy.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}src/backend.gdocs.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}src/backend.elasticsearch.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}src/backend.csv.js"></script>
|
||||
|
||||
<!-- views and view tests -->
|
||||
<script type="text/javascript" src="{{page.root}}src/view.grid.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}src/view.slickgrid.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}src/view.transform.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}src/costco.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}src/view.graph.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}src/view.map.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}src/view.timeline.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}src/widget.pager.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}src/widget.queryeditor.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}src/widget.filtereditor.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}src/widget.fields.js"></script>
|
||||
<script type="text/javascript" src="{{page.root}}src/view.multiview.js"></script>
|
||||
|
||||
|
||||
@ -27,17 +27,17 @@
|
||||
<a class="logo-icon pull-left" href="/">
|
||||
<img src="http://assets.okfn.org/p/recline/img/chair.png" />
|
||||
</a>
|
||||
<a class="brand" href="/"><strong>Recline.js</strong> – relax with your data</a>
|
||||
<a class="brand" href="{{page.root}}"><strong>Recline.js</strong> – relax with your data</a>
|
||||
<ul class="nav">
|
||||
<li>
|
||||
<a href="/docs/">
|
||||
<a href="{{page.root}}docs/">
|
||||
<i class="icon-book icon-white"></i>
|
||||
Documentation
|
||||
</a>
|
||||
</li>
|
||||
<li class="divider-vertical"></li>
|
||||
<li>
|
||||
<a href="demos.html">
|
||||
<a href="{{page.root}}demos/">
|
||||
<i class="icon-pencil icon-white"></i>
|
||||
Demos
|
||||
</a>
|
||||
@ -75,7 +75,7 @@
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="span4">
|
||||
<p class="getit-btn"><a href="library.html" class="btn">Use the Library »</a></p>
|
||||
<p class="getit-btn"><a href="{{page.root}}docs/" class="btn">Use the Library »</a></p>
|
||||
<p>Recline.js is freely redistributable under the terms of the MIT license.</p>
|
||||
</div>
|
||||
<div class="span3">
|
||||
|
||||
170
app/built.html
170
app/built.html
@ -1,170 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>Recline Data Explorer (Built Sources)</title>
|
||||
<meta name="description" content="A demo of the Recline Data Explorer">
|
||||
<meta name="author" content="Rufus Pollock and Max Ogden">
|
||||
|
||||
<!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
|
||||
<![endif]-->
|
||||
<link rel="stylesheet" href="../vendor/bootstrap/2.0.2/css/bootstrap.css">
|
||||
<link rel="stylesheet" href="../vendor/leaflet/0.3.1/leaflet.css">
|
||||
<!--[if lte IE 8]>
|
||||
<link rel="stylesheet" href="../vendor/leaflet/0.3.1/leaflet.ie.css" />
|
||||
<![endif]-->
|
||||
|
||||
<!-- Recline CSS components -->
|
||||
<link rel="stylesheet" href="../css/data-explorer.css">
|
||||
<link rel="stylesheet" href="../css/grid.css">
|
||||
<link rel="stylesheet" href="../css/graph.css">
|
||||
<link rel="stylesheet" href="../css/map.css">
|
||||
<!-- /Recline CSS components -->
|
||||
|
||||
<!-- Custom CSS for the Data Explorer Online App -->
|
||||
<link rel="stylesheet" href="style/demo.css">
|
||||
|
||||
<link rel="stylesheet" href="../vendor/bootstrap/2.0.2/css/bootstrap-responsive.css">
|
||||
|
||||
<!-- 3rd party JS libraries -->
|
||||
<script type="text/javascript" src="../vendor/jquery/1.7.1/jquery.js"></script>
|
||||
<script type="text/javascript" src="../vendor/underscore/1.1.6/underscore.js"></script>
|
||||
<script type="text/javascript" src="../vendor/backbone/0.5.1/backbone.js"></script>
|
||||
<script type="text/javascript" src="../vendor/jquery.flot/0.7/jquery.flot.js"></script>
|
||||
<script type="text/javascript" src="../vendor/jquery.mustache.js"></script>
|
||||
<script type="text/javascript" src="../vendor/bootstrap/2.0.2/bootstrap.js"></script>
|
||||
<script type="text/javascript" src="../vendor/leaflet/0.3.1/leaflet.js"></script>
|
||||
|
||||
<!-- recline library -->
|
||||
<script type="text/javascript" src="../recline.js"></script>
|
||||
|
||||
<!-- non-library javascript specific to this demo -->
|
||||
<script type="text/javascript" src="js/app.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="recline-app">
|
||||
<div class="navbar navbar-fixed-top">
|
||||
<div class="navbar-inner">
|
||||
<div class="container-fluid">
|
||||
<a class="brand" href="../">Recline Data Explorer</a>
|
||||
<ul class="nav">
|
||||
<li><a href="../#docs">Documentation</a></li>
|
||||
</ul>
|
||||
<ul class="nav pull-right">
|
||||
<li class="dropdown">
|
||||
<a data-toggle="dropdown" class="dropdown-toggle">
|
||||
Import <b class="caret"></b></a>
|
||||
<ul class="dropdown-menu js-import">
|
||||
<li>
|
||||
<a data-toggle="modal" href=".js-import-dialog-url">Import from URL</a>
|
||||
</li>
|
||||
<li>
|
||||
<a data-toggle="modal" href=".js-import-dialog-file">Import from File</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href=".js-share-and-embed-dialog" data-toggle="modal">
|
||||
Share and Embed
|
||||
<i class="icon-share icon-white"></i>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal fade in js-import-dialog-url" style="display: none;">
|
||||
<div class="modal-header">
|
||||
<a class="close" data-dismiss="modal">×</a>
|
||||
<h3>Import from URL</h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form class="js-import-url form-horizontal">
|
||||
<div class="control-group">
|
||||
<label class="control-label">URL</label>
|
||||
<div class="controls">
|
||||
<input type="text" name="source" class="input-xlarge" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="control-label">Type of data</label>
|
||||
<div class="controls">
|
||||
<select name="backend_type">
|
||||
<option value="elasticsearch">ElasticSearch</option>
|
||||
<option value="dataproxy">CSV or Excel</option>
|
||||
<option value="gdocs">Google Spreadsheet</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-actions">
|
||||
<button type="submit" class="btn btn-primary">Import »</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal fade in js-import-dialog-file" style="display: none;">
|
||||
<div class="modal-header">
|
||||
<a class="close" data-dismiss="modal">×</a>
|
||||
<h3>Import from File</h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form class="form-horizontal">
|
||||
<div class="control-group">
|
||||
<label class="control-label">File</label>
|
||||
<div class="controls">
|
||||
<input type="file" name="source" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="control-label">Separator</label>
|
||||
<div class="controls">
|
||||
<input type="text" name="separator" value="," class="spam1"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="control-label">Text delimiter</label>
|
||||
<div class="controls">
|
||||
<input type="text" name="delimiter" value='"' />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="control-group">
|
||||
<label class="control-label">Encoding</label>
|
||||
<div class="controls">
|
||||
<input type="text" name="encoding" value="UTF-8" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-actions">
|
||||
<button type="submit" class="btn btn-primary">Import »</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal fade in js-share-and-embed-dialog" style="display: none;">
|
||||
<div class="modal-header">
|
||||
<a class="close" data-dismiss="modal">×</a>
|
||||
<h3>Share and Embed</h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<h4>Sharable Link to current View</h4>
|
||||
<textarea class="view-link" style="width: 100%; height: 100px;"></textarea>
|
||||
<h4>Embed this View</h4>
|
||||
<textarea class="view-embed" style="width: 100%; height: 200px;"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container-fluid">
|
||||
<div class="content">
|
||||
<div class="data-explorer-here"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 87 B |
Binary file not shown.
|
Before Width: | Height: | Size: 2.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.1 KiB |
265
app/index.html
265
app/index.html
@ -1,265 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>Recline Data Explorer</title>
|
||||
<meta name="description" content="The Recline Data Explorer">
|
||||
<meta name="author" content="Rufus Pollock and Max Ogden">
|
||||
|
||||
<!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
|
||||
<![endif]-->
|
||||
<link rel="stylesheet" href="../vendor/bootstrap/2.0.2/css/bootstrap.css">
|
||||
<link rel="stylesheet" href="../vendor/leaflet/0.3.1/leaflet.css">
|
||||
<!--[if lte IE 8]>
|
||||
<link rel="stylesheet" href="../vendor/leaflet/0.3.1/leaflet.ie.css" />
|
||||
<![endif]-->
|
||||
<link rel="stylesheet" href="../vendor/slickgrid/2.0.1/slick.grid.css">
|
||||
<link rel="stylesheet" href="../vendor/timeline/20120520/css/timeline.css">
|
||||
|
||||
<!-- Recline CSS components -->
|
||||
<link rel="stylesheet" href="../css/grid.css">
|
||||
<link rel="stylesheet" href="../css/slickgrid.css">
|
||||
<link rel="stylesheet" href="../css/graph.css">
|
||||
<link rel="stylesheet" href="../css/map.css">
|
||||
<link rel="stylesheet" href="../css/multiview.css">
|
||||
<!-- /Recline CSS components -->
|
||||
|
||||
<!-- Custom CSS for the Data Explorer Online App -->
|
||||
<link rel="stylesheet" href="../css/site/site.css">
|
||||
<link rel="stylesheet" href="style/demo.css">
|
||||
|
||||
<link rel="stylesheet" href="../vendor/bootstrap/2.0.2/css/bootstrap-responsive.css">
|
||||
|
||||
<!-- 3rd party JS libraries -->
|
||||
<script type="text/javascript" src="../vendor/jquery/1.7.1/jquery.js"></script>
|
||||
<script type="text/javascript" src="../vendor/underscore/1.1.6/underscore.js"></script>
|
||||
<script type="text/javascript" src="../vendor/backbone/0.5.1/backbone.js"></script>
|
||||
<script type="text/javascript" src="../vendor/moment/1.6.2/moment.js"></script>
|
||||
<script type="text/javascript" src="../vendor/jquery.flot/0.7/jquery.flot.js"></script>
|
||||
<script type="text/javascript" src="../vendor/mustache/0.5.0-dev/mustache.js"></script>
|
||||
<script type="text/javascript" src="../vendor/bootstrap/2.0.2/bootstrap.js"></script>
|
||||
<script type="text/javascript" src="../vendor/leaflet/0.3.1/leaflet.js"></script>
|
||||
<script type="text/javascript" src="../vendor/slickgrid/2.0.1/jquery-ui-1.8.16.custom.min.js"></script>
|
||||
<script type="text/javascript" src="../vendor/slickgrid/2.0.1/jquery.event.drag-2.0.min.js"></script>
|
||||
<script type="text/javascript" src="../vendor/slickgrid/2.0.1/slick.grid.min.js"></script>
|
||||
<script type="text/javascript" src="../vendor/timeline/20120520/js/timeline.js"></script>
|
||||
|
||||
<!-- recline library -->
|
||||
<!-- in normal use would just the single recline.js library file. However, for testing it
|
||||
is easier to reference individual files. See built.html for example using just recline.js -->
|
||||
<script type="text/javascript" src="../src/costco.js"></script>
|
||||
<script type="text/javascript" src="../src/model.js"></script>
|
||||
<script type="text/javascript" src="../src/backend/base.js"></script>
|
||||
<script type="text/javascript" src="../src/backend/memory.js"></script>
|
||||
<script type="text/javascript" src="../src/backend/dataproxy.js"></script>
|
||||
<script type="text/javascript" src="../src/backend/elasticsearch.js"></script>
|
||||
<script type="text/javascript" src="../src/backend/gdocs.js"></script>
|
||||
<script type="text/javascript" src="../src/backend/csv.js"></script>
|
||||
|
||||
<script type="text/javascript" src="../src/view.grid.js"></script>
|
||||
<script type="text/javascript" src="../src/view.slickgrid.js"></script>
|
||||
<script type="text/javascript" src="../src/view.transform.js"></script>
|
||||
<script type="text/javascript" src="../src/view.graph.js"></script>
|
||||
<script type="text/javascript" src="../src/view.map.js"></script>
|
||||
<script type="text/javascript" src="../src/view.timeline.js"></script>
|
||||
<script type="text/javascript" src="../src/widget.pager.js"></script>
|
||||
<script type="text/javascript" src="../src/widget.queryeditor.js"></script>
|
||||
<script type="text/javascript" src="../src/widget.filtereditor.js"></script>
|
||||
<script type="text/javascript" src="../src/widget.fields.js"></script>
|
||||
<script type="text/javascript" src="../src/view.multiview.js"></script>
|
||||
|
||||
<!-- non-library javascript specific to this demo -->
|
||||
<script type="text/javascript" src="js/app.js"></script>
|
||||
<!-- for demo dataset -->
|
||||
<script type="text/javascript" src="../test/base.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="recline-app">
|
||||
<div class="navbar navbar-fixed-top">
|
||||
<div class="navbar-inner">
|
||||
<div class="container-fluid">
|
||||
<a class="brand" href="#">Recline Data Explorer</a>
|
||||
<ul class="nav pull-right">
|
||||
<li class="dropdown">
|
||||
<a data-toggle="dropdown" class="dropdown-toggle">
|
||||
Load Data <b class="caret"></b></a>
|
||||
<ul class="dropdown-menu js-load">
|
||||
<li>
|
||||
<a href="#" class="js-load-dialog-url" data-type="gdocs" data-help="You must have published your spreadsheet to load it here (File Menu - Publish to the Web)">Load from Google Docs Spreadsheet</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="js-load-dialog-url" data-type="datahub" data-help="The link to the Dataset Data Resource on the DataHub to load from - note that the resource must have its Data API enabled">Load from the DataHub</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="js-load-dialog-url" data-type="csv" data-help="Provide the link to the CSV file online">Load from CSV online</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="js-load-dialog-url" data-type="excel" data-help="Provide the link to the Excel file online">Load from Excel online</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="js-load-dialog-url" data-type="elasticsearch" data-help="Provide the link to the ElasticSearch endpoint (either an index or a type/table">Load from ElasticSearch</a>
|
||||
</li>
|
||||
<li class="divider"></li>
|
||||
<li>
|
||||
<a data-toggle="modal" href=".js-load-dialog-file">Load from CSV on disk</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href=".js-share-and-embed-dialog" data-toggle="modal">
|
||||
Share and Embed
|
||||
<i class="icon-share icon-white"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href=".js-settings" data-toggle="modal">
|
||||
Settings
|
||||
<i class="icon-cog icon-white" style="margin-top: 1px;"></i>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container-fluid">
|
||||
<div class="content">
|
||||
<div class="page-home backbone-page">
|
||||
<div class="hero-unit">
|
||||
<h1>Welcome to the Recline Data Explorer</h1>
|
||||
<p>Recline allows you to explore and work with data in your browser and then share with others</p>
|
||||
</div>
|
||||
<div class="row-fluid">
|
||||
<div class="span4">
|
||||
<div class="well">
|
||||
<h3>View the demo</h3>
|
||||
<p>Try out the demo using a local example dataset.</p>
|
||||
<p><a class="btn btn-primary" href="?url=demo#explorer">View the demo dataset »</a></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="span4">
|
||||
<div class="well">
|
||||
<h3>Features</h3>
|
||||
<ul>
|
||||
<li>Data grid</li>
|
||||
<li>Data editing including programmatic data transformation in javascript</li>
|
||||
<li>Visualizations includes graphs and maps</li>
|
||||
<li>Load and export from a variety of sources including online sources such as online Excel and CSV files, Google docs and
|
||||
the <a href="http://datahub.io/">DataHub</a> and offline sources like CSV files on your local machine.</li>
|
||||
<li>Use online or offline - because the app is built in pure javascript and html you can use it anywhere there's a modern web browser. Using offline is as easy and downloading this web page to your local machine.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="span4">
|
||||
<div class="well">
|
||||
<h3>Get started</h3>
|
||||
<p>Get started straight away for example by importing some data from an external source <strong>using the menu at the top right</strong> of this page.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="page-explorer backbone-page">
|
||||
<div class="data-explorer-here"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- modals for menus -->
|
||||
<div class="modal fade in js-load-dialog-url" style="display: none;">
|
||||
<div class="modal-header">
|
||||
<a class="close" data-dismiss="modal">×</a>
|
||||
<h3>Load from URL</h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form class="js-load-url">
|
||||
<div class="control-group">
|
||||
<div class="controls">
|
||||
<input type="text" name="source" class="span5" placeholder="URL to data source" />
|
||||
<p class="help-block"></p>
|
||||
<input name="backend_type" style="display: none;" />
|
||||
</div>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary">Load »</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal fade in js-load-dialog-file" style="display: none;">
|
||||
<div class="modal-header">
|
||||
<a class="close" data-dismiss="modal">×</a>
|
||||
<h3>Load from File</h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form class="form-horizontal">
|
||||
<div class="control-group">
|
||||
<label class="control-label">File</label>
|
||||
<div class="controls">
|
||||
<input type="file" name="source" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="control-label">Separator</label>
|
||||
<div class="controls">
|
||||
<input type="text" name="separator" value="," class="spam1"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="control-label">Text delimiter</label>
|
||||
<div class="controls">
|
||||
<input type="text" name="delimiter" value='"' />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="control-group">
|
||||
<label class="control-label">Encoding</label>
|
||||
<div class="controls">
|
||||
<input type="text" name="encoding" value="UTF-8" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-actions">
|
||||
<button type="submit" class="btn btn-primary">Load »</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal fade in js-share-and-embed-dialog" style="display: none;">
|
||||
<div class="modal-header">
|
||||
<a class="close" data-dismiss="modal">×</a>
|
||||
<h3>Share and Embed</h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<h4>Sharable Link to current View</h4>
|
||||
<textarea class="view-link" style="width: 100%; height: 100px;"></textarea>
|
||||
<h4>Embed this View</h4>
|
||||
<textarea class="view-embed" style="width: 100%; height: 200px;"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal fade in js-settings" style="display: none;">
|
||||
<div class="modal-header">
|
||||
<a class="close" data-dismiss="modal">×</a>
|
||||
<h3>Settings</h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form class="form-horizontal">
|
||||
<div class="control-group">
|
||||
<label class="control-label">DataHub API Key</label>
|
||||
<div class="controls">
|
||||
<input type="text" name="datahub_api_key" value="" />
|
||||
<p class="help-block"><strong>Getting your API key:</strong> Register/Login to <a href="http://datahub.io/">http://datahub.io/</a> and then visit your user home page (click on the link at the top right). On your home page your API key is located at the top of the page in the section showing your main user details.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-actions">
|
||||
<button type="submit" class="btn btn-primary">Save »</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
246
app/js/app.js
246
app/js/app.js
@ -1,246 +0,0 @@
|
||||
jQuery(function($) {
|
||||
window.ReclineDataExplorer = new ExplorerApp({
|
||||
el: $('.recline-app')
|
||||
})
|
||||
});
|
||||
|
||||
var ExplorerApp = Backbone.View.extend({
|
||||
events: {
|
||||
'click .nav .js-load-dialog-url': '_onLoadURLDialog',
|
||||
'submit form.js-load-url': '_onLoadURL',
|
||||
'submit .js-load-dialog-file form': '_onLoadFile',
|
||||
'submit .js-settings form': '_onSettingsSave'
|
||||
},
|
||||
|
||||
initialize: function() {
|
||||
this.el = $(this.el);
|
||||
this.dataExplorer = null;
|
||||
this.explorerDiv = $('.data-explorer-here');
|
||||
_.bindAll(this, 'viewExplorer', 'viewHome');
|
||||
|
||||
this.router = new Backbone.Router();
|
||||
this.router.route('', 'home', this.viewHome);
|
||||
this.router.route(/explorer/, 'explorer', this.viewExplorer);
|
||||
Backbone.history.start();
|
||||
|
||||
var state = recline.View.parseQueryString(decodeURIComponent(window.location.search));
|
||||
if (state) {
|
||||
_.each(state, function(value, key) {
|
||||
try {
|
||||
value = JSON.parse(value);
|
||||
} catch(e) {}
|
||||
state[key] = value;
|
||||
});
|
||||
if (state.embed) {
|
||||
$('.navbar').hide();
|
||||
$('body').attr('style', 'padding-top: 0px');
|
||||
}
|
||||
}
|
||||
var dataset = null;
|
||||
// special cases for demo / memory dataset
|
||||
if (state.url === 'demo' || state.backend === 'memory') {
|
||||
dataset = localDataset();
|
||||
}
|
||||
else if (state.dataset || state.url) {
|
||||
dataset = recline.Model.Dataset.restore(state);
|
||||
}
|
||||
if (dataset) {
|
||||
this.createExplorer(dataset, state);
|
||||
}
|
||||
this._initializeSettings();
|
||||
},
|
||||
|
||||
viewHome: function() {
|
||||
this.switchView('home');
|
||||
},
|
||||
|
||||
viewExplorer: function() {
|
||||
this.router.navigate('explorer');
|
||||
this.switchView('explorer');
|
||||
},
|
||||
|
||||
switchView: function(path) {
|
||||
$('.backbone-page').hide();
|
||||
var cssClass = path.replace('/', '-');
|
||||
$('.page-' + cssClass).show();
|
||||
},
|
||||
|
||||
|
||||
// make Explorer creation / initialization in a function so we can call it
|
||||
// again and again
|
||||
createExplorer: function(dataset, state) {
|
||||
var self = this;
|
||||
// remove existing data explorer view
|
||||
var reload = false;
|
||||
if (this.dataExplorer) {
|
||||
this.dataExplorer.remove();
|
||||
reload = true;
|
||||
}
|
||||
this.dataExplorer = null;
|
||||
var $el = $('<div />');
|
||||
$el.appendTo(this.explorerDiv);
|
||||
var views = [
|
||||
{
|
||||
id: 'grid',
|
||||
label: 'Grid',
|
||||
view: new recline.View.SlickGrid({
|
||||
model: dataset
|
||||
})
|
||||
},
|
||||
|
||||
{
|
||||
id: 'graph',
|
||||
label: 'Graph',
|
||||
view: new recline.View.Graph({
|
||||
model: dataset
|
||||
})
|
||||
},
|
||||
{
|
||||
id: 'map',
|
||||
label: 'Map',
|
||||
view: new recline.View.Map({
|
||||
model: dataset
|
||||
})
|
||||
},
|
||||
{
|
||||
id: 'timeline',
|
||||
label: 'Timeline',
|
||||
view: new recline.View.Timeline({
|
||||
model: dataset
|
||||
})
|
||||
}
|
||||
];
|
||||
|
||||
this.dataExplorer = new recline.View.MultiView({
|
||||
model: dataset,
|
||||
el: $el,
|
||||
state: state,
|
||||
views: views
|
||||
});
|
||||
this._setupPermaLink(this.dataExplorer);
|
||||
this._setupEmbed(this.dataExplorer);
|
||||
|
||||
this.viewExplorer();
|
||||
},
|
||||
|
||||
_setupPermaLink: function(explorer) {
|
||||
var self = this;
|
||||
var $viewLink = this.el.find('.js-share-and-embed-dialog .view-link');
|
||||
explorer.state.bind('change', function() {
|
||||
$viewLink.val(self.makePermaLink(explorer.state));
|
||||
});
|
||||
$viewLink.val(self.makePermaLink(explorer.state));
|
||||
},
|
||||
|
||||
_setupEmbed: function(explorer) {
|
||||
var self = this;
|
||||
var $embedLink = this.el.find('.js-share-and-embed-dialog .view-embed');
|
||||
function makeEmbedLink(state) {
|
||||
var link = self.makePermaLink(state);
|
||||
link = link + '&embed=true';
|
||||
var out = Mustache.render('<iframe src="{{link}}" width="100%" min-height="500px;"></iframe>', {link: link});
|
||||
return out;
|
||||
}
|
||||
explorer.state.bind('change', function() {
|
||||
$embedLink.val(makeEmbedLink(explorer.state));
|
||||
});
|
||||
$embedLink.val(makeEmbedLink(explorer.state));
|
||||
},
|
||||
|
||||
makePermaLink: function(state) {
|
||||
var qs = recline.View.composeQueryString(state.toJSON());
|
||||
return window.location.origin + window.location.pathname + qs;
|
||||
},
|
||||
|
||||
// setup the loader menu in top bar
|
||||
setupLoader: function(callback) {
|
||||
// pre-populate webstore load form with an example url
|
||||
var demoUrl = 'http://thedatahub.org/api/data/b9aae52b-b082-4159-b46f-7bb9c158d013';
|
||||
$('form.js-load-url input[name="source"]').val(demoUrl);
|
||||
},
|
||||
|
||||
_onLoadURLDialog: function(e) {
|
||||
e.preventDefault();
|
||||
var $link = $(e.target);
|
||||
var $modal = $('.modal.js-load-dialog-url');
|
||||
$modal.find('h3').text($link.text());
|
||||
$modal.modal('show');
|
||||
$modal.find('input[name="source"]').val('');
|
||||
$modal.find('input[name="backend_type"]').val($link.attr('data-type'));
|
||||
$modal.find('.help-block').text($link.attr('data-help'));
|
||||
},
|
||||
|
||||
_onLoadURL: function(e) {
|
||||
e.preventDefault();
|
||||
$('.modal.js-load-dialog-url').modal('hide');
|
||||
var $form = $(e.target);
|
||||
var source = $form.find('input[name="source"]').val();
|
||||
var datasetInfo = {
|
||||
id: 'my-dataset',
|
||||
url: source
|
||||
};
|
||||
var type = $form.find('input[name="backend_type"]').val();
|
||||
if (type === 'csv' || type === 'excel') {
|
||||
datasetInfo.format = type;
|
||||
type = 'dataproxy';
|
||||
}
|
||||
if (type === 'datahub') {
|
||||
// have a full resource url so convert to data API
|
||||
if (source.indexOf('dataset') != -1) {
|
||||
var parts = source.split('/');
|
||||
datasetInfo.url = parts[0] + '/' + parts[1] + '/' + parts[2] + '/api/data/' + parts[parts.length-1];
|
||||
}
|
||||
type = 'elasticsearch';
|
||||
}
|
||||
var dataset = new recline.Model.Dataset(datasetInfo, type);
|
||||
this.createExplorer(dataset);
|
||||
},
|
||||
|
||||
_onLoadFile: function(e) {
|
||||
var self = this;
|
||||
e.preventDefault();
|
||||
var $form = $(e.target);
|
||||
$('.modal.js-load-dialog-file').modal('hide');
|
||||
var $file = $form.find('input[type="file"]')[0];
|
||||
var dataset = new recline.Model.Dataset({
|
||||
file: $file.files[0],
|
||||
separator : $form.find('input[name="separator"]').val(),
|
||||
delimiter : $form.find('input[name="delimiter"]').val(),
|
||||
encoding : $form.find('input[name="encoding"]').val()
|
||||
},
|
||||
'csv'
|
||||
);
|
||||
dataset.fetch().done(function() {
|
||||
self.createExplorer(dataset)
|
||||
});
|
||||
},
|
||||
|
||||
_getSettings: function() {
|
||||
var settings = localStorage.getItem('dataexplorer.settings');
|
||||
settings = JSON.parse(settings) || {};
|
||||
return settings;
|
||||
},
|
||||
|
||||
_initializeSettings: function() {
|
||||
var settings = this._getSettings();
|
||||
$('.modal.js-settings form input[name="datahub_api_key"]').val(settings.datahubApiKey);
|
||||
},
|
||||
|
||||
_onSettingsSave: function(e) {
|
||||
var self = this;
|
||||
e.preventDefault();
|
||||
var $form = $(e.target);
|
||||
$('.modal.js-settings').modal('hide');
|
||||
var datahubKey = $form.find('input[name="datahub_api_key"]').val();
|
||||
var settings = this._getSettings();
|
||||
settings.datahubApiKey = datahubKey;
|
||||
localStorage.setItem('dataexplorer.settings', JSON.stringify(settings));
|
||||
}
|
||||
});
|
||||
|
||||
// provide a demonstration in memory dataset
|
||||
function localDataset() {
|
||||
var dataset = Fixture.getDataset();
|
||||
return dataset;
|
||||
}
|
||||
|
||||
@ -1,21 +0,0 @@
|
||||
body {
|
||||
padding-top: 60px;
|
||||
}
|
||||
|
||||
/* we do not have a LH sidebar */
|
||||
.container-fluid > .content {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.recline-grid-container {
|
||||
height: 550px;
|
||||
}
|
||||
|
||||
.recline-slickgrid {
|
||||
height: 550px;
|
||||
}
|
||||
|
||||
.recline-timeline .vmm-timeline {
|
||||
height: 550px;
|
||||
}
|
||||
|
||||
88
css/grid.css
88
css/grid.css
@ -185,94 +185,6 @@ div.data-table-cell-content-numeric > a.data-table-cell-edit {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
|
||||
/**********************************************************
|
||||
* Transform Dialog
|
||||
*********************************************************/
|
||||
|
||||
textarea.expression-preview-code {
|
||||
font-family: monospace;
|
||||
height: 5em;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.expression-preview-parsing-status {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.expression-preview-parsing-status.error {
|
||||
color: red;
|
||||
}
|
||||
|
||||
#expression-preview-tabs-preview,
|
||||
#expression-preview-tabs-help,
|
||||
#expression-preview-tabs-history,
|
||||
#expression-preview-tabs-starred {
|
||||
padding: 5px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#expression-preview-tabs-preview > div,
|
||||
#expression-preview-tabs-help > div,
|
||||
#expression-preview-tabs-history > div,
|
||||
#expression-preview-tabs-starred {
|
||||
height: 200px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
#expression-preview-tabs-preview td, #expression-preview-tabs-preview th,
|
||||
#expression-preview-tabs-help td, #expression-preview-tabs-help th,
|
||||
#expression-preview-tabs-history td, #expression-preview-tabs-history th,
|
||||
#expression-preview-tabs-starred td, #expression-preview-tabs-starred th {
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.expression-preview-table-wrapper {
|
||||
padding: 7px;
|
||||
}
|
||||
|
||||
.expression-preview-container td {
|
||||
padding: 2px 5px;
|
||||
border-top: 1px solid #ccc;
|
||||
}
|
||||
|
||||
td.expression-preview-heading {
|
||||
border-top: none;
|
||||
background: #ddd;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
td.expression-preview-value {
|
||||
max-width: 250px !important;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.expression-preview-special-value {
|
||||
color: #aaa;
|
||||
}
|
||||
|
||||
.expression-preview-help-container h3 {
|
||||
margin-top: 15px;
|
||||
margin-bottom: 7px;
|
||||
border-bottom: 1px solid #999;
|
||||
}
|
||||
|
||||
.expression-preview-doc-item-title {
|
||||
font-weight: bold;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.expression-preview-doc-item-params {
|
||||
}
|
||||
|
||||
.expression-preview-doc-item-returns {
|
||||
}
|
||||
|
||||
.expression-preview-doc-item-desc {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
|
||||
/**********************************************************
|
||||
* Read-only mode
|
||||
*********************************************************/
|
||||
|
||||
31
css/transform.css
Normal file
31
css/transform.css
Normal file
@ -0,0 +1,31 @@
|
||||
.recline-transform .script {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.recline-transform .script textarea {
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
font-family: monospace;
|
||||
}
|
||||
|
||||
.recline-transform h2 {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.recline-transform h2 .okButton {
|
||||
margin-left: 10px;
|
||||
margin-top: -2px;
|
||||
}
|
||||
|
||||
.recline-transform .preview {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.expression-preview-parsing-status {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.expression-preview-parsing-status.error {
|
||||
color: red;
|
||||
}
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
---
|
||||
layout: container
|
||||
title: Demos
|
||||
root: ../
|
||||
---
|
||||
|
||||
<div class="page-header">
|
||||
@ -12,8 +13,8 @@ title: Demos
|
||||
<div class="row">
|
||||
<div class="span4">
|
||||
<div class="well">
|
||||
<h3>Explorer Demo</h3>
|
||||
<p>View the full Data Explorer in action on a sample dataset <a href="app/?url=demo">Demo »</a></p>
|
||||
<h3>Multiview Demo</h3>
|
||||
<p>See the integrated multiview "Data Explorer" in action on a sample dataset <a href="multiview/">Demo »</a></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="span4">
|
||||
52
demos/multiview/app.js
Executable file
52
demos/multiview/app.js
Executable file
@ -0,0 +1,52 @@
|
||||
jQuery(function($) {
|
||||
window.dataExplorer = null;
|
||||
window.explorerDiv = $('.data-explorer-here');
|
||||
|
||||
// see if we have any configuration from query string
|
||||
var state = recline.View.parseQueryString(decodeURIComponent(window.location.search));
|
||||
if (state) {
|
||||
_.each(state, function(value, key) {
|
||||
try {
|
||||
value = JSON.parse(value);
|
||||
} catch(e) {}
|
||||
state[key] = value;
|
||||
});
|
||||
} else {
|
||||
state.url = 'demo';
|
||||
}
|
||||
var dataset = null;
|
||||
if (state.dataset || state.url) {
|
||||
dataset = recline.Model.Dataset.restore(state);
|
||||
} else {
|
||||
dataset = localDataset();
|
||||
}
|
||||
createExplorer(dataset, state);
|
||||
});
|
||||
|
||||
|
||||
// make Explorer creation / initialization in a function so we can call it
|
||||
// again and again
|
||||
var createExplorer = function(dataset, state) {
|
||||
// remove existing data explorer view
|
||||
var reload = false;
|
||||
if (window.dataExplorer) {
|
||||
window.dataExplorer.remove();
|
||||
reload = true;
|
||||
}
|
||||
window.dataExplorer = null;
|
||||
var $el = $('<div />');
|
||||
$el.appendTo(window.explorerDiv);
|
||||
|
||||
window.dataExplorer = new recline.View.MultiView({
|
||||
model: dataset,
|
||||
el: $el,
|
||||
state: state
|
||||
});
|
||||
}
|
||||
|
||||
// provide a demonstration in memory dataset
|
||||
function localDataset() {
|
||||
var dataset = Fixture.getDataset();
|
||||
return dataset;
|
||||
}
|
||||
|
||||
24
demos/multiview/index.html
Normal file
24
demos/multiview/index.html
Normal file
@ -0,0 +1,24 @@
|
||||
---
|
||||
layout: container
|
||||
title: Demos - Multiview
|
||||
recline-deps: true
|
||||
root: ../../
|
||||
---
|
||||
|
||||
<style type="text/css">
|
||||
.recline-slickgrid {
|
||||
height: 450px;
|
||||
}
|
||||
|
||||
.recline-timeline .vmm-timeline {
|
||||
height: 450px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="data-explorer-here"></div>
|
||||
|
||||
<div style="clear: both;"></div>
|
||||
|
||||
<script type="text/javascript" src="{{page.root}}/test/base.js"></script>
|
||||
<script type="text/javascript" src="app.js"></script>
|
||||
|
||||
2290
dist/recline.js
vendored
2290
dist/recline.js
vendored
File diff suppressed because it is too large
Load Diff
@ -1,97 +0,0 @@
|
||||
<!DOCTYPE html> <html> <head> <title>base.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="base.html"> base.js </a> <a class="source" href="csv.html"> csv.js </a> <a class="source" href="dataproxy.html"> dataproxy.js </a> <a class="source" href="elasticsearch.html"> elasticsearch.js </a> <a class="source" href="gdocs.html"> gdocs.js </a> <a class="source" href="memory.html"> memory.js </a> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> base.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> <h1>Recline Backends</h1>
|
||||
|
||||
<p>Backends are connectors to backend data sources and stores</p>
|
||||
|
||||
<p>This is just the base module containing a template Base class and convenience methods.</p> </td> <td class="code"> <div class="highlight"><pre><span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span> <span class="o">||</span> <span class="p">{};</span></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <h2>recline.Backend.Base</h2>
|
||||
|
||||
<p>Exemplar 'class' for backends showing what a base class would look like.</p> </td> <td class="code"> <div class="highlight"><pre><span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">Base</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <h3><strong>type</strong></h3>
|
||||
|
||||
<p>'type' of this backend. This should be either the class path for this
|
||||
object as a string (e.g. recline.Backend.Memory) or for Backends within
|
||||
recline.Backend module it may be their class name.</p>
|
||||
|
||||
<p>This value is used as an identifier for this backend when initializing
|
||||
backends (see recline.Model.Dataset.initialize).</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">__type__</span> <span class="o">=</span> <span class="s1">'base'</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-4">¶</a> </div> <h3>readonly</h3>
|
||||
|
||||
<p>Class level attribute indicating that this backend is read-only (that
|
||||
is, cannot be written to).</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">readonly</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <h3>sync</h3>
|
||||
|
||||
<p>An implementation of Backbone.sync that will be used to override
|
||||
Backbone.sync on operations for Datasets and Documents which are using this backend.</p>
|
||||
|
||||
<p>For read-only implementations you will need only to implement read method
|
||||
for Dataset models (and even this can be a null operation). The read method
|
||||
should return relevant metadata for the Dataset. We do not require read support
|
||||
for Documents because they are loaded in bulk by the query method.</p>
|
||||
|
||||
<p>For backends supporting write operations you must implement update and delete support for Document objects.</p>
|
||||
|
||||
<p>All code paths should return an object conforming to the jquery promise API.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">sync</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">method</span><span class="p">,</span> <span class="nx">model</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="p">},</span>
|
||||
</pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <h3>query</h3>
|
||||
|
||||
<p>Query the backend for documents returning them in bulk. This method will
|
||||
be used by the Dataset.query method to search the backend for documents,
|
||||
retrieving the results in bulk.</p>
|
||||
|
||||
<p>@param {recline.model.Dataset} model: Dataset model.</p>
|
||||
|
||||
<p>@param {Object} queryObj: object describing a query (usually produced by
|
||||
using recline.Model.Query and calling toJSON on it).</p>
|
||||
|
||||
<p>The structure of data in the Query object or
|
||||
Hash should follow that defined in <a
|
||||
href="http://github.com/okfn/recline/issues/34">issue 34</a>.
|
||||
(Of course, if you are writing your own backend, and hence
|
||||
have control over the interpretation of the query object, you
|
||||
can use whatever structure you like).</p>
|
||||
|
||||
<p>@returns {Promise} promise API object. The promise resolve method will
|
||||
be called on query completion with a QueryResult object.</p>
|
||||
|
||||
<p>A QueryResult has the following structure (modelled closely on
|
||||
ElasticSearch - see <a
|
||||
href="https://github.com/okfn/recline/issues/57">this issue for more
|
||||
details</a>):</p>
|
||||
|
||||
<pre>
|
||||
{
|
||||
total: // (required) total number of results (can be null)
|
||||
hits: [ // (required) one entry for each result document
|
||||
{
|
||||
_score: // (optional) match score for document
|
||||
_type: // (optional) document type
|
||||
_source: // (required) document/row object
|
||||
}
|
||||
],
|
||||
facets: { // (optional)
|
||||
// facet results (as per <http://www.elasticsearch.org/guide/reference/api/search/facets/>)
|
||||
}
|
||||
}
|
||||
</pre> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">query</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">model</span><span class="p">,</span> <span class="nx">queryObj</span><span class="p">)</span> <span class="p">{}</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <h3>makeRequest</h3>
|
||||
|
||||
<p>Just $.ajax but in any headers in the 'headers' attribute of this
|
||||
Backend instance. Example:</p>
|
||||
|
||||
<pre>
|
||||
var jqxhr = this._makeRequest({
|
||||
url: the-url
|
||||
});
|
||||
</pre> </td> <td class="code"> <div class="highlight"><pre><span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">makeRequest</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">data</span><span class="p">,</span> <span class="nx">headers</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">extras</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">headers</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">extras</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">beforeSend</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">req</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">headers</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">value</span><span class="p">,</span> <span class="nx">key</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">req</span><span class="p">.</span><span class="nx">setRequestHeader</span><span class="p">(</span><span class="nx">key</span><span class="p">,</span> <span class="nx">value</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">}</span>
|
||||
<span class="kd">var</span> <span class="nx">data</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span><span class="nx">extras</span><span class="p">,</span> <span class="nx">data</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="nx">$</span><span class="p">.</span><span class="nx">ajax</span><span class="p">(</span><span class="nx">data</span><span class="p">);</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
</pre></div> </td> </tr> </tbody> </table> </div> </body> </html>
|
||||
@ -1,108 +0,0 @@
|
||||
<!DOCTYPE html> <html> <head> <title>dataproxy.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="base.html"> base.js </a> <a class="source" href="csv.html"> csv.js </a> <a class="source" href="dataproxy.html"> dataproxy.js </a> <a class="source" href="elasticsearch.html"> elasticsearch.js </a> <a class="source" href="gdocs.html"> gdocs.js </a> <a class="source" href="memory.html"> memory.js </a> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> dataproxy.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> </td> <td class="code"> <div class="highlight"><pre><span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">DataProxy</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">DataProxy</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
|
||||
<span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">$</span><span class="p">,</span> <span class="nx">my</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <h2>DataProxy Backend</h2>
|
||||
|
||||
<p>For connecting to <a href="http://github.com/okfn/dataproxy">DataProxy-s</a>.</p>
|
||||
|
||||
<p>When initializing the DataProxy backend you can set the following
|
||||
attributes in the options object:</p>
|
||||
|
||||
<ul>
|
||||
<li>dataproxy: {url-to-proxy} (optional). Defaults to http://jsonpdataproxy.appspot.com</li>
|
||||
</ul>
|
||||
|
||||
<p>Datasets using using this backend should set the following attributes:</p>
|
||||
|
||||
<ul>
|
||||
<li>url: (required) url-of-data-to-proxy</li>
|
||||
<li>format: (optional) csv | xls (defaults to csv if not specified)</li>
|
||||
</ul>
|
||||
|
||||
<p>Note that this is a <strong>read-only</strong> backend.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">Backbone</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">__type__</span> <span class="o">=</span> <span class="s1">'dataproxy'</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">readonly</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">dataproxy_url</span> <span class="o">=</span> <span class="nx">options</span> <span class="o">&&</span> <span class="nx">options</span><span class="p">.</span><span class="nx">dataproxy_url</span> <span class="o">?</span> <span class="nx">options</span><span class="p">.</span><span class="nx">dataproxy_url</span> <span class="o">:</span> <span class="s1">'http://jsonpdataproxy.appspot.com'</span><span class="p">;</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">sync</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">method</span><span class="p">,</span> <span class="nx">model</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">method</span> <span class="o">===</span> <span class="s2">"read"</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">model</span><span class="p">.</span><span class="nx">__type__</span> <span class="o">==</span> <span class="s1">'Dataset'</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <p>Do nothing as we will get fields in query step (and no metadata to
|
||||
retrieve)</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">model</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">alert</span><span class="p">(</span><span class="s1">'This backend only supports read operations'</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">query</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">dataset</span><span class="p">,</span> <span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">data</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'url'</span><span class="p">),</span>
|
||||
<span class="s1">'max-results'</span><span class="o">:</span> <span class="nx">queryObj</span><span class="p">.</span><span class="nx">size</span><span class="p">,</span>
|
||||
<span class="nx">type</span><span class="o">:</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'format'</span><span class="p">)</span>
|
||||
<span class="p">};</span>
|
||||
<span class="kd">var</span> <span class="nx">jqxhr</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">ajax</span><span class="p">({</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">dataproxy_url</span><span class="p">,</span>
|
||||
<span class="nx">data</span><span class="o">:</span> <span class="nx">data</span><span class="p">,</span>
|
||||
<span class="nx">dataType</span><span class="o">:</span> <span class="s1">'jsonp'</span>
|
||||
<span class="p">});</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="nx">_wrapInTimeout</span><span class="p">(</span><span class="nx">jqxhr</span><span class="p">).</span><span class="nx">done</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">results</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">results</span><span class="p">.</span><span class="nx">error</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">reject</span><span class="p">(</span><span class="nx">results</span><span class="p">.</span><span class="nx">error</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">dataset</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">reset</span><span class="p">(</span><span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">results</span><span class="p">.</span><span class="nx">fields</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">fieldId</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{</span><span class="nx">id</span><span class="o">:</span> <span class="nx">fieldId</span><span class="p">};</span>
|
||||
<span class="p">})</span>
|
||||
<span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">_out</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">results</span><span class="p">.</span><span class="nx">data</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">tmp</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">results</span><span class="p">.</span><span class="nx">fields</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">,</span> <span class="nx">idx</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">tmp</span><span class="p">[</span><span class="nx">key</span><span class="p">]</span> <span class="o">=</span> <span class="nx">doc</span><span class="p">[</span><span class="nx">idx</span><span class="p">];</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">tmp</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">({</span>
|
||||
<span class="nx">total</span><span class="o">:</span> <span class="kc">null</span><span class="p">,</span>
|
||||
<span class="nx">hits</span><span class="o">:</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">_out</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">row</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{</span> <span class="nx">_source</span><span class="o">:</span> <span class="nx">row</span> <span class="p">};</span>
|
||||
<span class="p">})</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">})</span>
|
||||
<span class="p">.</span><span class="nx">fail</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">arguments</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">reject</span><span class="p">(</span><span class="nx">arguments</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-4">¶</a> </div> <h2>_wrapInTimeout</h2>
|
||||
|
||||
<p>Convenience method providing a crude way to catch backend errors on JSONP calls.
|
||||
Many of backends use JSONP and so will not get error messages and this is
|
||||
a crude way to catch those errors.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">_wrapInTimeout</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">ourFunction</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">timeout</span> <span class="o">=</span> <span class="mi">5000</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">timer</span> <span class="o">=</span> <span class="nx">setTimeout</span><span class="p">(</span><span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">reject</span><span class="p">({</span>
|
||||
<span class="nx">message</span><span class="o">:</span> <span class="s1">'Request Error: Backend did not respond after '</span> <span class="o">+</span> <span class="p">(</span><span class="nx">timeout</span> <span class="o">/</span> <span class="mi">1000</span><span class="p">)</span> <span class="o">+</span> <span class="s1">' seconds'</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">},</span> <span class="nx">timeout</span><span class="p">);</span>
|
||||
<span class="nx">ourFunction</span><span class="p">.</span><span class="nx">done</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">arguments</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">clearTimeout</span><span class="p">(</span><span class="nx">timer</span><span class="p">);</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">arguments</span><span class="p">);</span>
|
||||
<span class="p">})</span>
|
||||
<span class="p">.</span><span class="nx">fail</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">arguments</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">clearTimeout</span><span class="p">(</span><span class="nx">timer</span><span class="p">);</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">reject</span><span class="p">(</span><span class="nx">arguments</span><span class="p">);</span>
|
||||
<span class="p">})</span>
|
||||
<span class="p">;</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="p">}(</span><span class="nx">jQuery</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">DataProxy</span><span class="p">));</span>
|
||||
|
||||
</pre></div> </td> </tr> </tbody> </table> </div> </body> </html>
|
||||
@ -1,193 +0,0 @@
|
||||
<!DOCTYPE html> <html> <head> <title>elasticsearch.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="base.html"> base.js </a> <a class="source" href="csv.html"> csv.js </a> <a class="source" href="dataproxy.html"> dataproxy.js </a> <a class="source" href="elasticsearch.html"> elasticsearch.js </a> <a class="source" href="gdocs.html"> gdocs.js </a> <a class="source" href="memory.html"> memory.js </a> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> elasticsearch.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> </td> <td class="code"> <div class="highlight"><pre><span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">ElasticSearch</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">ElasticSearch</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
|
||||
<span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">$</span><span class="p">,</span> <span class="nx">my</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <h2>ElasticSearch Wrapper</h2>
|
||||
|
||||
<p>Connecting to <a href="http://www.elasticsearch.org/">ElasticSearch</a> endpoints.
|
||||
@param {String} endpoint: url for ElasticSearch type/table, e.g. for ES running
|
||||
on localhost:9200 with index // twitter and type tweet it would be:</p>
|
||||
|
||||
<pre>http://localhost:9200/twitter/tweet</pre>
|
||||
|
||||
<p>@param {Object} options: set of options such as:</p>
|
||||
|
||||
<ul>
|
||||
<li>headers - {dict of headers to add to each request}</li>
|
||||
<li>dataType: dataType for AJAx requests e.g. set to jsonp to make jsonp requests (default is json requests)</li>
|
||||
</ul> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">Wrapper</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">endpoint</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">endpoint</span> <span class="o">=</span> <span class="nx">endpoint</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">options</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">dataType</span><span class="o">:</span> <span class="s1">'json'</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">options</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <h3>mapping</h3>
|
||||
|
||||
<p>Get ES mapping for this type/table</p>
|
||||
|
||||
<p>@return promise compatible deferred object.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">mapping</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">schemaUrl</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">endpoint</span> <span class="o">+</span> <span class="s1">'/_mapping'</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">jqxhr</span> <span class="o">=</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">makeRequest</span><span class="p">({</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="nx">schemaUrl</span><span class="p">,</span>
|
||||
<span class="nx">dataType</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">options</span><span class="p">.</span><span class="nx">dataType</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">jqxhr</span><span class="p">;</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-4">¶</a> </div> <h3>get</h3>
|
||||
|
||||
<p>Get document corresponding to specified id</p>
|
||||
|
||||
<p>@return promise compatible deferred object.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">get</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">id</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">base</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">endpoint</span> <span class="o">+</span> <span class="s1">'/'</span> <span class="o">+</span> <span class="nx">id</span><span class="p">;</span>
|
||||
<span class="k">return</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">makeRequest</span><span class="p">({</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="nx">base</span><span class="p">,</span>
|
||||
<span class="nx">dataType</span><span class="o">:</span> <span class="s1">'json'</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <h3>upsert</h3>
|
||||
|
||||
<p>create / update a document to ElasticSearch backend</p>
|
||||
|
||||
<p>@param {Object} doc an object to insert to the index.
|
||||
@return deferred supporting promise API</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">upsert</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">data</span> <span class="o">=</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">stringify</span><span class="p">(</span><span class="nx">doc</span><span class="p">);</span>
|
||||
<span class="nx">url</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">endpoint</span><span class="p">;</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">doc</span><span class="p">.</span><span class="nx">id</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">url</span> <span class="o">+=</span> <span class="s1">'/'</span> <span class="o">+</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">id</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">makeRequest</span><span class="p">({</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="nx">url</span><span class="p">,</span>
|
||||
<span class="nx">type</span><span class="o">:</span> <span class="s1">'POST'</span><span class="p">,</span>
|
||||
<span class="nx">data</span><span class="o">:</span> <span class="nx">data</span><span class="p">,</span>
|
||||
<span class="nx">dataType</span><span class="o">:</span> <span class="s1">'json'</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <h3>delete</h3>
|
||||
|
||||
<p>Delete a document from the ElasticSearch backend.</p>
|
||||
|
||||
<p>@param {Object} id id of object to delete
|
||||
@return deferred supporting promise API</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="k">delete</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">id</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">url</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">endpoint</span><span class="p">;</span>
|
||||
<span class="nx">url</span> <span class="o">+=</span> <span class="s1">'/'</span> <span class="o">+</span> <span class="nx">id</span><span class="p">;</span>
|
||||
<span class="k">return</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">makeRequest</span><span class="p">({</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="nx">url</span><span class="p">,</span>
|
||||
<span class="nx">type</span><span class="o">:</span> <span class="s1">'DELETE'</span><span class="p">,</span>
|
||||
<span class="nx">dataType</span><span class="o">:</span> <span class="s1">'json'</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_normalizeQuery</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">out</span> <span class="o">=</span> <span class="nx">queryObj</span> <span class="o">&&</span> <span class="nx">queryObj</span><span class="p">.</span><span class="nx">toJSON</span> <span class="o">?</span> <span class="nx">queryObj</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">()</span> <span class="o">:</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">({},</span> <span class="nx">queryObj</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">out</span><span class="p">.</span><span class="nx">q</span> <span class="o">!==</span> <span class="kc">undefined</span> <span class="o">&&</span> <span class="nx">out</span><span class="p">.</span><span class="nx">q</span><span class="p">.</span><span class="nx">trim</span><span class="p">()</span> <span class="o">===</span> <span class="s1">''</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">delete</span> <span class="nx">out</span><span class="p">.</span><span class="nx">q</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">out</span><span class="p">.</span><span class="nx">q</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">out</span><span class="p">.</span><span class="nx">query</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">match_all</span><span class="o">:</span> <span class="p">{}</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">out</span><span class="p">.</span><span class="nx">query</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">query_string</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="nx">query</span><span class="o">:</span> <span class="nx">out</span><span class="p">.</span><span class="nx">q</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span>
|
||||
<span class="k">delete</span> <span class="nx">out</span><span class="p">.</span><span class="nx">q</span><span class="p">;</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <p>now do filters (note the <em>plural</em>)</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">out</span><span class="p">.</span><span class="nx">filters</span> <span class="o">&&</span> <span class="nx">out</span><span class="p">.</span><span class="nx">filters</span><span class="p">.</span><span class="nx">length</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">out</span><span class="p">.</span><span class="nx">filter</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">out</span><span class="p">.</span><span class="nx">filter</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">out</span><span class="p">.</span><span class="nx">filter</span><span class="p">.</span><span class="nx">and</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">out</span><span class="p">.</span><span class="nx">filter</span><span class="p">.</span><span class="nx">and</span> <span class="o">=</span> <span class="p">[];</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">out</span><span class="p">.</span><span class="nx">filter</span><span class="p">.</span><span class="nx">and</span> <span class="o">=</span> <span class="nx">out</span><span class="p">.</span><span class="nx">filter</span><span class="p">.</span><span class="nx">and</span><span class="p">.</span><span class="nx">concat</span><span class="p">(</span><span class="nx">out</span><span class="p">.</span><span class="nx">filters</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">out</span><span class="p">.</span><span class="nx">filters</span> <span class="o">!==</span> <span class="kc">undefined</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">delete</span> <span class="nx">out</span><span class="p">.</span><span class="nx">filters</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">out</span><span class="p">;</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">¶</a> </div> <h3>query</h3>
|
||||
|
||||
<p>@return deferred supporting promise API</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">query</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">queryNormalized</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">_normalizeQuery</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">data</span> <span class="o">=</span> <span class="p">{</span><span class="nx">source</span><span class="o">:</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">stringify</span><span class="p">(</span><span class="nx">queryNormalized</span><span class="p">)};</span>
|
||||
<span class="kd">var</span> <span class="nx">url</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">endpoint</span> <span class="o">+</span> <span class="s1">'/_search'</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">jqxhr</span> <span class="o">=</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">makeRequest</span><span class="p">({</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="nx">url</span><span class="p">,</span>
|
||||
<span class="nx">data</span><span class="o">:</span> <span class="nx">data</span><span class="p">,</span>
|
||||
<span class="nx">dataType</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">options</span><span class="p">.</span><span class="nx">dataType</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">jqxhr</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-9">¶</a> </div> <h2>ElasticSearch Backbone Backend</h2>
|
||||
|
||||
<p>Backbone connector for an ES backend.</p>
|
||||
|
||||
<p>Usage:</p>
|
||||
|
||||
<p>var backend = new recline.Backend.ElasticSearch(options);</p>
|
||||
|
||||
<p><code>options</code> are passed through to Wrapper</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">Backbone</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">esOptions</span> <span class="o">=</span> <span class="nx">options</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">__type__</span> <span class="o">=</span> <span class="s1">'elasticsearch'</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">¶</a> </div> <h3>sync</h3>
|
||||
|
||||
<p>Backbone sync implementation for this backend.</p>
|
||||
|
||||
<p>URL of ElasticSearch endpoint to use must be specified on the dataset
|
||||
(and on a Document via its dataset attribute) by the dataset having a
|
||||
url attribute.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">sync</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">method</span><span class="p">,</span> <span class="nx">model</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">model</span><span class="p">.</span><span class="nx">__type__</span> <span class="o">==</span> <span class="s1">'Dataset'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">endpoint</span> <span class="o">=</span> <span class="nx">model</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'url'</span><span class="p">);</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">endpoint</span> <span class="o">=</span> <span class="nx">model</span><span class="p">.</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'url'</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="kd">var</span> <span class="nx">es</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Wrapper</span><span class="p">(</span><span class="nx">endpoint</span><span class="p">,</span> <span class="nx">esOptions</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">method</span> <span class="o">===</span> <span class="s2">"read"</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">model</span><span class="p">.</span><span class="nx">__type__</span> <span class="o">==</span> <span class="s1">'Dataset'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="nx">es</span><span class="p">.</span><span class="nx">mapping</span><span class="p">().</span><span class="nx">done</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">schema</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-11">¶</a> </div> <p>only one top level key in ES = the type so we can ignore it</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">key</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">keys</span><span class="p">(</span><span class="nx">schema</span><span class="p">)[</span><span class="mi">0</span><span class="p">];</span>
|
||||
<span class="kd">var</span> <span class="nx">fieldData</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">schema</span><span class="p">[</span><span class="nx">key</span><span class="p">].</span><span class="nx">properties</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">dict</span><span class="p">,</span> <span class="nx">fieldName</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">dict</span><span class="p">.</span><span class="nx">id</span> <span class="o">=</span> <span class="nx">fieldName</span><span class="p">;</span>
|
||||
<span class="k">return</span> <span class="nx">dict</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">reset</span><span class="p">(</span><span class="nx">fieldData</span><span class="p">);</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">model</span><span class="p">);</span>
|
||||
<span class="p">})</span>
|
||||
<span class="p">.</span><span class="nx">fail</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">arguments</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">reject</span><span class="p">(</span><span class="nx">arguments</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">model</span><span class="p">.</span><span class="nx">__type__</span> <span class="o">==</span> <span class="s1">'Document'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">es</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">model</span><span class="p">.</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">id</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">method</span> <span class="o">===</span> <span class="s1">'update'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">model</span><span class="p">.</span><span class="nx">__type__</span> <span class="o">==</span> <span class="s1">'Document'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">es</span><span class="p">.</span><span class="nx">upsert</span><span class="p">(</span><span class="nx">model</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">());</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">method</span> <span class="o">===</span> <span class="s1">'delete'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">model</span><span class="p">.</span><span class="nx">__type__</span> <span class="o">==</span> <span class="s1">'Document'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">es</span><span class="p">.</span><span class="k">delete</span><span class="p">(</span><span class="nx">model</span><span class="p">.</span><span class="nx">id</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-12">¶</a> </div> <h3>query</h3>
|
||||
|
||||
<p>query the ES backend</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">query</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">model</span><span class="p">,</span> <span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">url</span> <span class="o">=</span> <span class="nx">model</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'url'</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">es</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Wrapper</span><span class="p">(</span><span class="nx">url</span><span class="p">,</span> <span class="nx">esOptions</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">jqxhr</span> <span class="o">=</span> <span class="nx">es</span><span class="p">.</span><span class="nx">query</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-13">¶</a> </div> <p>TODO: fail case</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">jqxhr</span><span class="p">.</span><span class="nx">done</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">results</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">results</span><span class="p">.</span><span class="nx">hits</span><span class="p">.</span><span class="nx">hits</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">hit</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="p">(</span><span class="s1">'id'</span> <span class="k">in</span> <span class="nx">hit</span><span class="p">.</span><span class="nx">_source</span><span class="p">)</span> <span class="o">&&</span> <span class="nx">hit</span><span class="p">.</span><span class="nx">_id</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">hit</span><span class="p">.</span><span class="nx">_source</span><span class="p">.</span><span class="nx">id</span> <span class="o">=</span> <span class="nx">hit</span><span class="p">.</span><span class="nx">_id</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">results</span><span class="p">.</span><span class="nx">facets</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">results</span><span class="p">.</span><span class="nx">hits</span><span class="p">.</span><span class="nx">facets</span> <span class="o">=</span> <span class="nx">results</span><span class="p">.</span><span class="nx">facets</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">results</span><span class="p">.</span><span class="nx">hits</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="p">}(</span><span class="nx">jQuery</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">ElasticSearch</span><span class="p">));</span>
|
||||
|
||||
</pre></div> </td> </tr> </tbody> </table> </div> </body> </html>
|
||||
@ -1,149 +0,0 @@
|
||||
<!DOCTYPE html> <html> <head> <title>gdocs.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="base.html"> base.js </a> <a class="source" href="csv.html"> csv.js </a> <a class="source" href="dataproxy.html"> dataproxy.js </a> <a class="source" href="elasticsearch.html"> elasticsearch.js </a> <a class="source" href="gdocs.html"> gdocs.js </a> <a class="source" href="memory.html"> memory.js </a> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> gdocs.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> </td> <td class="code"> <div class="highlight"><pre><span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">GDocs</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">GDocs</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
|
||||
<span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">$</span><span class="p">,</span> <span class="nx">my</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <h2>Google spreadsheet backend</h2>
|
||||
|
||||
<p>Connect to Google Docs spreadsheet.</p>
|
||||
|
||||
<p>Dataset must have a url attribute pointing to the Gdocs
|
||||
spreadsheet's JSON feed e.g.</p>
|
||||
|
||||
<pre>
|
||||
var dataset = new recline.Model.Dataset({
|
||||
url: 'https://spreadsheets.google.com/feeds/list/0Aon3JiuouxLUdDQwZE1JdV94cUd6NWtuZ0IyWTBjLWc/od6/public/values?alt=json'
|
||||
},
|
||||
'gdocs'
|
||||
);
|
||||
</pre> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">Backbone</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">__type__</span> <span class="o">=</span> <span class="s1">'gdocs'</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">readonly</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">sync</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">method</span><span class="p">,</span> <span class="nx">model</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">method</span> <span class="o">===</span> <span class="s2">"read"</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">model</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">query</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">dataset</span><span class="p">,</span> <span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">_dataCache</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">_dataCache</span><span class="p">);</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">loadData</span><span class="p">(</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'url'</span><span class="p">)).</span><span class="nx">done</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">result</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">dataset</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">reset</span><span class="p">(</span><span class="nx">result</span><span class="p">.</span><span class="nx">fields</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <p>cache data onto dataset (we have loaded whole gdoc it seems!)</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">dataset</span><span class="p">.</span><span class="nx">_dataCache</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">_formatResults</span><span class="p">(</span><span class="nx">dataset</span><span class="p">,</span> <span class="nx">result</span><span class="p">.</span><span class="nx">data</span><span class="p">);</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">_dataCache</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_formatResults</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">dataset</span><span class="p">,</span> <span class="nx">data</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">fields</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">pluck</span><span class="p">(</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">(),</span> <span class="s1">'id'</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-4">¶</a> </div> <p>zip the fields with the data rows to produce js objs
|
||||
TODO: factor this out as a common method with other backends</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">objs</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">data</span><span class="p">,</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">d</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">obj</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">_</span><span class="p">.</span><span class="nx">zip</span><span class="p">(</span><span class="nx">fields</span><span class="p">,</span> <span class="nx">d</span><span class="p">),</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">x</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">obj</span><span class="p">[</span><span class="nx">x</span><span class="p">[</span><span class="mi">0</span><span class="p">]]</span> <span class="o">=</span> <span class="nx">x</span><span class="p">[</span><span class="mi">1</span><span class="p">];</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">obj</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="kd">var</span> <span class="nx">out</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">total</span><span class="o">:</span> <span class="nx">objs</span><span class="p">.</span><span class="nx">length</span><span class="p">,</span>
|
||||
<span class="nx">hits</span><span class="o">:</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">objs</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">row</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{</span> <span class="nx">_source</span><span class="o">:</span> <span class="nx">row</span> <span class="p">}</span>
|
||||
<span class="p">})</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">out</span><span class="p">;</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <h2>loadData</h2>
|
||||
|
||||
<p>loadData from a google docs URL</p>
|
||||
|
||||
<p>@return object with two attributes</p>
|
||||
|
||||
<ul>
|
||||
<li>fields: array of objects</li>
|
||||
<li>data: array of arrays</li>
|
||||
</ul> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">loadData</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">url</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">url</span> <span class="o">=</span> <span class="nx">my</span><span class="p">.</span><span class="nx">getSpreadsheetAPIUrl</span><span class="p">(</span><span class="nx">url</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">out</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">fields</span><span class="o">:</span> <span class="p">[],</span>
|
||||
<span class="nx">data</span><span class="o">:</span> <span class="p">[]</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">$</span><span class="p">.</span><span class="nx">getJSON</span><span class="p">(</span><span class="nx">url</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">d</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">result</span> <span class="o">=</span> <span class="nx">my</span><span class="p">.</span><span class="nx">parseData</span><span class="p">(</span><span class="nx">d</span><span class="p">);</span>
|
||||
<span class="nx">result</span><span class="p">.</span><span class="nx">fields</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">result</span><span class="p">.</span><span class="nx">fields</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">fieldId</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{</span><span class="nx">id</span><span class="o">:</span> <span class="nx">fieldId</span><span class="p">};</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">result</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <h2>parseData</h2>
|
||||
|
||||
<p>Parse data from Google Docs API into a reasonable form</p>
|
||||
|
||||
<p>:options: (optional) optional argument dictionary:
|
||||
columnsToUse: list of columns to use (specified by field names)
|
||||
colTypes: dictionary (with column names as keys) specifying types (e.g. range, percent for use in conversion).
|
||||
:return: tabular data object (hash with keys: field and data).</p>
|
||||
|
||||
<p>Issues: seems google docs return columns in rows in random order and not even sure whether consistent across rows.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">parseData</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">gdocsSpreadsheet</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">options</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">arguments</span><span class="p">.</span><span class="nx">length</span> <span class="o">></span> <span class="mi">1</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">options</span> <span class="o">=</span> <span class="nx">arguments</span><span class="p">[</span><span class="mi">1</span><span class="p">];</span>
|
||||
<span class="p">}</span>
|
||||
<span class="kd">var</span> <span class="nx">results</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="s1">'fields'</span><span class="o">:</span> <span class="p">[],</span>
|
||||
<span class="s1">'data'</span><span class="o">:</span> <span class="p">[]</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <p>default is no special info on type of columns</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">colTypes</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">options</span><span class="p">.</span><span class="nx">colTypes</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">colTypes</span> <span class="o">=</span> <span class="nx">options</span><span class="p">.</span><span class="nx">colTypes</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">gdocsSpreadsheet</span><span class="p">.</span><span class="nx">feed</span><span class="p">.</span><span class="nx">entry</span><span class="p">.</span><span class="nx">length</span> <span class="o">></span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">k</span> <span class="k">in</span> <span class="nx">gdocsSpreadsheet</span><span class="p">.</span><span class="nx">feed</span><span class="p">.</span><span class="nx">entry</span><span class="p">[</span><span class="mi">0</span><span class="p">])</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">k</span><span class="p">.</span><span class="nx">substr</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="mi">3</span><span class="p">)</span> <span class="o">==</span> <span class="s1">'gsx'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">col</span> <span class="o">=</span> <span class="nx">k</span><span class="p">.</span><span class="nx">substr</span><span class="p">(</span><span class="mi">4</span><span class="p">);</span>
|
||||
<span class="nx">results</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">col</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">¶</a> </div> <p>converts non numberical values that should be numerical (22.3%[string] -> 0.223[float])</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">rep</span> <span class="o">=</span> <span class="sr">/^([\d\.\-]+)\%$/</span><span class="p">;</span>
|
||||
<span class="nx">$</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">gdocsSpreadsheet</span><span class="p">.</span><span class="nx">feed</span><span class="p">.</span><span class="nx">entry</span><span class="p">,</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">i</span><span class="p">,</span> <span class="nx">entry</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">row</span> <span class="o">=</span> <span class="p">[];</span>
|
||||
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">k</span> <span class="k">in</span> <span class="nx">results</span><span class="p">.</span><span class="nx">fields</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">col</span> <span class="o">=</span> <span class="nx">results</span><span class="p">.</span><span class="nx">fields</span><span class="p">[</span><span class="nx">k</span><span class="p">];</span>
|
||||
<span class="kd">var</span> <span class="nx">_keyname</span> <span class="o">=</span> <span class="s1">'gsx$'</span> <span class="o">+</span> <span class="nx">col</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">value</span> <span class="o">=</span> <span class="nx">entry</span><span class="p">[</span><span class="nx">_keyname</span><span class="p">][</span><span class="s1">'$t'</span><span class="p">];</span></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-9">¶</a> </div> <p>if labelled as % and value contains %, convert</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">colTypes</span><span class="p">[</span><span class="nx">col</span><span class="p">]</span> <span class="o">==</span> <span class="s1">'percent'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">rep</span><span class="p">.</span><span class="nx">test</span><span class="p">(</span><span class="nx">value</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">value2</span> <span class="o">=</span> <span class="nx">rep</span><span class="p">.</span><span class="nx">exec</span><span class="p">(</span><span class="nx">value</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">value3</span> <span class="o">=</span> <span class="nb">parseFloat</span><span class="p">(</span><span class="nx">value2</span><span class="p">);</span>
|
||||
<span class="nx">value</span> <span class="o">=</span> <span class="nx">value3</span> <span class="o">/</span> <span class="mi">100</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">row</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">value</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">results</span><span class="p">.</span><span class="nx">data</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">row</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">results</span><span class="p">;</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">¶</a> </div> <p>Convenience function to get GDocs JSON API Url from standard URL</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">getSpreadsheetAPIUrl</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">url</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">url</span><span class="p">.</span><span class="nx">indexOf</span><span class="p">(</span><span class="s1">'feeds/list'</span><span class="p">)</span> <span class="o">!=</span> <span class="o">-</span><span class="mi">1</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">url</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-11">¶</a> </div> <p>https://docs.google.com/spreadsheet/ccc?key=XXXX#gid=0</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">regex</span> <span class="o">=</span> <span class="sr">/.*spreadsheet\/ccc?.*key=([^#?&+]+).*/</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">matches</span> <span class="o">=</span> <span class="nx">url</span><span class="p">.</span><span class="nx">match</span><span class="p">(</span><span class="nx">regex</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">matches</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">key</span> <span class="o">=</span> <span class="nx">matches</span><span class="p">[</span><span class="mi">1</span><span class="p">];</span>
|
||||
<span class="kd">var</span> <span class="nx">worksheet</span> <span class="o">=</span> <span class="mi">1</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">out</span> <span class="o">=</span> <span class="s1">'https://spreadsheets.google.com/feeds/list/'</span> <span class="o">+</span> <span class="nx">key</span> <span class="o">+</span> <span class="s1">'/'</span> <span class="o">+</span> <span class="nx">worksheet</span> <span class="o">+</span> <span class="s1">'/public/values?alt=json'</span><span class="p">;</span>
|
||||
<span class="k">return</span> <span class="nx">out</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">alert</span><span class="p">(</span><span class="s1">'Failed to extract gdocs key from '</span> <span class="o">+</span> <span class="nx">url</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">}(</span><span class="nx">jQuery</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">GDocs</span><span class="p">));</span>
|
||||
|
||||
</pre></div> </td> </tr> </tbody> </table> </div> </body> </html>
|
||||
@ -1,190 +0,0 @@
|
||||
/*--------------------- Layout and Typography ----------------------------*/
|
||||
body {
|
||||
font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, FreeSerif, serif;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
color: #252519;
|
||||
margin: 0; padding: 0;
|
||||
background: #f5f5ff;
|
||||
}
|
||||
a {
|
||||
color: #261a3b;
|
||||
}
|
||||
a:visited {
|
||||
color: #261a3b;
|
||||
}
|
||||
p {
|
||||
margin: 0 0 15px 0;
|
||||
}
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
margin: 40px 0 15px 0;
|
||||
}
|
||||
h2, h3, h4, h5, h6 {
|
||||
margin-top: 0;
|
||||
}
|
||||
#container {
|
||||
background: white;
|
||||
}
|
||||
#container, div.section {
|
||||
position: relative;
|
||||
}
|
||||
#background {
|
||||
position: absolute;
|
||||
top: 0; left: 580px; right: 0; bottom: 0;
|
||||
background: #f5f5ff;
|
||||
border-left: 1px solid #e5e5ee;
|
||||
z-index: 0;
|
||||
}
|
||||
#jump_to, #jump_page {
|
||||
background: white;
|
||||
-webkit-box-shadow: 0 0 25px #777; -moz-box-shadow: 0 0 25px #777;
|
||||
-webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomleft: 5px;
|
||||
font: 10px Arial;
|
||||
text-transform: uppercase;
|
||||
cursor: pointer;
|
||||
text-align: right;
|
||||
}
|
||||
#jump_to, #jump_wrapper {
|
||||
position: fixed;
|
||||
right: 0; top: 0;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
#jump_wrapper {
|
||||
padding: 0;
|
||||
display: none;
|
||||
}
|
||||
#jump_to:hover #jump_wrapper {
|
||||
display: block;
|
||||
}
|
||||
#jump_page {
|
||||
padding: 5px 0 3px;
|
||||
margin: 0 0 25px 25px;
|
||||
}
|
||||
#jump_page .source {
|
||||
display: block;
|
||||
padding: 5px 10px;
|
||||
text-decoration: none;
|
||||
border-top: 1px solid #eee;
|
||||
}
|
||||
#jump_page .source:hover {
|
||||
background: #f5f5ff;
|
||||
}
|
||||
#jump_page .source:first-child {
|
||||
}
|
||||
div.docs {
|
||||
float: left;
|
||||
max-width: 500px;
|
||||
min-width: 500px;
|
||||
min-height: 5px;
|
||||
padding: 10px 25px 1px 50px;
|
||||
vertical-align: top;
|
||||
text-align: left;
|
||||
}
|
||||
.docs pre {
|
||||
margin: 15px 0 15px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
.docs p tt, .docs p code {
|
||||
background: #f8f8ff;
|
||||
border: 1px solid #dedede;
|
||||
font-size: 12px;
|
||||
padding: 0 0.2em;
|
||||
}
|
||||
.octowrap {
|
||||
position: relative;
|
||||
}
|
||||
.octothorpe {
|
||||
font: 12px Arial;
|
||||
text-decoration: none;
|
||||
color: #454545;
|
||||
position: absolute;
|
||||
top: 3px; left: -20px;
|
||||
padding: 1px 2px;
|
||||
opacity: 0;
|
||||
-webkit-transition: opacity 0.2s linear;
|
||||
}
|
||||
div.docs:hover .octothorpe {
|
||||
opacity: 1;
|
||||
}
|
||||
div.code {
|
||||
margin-left: 580px;
|
||||
padding: 14px 15px 16px 50px;
|
||||
vertical-align: top;
|
||||
}
|
||||
.code pre, .docs p code {
|
||||
font-size: 12px;
|
||||
}
|
||||
pre, tt, code {
|
||||
line-height: 18px;
|
||||
font-family: Monaco, Consolas, "Lucida Console", monospace;
|
||||
margin: 0; padding: 0;
|
||||
}
|
||||
div.clearall {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
|
||||
/*---------------------- Syntax Highlighting -----------------------------*/
|
||||
td.linenos { background-color: #f0f0f0; padding-right: 10px; }
|
||||
span.lineno { background-color: #f0f0f0; padding: 0 5px 0 5px; }
|
||||
body .hll { background-color: #ffffcc }
|
||||
body .c { color: #408080; font-style: italic } /* Comment */
|
||||
body .err { border: 1px solid #FF0000 } /* Error */
|
||||
body .k { color: #954121 } /* Keyword */
|
||||
body .o { color: #666666 } /* Operator */
|
||||
body .cm { color: #408080; font-style: italic } /* Comment.Multiline */
|
||||
body .cp { color: #BC7A00 } /* Comment.Preproc */
|
||||
body .c1 { color: #408080; font-style: italic } /* Comment.Single */
|
||||
body .cs { color: #408080; font-style: italic } /* Comment.Special */
|
||||
body .gd { color: #A00000 } /* Generic.Deleted */
|
||||
body .ge { font-style: italic } /* Generic.Emph */
|
||||
body .gr { color: #FF0000 } /* Generic.Error */
|
||||
body .gh { color: #000080; font-weight: bold } /* Generic.Heading */
|
||||
body .gi { color: #00A000 } /* Generic.Inserted */
|
||||
body .go { color: #808080 } /* Generic.Output */
|
||||
body .gp { color: #000080; font-weight: bold } /* Generic.Prompt */
|
||||
body .gs { font-weight: bold } /* Generic.Strong */
|
||||
body .gu { color: #800080; font-weight: bold } /* Generic.Subheading */
|
||||
body .gt { color: #0040D0 } /* Generic.Traceback */
|
||||
body .kc { color: #954121 } /* Keyword.Constant */
|
||||
body .kd { color: #954121; font-weight: bold } /* Keyword.Declaration */
|
||||
body .kn { color: #954121; font-weight: bold } /* Keyword.Namespace */
|
||||
body .kp { color: #954121 } /* Keyword.Pseudo */
|
||||
body .kr { color: #954121; font-weight: bold } /* Keyword.Reserved */
|
||||
body .kt { color: #B00040 } /* Keyword.Type */
|
||||
body .m { color: #666666 } /* Literal.Number */
|
||||
body .s { color: #219161 } /* Literal.String */
|
||||
body .na { color: #7D9029 } /* Name.Attribute */
|
||||
body .nb { color: #954121 } /* Name.Builtin */
|
||||
body .nc { color: #0000FF; font-weight: bold } /* Name.Class */
|
||||
body .no { color: #880000 } /* Name.Constant */
|
||||
body .nd { color: #AA22FF } /* Name.Decorator */
|
||||
body .ni { color: #999999; font-weight: bold } /* Name.Entity */
|
||||
body .ne { color: #D2413A; font-weight: bold } /* Name.Exception */
|
||||
body .nf { color: #0000FF } /* Name.Function */
|
||||
body .nl { color: #A0A000 } /* Name.Label */
|
||||
body .nn { color: #0000FF; font-weight: bold } /* Name.Namespace */
|
||||
body .nt { color: #954121; font-weight: bold } /* Name.Tag */
|
||||
body .nv { color: #19469D } /* Name.Variable */
|
||||
body .ow { color: #AA22FF; font-weight: bold } /* Operator.Word */
|
||||
body .w { color: #bbbbbb } /* Text.Whitespace */
|
||||
body .mf { color: #666666 } /* Literal.Number.Float */
|
||||
body .mh { color: #666666 } /* Literal.Number.Hex */
|
||||
body .mi { color: #666666 } /* Literal.Number.Integer */
|
||||
body .mo { color: #666666 } /* Literal.Number.Oct */
|
||||
body .sb { color: #219161 } /* Literal.String.Backtick */
|
||||
body .sc { color: #219161 } /* Literal.String.Char */
|
||||
body .sd { color: #219161; font-style: italic } /* Literal.String.Doc */
|
||||
body .s2 { color: #219161 } /* Literal.String.Double */
|
||||
body .se { color: #BB6622; font-weight: bold } /* Literal.String.Escape */
|
||||
body .sh { color: #219161 } /* Literal.String.Heredoc */
|
||||
body .si { color: #BB6688; font-weight: bold } /* Literal.String.Interpol */
|
||||
body .sx { color: #954121 } /* Literal.String.Other */
|
||||
body .sr { color: #BB6688 } /* Literal.String.Regex */
|
||||
body .s1 { color: #219161 } /* Literal.String.Single */
|
||||
body .ss { color: #19469D } /* Literal.String.Symbol */
|
||||
body .bp { color: #954121 } /* Name.Builtin.Pseudo */
|
||||
body .vc { color: #19469D } /* Name.Variable.Class */
|
||||
body .vg { color: #19469D } /* Name.Variable.Global */
|
||||
body .vi { color: #19469D } /* Name.Variable.Instance */
|
||||
body .il { color: #666666 } /* Literal.Number.Integer.Long */
|
||||
186
docs/docco.css
186
docs/docco.css
@ -1,186 +0,0 @@
|
||||
/*--------------------- Layout and Typography ----------------------------*/
|
||||
body {
|
||||
font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, FreeSerif, serif;
|
||||
font-size: 15px;
|
||||
line-height: 22px;
|
||||
color: #252519;
|
||||
margin: 0; padding: 0;
|
||||
}
|
||||
a {
|
||||
color: #261a3b;
|
||||
}
|
||||
a:visited {
|
||||
color: #261a3b;
|
||||
}
|
||||
p {
|
||||
margin: 0 0 15px 0;
|
||||
}
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
margin: 0px 0 15px 0;
|
||||
}
|
||||
h1 {
|
||||
margin-top: 40px;
|
||||
}
|
||||
#container {
|
||||
position: relative;
|
||||
}
|
||||
#background {
|
||||
position: fixed;
|
||||
top: 0; left: 525px; right: 0; bottom: 0;
|
||||
background: #f5f5ff;
|
||||
border-left: 1px solid #e5e5ee;
|
||||
z-index: -1;
|
||||
}
|
||||
#jump_to, #jump_page {
|
||||
background: white;
|
||||
-webkit-box-shadow: 0 0 25px #777; -moz-box-shadow: 0 0 25px #777;
|
||||
-webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomleft: 5px;
|
||||
font: 10px Arial;
|
||||
text-transform: uppercase;
|
||||
cursor: pointer;
|
||||
text-align: right;
|
||||
}
|
||||
#jump_to, #jump_wrapper {
|
||||
position: fixed;
|
||||
right: 0; top: 0;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
#jump_wrapper {
|
||||
padding: 0;
|
||||
display: none;
|
||||
}
|
||||
#jump_to:hover #jump_wrapper {
|
||||
display: block;
|
||||
}
|
||||
#jump_page {
|
||||
padding: 5px 0 3px;
|
||||
margin: 0 0 25px 25px;
|
||||
}
|
||||
#jump_page .source {
|
||||
display: block;
|
||||
padding: 5px 10px;
|
||||
text-decoration: none;
|
||||
border-top: 1px solid #eee;
|
||||
}
|
||||
#jump_page .source:hover {
|
||||
background: #f5f5ff;
|
||||
}
|
||||
#jump_page .source:first-child {
|
||||
}
|
||||
table td {
|
||||
border: 0;
|
||||
outline: 0;
|
||||
}
|
||||
td.docs, th.docs {
|
||||
max-width: 450px;
|
||||
min-width: 450px;
|
||||
min-height: 5px;
|
||||
padding: 10px 25px 1px 50px;
|
||||
overflow-x: hidden;
|
||||
vertical-align: top;
|
||||
text-align: left;
|
||||
}
|
||||
.docs pre {
|
||||
margin: 15px 0 15px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
.docs p tt, .docs p code {
|
||||
background: #f8f8ff;
|
||||
border: 1px solid #dedede;
|
||||
font-size: 12px;
|
||||
padding: 0 0.2em;
|
||||
}
|
||||
.pilwrap {
|
||||
position: relative;
|
||||
}
|
||||
.pilcrow {
|
||||
font: 12px Arial;
|
||||
text-decoration: none;
|
||||
color: #454545;
|
||||
position: absolute;
|
||||
top: 3px; left: -20px;
|
||||
padding: 1px 2px;
|
||||
opacity: 0;
|
||||
-webkit-transition: opacity 0.2s linear;
|
||||
}
|
||||
td.docs:hover .pilcrow {
|
||||
opacity: 1;
|
||||
}
|
||||
td.code, th.code {
|
||||
padding: 14px 15px 16px 25px;
|
||||
width: 100%;
|
||||
vertical-align: top;
|
||||
background: #f5f5ff;
|
||||
border-left: 1px solid #e5e5ee;
|
||||
}
|
||||
pre, tt, code {
|
||||
font-size: 12px; line-height: 18px;
|
||||
font-family: Monaco, Consolas, "Lucida Console", monospace;
|
||||
margin: 0; padding: 0;
|
||||
}
|
||||
|
||||
|
||||
/*---------------------- Syntax Highlighting -----------------------------*/
|
||||
td.linenos { background-color: #f0f0f0; padding-right: 10px; }
|
||||
span.lineno { background-color: #f0f0f0; padding: 0 5px 0 5px; }
|
||||
body .hll { background-color: #ffffcc }
|
||||
body .c { color: #408080; font-style: italic } /* Comment */
|
||||
body .err { border: 1px solid #FF0000 } /* Error */
|
||||
body .k { color: #954121 } /* Keyword */
|
||||
body .o { color: #666666 } /* Operator */
|
||||
body .cm { color: #408080; font-style: italic } /* Comment.Multiline */
|
||||
body .cp { color: #BC7A00 } /* Comment.Preproc */
|
||||
body .c1 { color: #408080; font-style: italic } /* Comment.Single */
|
||||
body .cs { color: #408080; font-style: italic } /* Comment.Special */
|
||||
body .gd { color: #A00000 } /* Generic.Deleted */
|
||||
body .ge { font-style: italic } /* Generic.Emph */
|
||||
body .gr { color: #FF0000 } /* Generic.Error */
|
||||
body .gh { color: #000080; font-weight: bold } /* Generic.Heading */
|
||||
body .gi { color: #00A000 } /* Generic.Inserted */
|
||||
body .go { color: #808080 } /* Generic.Output */
|
||||
body .gp { color: #000080; font-weight: bold } /* Generic.Prompt */
|
||||
body .gs { font-weight: bold } /* Generic.Strong */
|
||||
body .gu { color: #800080; font-weight: bold } /* Generic.Subheading */
|
||||
body .gt { color: #0040D0 } /* Generic.Traceback */
|
||||
body .kc { color: #954121 } /* Keyword.Constant */
|
||||
body .kd { color: #954121; font-weight: bold } /* Keyword.Declaration */
|
||||
body .kn { color: #954121; font-weight: bold } /* Keyword.Namespace */
|
||||
body .kp { color: #954121 } /* Keyword.Pseudo */
|
||||
body .kr { color: #954121; font-weight: bold } /* Keyword.Reserved */
|
||||
body .kt { color: #B00040 } /* Keyword.Type */
|
||||
body .m { color: #666666 } /* Literal.Number */
|
||||
body .s { color: #219161 } /* Literal.String */
|
||||
body .na { color: #7D9029 } /* Name.Attribute */
|
||||
body .nb { color: #954121 } /* Name.Builtin */
|
||||
body .nc { color: #0000FF; font-weight: bold } /* Name.Class */
|
||||
body .no { color: #880000 } /* Name.Constant */
|
||||
body .nd { color: #AA22FF } /* Name.Decorator */
|
||||
body .ni { color: #999999; font-weight: bold } /* Name.Entity */
|
||||
body .ne { color: #D2413A; font-weight: bold } /* Name.Exception */
|
||||
body .nf { color: #0000FF } /* Name.Function */
|
||||
body .nl { color: #A0A000 } /* Name.Label */
|
||||
body .nn { color: #0000FF; font-weight: bold } /* Name.Namespace */
|
||||
body .nt { color: #954121; font-weight: bold } /* Name.Tag */
|
||||
body .nv { color: #19469D } /* Name.Variable */
|
||||
body .ow { color: #AA22FF; font-weight: bold } /* Operator.Word */
|
||||
body .w { color: #bbbbbb } /* Text.Whitespace */
|
||||
body .mf { color: #666666 } /* Literal.Number.Float */
|
||||
body .mh { color: #666666 } /* Literal.Number.Hex */
|
||||
body .mi { color: #666666 } /* Literal.Number.Integer */
|
||||
body .mo { color: #666666 } /* Literal.Number.Oct */
|
||||
body .sb { color: #219161 } /* Literal.String.Backtick */
|
||||
body .sc { color: #219161 } /* Literal.String.Char */
|
||||
body .sd { color: #219161; font-style: italic } /* Literal.String.Doc */
|
||||
body .s2 { color: #219161 } /* Literal.String.Double */
|
||||
body .se { color: #BB6622; font-weight: bold } /* Literal.String.Escape */
|
||||
body .sh { color: #219161 } /* Literal.String.Heredoc */
|
||||
body .si { color: #BB6688; font-weight: bold } /* Literal.String.Interpol */
|
||||
body .sx { color: #954121 } /* Literal.String.Other */
|
||||
body .sr { color: #BB6688 } /* Literal.String.Regex */
|
||||
body .s1 { color: #219161 } /* Literal.String.Single */
|
||||
body .ss { color: #19469D } /* Literal.String.Symbol */
|
||||
body .bp { color: #954121 } /* Name.Builtin.Pseudo */
|
||||
body .vc { color: #19469D } /* Name.Variable.Class */
|
||||
body .vg { color: #19469D } /* Name.Variable.Global */
|
||||
body .vi { color: #19469D } /* Name.Variable.Instance */
|
||||
body .il { color: #666666 } /* Literal.Number.Integer.Long */
|
||||
@ -42,6 +42,8 @@ root: ../
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<img src="https://docs.google.com/drawings/pub?id=1tEKX9ybHZKdPImoy7j_m5x3_b9HzcaU1OnNfQB3F9XQ&w=888&h=539" style="display: block; margin: auto;" />
|
||||
|
||||
<div id="tutorials" class="tutorials">
|
||||
<h2>Tutorials</h2>
|
||||
<div class="alert alert-success"><strong>Note:</strong> A quick read through of the <a href="#concepts">Concepts section</a> will
|
||||
@ -113,21 +115,20 @@ root: ../
|
||||
<div class="span4">
|
||||
<h4>Backends</h4>
|
||||
<ul>
|
||||
<li><a href="backend/base.html">Base module providing convenience functions</a></li>
|
||||
<li><a href="backend/memory.html">memory: Memory Backend (local data)</a></li>
|
||||
<li><a href="backend/elasticsearch.html">elasticsearch: ElasticSearch Backend</a></li>
|
||||
<li><a href="backend/dataproxy.html">dataproxy: DataProxy Backend (CSV and XLS on the Web)</a></li>
|
||||
<li><a href="backend/gdocs.html">gdocs: Google Docs (Spreadsheet) Backend</a></li>
|
||||
<li><a href="backend/csv.html">csv: Local CSV file backend</a></li>
|
||||
<li><a href="src/backend.memory.html">memory: Memory Backend (local data)</a></li>
|
||||
<li><a href="src/backend.elasticsearch.html">elasticsearch: ElasticSearch Backend</a></li>
|
||||
<li><a href="src/backend.dataproxy.html">dataproxy: DataProxy Backend (CSV and XLS on the Web)</a></li>
|
||||
<li><a href="src/backend.gdocs.html">gdocs: Google Docs (Spreadsheet) Backend</a></li>
|
||||
<li><a href="src/backend.csv.html">csv: Local CSV file backend</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span4">
|
||||
<h4>Dataset Views and Widgets</h4>
|
||||
<ul>
|
||||
<li><a href="view.multiview.html">MultiView View (plus common view code)</a></li>
|
||||
<li><a href="view-grid.html">(Data) Grid View</a></li>
|
||||
<li><a href="view-graph.html">Graph View (based on Flot)</a></li>
|
||||
<li><a href="view-map.html">Map View (based on Leaflet)</a></li>
|
||||
<li><a href="src/view.multiview.html">MultiView View (plus common view code)</a></li>
|
||||
<li><a href="src/view.grid.html">(Data) Grid View</a></li>
|
||||
<li><a href="src/view.graph.html">Graph View (based on Flot)</a></li>
|
||||
<li><a href="src/view.map.html">Map View (based on Leaflet)</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
437
docs/model.html
437
docs/model.html
@ -1,437 +0,0 @@
|
||||
<!DOCTYPE html> <html> <head> <title>model.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="model.html"> model.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.html"> view.js </a> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> model.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> <h1>Recline Backbone Models</h1> </td> <td class="code"> <div class="highlight"><pre><span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
|
||||
<span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">$</span><span class="p">,</span> <span class="nx">my</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <h2><a id="dataset">A Dataset model</a></h2>
|
||||
|
||||
<p>A model has the following (non-Backbone) attributes:</p>
|
||||
|
||||
<p>@property {FieldList} fields: (aka columns) is a <code>FieldList</code> listing all the
|
||||
fields on this Dataset (this can be set explicitly, or, will be set by
|
||||
Dataset.fetch() or Dataset.query()</p>
|
||||
|
||||
<p>@property {DocumentList} currentDocuments: a <code>DocumentList</code> containing the
|
||||
Documents we have currently loaded for viewing (updated by calling query
|
||||
method)</p>
|
||||
|
||||
<p>@property {number} docCount: total number of documents in this dataset</p>
|
||||
|
||||
<p>@property {Backend} backend: the Backend (instance) for this Dataset.</p>
|
||||
|
||||
<p>@property {Query} queryState: <code>Query</code> object which stores current
|
||||
queryState. queryState may be edited by other components (e.g. a query
|
||||
editor view) changes will trigger a Dataset query.</p>
|
||||
|
||||
<p>@property {FacetList} facets: FacetList object containing all current
|
||||
Facets.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">Dataset</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">__type__</span><span class="o">:</span> <span class="s1">'Dataset'</span><span class="p">,</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <h3>initialize</h3>
|
||||
|
||||
<p>Sets up instance properties (see above)</p>
|
||||
|
||||
<p>@param {Object} model: standard set of model attributes passed to Backbone models</p>
|
||||
|
||||
<p>@param {Object or String} backend: Backend instance (see
|
||||
<code>recline.Backend.Base</code>) or a string specifying that instance. The
|
||||
string specifying may be a full class path e.g.
|
||||
'recline.Backend.ElasticSearch' or a simple name e.g.
|
||||
'elasticsearch' or 'ElasticSearch' (in this case must be a Backend in
|
||||
recline.Backend module)</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">initialize</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">model</span><span class="p">,</span> <span class="nx">backend</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">bindAll</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="s1">'query'</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">backend</span> <span class="o">=</span> <span class="nx">backend</span><span class="p">;</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">typeof</span><span class="p">(</span><span class="nx">backend</span><span class="p">)</span> <span class="o">===</span> <span class="s1">'string'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">backend</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">_backendFromString</span><span class="p">(</span><span class="nx">backend</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">fields</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">FieldList</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">currentDocuments</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">DocumentList</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">facets</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">FacetList</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">docCount</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">queryState</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Query</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">queryState</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'change'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">query</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">queryState</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'facet:add'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">query</span><span class="p">);</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-4">¶</a> </div> <h3>query</h3>
|
||||
|
||||
<p>AJAX method with promise API to get documents from the backend.</p>
|
||||
|
||||
<p>It will query based on current query state (given by this.queryState)
|
||||
updated by queryObj (if provided).</p>
|
||||
|
||||
<p>Resulting DocumentList are used to reset this.currentDocuments and are
|
||||
also returned.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">query</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'query:start'</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">actualQuery</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">_prepareQuery</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">backend</span><span class="p">.</span><span class="nx">query</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="nx">actualQuery</span><span class="p">).</span><span class="nx">done</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">queryResult</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">docCount</span> <span class="o">=</span> <span class="nx">queryResult</span><span class="p">.</span><span class="nx">total</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">docs</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">queryResult</span><span class="p">.</span><span class="nx">hits</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">hit</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">_doc</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Document</span><span class="p">(</span><span class="nx">hit</span><span class="p">.</span><span class="nx">_source</span><span class="p">);</span>
|
||||
<span class="nx">_doc</span><span class="p">.</span><span class="nx">backend</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">backend</span><span class="p">;</span>
|
||||
<span class="nx">_doc</span><span class="p">.</span><span class="nx">dataset</span> <span class="o">=</span> <span class="nx">self</span><span class="p">;</span>
|
||||
<span class="k">return</span> <span class="nx">_doc</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">reset</span><span class="p">(</span><span class="nx">docs</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">queryResult</span><span class="p">.</span><span class="nx">facets</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">facets</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">queryResult</span><span class="p">.</span><span class="nx">facets</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">facetResult</span><span class="p">,</span> <span class="nx">facetId</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">facetResult</span><span class="p">.</span><span class="nx">id</span> <span class="o">=</span> <span class="nx">facetId</span><span class="p">;</span>
|
||||
<span class="k">return</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Facet</span><span class="p">(</span><span class="nx">facetResult</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">facets</span><span class="p">.</span><span class="nx">reset</span><span class="p">(</span><span class="nx">facets</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'query:done'</span><span class="p">);</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">);</span>
|
||||
<span class="p">})</span>
|
||||
<span class="p">.</span><span class="nx">fail</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">arguments</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'query:fail'</span><span class="p">,</span> <span class="nx">arguments</span><span class="p">);</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">reject</span><span class="p">(</span><span class="nx">arguments</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">_prepareQuery</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">newQueryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">newQueryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">queryState</span><span class="p">.</span><span class="nx">set</span><span class="p">(</span><span class="nx">newQueryObj</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="kd">var</span> <span class="nx">out</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">queryState</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">();</span>
|
||||
<span class="k">return</span> <span class="nx">out</span><span class="p">;</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">toTemplateJSON</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">data</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">();</span>
|
||||
<span class="nx">data</span><span class="p">.</span><span class="nx">docCount</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">docCount</span><span class="p">;</span>
|
||||
<span class="nx">data</span><span class="p">.</span><span class="nx">fields</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">();</span>
|
||||
<span class="k">return</span> <span class="nx">data</span><span class="p">;</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <h3>_backendFromString(backendString)</h3>
|
||||
|
||||
<p>See backend argument to initialize for details</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_backendFromString</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">backendString</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">parts</span> <span class="o">=</span> <span class="nx">backendString</span><span class="p">.</span><span class="nx">split</span><span class="p">(</span><span class="s1">'.'</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <p>walk through the specified path xxx.yyy.zzz to get the final object which should be backend class</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">current</span> <span class="o">=</span> <span class="nb">window</span><span class="p">;</span>
|
||||
<span class="k">for</span><span class="p">(</span><span class="nx">ii</span><span class="o">=</span><span class="mi">0</span><span class="p">;</span><span class="nx">ii</span><span class="o"><</span><span class="nx">parts</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span><span class="nx">ii</span><span class="o">++</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">current</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">break</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">current</span> <span class="o">=</span> <span class="nx">current</span><span class="p">[</span><span class="nx">parts</span><span class="p">[</span><span class="nx">ii</span><span class="p">]];</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">current</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="k">new</span> <span class="nx">current</span><span class="p">();</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <p>alternatively we just had a simple string</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">backend</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">recline</span> <span class="o">&&</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">_</span><span class="p">.</span><span class="nx">keys</span><span class="p">(</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">),</span> <span class="kd">function</span><span class="p">(</span><span class="nx">name</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">name</span><span class="p">.</span><span class="nx">toLowerCase</span><span class="p">()</span> <span class="o">===</span> <span class="nx">backendString</span><span class="p">.</span><span class="nx">toLowerCase</span><span class="p">())</span> <span class="p">{</span>
|
||||
<span class="nx">backend</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">[</span><span class="nx">name</span><span class="p">].</span><span class="nx">Backbone</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">backend</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">¶</a> </div> <h3>Dataset.restore</h3>
|
||||
|
||||
<p>Restore a Dataset instance from a serialized state. Serialized state for a
|
||||
Dataset is an Object like:</p>
|
||||
|
||||
<p><pre>
|
||||
{
|
||||
backend: {backend type - i.e. value of dataset.backend.<strong>type</strong>}
|
||||
dataset: {dataset info needed for loading -- result of dataset.toJSON() would be sufficient but can be simpler }
|
||||
// convenience - if url provided and dataste not this be used as dataset url
|
||||
url: {dataset url}
|
||||
...
|
||||
}</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">Dataset</span><span class="p">.</span><span class="nx">restore</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">state</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dataset</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-9">¶</a> </div> <p>hack-y - restoring a memory dataset does not mean much ...</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">state</span><span class="p">.</span><span class="nx">backend</span> <span class="o">===</span> <span class="s1">'memory'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">dataset</span> <span class="o">=</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">Memory</span><span class="p">.</span><span class="nx">createDataset</span><span class="p">(</span>
|
||||
<span class="p">[{</span><span class="nx">stub</span><span class="o">:</span> <span class="s1">'this is a stub dataset because we do not restore memory datasets'</span><span class="p">}],</span>
|
||||
<span class="p">[],</span>
|
||||
<span class="nx">state</span><span class="p">.</span><span class="nx">dataset</span> <span class="c1">// metadata</span>
|
||||
<span class="p">);</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">datasetInfo</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="nx">state</span><span class="p">.</span><span class="nx">url</span>
|
||||
<span class="p">};</span>
|
||||
<span class="nx">dataset</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">Dataset</span><span class="p">(</span>
|
||||
<span class="nx">datasetInfo</span><span class="p">,</span>
|
||||
<span class="nx">state</span><span class="p">.</span><span class="nx">backend</span>
|
||||
<span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">dataset</span><span class="p">;</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">¶</a> </div> <h2><a id="document">A Document (aka Row)</a></h2>
|
||||
|
||||
<p>A single entry or row in the dataset</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">Document</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">__type__</span><span class="o">:</span> <span class="s1">'Document'</span><span class="p">,</span>
|
||||
<span class="nx">initialize</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">bindAll</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="s1">'getFieldValue'</span><span class="p">);</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-11">¶</a> </div> <h3>getFieldValue</h3>
|
||||
|
||||
<p>For the provided Field get the corresponding rendered computed data value
|
||||
for this document.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">getFieldValue</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">field</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">val</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">field</span><span class="p">.</span><span class="nx">id</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">field</span><span class="p">.</span><span class="nx">deriver</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">val</span> <span class="o">=</span> <span class="nx">field</span><span class="p">.</span><span class="nx">deriver</span><span class="p">(</span><span class="nx">val</span><span class="p">,</span> <span class="nx">field</span><span class="p">,</span> <span class="k">this</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">field</span><span class="p">.</span><span class="nx">renderer</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">val</span> <span class="o">=</span> <span class="nx">field</span><span class="p">.</span><span class="nx">renderer</span><span class="p">(</span><span class="nx">val</span><span class="p">,</span> <span class="nx">field</span><span class="p">,</span> <span class="k">this</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">val</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-12">¶</a> </div> <h2>A Backbone collection of Documents</h2> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">DocumentList</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Collection</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">__type__</span><span class="o">:</span> <span class="s1">'DocumentList'</span><span class="p">,</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Document</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-13">¶</a> </div> <h2><a id="field">A Field (aka Column) on a Dataset</a></h2>
|
||||
|
||||
<p>Following (Backbone) attributes as standard:</p>
|
||||
|
||||
<ul>
|
||||
<li>id: a unique identifer for this field- usually this should match the key in the documents hash</li>
|
||||
<li>label: (optional: defaults to id) the visible label used for this field</li>
|
||||
<li>type: (optional: defaults to string) the type of the data in this field. Should be a string as per type names defined by ElasticSearch - see Types list on <a href="http://www.elasticsearch.org/guide/reference/mapping/">http://www.elasticsearch.org/guide/reference/mapping/</a></li>
|
||||
<li>format: (optional) used to indicate how the data should be formatted. For example:
|
||||
<ul><li>type=date, format=yyyy-mm-dd</li>
|
||||
<li>type=float, format=percentage</li>
|
||||
<li>type=string, format=markdown (render as markdown if Showdown available)</li></ul></li>
|
||||
<li>is_derived: (default: false) attribute indicating this field has no backend data but is just derived from other fields (see below).</li>
|
||||
</ul>
|
||||
|
||||
<p>Following additional instance properties:</p>
|
||||
|
||||
<p>@property {Function} renderer: a function to render the data for this field.
|
||||
Signature: function(value, field, doc) where value is the value of this
|
||||
cell, field is corresponding field object and document is the document
|
||||
object. Note that implementing functions can ignore arguments (e.g.
|
||||
function(value) would be a valid formatter function).</p>
|
||||
|
||||
<p>@property {Function} deriver: a function to derive/compute the value of data
|
||||
in this field as a function of this field's value (if any) and the current
|
||||
document, its signature and behaviour is the same as for renderer. Use of
|
||||
this function allows you to define an entirely new value for data in this
|
||||
field. This provides support for a) 'derived/computed' fields: i.e. fields
|
||||
whose data are functions of the data in other fields b) transforming the
|
||||
value of this field prior to rendering.</p>
|
||||
|
||||
<h4>Default renderers</h4>
|
||||
|
||||
<ul>
|
||||
<li>string
|
||||
<ul><li>no format provided: pass through but convert http:// to hyperlinks </li>
|
||||
<li>format = plain: do no processing on the source text</li>
|
||||
<li>format = markdown: process as markdown (if Showdown library available)</li></ul></li>
|
||||
<li>float
|
||||
<ul><li>format = percentage: format as a percentage</li></ul></li>
|
||||
</ul> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">Field</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span></pre></div> </td> </tr> <tr id="section-14"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-14">¶</a> </div> <h3>defaults - define default values</h3> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">defaults</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="nx">label</span><span class="o">:</span> <span class="kc">null</span><span class="p">,</span>
|
||||
<span class="nx">type</span><span class="o">:</span> <span class="s1">'string'</span><span class="p">,</span>
|
||||
<span class="nx">format</span><span class="o">:</span> <span class="kc">null</span><span class="p">,</span>
|
||||
<span class="nx">is_derived</span><span class="o">:</span> <span class="kc">false</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-15"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-15">¶</a> </div> <h3>initialize</h3>
|
||||
|
||||
<p>@param {Object} data: standard Backbone model attributes</p>
|
||||
|
||||
<p>@param {Object} options: renderer and/or deriver functions.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">initialize</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">data</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-16"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-16">¶</a> </div> <p>if a hash not passed in the first argument throw error</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="s1">'0'</span> <span class="k">in</span> <span class="nx">data</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">throw</span> <span class="k">new</span> <span class="nb">Error</span><span class="p">(</span><span class="s1">'Looks like you did not pass a proper hash with id to Field constructor'</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">attributes</span><span class="p">.</span><span class="nx">label</span> <span class="o">===</span> <span class="kc">null</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span><span class="nx">label</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">id</span><span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">renderer</span> <span class="o">=</span> <span class="nx">options</span><span class="p">.</span><span class="nx">renderer</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">deriver</span> <span class="o">=</span> <span class="nx">options</span><span class="p">.</span><span class="nx">deriver</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">renderer</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">renderer</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">defaultRenderers</span><span class="p">[</span><span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'type'</span><span class="p">)];</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">defaultRenderers</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="nx">object</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">val</span><span class="p">,</span> <span class="nx">field</span><span class="p">,</span> <span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">stringify</span><span class="p">(</span><span class="nx">val</span><span class="p">);</span>
|
||||
<span class="p">},</span>
|
||||
<span class="s1">'float'</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">val</span><span class="p">,</span> <span class="nx">field</span><span class="p">,</span> <span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">format</span> <span class="o">=</span> <span class="nx">field</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'format'</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">format</span> <span class="o">===</span> <span class="s1">'percentage'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">val</span> <span class="o">+</span> <span class="s1">'%'</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">val</span><span class="p">;</span>
|
||||
<span class="p">},</span>
|
||||
<span class="s1">'string'</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">val</span><span class="p">,</span> <span class="nx">field</span><span class="p">,</span> <span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">format</span> <span class="o">=</span> <span class="nx">field</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'format'</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">format</span> <span class="o">===</span> <span class="s1">'markdown'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">typeof</span> <span class="nx">Showdown</span> <span class="o">!==</span> <span class="s1">'undefined'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">showdown</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Showdown</span><span class="p">.</span><span class="nx">converter</span><span class="p">();</span>
|
||||
<span class="nx">out</span> <span class="o">=</span> <span class="nx">showdown</span><span class="p">.</span><span class="nx">makeHtml</span><span class="p">(</span><span class="nx">val</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="nx">out</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">val</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">format</span> <span class="o">==</span> <span class="s1">'plain'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">val</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-17"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-17">¶</a> </div> <p>as this is the default and default type is string may get things
|
||||
here that are not actually strings</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">val</span> <span class="o">&&</span> <span class="k">typeof</span> <span class="nx">val</span> <span class="o">===</span> <span class="s1">'string'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">val</span> <span class="o">=</span> <span class="nx">val</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="sr">/(https?:\/\/[^ ]+)/g</span><span class="p">,</span> <span class="s1">'<a href="$1">$1</a>'</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">val</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
|
||||
<span class="nx">my</span><span class="p">.</span><span class="nx">FieldList</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Collection</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Field</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-18"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-18">¶</a> </div> <h2><a id="query">Query</a></h2>
|
||||
|
||||
<p>Query instances encapsulate a query to the backend (see <a
|
||||
href="backend/base.html">query method on backend</a>). Useful both
|
||||
for creating queries and for storing and manipulating query state -
|
||||
e.g. from a query editor).</p>
|
||||
|
||||
<p><strong>Query Structure and format</strong></p>
|
||||
|
||||
<p>Query structure should follow that of <a href="http://www.elasticsearch.org/guide/reference/api/search/">ElasticSearch query
|
||||
language</a>.</p>
|
||||
|
||||
<p><strong>NB: It is up to specific backends how to implement and support this query
|
||||
structure. Different backends might choose to implement things differently
|
||||
or not support certain features. Please check your backend for details.</strong></p>
|
||||
|
||||
<p>Query object has the following key attributes:</p>
|
||||
|
||||
<ul>
|
||||
<li>size (=limit): number of results to return</li>
|
||||
<li>from (=offset): offset into result set - http://www.elasticsearch.org/guide/reference/api/search/from-size.html</li>
|
||||
<li>sort: sort order - <a href="http://www.elasticsearch.org/guide/reference/api/search/sort.html">http://www.elasticsearch.org/guide/reference/api/search/sort.html</a></li>
|
||||
<li>query: Query in ES Query DSL <a href="http://www.elasticsearch.org/guide/reference/api/search/query.html">http://www.elasticsearch.org/guide/reference/api/search/query.html</a></li>
|
||||
<li>filter: See filters and <a href="http://www.elasticsearch.org/guide/reference/query-dsl/filtered-query.html">Filtered Query</a></li>
|
||||
<li>fields: set of fields to return - http://www.elasticsearch.org/guide/reference/api/search/fields.html</li>
|
||||
<li>facets: specification of facets - see http://www.elasticsearch.org/guide/reference/api/search/facets/</li>
|
||||
</ul>
|
||||
|
||||
<p>Additions:</p>
|
||||
|
||||
<ul>
|
||||
<li><p>q: either straight text or a hash will map directly onto a <a href="http://www.elasticsearch.org/guide/reference/query-dsl/query-string-query.html">query_string
|
||||
query</a>
|
||||
in backend</p>
|
||||
|
||||
<ul><li>Of course this can be re-interpreted by different backends. E.g. some
|
||||
may just pass this straight through e.g. for an SQL backend this could be
|
||||
the full SQL query</li></ul></li>
|
||||
<li><p>filters: dict of ElasticSearch filters. These will be and-ed together for
|
||||
execution.</p></li>
|
||||
</ul>
|
||||
|
||||
<p><strong>Examples</strong></p>
|
||||
|
||||
<pre>
|
||||
{
|
||||
q: 'quick brown fox',
|
||||
filters: [
|
||||
{ term: { 'owner': 'jones' } }
|
||||
]
|
||||
}
|
||||
</pre> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">Query</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">defaults</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{</span>
|
||||
<span class="nx">size</span><span class="o">:</span> <span class="mi">100</span><span class="p">,</span>
|
||||
<span class="nx">from</span><span class="o">:</span> <span class="mi">0</span><span class="p">,</span>
|
||||
<span class="nx">facets</span><span class="o">:</span> <span class="p">{},</span></pre></div> </td> </tr> <tr id="section-19"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-19">¶</a> </div> <p><a href="http://www.elasticsearch.org/guide/reference/query-dsl/and-filter.html">http://www.elasticsearch.org/guide/reference/query-dsl/and-filter.html</a>
|
||||
, filter: {}</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">filters</span><span class="o">:</span> <span class="p">[]</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-20"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-20">¶</a> </div> <h4>addTermFilter</h4>
|
||||
|
||||
<p>Set (update or add) a terms filter to filters</p>
|
||||
|
||||
<p>See <a href="http://www.elasticsearch.org/guide/reference/query-dsl/terms-filter.html">http://www.elasticsearch.org/guide/reference/query-dsl/terms-filter.html</a></p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">addTermFilter</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">fieldId</span><span class="p">,</span> <span class="nx">value</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">filters</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'filters'</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">filter</span> <span class="o">=</span> <span class="p">{</span> <span class="nx">term</span><span class="o">:</span> <span class="p">{}</span> <span class="p">};</span>
|
||||
<span class="nx">filter</span><span class="p">.</span><span class="nx">term</span><span class="p">[</span><span class="nx">fieldId</span><span class="p">]</span> <span class="o">=</span> <span class="nx">value</span><span class="p">;</span>
|
||||
<span class="nx">filters</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">filter</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span><span class="nx">filters</span><span class="o">:</span> <span class="nx">filters</span><span class="p">});</span></pre></div> </td> </tr> <tr id="section-21"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-21">¶</a> </div> <p>change does not seem to be triggered automatically</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">value</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'change'</span><span class="p">);</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-22"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-22">¶</a> </div> <p>adding a new blank filter and do not want to trigger a new query</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'change:filters:new-blank'</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-23"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-23">¶</a> </div> <h3>removeFilter</h3>
|
||||
|
||||
<p>Remove a filter from filters at index filterIndex</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">removeFilter</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">filterIndex</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">filters</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'filters'</span><span class="p">);</span>
|
||||
<span class="nx">filters</span><span class="p">.</span><span class="nx">splice</span><span class="p">(</span><span class="nx">filterIndex</span><span class="p">,</span> <span class="mi">1</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span><span class="nx">filters</span><span class="o">:</span> <span class="nx">filters</span><span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'change'</span><span class="p">);</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-24"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-24">¶</a> </div> <h3>addFacet</h3>
|
||||
|
||||
<p>Add a Facet to this query</p>
|
||||
|
||||
<p>See <a href="http://www.elasticsearch.org/guide/reference/api/search/facets/">http://www.elasticsearch.org/guide/reference/api/search/facets/</a></p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">addFacet</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">fieldId</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">facets</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'facets'</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-25"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-25">¶</a> </div> <p>Assume id and fieldId should be the same (TODO: this need not be true if we want to add two different type of facets on same field)</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">_</span><span class="p">.</span><span class="nx">contains</span><span class="p">(</span><span class="nx">_</span><span class="p">.</span><span class="nx">keys</span><span class="p">(</span><span class="nx">facets</span><span class="p">),</span> <span class="nx">fieldId</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="k">return</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">facets</span><span class="p">[</span><span class="nx">fieldId</span><span class="p">]</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">terms</span><span class="o">:</span> <span class="p">{</span> <span class="nx">field</span><span class="o">:</span> <span class="nx">fieldId</span> <span class="p">}</span>
|
||||
<span class="p">};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span><span class="nx">facets</span><span class="o">:</span> <span class="nx">facets</span><span class="p">},</span> <span class="p">{</span><span class="nx">silent</span><span class="o">:</span> <span class="kc">true</span><span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'facet:add'</span><span class="p">,</span> <span class="k">this</span><span class="p">);</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">addHistogramFacet</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">fieldId</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">facets</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'facets'</span><span class="p">);</span>
|
||||
<span class="nx">facets</span><span class="p">[</span><span class="nx">fieldId</span><span class="p">]</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">date_histogram</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="nx">field</span><span class="o">:</span> <span class="nx">fieldId</span><span class="p">,</span>
|
||||
<span class="nx">interval</span><span class="o">:</span> <span class="s1">'day'</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span><span class="nx">facets</span><span class="o">:</span> <span class="nx">facets</span><span class="p">},</span> <span class="p">{</span><span class="nx">silent</span><span class="o">:</span> <span class="kc">true</span><span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'facet:add'</span><span class="p">,</span> <span class="k">this</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-26"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-26">¶</a> </div> <h2><a id="facet">A Facet (Result)</a></h2>
|
||||
|
||||
<p>Object to store Facet information, that is summary information (e.g. values
|
||||
and counts) about a field obtained by some faceting method on the
|
||||
backend.</p>
|
||||
|
||||
<p>Structure of a facet follows that of Facet results in ElasticSearch, see:
|
||||
<a href="http://www.elasticsearch.org/guide/reference/api/search/facets/">http://www.elasticsearch.org/guide/reference/api/search/facets/</a></p>
|
||||
|
||||
<p>Specifically the object structure of a facet looks like (there is one
|
||||
addition compared to ElasticSearch: the "id" field which corresponds to the
|
||||
key used to specify this facet in the facet query):</p>
|
||||
|
||||
<pre>
|
||||
{
|
||||
"id": "id-of-facet",
|
||||
// type of this facet (terms, range, histogram etc)
|
||||
"_type" : "terms",
|
||||
// total number of tokens in the facet
|
||||
"total": 5,
|
||||
// @property {number} number of documents which have no value for the field
|
||||
"missing" : 0,
|
||||
// number of facet values not included in the returned facets
|
||||
"other": 0,
|
||||
// term object ({term: , count: ...})
|
||||
"terms" : [ {
|
||||
"term" : "foo",
|
||||
"count" : 2
|
||||
}, {
|
||||
"term" : "bar",
|
||||
"count" : 2
|
||||
}, {
|
||||
"term" : "baz",
|
||||
"count" : 1
|
||||
}
|
||||
]
|
||||
}
|
||||
</pre> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">Facet</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">defaults</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{</span>
|
||||
<span class="nx">_type</span><span class="o">:</span> <span class="s1">'terms'</span><span class="p">,</span>
|
||||
<span class="nx">total</span><span class="o">:</span> <span class="mi">0</span><span class="p">,</span>
|
||||
<span class="nx">other</span><span class="o">:</span> <span class="mi">0</span><span class="p">,</span>
|
||||
<span class="nx">missing</span><span class="o">:</span> <span class="mi">0</span><span class="p">,</span>
|
||||
<span class="nx">terms</span><span class="o">:</span> <span class="p">[]</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-27"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-27">¶</a> </div> <h2>A Collection/List of Facets</h2> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">FacetList</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Collection</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Facet</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-28"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-28">¶</a> </div> <h2>Object State</h2>
|
||||
|
||||
<p>Convenience Backbone model for storing (configuration) state of objects like Views.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">ObjectState</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-29"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-29">¶</a> </div> <h2>Backbone.sync</h2>
|
||||
|
||||
<p>Override Backbone.sync to hand off to sync function in relevant backend</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">Backbone</span><span class="p">.</span><span class="nx">sync</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">method</span><span class="p">,</span> <span class="nx">model</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">model</span><span class="p">.</span><span class="nx">backend</span><span class="p">.</span><span class="nx">sync</span><span class="p">(</span><span class="nx">method</span><span class="p">,</span> <span class="nx">model</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="p">}(</span><span class="nx">jQuery</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span><span class="p">));</span>
|
||||
|
||||
</pre></div> </td> </tr> </tbody> </table> </div> </body> </html>
|
||||
190
docs/pycco.css
190
docs/pycco.css
@ -1,190 +0,0 @@
|
||||
/*--------------------- Layout and Typography ----------------------------*/
|
||||
body {
|
||||
font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, FreeSerif, serif;
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
color: #252519;
|
||||
margin: 0; padding: 0;
|
||||
background: #f5f5ff;
|
||||
}
|
||||
a {
|
||||
color: #261a3b;
|
||||
}
|
||||
a:visited {
|
||||
color: #261a3b;
|
||||
}
|
||||
p {
|
||||
margin: 0 0 15px 0;
|
||||
}
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
margin: 40px 0 15px 0;
|
||||
}
|
||||
h2, h3, h4, h5, h6 {
|
||||
margin-top: 0;
|
||||
}
|
||||
#container {
|
||||
background: white;
|
||||
}
|
||||
#container, div.section {
|
||||
position: relative;
|
||||
}
|
||||
#background {
|
||||
position: absolute;
|
||||
top: 0; left: 580px; right: 0; bottom: 0;
|
||||
background: #f5f5ff;
|
||||
border-left: 1px solid #e5e5ee;
|
||||
z-index: 0;
|
||||
}
|
||||
#jump_to, #jump_page {
|
||||
background: white;
|
||||
-webkit-box-shadow: 0 0 25px #777; -moz-box-shadow: 0 0 25px #777;
|
||||
-webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomleft: 5px;
|
||||
font: 10px Arial;
|
||||
text-transform: uppercase;
|
||||
cursor: pointer;
|
||||
text-align: right;
|
||||
}
|
||||
#jump_to, #jump_wrapper {
|
||||
position: fixed;
|
||||
right: 0; top: 0;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
#jump_wrapper {
|
||||
padding: 0;
|
||||
display: none;
|
||||
}
|
||||
#jump_to:hover #jump_wrapper {
|
||||
display: block;
|
||||
}
|
||||
#jump_page {
|
||||
padding: 5px 0 3px;
|
||||
margin: 0 0 25px 25px;
|
||||
}
|
||||
#jump_page .source {
|
||||
display: block;
|
||||
padding: 5px 10px;
|
||||
text-decoration: none;
|
||||
border-top: 1px solid #eee;
|
||||
}
|
||||
#jump_page .source:hover {
|
||||
background: #f5f5ff;
|
||||
}
|
||||
#jump_page .source:first-child {
|
||||
}
|
||||
div.docs {
|
||||
float: left;
|
||||
max-width: 500px;
|
||||
min-width: 500px;
|
||||
min-height: 5px;
|
||||
padding: 10px 25px 1px 50px;
|
||||
vertical-align: top;
|
||||
text-align: left;
|
||||
}
|
||||
.docs pre {
|
||||
margin: 15px 0 15px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
.docs p tt, .docs p code {
|
||||
background: #f8f8ff;
|
||||
border: 1px solid #dedede;
|
||||
font-size: 12px;
|
||||
padding: 0 0.2em;
|
||||
}
|
||||
.octowrap {
|
||||
position: relative;
|
||||
}
|
||||
.octothorpe {
|
||||
font: 12px Arial;
|
||||
text-decoration: none;
|
||||
color: #454545;
|
||||
position: absolute;
|
||||
top: 3px; left: -20px;
|
||||
padding: 1px 2px;
|
||||
opacity: 0;
|
||||
-webkit-transition: opacity 0.2s linear;
|
||||
}
|
||||
div.docs:hover .octothorpe {
|
||||
opacity: 1;
|
||||
}
|
||||
div.code {
|
||||
margin-left: 580px;
|
||||
padding: 14px 15px 16px 50px;
|
||||
vertical-align: top;
|
||||
}
|
||||
.code pre, .docs p code {
|
||||
font-size: 12px;
|
||||
}
|
||||
pre, tt, code {
|
||||
line-height: 18px;
|
||||
font-family: Monaco, Consolas, "Lucida Console", monospace;
|
||||
margin: 0; padding: 0;
|
||||
}
|
||||
div.clearall {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
|
||||
/*---------------------- Syntax Highlighting -----------------------------*/
|
||||
td.linenos { background-color: #f0f0f0; padding-right: 10px; }
|
||||
span.lineno { background-color: #f0f0f0; padding: 0 5px 0 5px; }
|
||||
body .hll { background-color: #ffffcc }
|
||||
body .c { color: #408080; font-style: italic } /* Comment */
|
||||
body .err { border: 1px solid #FF0000 } /* Error */
|
||||
body .k { color: #954121 } /* Keyword */
|
||||
body .o { color: #666666 } /* Operator */
|
||||
body .cm { color: #408080; font-style: italic } /* Comment.Multiline */
|
||||
body .cp { color: #BC7A00 } /* Comment.Preproc */
|
||||
body .c1 { color: #408080; font-style: italic } /* Comment.Single */
|
||||
body .cs { color: #408080; font-style: italic } /* Comment.Special */
|
||||
body .gd { color: #A00000 } /* Generic.Deleted */
|
||||
body .ge { font-style: italic } /* Generic.Emph */
|
||||
body .gr { color: #FF0000 } /* Generic.Error */
|
||||
body .gh { color: #000080; font-weight: bold } /* Generic.Heading */
|
||||
body .gi { color: #00A000 } /* Generic.Inserted */
|
||||
body .go { color: #808080 } /* Generic.Output */
|
||||
body .gp { color: #000080; font-weight: bold } /* Generic.Prompt */
|
||||
body .gs { font-weight: bold } /* Generic.Strong */
|
||||
body .gu { color: #800080; font-weight: bold } /* Generic.Subheading */
|
||||
body .gt { color: #0040D0 } /* Generic.Traceback */
|
||||
body .kc { color: #954121 } /* Keyword.Constant */
|
||||
body .kd { color: #954121; font-weight: bold } /* Keyword.Declaration */
|
||||
body .kn { color: #954121; font-weight: bold } /* Keyword.Namespace */
|
||||
body .kp { color: #954121 } /* Keyword.Pseudo */
|
||||
body .kr { color: #954121; font-weight: bold } /* Keyword.Reserved */
|
||||
body .kt { color: #B00040 } /* Keyword.Type */
|
||||
body .m { color: #666666 } /* Literal.Number */
|
||||
body .s { color: #219161 } /* Literal.String */
|
||||
body .na { color: #7D9029 } /* Name.Attribute */
|
||||
body .nb { color: #954121 } /* Name.Builtin */
|
||||
body .nc { color: #0000FF; font-weight: bold } /* Name.Class */
|
||||
body .no { color: #880000 } /* Name.Constant */
|
||||
body .nd { color: #AA22FF } /* Name.Decorator */
|
||||
body .ni { color: #999999; font-weight: bold } /* Name.Entity */
|
||||
body .ne { color: #D2413A; font-weight: bold } /* Name.Exception */
|
||||
body .nf { color: #0000FF } /* Name.Function */
|
||||
body .nl { color: #A0A000 } /* Name.Label */
|
||||
body .nn { color: #0000FF; font-weight: bold } /* Name.Namespace */
|
||||
body .nt { color: #954121; font-weight: bold } /* Name.Tag */
|
||||
body .nv { color: #19469D } /* Name.Variable */
|
||||
body .ow { color: #AA22FF; font-weight: bold } /* Operator.Word */
|
||||
body .w { color: #bbbbbb } /* Text.Whitespace */
|
||||
body .mf { color: #666666 } /* Literal.Number.Float */
|
||||
body .mh { color: #666666 } /* Literal.Number.Hex */
|
||||
body .mi { color: #666666 } /* Literal.Number.Integer */
|
||||
body .mo { color: #666666 } /* Literal.Number.Oct */
|
||||
body .sb { color: #219161 } /* Literal.String.Backtick */
|
||||
body .sc { color: #219161 } /* Literal.String.Char */
|
||||
body .sd { color: #219161; font-style: italic } /* Literal.String.Doc */
|
||||
body .s2 { color: #219161 } /* Literal.String.Double */
|
||||
body .se { color: #BB6622; font-weight: bold } /* Literal.String.Escape */
|
||||
body .sh { color: #219161 } /* Literal.String.Heredoc */
|
||||
body .si { color: #BB6688; font-weight: bold } /* Literal.String.Interpol */
|
||||
body .sx { color: #954121 } /* Literal.String.Other */
|
||||
body .sr { color: #BB6688 } /* Literal.String.Regex */
|
||||
body .s1 { color: #219161 } /* Literal.String.Single */
|
||||
body .ss { color: #19469D } /* Literal.String.Symbol */
|
||||
body .bp { color: #954121 } /* Name.Builtin.Pseudo */
|
||||
body .vc { color: #19469D } /* Name.Variable.Class */
|
||||
body .vg { color: #19469D } /* Name.Variable.Global */
|
||||
body .vi { color: #19469D } /* Name.Variable.Instance */
|
||||
body .il { color: #666666 } /* Literal.Number.Integer.Long */
|
||||
429
docs/src/backend.couchdb.html
Normal file
429
docs/src/backend.couchdb.html
Normal file
@ -0,0 +1,429 @@
|
||||
<!DOCTYPE html> <html> <head> <title>backend.couchdb.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="backend.couchdb.html"> backend.couchdb.js </a> <a class="source" href="backend.csv.html"> backend.csv.js </a> <a class="source" href="backend.dataproxy.html"> backend.dataproxy.js </a> <a class="source" href="backend.elasticsearch.html"> backend.elasticsearch.js </a> <a class="source" href="backend.gdocs.html"> backend.gdocs.js </a> <a class="source" href="backend.memory.html"> backend.memory.js </a> <a class="source" href="costco.html"> costco.js </a> <a class="source" href="model.html"> model.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="view.transform.html"> view.transform.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> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> backend.couchdb.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> </td> <td class="code"> <div class="highlight"><pre><span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">CouchDB</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">CouchDB</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
|
||||
<span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">$</span><span class="p">,</span> <span class="nx">my</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">my</span><span class="p">.</span><span class="nx">__type__</span> <span class="o">=</span> <span class="s1">'couchdb'</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <h2>CouchDB Wrapper</h2>
|
||||
|
||||
<p>Connecting to [CouchDB] (http://www.couchdb.apache.org/) endpoints.
|
||||
@param {String} endpoint: url for CouchDB database, e.g. for Couchdb running
|
||||
on localhost:5984 with database // ckan-std it would be:</p>
|
||||
|
||||
<pre>http://localhost:5984/ckan-std</pre>
|
||||
|
||||
<p>TODO Add user/password arguments for couchdb authentication support.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">CouchDBWrapper</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">db_url</span><span class="p">,</span> <span class="nx">view_url</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">endpoint</span> <span class="o">=</span> <span class="nx">db_url</span><span class="p">;</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">view_url</span> <span class="o">=</span> <span class="p">(</span><span class="nx">view_url</span><span class="p">)</span> <span class="o">?</span> <span class="nx">view_url</span> <span class="o">:</span> <span class="nx">db_url</span><span class="o">+</span><span class="s1">'/'</span><span class="o">+</span><span class="s1">'_all_docs'</span><span class="p">;</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">options</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">dataType</span><span class="o">:</span> <span class="s1">'json'</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">options</span><span class="p">);</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_makeRequest</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">data</span><span class="p">,</span> <span class="nx">headers</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">extras</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">headers</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">extras</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">beforeSend</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">req</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">headers</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">value</span><span class="p">,</span> <span class="nx">key</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">req</span><span class="p">.</span><span class="nx">setRequestHeader</span><span class="p">(</span><span class="nx">key</span><span class="p">,</span> <span class="nx">value</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">data</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span><span class="nx">extras</span><span class="p">,</span> <span class="nx">data</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="nx">$</span><span class="p">.</span><span class="nx">ajax</span><span class="p">(</span><span class="nx">data</span><span class="p">);</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <h3>mapping</h3>
|
||||
|
||||
<p>Get mapping for this database.
|
||||
Assume all docs in the view have the same schema so
|
||||
limit query to single result.</p>
|
||||
|
||||
<p>@return promise compatible deferred object.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">mapping</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">schemaUrl</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">view_url</span> <span class="o">+</span> <span class="s1">'?limit=1&include_docs=true'</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">jqxhr</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">_makeRequest</span><span class="p">({</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="nx">schemaUrl</span><span class="p">,</span>
|
||||
<span class="nx">dataType</span><span class="o">:</span> <span class="nx">self</span><span class="p">.</span><span class="nx">options</span><span class="p">.</span><span class="nx">dataType</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">jqxhr</span><span class="p">;</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-4">¶</a> </div> <h3>get</h3>
|
||||
|
||||
<p>Get record corresponding to specified id</p>
|
||||
|
||||
<p>@return promise compatible deferred object.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">get</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">_id</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">base</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">endpoint</span> <span class="o">+</span> <span class="s1">'/'</span> <span class="o">+</span> <span class="nx">_id</span><span class="p">;</span>
|
||||
<span class="k">return</span> <span class="nx">self</span><span class="p">.</span><span class="nx">_makeRequest</span><span class="p">({</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="nx">base</span><span class="p">,</span>
|
||||
<span class="nx">dataType</span><span class="o">:</span> <span class="s1">'json'</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <h3>upsert</h3>
|
||||
|
||||
<p>create / update a record to CouchDB backend</p>
|
||||
|
||||
<p>@param {Object} doc an object to insert to the index.
|
||||
@return deferred supporting promise API</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">upsert</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">data</span> <span class="o">=</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">stringify</span><span class="p">(</span><span class="nx">doc</span><span class="p">);</span>
|
||||
<span class="nx">url</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">endpoint</span><span class="p">;</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">doc</span><span class="p">.</span><span class="nx">_id</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">url</span> <span class="o">+=</span> <span class="s1">'/'</span> <span class="o">+</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">_id</span><span class="p">;</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <p>use a PUT, not a POST to update the document:
|
||||
http://wiki.apache.org/couchdb/HTTP<em>Document</em>API#POST</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="nx">self</span><span class="p">.</span><span class="nx">_makeRequest</span><span class="p">({</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="nx">url</span><span class="p">,</span>
|
||||
<span class="nx">type</span><span class="o">:</span> <span class="s1">'PUT'</span><span class="p">,</span>
|
||||
<span class="nx">data</span><span class="o">:</span> <span class="nx">data</span><span class="p">,</span>
|
||||
<span class="nx">dataType</span><span class="o">:</span> <span class="s1">'json'</span><span class="p">,</span>
|
||||
<span class="nx">contentType</span><span class="o">:</span> <span class="s1">'application/json'</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <h3>delete</h3>
|
||||
|
||||
<p>Delete a record from the CouchDB backend.</p>
|
||||
|
||||
<p>@param {Object} id id of object to delete
|
||||
@return deferred supporting promise API</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="k">delete</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">_id</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">url</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">endpoint</span><span class="p">;</span>
|
||||
<span class="nx">url</span> <span class="o">+=</span> <span class="s1">'/'</span> <span class="o">+</span> <span class="nx">_id</span><span class="p">;</span>
|
||||
<span class="k">return</span> <span class="nx">self</span><span class="p">.</span><span class="nx">_makeRequest</span><span class="p">({</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="nx">url</span><span class="p">,</span>
|
||||
<span class="nx">type</span><span class="o">:</span> <span class="s1">'DELETE'</span><span class="p">,</span>
|
||||
<span class="nx">dataType</span><span class="o">:</span> <span class="s1">'json'</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">¶</a> </div> <h3>_normalizeQuery</h3>
|
||||
|
||||
<p>Convert the query object from Elastic Search format to a
|
||||
Couchdb View API compatible format.
|
||||
See: http://wiki.apache.org/couchdb/HTTP<em>view</em>API</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">_normalizeQuery</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">out</span> <span class="o">=</span> <span class="nx">queryObj</span> <span class="o">&&</span> <span class="nx">queryObj</span><span class="p">.</span><span class="nx">toJSON</span> <span class="o">?</span> <span class="nx">queryObj</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">()</span> <span class="o">:</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">({},</span> <span class="nx">queryObj</span><span class="p">);</span>
|
||||
<span class="k">delete</span> <span class="nx">out</span><span class="p">.</span><span class="nx">sort</span><span class="p">;</span>
|
||||
<span class="k">delete</span> <span class="nx">out</span><span class="p">.</span><span class="nx">query</span><span class="p">;</span>
|
||||
<span class="k">delete</span> <span class="nx">out</span><span class="p">.</span><span class="nx">filters</span><span class="p">;</span>
|
||||
<span class="k">delete</span> <span class="nx">out</span><span class="p">.</span><span class="nx">fields</span><span class="p">;</span>
|
||||
<span class="k">delete</span> <span class="nx">out</span><span class="p">.</span><span class="nx">facets</span><span class="p">;</span>
|
||||
<span class="nx">out</span><span class="p">[</span><span class="s1">'skip'</span><span class="p">]</span> <span class="o">=</span> <span class="nx">out</span><span class="p">.</span><span class="nx">from</span> <span class="o">||</span> <span class="mi">0</span><span class="p">;</span>
|
||||
<span class="nx">out</span><span class="p">[</span><span class="s1">'limit'</span><span class="p">]</span> <span class="o">=</span> <span class="nx">out</span><span class="p">.</span><span class="nx">size</span> <span class="o">||</span> <span class="mi">100</span><span class="p">;</span>
|
||||
<span class="k">delete</span> <span class="nx">out</span><span class="p">.</span><span class="nx">from</span><span class="p">;</span>
|
||||
<span class="k">delete</span> <span class="nx">out</span><span class="p">.</span><span class="nx">size</span><span class="p">;</span>
|
||||
<span class="nx">out</span><span class="p">[</span><span class="s1">'include_docs'</span><span class="p">]</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
|
||||
<span class="k">return</span> <span class="nx">out</span><span class="p">;</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-9">¶</a> </div> <h3>query</h3>
|
||||
|
||||
<p>@param {Object} recline.Query instance.
|
||||
@param {Object} additional couchdb view query options.
|
||||
@return deferred supporting promise API</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">query</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">query_object</span><span class="p">,</span> <span class="nx">query_options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">norm_q</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">_normalizeQuery</span><span class="p">(</span><span class="nx">query_object</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">url</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">view_url</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">q</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span><span class="nx">query_options</span><span class="p">,</span> <span class="nx">norm_q</span><span class="p">);</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">jqxhr</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">_makeRequest</span><span class="p">({</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="nx">url</span><span class="p">,</span>
|
||||
<span class="nx">data</span><span class="o">:</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">stringify</span><span class="p">(</span><span class="nx">q</span><span class="p">),</span>
|
||||
<span class="nx">dataType</span><span class="o">:</span> <span class="nx">self</span><span class="p">.</span><span class="nx">options</span><span class="p">.</span><span class="nx">dataType</span><span class="p">,</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">jqxhr</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">¶</a> </div> <h2>CouchDB Backend</h2>
|
||||
|
||||
<p>Backbone connector for a CouchDB backend.</p>
|
||||
|
||||
<p>Usage:</p>
|
||||
|
||||
<p>var backend = new recline.Backend.CouchDB();
|
||||
var dataset = new recline.Model.Dataset({
|
||||
db<em>url: '/couchdb/mydb',
|
||||
view</em>url: '/couchdb/mydb/<em>design/design1/</em>views/view1',
|
||||
query<em>options: {
|
||||
'key': 'some</em>document_key'
|
||||
}
|
||||
});
|
||||
backend.fetch(dataset.toJSON());
|
||||
backend.query(query, dataset.toJSON()).done(function () { ... });</p>
|
||||
|
||||
<p>Alternatively:
|
||||
var dataset = new recline.Model.Dataset({ ... }, 'couchdb');
|
||||
dataset.fetch();
|
||||
var results = dataset.query(query_obj);</p>
|
||||
|
||||
<p>Additionally, the Dataset instance may define three methods:
|
||||
function record<em>update (record, document) { ... }
|
||||
function record</em>delete (record, document) { ... }
|
||||
function record<em>create (record, document) { ... }
|
||||
Where <code>record</code> is the JSON representation of the Record/Document instance
|
||||
and <code>document</code> is the JSON document stored in couchdb.
|
||||
When _all</em>docs view is used (default), a record is the same as a document
|
||||
so these methods need not be defined.
|
||||
They are most useful when using a custom view that performs a map-reduce
|
||||
operation on each document to yield a record. Hence, when the record is
|
||||
created, updated or deleted, an inverse operation must be performed on the original
|
||||
document.</p>
|
||||
|
||||
<p>@param {string} url of couchdb database.
|
||||
@param {string} (optional) url of couchdb view. default:<code>db_url</code>/<em>all</em>docs
|
||||
@param {Object} (optional) query options accepted by couchdb views.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">couchOptions</span> <span class="o">=</span> <span class="p">{};</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-11">¶</a> </div> <h3>fetch</h3>
|
||||
|
||||
<p>@param {object} dataset json object with the db<em>url, view</em>url, and query_options args.
|
||||
@return promise object that resolves to the document mapping.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">fetch</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">dataset</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">db_url</span> <span class="o">=</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">db_url</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">view_url</span> <span class="o">=</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">view_url</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">cdb</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">CouchDBWrapper</span><span class="p">(</span><span class="nx">db_url</span><span class="p">,</span> <span class="nx">view_url</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-12">¶</a> </div> <p>if 'doc' attribute is present, return schema of that
|
||||
else return schema of 'value' attribute which contains
|
||||
the map-reduced document.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">cdb</span><span class="p">.</span><span class="nx">mapping</span><span class="p">().</span><span class="nx">done</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">result</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">row</span> <span class="o">=</span> <span class="nx">result</span><span class="p">.</span><span class="nx">rows</span><span class="p">[</span><span class="mi">0</span><span class="p">];</span>
|
||||
<span class="kd">var</span> <span class="nx">keys</span> <span class="o">=</span> <span class="p">[];</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">view_url</span><span class="p">.</span><span class="nx">search</span><span class="p">(</span><span class="s2">"_all_docs"</span><span class="p">)</span> <span class="o">!==</span> <span class="o">-</span><span class="mi">1</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">keys</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">keys</span><span class="p">(</span><span class="nx">row</span><span class="p">[</span><span class="s1">'doc'</span><span class="p">]);</span>
|
||||
<span class="nx">keys</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">filter</span><span class="p">(</span><span class="nx">keys</span><span class="p">,</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">k</span><span class="p">)</span> <span class="p">{</span> <span class="k">return</span> <span class="nx">k</span><span class="p">.</span><span class="nx">charAt</span><span class="p">(</span><span class="mi">0</span><span class="p">)</span> <span class="o">!==</span> <span class="s1">'_'</span> <span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">keys</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">keys</span><span class="p">(</span><span class="nx">row</span><span class="p">[</span><span class="s1">'value'</span><span class="p">]);</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">fieldData</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">keys</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">k</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{</span> <span class="s1">'id'</span> <span class="o">:</span> <span class="nx">k</span> <span class="p">};</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">({</span>
|
||||
<span class="nx">fields</span><span class="o">:</span> <span class="nx">fieldData</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">})</span>
|
||||
<span class="p">.</span><span class="nx">fail</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">arguments</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">reject</span><span class="p">(</span><span class="nx">arguments</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-13">¶</a> </div> <h3>save</h3>
|
||||
|
||||
<p>Iterate through all the changes and save them to the server.
|
||||
N.B. This method is asynchronous and attempts to do multiple
|
||||
operation concurrently. This can be problematic when more than
|
||||
one operation is requested on the same document (as in the case
|
||||
of bulk column transforms).</p>
|
||||
|
||||
<p>@param {object} lists of create, update, delete.
|
||||
@param {object} dataset json object.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">save</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">changes</span><span class="p">,</span> <span class="nx">dataset</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">total</span> <span class="o">=</span> <span class="nx">changes</span><span class="p">.</span><span class="nx">creates</span><span class="p">.</span><span class="nx">length</span> <span class="o">+</span> <span class="nx">changes</span><span class="p">.</span><span class="nx">updates</span><span class="p">.</span><span class="nx">length</span> <span class="o">+</span> <span class="nx">changes</span><span class="p">.</span><span class="nx">deletes</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">results</span> <span class="o">=</span> <span class="p">{</span><span class="s1">'done'</span><span class="o">:</span> <span class="p">[],</span> <span class="s1">'fail'</span><span class="o">:</span> <span class="p">[]</span> <span class="p">};</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">decr_cb</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">total</span> <span class="o">-=</span> <span class="mi">1</span><span class="p">;</span> <span class="p">}</span>
|
||||
<span class="kd">var</span> <span class="nx">resolve_cb</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">()</span> <span class="p">{</span> <span class="k">if</span> <span class="p">(</span><span class="nx">total</span> <span class="o">==</span> <span class="mi">0</span><span class="p">)</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">results</span><span class="p">);</span> <span class="p">}</span>
|
||||
|
||||
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span> <span class="k">in</span> <span class="nx">changes</span><span class="p">.</span><span class="nx">creates</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">new_doc</span> <span class="o">=</span> <span class="nx">changes</span><span class="p">.</span><span class="nx">creates</span><span class="p">[</span><span class="nx">i</span><span class="p">];</span>
|
||||
<span class="kd">var</span> <span class="nx">succ_cb</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">msg</span><span class="p">)</span> <span class="p">{</span><span class="nx">results</span><span class="p">.</span><span class="nx">done</span><span class="p">.</span><span class="nx">push</span><span class="p">({</span><span class="s1">'op'</span><span class="o">:</span> <span class="s1">'create'</span><span class="p">,</span> <span class="s1">'record'</span><span class="o">:</span> <span class="nx">new_doc</span><span class="p">,</span> <span class="s1">'reason'</span><span class="o">:</span> <span class="s1">''</span><span class="p">});</span> <span class="p">}</span>
|
||||
<span class="kd">var</span> <span class="nx">fail_cb</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">msg</span><span class="p">)</span> <span class="p">{</span><span class="nx">results</span><span class="p">.</span><span class="nx">fail</span><span class="p">.</span><span class="nx">push</span><span class="p">({</span><span class="s1">'op'</span><span class="o">:</span> <span class="s1">'create'</span><span class="p">,</span> <span class="s1">'record'</span><span class="o">:</span> <span class="nx">new_doc</span><span class="p">,</span> <span class="s1">'reason'</span><span class="o">:</span> <span class="nx">msg</span><span class="p">});</span> <span class="p">}</span>
|
||||
|
||||
<span class="nx">_createDocument</span><span class="p">(</span><span class="nx">new_doc</span><span class="p">,</span> <span class="nx">dataset</span><span class="p">).</span><span class="nx">then</span><span class="p">([</span><span class="nx">decr_cb</span><span class="p">,</span> <span class="nx">succ_cb</span><span class="p">,</span> <span class="nx">resolve_cb</span><span class="p">],</span> <span class="p">[</span><span class="nx">decr_cb</span><span class="p">,</span> <span class="nx">fail_cb</span><span class="p">,</span> <span class="nx">resolve_cb</span><span class="p">]);</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span> <span class="k">in</span> <span class="nx">changes</span><span class="p">.</span><span class="nx">updates</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">new_doc</span> <span class="o">=</span> <span class="nx">changes</span><span class="p">.</span><span class="nx">updates</span><span class="p">[</span><span class="nx">i</span><span class="p">];</span>
|
||||
<span class="kd">var</span> <span class="nx">succ_cb</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">msg</span><span class="p">)</span> <span class="p">{</span><span class="nx">results</span><span class="p">.</span><span class="nx">done</span><span class="p">.</span><span class="nx">push</span><span class="p">({</span><span class="s1">'op'</span><span class="o">:</span> <span class="s1">'update'</span><span class="p">,</span> <span class="s1">'record'</span><span class="o">:</span> <span class="nx">new_doc</span><span class="p">,</span> <span class="s1">'reason'</span><span class="o">:</span> <span class="s1">''</span><span class="p">});</span> <span class="p">}</span>
|
||||
<span class="kd">var</span> <span class="nx">fail_cb</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">msg</span><span class="p">)</span> <span class="p">{</span><span class="nx">results</span><span class="p">.</span><span class="nx">fail</span><span class="p">.</span><span class="nx">push</span><span class="p">({</span><span class="s1">'op'</span><span class="o">:</span> <span class="s1">'update'</span><span class="p">,</span> <span class="s1">'record'</span><span class="o">:</span> <span class="nx">new_doc</span><span class="p">,</span> <span class="s1">'reason'</span><span class="o">:</span> <span class="nx">msg</span><span class="p">});</span> <span class="p">}</span>
|
||||
|
||||
<span class="nx">_updateDocument</span><span class="p">(</span><span class="nx">new_doc</span><span class="p">,</span> <span class="nx">dataset</span><span class="p">).</span><span class="nx">then</span><span class="p">([</span><span class="nx">decr_cb</span><span class="p">,</span> <span class="nx">succ_cb</span><span class="p">,</span> <span class="nx">resolve_cb</span><span class="p">],</span> <span class="p">[</span><span class="nx">decr_cb</span><span class="p">,</span> <span class="nx">fail_cb</span><span class="p">,</span> <span class="nx">resolve_cb</span><span class="p">]);</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span> <span class="k">in</span> <span class="nx">changes</span><span class="p">.</span><span class="nx">deletes</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">old_doc</span> <span class="o">=</span> <span class="nx">changes</span><span class="p">.</span><span class="nx">deletes</span><span class="p">[</span><span class="nx">i</span><span class="p">];</span>
|
||||
<span class="kd">var</span> <span class="nx">succ_cb</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">msg</span><span class="p">)</span> <span class="p">{</span><span class="nx">results</span><span class="p">.</span><span class="nx">done</span><span class="p">.</span><span class="nx">push</span><span class="p">({</span><span class="s1">'op'</span><span class="o">:</span> <span class="s1">'delete'</span><span class="p">,</span> <span class="s1">'record'</span><span class="o">:</span> <span class="nx">old_doc</span><span class="p">,</span> <span class="s1">'reason'</span><span class="o">:</span> <span class="s1">''</span><span class="p">});</span> <span class="p">}</span>
|
||||
<span class="kd">var</span> <span class="nx">fail_cb</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">msg</span><span class="p">)</span> <span class="p">{</span><span class="nx">results</span><span class="p">.</span><span class="nx">fail</span><span class="p">.</span><span class="nx">push</span><span class="p">({</span><span class="s1">'op'</span><span class="o">:</span> <span class="s1">'delete'</span><span class="p">,</span> <span class="s1">'record'</span><span class="o">:</span> <span class="nx">old_doc</span><span class="p">,</span> <span class="s1">'reason'</span><span class="o">:</span> <span class="nx">msg</span><span class="p">});</span> <span class="p">}</span>
|
||||
|
||||
<span class="nx">_deleteDocument</span><span class="p">(</span><span class="nx">new_doc</span><span class="p">,</span> <span class="nx">dataset</span><span class="p">).</span><span class="nx">then</span><span class="p">([</span><span class="nx">decr_cb</span><span class="p">,</span> <span class="nx">succ_cb</span><span class="p">,</span> <span class="nx">resolve_cb</span><span class="p">],</span> <span class="p">[</span><span class="nx">decr_cb</span><span class="p">,</span> <span class="nx">fail_cb</span><span class="p">,</span> <span class="nx">resolve_cb</span><span class="p">]);</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-14"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-14">¶</a> </div> <h3>query</h3>
|
||||
|
||||
<p>fetch the data from the couchdb view and filter it.
|
||||
@param {Object} recline.Dataset instance
|
||||
@param {Object} recline.Query instance.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">query</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">,</span> <span class="nx">dataset</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">db_url</span> <span class="o">=</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">db_url</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">view_url</span> <span class="o">=</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">view_url</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">query_options</span> <span class="o">=</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">query_options</span><span class="p">;</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">cdb</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">CouchDBWrapper</span><span class="p">(</span><span class="nx">db_url</span><span class="p">,</span> <span class="nx">view_url</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">cdb_q</span> <span class="o">=</span> <span class="nx">cdb</span><span class="p">.</span><span class="nx">_normalizeQuery</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">,</span> <span class="nx">query_options</span><span class="p">);</span>
|
||||
|
||||
<span class="nx">cdb</span><span class="p">.</span><span class="nx">query</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">,</span> <span class="nx">query_options</span><span class="p">).</span><span class="nx">done</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">records</span><span class="p">){</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">query_result</span> <span class="o">=</span> <span class="p">{</span> <span class="nx">hits</span><span class="o">:</span> <span class="p">[],</span> <span class="nx">total</span><span class="o">:</span> <span class="mi">0</span> <span class="p">};</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">records</span><span class="p">.</span><span class="nx">rows</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">record</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">doc</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">record</span><span class="p">.</span><span class="nx">hasOwnProperty</span><span class="p">(</span><span class="s1">'doc'</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="nx">doc</span> <span class="o">=</span> <span class="nx">record</span><span class="p">[</span><span class="s1">'doc'</span><span class="p">];</span></pre></div> </td> </tr> <tr id="section-15"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-15">¶</a> </div> <p>couchdb uses _id to identify documents, Backbone models use id.
|
||||
we add this fix so backbone.Model works correctly.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">doc</span><span class="p">[</span><span class="s1">'id'</span><span class="p">]</span> <span class="o">=</span> <span class="nx">doc</span><span class="p">[</span><span class="s1">'_id'</span><span class="p">];</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">doc</span> <span class="o">=</span> <span class="nx">record</span><span class="p">[</span><span class="s1">'value'</span><span class="p">];</span></pre></div> </td> </tr> <tr id="section-16"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-16">¶</a> </div> <p>using dunder to create compound id. need something more robust.
|
||||
couchdb uses _id to identify documents, Backbone models use id.
|
||||
we add this fix so backbone.Model works correctly.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">doc</span><span class="p">[</span><span class="s1">'_id'</span><span class="p">]</span> <span class="o">=</span> <span class="nx">doc</span><span class="p">[</span><span class="s1">'id'</span><span class="p">]</span> <span class="o">=</span> <span class="nx">record</span><span class="p">[</span><span class="s1">'id'</span><span class="p">]</span> <span class="o">+</span> <span class="s1">'__'</span> <span class="o">+</span> <span class="nx">record</span><span class="p">[</span><span class="s1">'key'</span><span class="p">];</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">query_result</span><span class="p">.</span><span class="nx">total</span> <span class="o">+=</span> <span class="mi">1</span><span class="p">;</span>
|
||||
<span class="nx">query_result</span><span class="p">.</span><span class="nx">hits</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">doc</span><span class="p">);</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-17"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-17">¶</a> </div> <p>the following block is borrowed verbatim from recline.backend.Memory
|
||||
search (with filtering, faceting, and sorting) should be factored
|
||||
out into a separate library.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">query_result</span><span class="p">.</span><span class="nx">hits</span> <span class="o">=</span> <span class="nx">_applyFilters</span><span class="p">(</span><span class="nx">query_result</span><span class="p">.</span><span class="nx">hits</span><span class="p">,</span> <span class="nx">queryObj</span><span class="p">);</span>
|
||||
<span class="nx">query_result</span><span class="p">.</span><span class="nx">hits</span> <span class="o">=</span> <span class="nx">_applyFreeTextQuery</span><span class="p">(</span><span class="nx">query_result</span><span class="p">.</span><span class="nx">hits</span><span class="p">,</span> <span class="nx">queryObj</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-18"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-18">¶</a> </div> <p>not complete sorting!</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">.</span><span class="nx">sort</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">sortObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">fieldName</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">keys</span><span class="p">(</span><span class="nx">sortObj</span><span class="p">)[</span><span class="mi">0</span><span class="p">];</span>
|
||||
<span class="nx">query_result</span><span class="p">.</span><span class="nx">hits</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">sortBy</span><span class="p">(</span><span class="nx">query_result</span><span class="p">.</span><span class="nx">hits</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">_out</span> <span class="o">=</span> <span class="nx">doc</span><span class="p">[</span><span class="nx">fieldName</span><span class="p">];</span>
|
||||
<span class="k">return</span> <span class="p">(</span><span class="nx">sortObj</span><span class="p">[</span><span class="nx">fieldName</span><span class="p">].</span><span class="nx">order</span> <span class="o">==</span> <span class="s1">'asc'</span><span class="p">)</span> <span class="o">?</span> <span class="nx">_out</span> <span class="o">:</span> <span class="o">-</span><span class="mi">1</span><span class="o">*</span><span class="nx">_out</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">query_result</span><span class="p">.</span><span class="nx">total</span> <span class="o">=</span> <span class="nx">query_result</span><span class="p">.</span><span class="nx">hits</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span>
|
||||
<span class="nx">query_result</span><span class="p">.</span><span class="nx">facets</span> <span class="o">=</span> <span class="nx">_computeFacets</span><span class="p">(</span><span class="nx">query_result</span><span class="p">.</span><span class="nx">hits</span><span class="p">,</span> <span class="nx">queryObj</span><span class="p">);</span>
|
||||
<span class="nx">query_result</span><span class="p">.</span><span class="nx">hits</span> <span class="o">=</span> <span class="nx">query_result</span><span class="p">.</span><span class="nx">hits</span><span class="p">.</span><span class="nx">slice</span><span class="p">(</span><span class="nx">cdb_q</span><span class="p">.</span><span class="nx">skip</span><span class="p">,</span> <span class="nx">cdb_q</span><span class="p">.</span><span class="nx">skip</span> <span class="o">+</span> <span class="nx">cdb_q</span><span class="p">.</span><span class="nx">limit</span><span class="o">+</span><span class="mi">1</span><span class="p">);</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">query_result</span><span class="p">);</span>
|
||||
|
||||
<span class="p">});</span>
|
||||
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-19"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-19">¶</a> </div> <p>in place filtering</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">_applyFilters</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">results</span><span class="p">,</span> <span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">.</span><span class="nx">filters</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">filter</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">results</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">filter</span><span class="p">(</span><span class="nx">results</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">fieldId</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">keys</span><span class="p">(</span><span class="nx">filter</span><span class="p">.</span><span class="nx">term</span><span class="p">)[</span><span class="mi">0</span><span class="p">];</span>
|
||||
<span class="k">return</span> <span class="p">(</span><span class="nx">doc</span><span class="p">[</span><span class="nx">fieldId</span><span class="p">]</span> <span class="o">==</span> <span class="nx">filter</span><span class="p">.</span><span class="nx">term</span><span class="p">[</span><span class="nx">fieldId</span><span class="p">]);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">results</span><span class="p">;</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-20"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-20">¶</a> </div> <p>we OR across fields but AND across terms in query string</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">_applyFreeTextQuery</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">results</span><span class="p">,</span> <span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">queryObj</span><span class="p">.</span><span class="nx">q</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">terms</span> <span class="o">=</span> <span class="nx">queryObj</span><span class="p">.</span><span class="nx">q</span><span class="p">.</span><span class="nx">split</span><span class="p">(</span><span class="s1">' '</span><span class="p">);</span>
|
||||
<span class="nx">results</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">filter</span><span class="p">(</span><span class="nx">results</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">rawdoc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">matches</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">terms</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">term</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">foundmatch</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">_</span><span class="p">.</span><span class="nx">keys</span><span class="p">(</span><span class="nx">rawdoc</span><span class="p">),</span> <span class="kd">function</span><span class="p">(</span><span class="nx">field</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">value</span> <span class="o">=</span> <span class="nx">rawdoc</span><span class="p">[</span><span class="nx">field</span><span class="p">];</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">value</span> <span class="o">!==</span> <span class="kc">null</span><span class="p">)</span> <span class="p">{</span> <span class="nx">value</span> <span class="o">=</span> <span class="nx">value</span><span class="p">.</span><span class="nx">toString</span><span class="p">();</span> <span class="p">}</span></pre></div> </td> </tr> <tr id="section-21"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-21">¶</a> </div> <p>TODO regexes?</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">foundmatch</span> <span class="o">=</span> <span class="nx">foundmatch</span> <span class="o">||</span> <span class="p">(</span><span class="nx">value</span> <span class="o">===</span> <span class="nx">term</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-22"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-22">¶</a> </div> <p>TODO: early out (once we are true should break to spare unnecessary testing)
|
||||
if (foundmatch) return true;</p> </td> <td class="code"> <div class="highlight"><pre> <span class="p">});</span>
|
||||
<span class="nx">matches</span> <span class="o">=</span> <span class="nx">matches</span> <span class="o">&&</span> <span class="nx">foundmatch</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-23"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-23">¶</a> </div> <p>TODO: early out (once false should break to spare unnecessary testing)
|
||||
if (!matches) return false;</p> </td> <td class="code"> <div class="highlight"><pre> <span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">matches</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">results</span><span class="p">;</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="nx">_computeFacets</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">records</span><span class="p">,</span> <span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">facetResults</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">queryObj</span><span class="p">.</span><span class="nx">facets</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">facetResults</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">.</span><span class="nx">facets</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">query</span><span class="p">,</span> <span class="nx">facetId</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-24"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-24">¶</a> </div> <p>TODO: remove dependency on recline.Model</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">facetResults</span><span class="p">[</span><span class="nx">facetId</span><span class="p">]</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">Facet</span><span class="p">({</span><span class="nx">id</span><span class="o">:</span> <span class="nx">facetId</span><span class="p">}).</span><span class="nx">toJSON</span><span class="p">();</span>
|
||||
<span class="nx">facetResults</span><span class="p">[</span><span class="nx">facetId</span><span class="p">].</span><span class="nx">termsall</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-25"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-25">¶</a> </div> <p>faceting</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">records</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">.</span><span class="nx">facets</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">query</span><span class="p">,</span> <span class="nx">facetId</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">fieldId</span> <span class="o">=</span> <span class="nx">query</span><span class="p">.</span><span class="nx">terms</span><span class="p">.</span><span class="nx">field</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">val</span> <span class="o">=</span> <span class="nx">doc</span><span class="p">[</span><span class="nx">fieldId</span><span class="p">];</span>
|
||||
<span class="kd">var</span> <span class="nx">tmp</span> <span class="o">=</span> <span class="nx">facetResults</span><span class="p">[</span><span class="nx">facetId</span><span class="p">];</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">val</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">tmp</span><span class="p">.</span><span class="nx">termsall</span><span class="p">[</span><span class="nx">val</span><span class="p">]</span> <span class="o">=</span> <span class="nx">tmp</span><span class="p">.</span><span class="nx">termsall</span><span class="p">[</span><span class="nx">val</span><span class="p">]</span> <span class="o">?</span> <span class="nx">tmp</span><span class="p">.</span><span class="nx">termsall</span><span class="p">[</span><span class="nx">val</span><span class="p">]</span> <span class="o">+</span> <span class="mi">1</span> <span class="o">:</span> <span class="mi">1</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">tmp</span><span class="p">.</span><span class="nx">missing</span> <span class="o">=</span> <span class="nx">tmp</span><span class="p">.</span><span class="nx">missing</span> <span class="o">+</span> <span class="mi">1</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">.</span><span class="nx">facets</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">query</span><span class="p">,</span> <span class="nx">facetId</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">tmp</span> <span class="o">=</span> <span class="nx">facetResults</span><span class="p">[</span><span class="nx">facetId</span><span class="p">];</span>
|
||||
<span class="kd">var</span> <span class="nx">terms</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">tmp</span><span class="p">.</span><span class="nx">termsall</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">count</span><span class="p">,</span> <span class="nx">term</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{</span> <span class="nx">term</span><span class="o">:</span> <span class="nx">term</span><span class="p">,</span> <span class="nx">count</span><span class="o">:</span> <span class="nx">count</span> <span class="p">};</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">tmp</span><span class="p">.</span><span class="nx">terms</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">sortBy</span><span class="p">(</span><span class="nx">terms</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">item</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-26"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-26">¶</a> </div> <p>want descending order</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="o">-</span><span class="nx">item</span><span class="p">.</span><span class="nx">count</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">tmp</span><span class="p">.</span><span class="nx">terms</span> <span class="o">=</span> <span class="nx">tmp</span><span class="p">.</span><span class="nx">terms</span><span class="p">.</span><span class="nx">slice</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="mi">10</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">facetResults</span><span class="p">;</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="nx">_createDocument</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">new_doc</span><span class="p">,</span> <span class="nx">dataset</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">db_url</span> <span class="o">=</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">db_url</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">view_url</span> <span class="o">=</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">view_url</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">_id</span> <span class="o">=</span> <span class="nx">new_doc</span><span class="p">[</span><span class="s1">'id'</span><span class="p">];</span>
|
||||
<span class="kd">var</span> <span class="nx">cdb</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">CouchDBWrapper</span><span class="p">(</span><span class="nx">db_url</span><span class="p">,</span> <span class="nx">view_url</span><span class="p">);</span>
|
||||
|
||||
<span class="k">delete</span> <span class="nx">new_doc</span><span class="p">[</span><span class="s1">'id'</span><span class="p">];</span>
|
||||
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">view_url</span><span class="p">.</span><span class="nx">search</span><span class="p">(</span><span class="s1">'_all_docs'</span><span class="p">)</span> <span class="o">!==</span> <span class="o">-</span><span class="mi">1</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">jqxhr</span> <span class="o">=</span> <span class="nx">cdb</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">_id</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">_id</span> <span class="o">=</span> <span class="nx">new_doc</span><span class="p">[</span><span class="s1">'_id'</span><span class="p">].</span><span class="nx">split</span><span class="p">(</span><span class="s1">'__'</span><span class="p">)[</span><span class="mi">0</span><span class="p">];</span>
|
||||
<span class="nx">jqxhr</span> <span class="o">=</span> <span class="nx">cdb</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">_id</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="nx">jqxhr</span><span class="p">.</span><span class="nx">done</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">old_doc</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">record_create</span><span class="p">)</span>
|
||||
<span class="nx">new_doc</span> <span class="o">=</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">record_create</span><span class="p">(</span><span class="nx">new_doc</span><span class="p">,</span> <span class="nx">old_doc</span><span class="p">);</span>
|
||||
<span class="nx">new_doc</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span><span class="nx">old_doc</span><span class="p">,</span> <span class="nx">new_doc</span><span class="p">);</span>
|
||||
<span class="nx">new_doc</span><span class="p">[</span><span class="s1">'_id'</span><span class="p">]</span> <span class="o">=</span> <span class="nx">_id</span><span class="p">;</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">cdb</span><span class="p">.</span><span class="nx">upsert</span><span class="p">(</span><span class="nx">new_doc</span><span class="p">));</span>
|
||||
<span class="p">}).</span><span class="nx">fail</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">args</span><span class="p">){</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">reject</span><span class="p">(</span><span class="nx">args</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="nx">_updateDocument</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">new_doc</span><span class="p">,</span> <span class="nx">dataset</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">db_url</span> <span class="o">=</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">db_url</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">view_url</span> <span class="o">=</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">view_url</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">_id</span> <span class="o">=</span> <span class="nx">new_doc</span><span class="p">[</span><span class="s1">'id'</span><span class="p">];</span>
|
||||
<span class="kd">var</span> <span class="nx">cdb</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">CouchDBWrapper</span><span class="p">(</span><span class="nx">db_url</span><span class="p">,</span> <span class="nx">view_url</span><span class="p">);</span>
|
||||
|
||||
<span class="k">delete</span> <span class="nx">new_doc</span><span class="p">[</span><span class="s1">'id'</span><span class="p">];</span>
|
||||
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">view_url</span><span class="p">.</span><span class="nx">search</span><span class="p">(</span><span class="s1">'_all_docs'</span><span class="p">)</span> <span class="o">!==</span> <span class="o">-</span><span class="mi">1</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">jqxhr</span> <span class="o">=</span> <span class="nx">cdb</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">_id</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">_id</span> <span class="o">=</span> <span class="nx">new_doc</span><span class="p">[</span><span class="s1">'_id'</span><span class="p">].</span><span class="nx">split</span><span class="p">(</span><span class="s1">'__'</span><span class="p">)[</span><span class="mi">0</span><span class="p">];</span>
|
||||
<span class="nx">jqxhr</span> <span class="o">=</span> <span class="nx">cdb</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">_id</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="nx">jqxhr</span><span class="p">.</span><span class="nx">done</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">old_doc</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">record_update</span><span class="p">)</span>
|
||||
<span class="nx">new_doc</span> <span class="o">=</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">record_update</span><span class="p">(</span><span class="nx">new_doc</span><span class="p">,</span> <span class="nx">old_doc</span><span class="p">);</span>
|
||||
<span class="nx">new_doc</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span><span class="nx">old_doc</span><span class="p">,</span> <span class="nx">new_doc</span><span class="p">);</span>
|
||||
<span class="nx">new_doc</span><span class="p">[</span><span class="s1">'_id'</span><span class="p">]</span> <span class="o">=</span> <span class="nx">_id</span><span class="p">;</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">cdb</span><span class="p">.</span><span class="nx">upsert</span><span class="p">(</span><span class="nx">new_doc</span><span class="p">));</span>
|
||||
<span class="p">}).</span><span class="nx">fail</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">args</span><span class="p">){</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">reject</span><span class="p">(</span><span class="nx">args</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="nx">_deleteDocument</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">del_doc</span><span class="p">,</span> <span class="nx">dataset</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">db_url</span> <span class="o">=</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">db_url</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">view_url</span> <span class="o">=</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">view_url</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">_id</span> <span class="o">=</span> <span class="nx">del_doc</span><span class="p">[</span><span class="s1">'id'</span><span class="p">];</span>
|
||||
<span class="kd">var</span> <span class="nx">cdb</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">CouchDBWrapper</span><span class="p">(</span><span class="nx">db_url</span><span class="p">,</span> <span class="nx">view_url</span><span class="p">);</span>
|
||||
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">view_url</span><span class="p">.</span><span class="nx">search</span><span class="p">(</span><span class="s1">'_all_docs'</span><span class="p">)</span> <span class="o">!==</span> <span class="o">-</span><span class="mi">1</span><span class="p">)</span>
|
||||
<span class="k">return</span> <span class="nx">cdb</span><span class="p">.</span><span class="k">delete</span><span class="p">(</span><span class="nx">_id</span><span class="p">);</span>
|
||||
<span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">_id</span> <span class="o">=</span> <span class="nx">model</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'_id'</span><span class="p">).</span><span class="nx">split</span><span class="p">(</span><span class="s1">'__'</span><span class="p">)[</span><span class="mi">0</span><span class="p">];</span>
|
||||
<span class="kd">var</span> <span class="nx">jqxhr</span> <span class="o">=</span> <span class="nx">cdb</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">_id</span><span class="p">);</span>
|
||||
|
||||
<span class="nx">jqxhr</span><span class="p">.</span><span class="nx">done</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">old_doc</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">record_delete</span><span class="p">)</span>
|
||||
<span class="nx">old_doc</span> <span class="o">=</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">record_delete</span><span class="p">(</span><span class="nx">del_doc</span><span class="p">,</span> <span class="nx">old_doc</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">_</span><span class="p">.</span><span class="nx">isNull</span><span class="p">(</span><span class="nx">del_doc</span><span class="p">))</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">cdb</span><span class="p">.</span><span class="k">delete</span><span class="p">(</span><span class="nx">_id</span><span class="p">));</span> <span class="c1">// XXX is this the right thing to do?</span>
|
||||
<span class="k">else</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-27"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-27">¶</a> </div> <p>couchdb uses _id to identify documents, Backbone models use id.
|
||||
we should remove it before sending it to the server.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">old_doc</span><span class="p">[</span><span class="s1">'_id'</span><span class="p">]</span> <span class="o">=</span> <span class="nx">_id</span><span class="p">;</span>
|
||||
<span class="k">delete</span> <span class="nx">old_doc</span><span class="p">[</span><span class="s1">'id'</span><span class="p">];</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">cdb</span><span class="p">.</span><span class="nx">upsert</span><span class="p">(</span><span class="nx">old_doc</span><span class="p">));</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}).</span><span class="nx">fail</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">args</span><span class="p">){</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">reject</span><span class="p">(</span><span class="nx">args</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="p">}(</span><span class="nx">jQuery</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">CouchDB</span><span class="p">));</span>
|
||||
|
||||
</pre></div> </td> </tr> </tbody> </table> </div> </body> </html>
|
||||
@ -1,44 +1,53 @@
|
||||
<!DOCTYPE html> <html> <head> <title>csv.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="base.html"> base.js </a> <a class="source" href="csv.html"> csv.js </a> <a class="source" href="dataproxy.html"> dataproxy.js </a> <a class="source" href="elasticsearch.html"> elasticsearch.js </a> <a class="source" href="gdocs.html"> gdocs.js </a> <a class="source" href="memory.html"> memory.js </a> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> csv.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> </td> <td class="code"> <div class="highlight"><pre><span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<!DOCTYPE html> <html> <head> <title>backend.csv.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="backend.couchdb.html"> backend.couchdb.js </a> <a class="source" href="backend.csv.html"> backend.csv.js </a> <a class="source" href="backend.dataproxy.html"> backend.dataproxy.js </a> <a class="source" href="backend.elasticsearch.html"> backend.elasticsearch.js </a> <a class="source" href="backend.gdocs.html"> backend.gdocs.js </a> <a class="source" href="backend.memory.html"> backend.memory.js </a> <a class="source" href="costco.html"> costco.js </a> <a class="source" href="model.html"> model.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="view.transform.html"> view.transform.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> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> backend.csv.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> </td> <td class="code"> <div class="highlight"><pre><span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">CSV</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">CSV</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
|
||||
<span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">my</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <h2>load</h2>
|
||||
<span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">my</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <h2>fetch</h2>
|
||||
|
||||
<p>Load data from a CSV file referenced in an HTMl5 file object returning the
|
||||
dataset in the callback</p>
|
||||
<p>3 options</p>
|
||||
|
||||
<p>@param options as for parseCSV below</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">load</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">file</span><span class="p">,</span> <span class="nx">callback</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">encoding</span> <span class="o">=</span> <span class="nx">options</span><span class="p">.</span><span class="nx">encoding</span> <span class="o">||</span> <span class="s1">'UTF-8'</span><span class="p">;</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">metadata</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">id</span><span class="o">:</span> <span class="nx">file</span><span class="p">.</span><span class="nx">name</span><span class="p">,</span>
|
||||
<span class="nx">file</span><span class="o">:</span> <span class="nx">file</span>
|
||||
<span class="p">};</span>
|
||||
<span class="kd">var</span> <span class="nx">reader</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">FileReader</span><span class="p">();</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <p>TODO</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">reader</span><span class="p">.</span><span class="nx">onload</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dataset</span> <span class="o">=</span> <span class="nx">my</span><span class="p">.</span><span class="nx">csvToDataset</span><span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">target</span><span class="p">.</span><span class="nx">result</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
|
||||
<span class="nx">callback</span><span class="p">(</span><span class="nx">dataset</span><span class="p">);</span>
|
||||
<span class="p">};</span>
|
||||
<span class="nx">reader</span><span class="p">.</span><span class="nx">onerror</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">alert</span><span class="p">(</span><span class="s1">'Failed to load file. Code: '</span> <span class="o">+</span> <span class="nx">e</span><span class="p">.</span><span class="nx">target</span><span class="p">.</span><span class="nx">error</span><span class="p">.</span><span class="nx">code</span><span class="p">);</span>
|
||||
<span class="p">};</span>
|
||||
<span class="nx">reader</span><span class="p">.</span><span class="nx">readAsText</span><span class="p">(</span><span class="nx">file</span><span class="p">,</span> <span class="nx">encoding</span><span class="p">);</span>
|
||||
<span class="p">};</span>
|
||||
<ol>
|
||||
<li>CSV local fileobject -> HTML5 file object + CSV parser</li>
|
||||
<li>Already have CSV string (in data) attribute -> CSV parser</li>
|
||||
<li>online CSV file that is ajax-able -> ajax + csv parser</li>
|
||||
</ol>
|
||||
|
||||
<span class="nx">my</span><span class="p">.</span><span class="nx">csvToDataset</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">csvString</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">out</span> <span class="o">=</span> <span class="nx">my</span><span class="p">.</span><span class="nx">parseCSV</span><span class="p">(</span><span class="nx">csvString</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
|
||||
<span class="nx">fields</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">out</span><span class="p">[</span><span class="mi">0</span><span class="p">],</span> <span class="kd">function</span><span class="p">(</span><span class="nx">cell</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{</span> <span class="nx">id</span><span class="o">:</span> <span class="nx">cell</span><span class="p">,</span> <span class="nx">label</span><span class="o">:</span> <span class="nx">cell</span> <span class="p">};</span>
|
||||
<span class="p">});</span>
|
||||
<span class="kd">var</span> <span class="nx">data</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">out</span><span class="p">.</span><span class="nx">slice</span><span class="p">(</span><span class="mi">1</span><span class="p">),</span> <span class="kd">function</span><span class="p">(</span><span class="nx">row</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">_doc</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">out</span><span class="p">[</span><span class="mi">0</span><span class="p">],</span> <span class="kd">function</span><span class="p">(</span><span class="nx">fieldId</span><span class="p">,</span> <span class="nx">idx</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">_doc</span><span class="p">[</span><span class="nx">fieldId</span><span class="p">]</span> <span class="o">=</span> <span class="nx">row</span><span class="p">[</span><span class="nx">idx</span><span class="p">];</span>
|
||||
<p>All options generates similar data and give a memory store outcome</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">fetch</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">dataset</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">file</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">reader</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">FileReader</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">encoding</span> <span class="o">=</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">encoding</span> <span class="o">||</span> <span class="s1">'UTF-8'</span><span class="p">;</span>
|
||||
<span class="nx">reader</span><span class="p">.</span><span class="nx">onload</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">rows</span> <span class="o">=</span> <span class="nx">my</span><span class="p">.</span><span class="nx">parseCSV</span><span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">target</span><span class="p">.</span><span class="nx">result</span><span class="p">,</span> <span class="nx">dataset</span><span class="p">);</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">({</span>
|
||||
<span class="nx">records</span><span class="o">:</span> <span class="nx">rows</span><span class="p">,</span>
|
||||
<span class="nx">metadata</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="nx">filename</span><span class="o">:</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">file</span><span class="p">.</span><span class="nx">name</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">useMemoryStore</span><span class="o">:</span> <span class="kc">true</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">};</span>
|
||||
<span class="nx">reader</span><span class="p">.</span><span class="nx">onerror</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">alert</span><span class="p">(</span><span class="s1">'Failed to load file. Code: '</span> <span class="o">+</span> <span class="nx">e</span><span class="p">.</span><span class="nx">target</span><span class="p">.</span><span class="nx">error</span><span class="p">.</span><span class="nx">code</span><span class="p">);</span>
|
||||
<span class="p">};</span>
|
||||
<span class="nx">reader</span><span class="p">.</span><span class="nx">readAsText</span><span class="p">(</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">file</span><span class="p">,</span> <span class="nx">encoding</span><span class="p">);</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">data</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">rows</span> <span class="o">=</span> <span class="nx">my</span><span class="p">.</span><span class="nx">parseCSV</span><span class="p">(</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">data</span><span class="p">,</span> <span class="nx">dataset</span><span class="p">);</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">({</span>
|
||||
<span class="nx">records</span><span class="o">:</span> <span class="nx">rows</span><span class="p">,</span>
|
||||
<span class="nx">useMemoryStore</span><span class="o">:</span> <span class="kc">true</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">_doc</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="kd">var</span> <span class="nx">dataset</span> <span class="o">=</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">Memory</span><span class="p">.</span><span class="nx">createDataset</span><span class="p">(</span><span class="nx">data</span><span class="p">,</span> <span class="nx">fields</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="nx">dataset</span><span class="p">;</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-4">¶</a> </div> <p>Converts a Comma Separated Values string into an array of arrays.
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">url</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">$</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">url</span><span class="p">).</span><span class="nx">done</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">data</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">rows</span> <span class="o">=</span> <span class="nx">my</span><span class="p">.</span><span class="nx">parseCSV</span><span class="p">(</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">data</span><span class="p">,</span> <span class="nx">dataset</span><span class="p">);</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">({</span>
|
||||
<span class="nx">records</span><span class="o">:</span> <span class="nx">rows</span><span class="p">,</span>
|
||||
<span class="nx">useMemoryStore</span><span class="o">:</span> <span class="kc">true</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <p>Converts a Comma Separated Values string into an array of arrays.
|
||||
Each line in the CSV becomes an array.</p>
|
||||
|
||||
<p>Empty fields are converted to nulls and non-quoted numbers are converted to integers or floats.</p>
|
||||
@ -51,14 +60,13 @@ Each line in the CSV becomes an array.</p>
|
||||
@param {Boolean} [trim=false] If set to True leading and trailing whitespace is stripped off of each non-quoted field as it is imported
|
||||
@param {String} [separator=','] Separator for CSV file
|
||||
Heavily based on uselesscode's JS CSV parser (MIT Licensed):
|
||||
thttp://www.uselesscode.org/javascript/csv/</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">parseCSV</span><span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">s</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <p>Get rid of any trailing \n</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">s</span> <span class="o">=</span> <span class="nx">chomp</span><span class="p">(</span><span class="nx">s</span><span class="p">);</span>
|
||||
http://www.uselesscode.org/javascript/csv/</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">parseCSV</span><span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">s</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-4">¶</a> </div> <p>Get rid of any trailing \n</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">s</span> <span class="o">=</span> <span class="nx">chomp</span><span class="p">(</span><span class="nx">s</span><span class="p">);</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">options</span> <span class="o">=</span> <span class="nx">options</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="kd">var</span> <span class="nx">trm</span> <span class="o">=</span> <span class="nx">options</span><span class="p">.</span><span class="nx">trim</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">trm</span> <span class="o">=</span> <span class="p">(</span><span class="nx">options</span><span class="p">.</span><span class="nx">trim</span> <span class="o">===</span> <span class="kc">false</span><span class="p">)</span> <span class="o">?</span> <span class="kc">false</span> <span class="o">:</span> <span class="kc">true</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">separator</span> <span class="o">=</span> <span class="nx">options</span><span class="p">.</span><span class="nx">separator</span> <span class="o">||</span> <span class="s1">','</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">delimiter</span> <span class="o">=</span> <span class="nx">options</span><span class="p">.</span><span class="nx">delimiter</span> <span class="o">||</span> <span class="s1">'"'</span><span class="p">;</span>
|
||||
|
||||
|
||||
<span class="kd">var</span> <span class="nx">cur</span> <span class="o">=</span> <span class="s1">''</span><span class="p">,</span> <span class="c1">// The character we are currently processing.</span>
|
||||
<span class="nx">inQuote</span> <span class="o">=</span> <span class="kc">false</span><span class="p">,</span>
|
||||
<span class="nx">fieldQuoted</span> <span class="o">=</span> <span class="kc">false</span><span class="p">,</span>
|
||||
@ -69,10 +77,10 @@ thttp://www.uselesscode.org/javascript/csv/</p> </td> <t
|
||||
<span class="nx">processField</span><span class="p">;</span>
|
||||
|
||||
<span class="nx">processField</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">field</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">fieldQuoted</span> <span class="o">!==</span> <span class="kc">true</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <p>If field is empty set to null</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">field</span> <span class="o">===</span> <span class="s1">''</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">field</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <p>If the field was not quoted and we are trimming fields, trim it</p> </td> <td class="code"> <div class="highlight"><pre> <span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">trm</span> <span class="o">===</span> <span class="kc">true</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">fieldQuoted</span> <span class="o">!==</span> <span class="kc">true</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <p>If field is empty set to null</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">field</span> <span class="o">===</span> <span class="s1">''</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">field</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <p>If the field was not quoted and we are trimming fields, trim it</p> </td> <td class="code"> <div class="highlight"><pre> <span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">trm</span> <span class="o">===</span> <span class="kc">true</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">field</span> <span class="o">=</span> <span class="nx">trim</span><span class="p">(</span><span class="nx">field</span><span class="p">);</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">¶</a> </div> <p>Convert unquoted numbers to their appropriate types</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">rxIsInt</span><span class="p">.</span><span class="nx">test</span><span class="p">(</span><span class="nx">field</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <p>Convert unquoted numbers to their appropriate types</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">rxIsInt</span><span class="p">.</span><span class="nx">test</span><span class="p">(</span><span class="nx">field</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="nx">field</span> <span class="o">=</span> <span class="nb">parseInt</span><span class="p">(</span><span class="nx">field</span><span class="p">,</span> <span class="mi">10</span><span class="p">);</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">rxIsFloat</span><span class="p">.</span><span class="nx">test</span><span class="p">(</span><span class="nx">field</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="nx">field</span> <span class="o">=</span> <span class="nb">parseFloat</span><span class="p">(</span><span class="nx">field</span><span class="p">,</span> <span class="mi">10</span><span class="p">);</span>
|
||||
@ -82,25 +90,25 @@ thttp://www.uselesscode.org/javascript/csv/</p> </td> <t
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="k">for</span> <span class="p">(</span><span class="nx">i</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span> <span class="nx">i</span> <span class="o"><</span> <span class="nx">s</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="nx">i</span> <span class="o">+=</span> <span class="mi">1</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">cur</span> <span class="o">=</span> <span class="nx">s</span><span class="p">.</span><span class="nx">charAt</span><span class="p">(</span><span class="nx">i</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-9">¶</a> </div> <p>If we are at a EOF or EOR</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">inQuote</span> <span class="o">===</span> <span class="kc">false</span> <span class="o">&&</span> <span class="p">(</span><span class="nx">cur</span> <span class="o">===</span> <span class="nx">separator</span> <span class="o">||</span> <span class="nx">cur</span> <span class="o">===</span> <span class="s2">"\n"</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="nx">field</span> <span class="o">=</span> <span class="nx">processField</span><span class="p">(</span><span class="nx">field</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">¶</a> </div> <p>Add the current field to the current row</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">row</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">field</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-11">¶</a> </div> <p>If this is EOR append row to output and flush row</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">cur</span> <span class="o">===</span> <span class="s2">"\n"</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">cur</span> <span class="o">=</span> <span class="nx">s</span><span class="p">.</span><span class="nx">charAt</span><span class="p">(</span><span class="nx">i</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">¶</a> </div> <p>If we are at a EOF or EOR</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">inQuote</span> <span class="o">===</span> <span class="kc">false</span> <span class="o">&&</span> <span class="p">(</span><span class="nx">cur</span> <span class="o">===</span> <span class="nx">separator</span> <span class="o">||</span> <span class="nx">cur</span> <span class="o">===</span> <span class="s2">"\n"</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="nx">field</span> <span class="o">=</span> <span class="nx">processField</span><span class="p">(</span><span class="nx">field</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-9">¶</a> </div> <p>Add the current field to the current row</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">row</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">field</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">¶</a> </div> <p>If this is EOR append row to output and flush row</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">cur</span> <span class="o">===</span> <span class="s2">"\n"</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">out</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">row</span><span class="p">);</span>
|
||||
<span class="nx">row</span> <span class="o">=</span> <span class="p">[];</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-12">¶</a> </div> <p>Flush the field buffer</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">field</span> <span class="o">=</span> <span class="s1">''</span><span class="p">;</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-11">¶</a> </div> <p>Flush the field buffer</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">field</span> <span class="o">=</span> <span class="s1">''</span><span class="p">;</span>
|
||||
<span class="nx">fieldQuoted</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-13">¶</a> </div> <p>If it's not a delimiter, add it to the field buffer</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">cur</span> <span class="o">!==</span> <span class="nx">delimiter</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-12">¶</a> </div> <p>If it's not a delimiter, add it to the field buffer</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">cur</span> <span class="o">!==</span> <span class="nx">delimiter</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">field</span> <span class="o">+=</span> <span class="nx">cur</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">inQuote</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-14"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-14">¶</a> </div> <p>We are not in a quote, start a quote</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">inQuote</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">inQuote</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-13">¶</a> </div> <p>We are not in a quote, start a quote</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">inQuote</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
|
||||
<span class="nx">fieldQuoted</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-15"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-15">¶</a> </div> <p>Next char is delimiter, this is an escaped delimiter</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">s</span><span class="p">.</span><span class="nx">charAt</span><span class="p">(</span><span class="nx">i</span> <span class="o">+</span> <span class="mi">1</span><span class="p">)</span> <span class="o">===</span> <span class="nx">delimiter</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">field</span> <span class="o">+=</span> <span class="nx">delimiter</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-16"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-16">¶</a> </div> <p>Skip the next char</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">i</span> <span class="o">+=</span> <span class="mi">1</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-17"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-17">¶</a> </div> <p>It's not escaping, so end quote</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">inQuote</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-14"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-14">¶</a> </div> <p>Next char is delimiter, this is an escaped delimiter</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">s</span><span class="p">.</span><span class="nx">charAt</span><span class="p">(</span><span class="nx">i</span> <span class="o">+</span> <span class="mi">1</span><span class="p">)</span> <span class="o">===</span> <span class="nx">delimiter</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">field</span> <span class="o">+=</span> <span class="nx">delimiter</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-15"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-15">¶</a> </div> <p>Skip the next char</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">i</span> <span class="o">+=</span> <span class="mi">1</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-16"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-16">¶</a> </div> <p>It's not escaping, so end quote</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">inQuote</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-18"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-18">¶</a> </div> <p>Add the last field</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">field</span> <span class="o">=</span> <span class="nx">processField</span><span class="p">(</span><span class="nx">field</span><span class="p">);</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-17"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-17">¶</a> </div> <p>Add the last field</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">field</span> <span class="o">=</span> <span class="nx">processField</span><span class="p">(</span><span class="nx">field</span><span class="p">);</span>
|
||||
<span class="nx">row</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">field</span><span class="p">);</span>
|
||||
<span class="nx">out</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">row</span><span class="p">);</span>
|
||||
|
||||
@ -108,10 +116,10 @@ thttp://www.uselesscode.org/javascript/csv/</p> </td> <t
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">rxIsInt</span> <span class="o">=</span> <span class="sr">/^\d+$/</span><span class="p">,</span>
|
||||
<span class="nx">rxIsFloat</span> <span class="o">=</span> <span class="sr">/^\d*\.\d+$|^\d+\.\d*$/</span><span class="p">,</span></pre></div> </td> </tr> <tr id="section-19"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-19">¶</a> </div> <p>If a string has leading or trailing space,
|
||||
<span class="nx">rxIsFloat</span> <span class="o">=</span> <span class="sr">/^\d*\.\d+$|^\d+\.\d*$/</span><span class="p">,</span></pre></div> </td> </tr> <tr id="section-18"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-18">¶</a> </div> <p>If a string has leading or trailing space,
|
||||
contains a comma double quote or a newline
|
||||
it needs to be quoted in CSV output</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">rxNeedsQuoting</span> <span class="o">=</span> <span class="sr">/^\s|\s$|,|"|\n/</span><span class="p">,</span>
|
||||
<span class="nx">trim</span> <span class="o">=</span> <span class="p">(</span><span class="kd">function</span> <span class="p">()</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-20"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-20">¶</a> </div> <p>Fx 3.1 has a native trim function, it's about 10x faster, use it if it exists</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nb">String</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">trim</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">trim</span> <span class="o">=</span> <span class="p">(</span><span class="kd">function</span> <span class="p">()</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-19"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-19">¶</a> </div> <p>Fx 3.1 has a native trim function, it's about 10x faster, use it if it exists</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nb">String</span><span class="p">.</span><span class="nx">prototype</span><span class="p">.</span><span class="nx">trim</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">s</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">s</span><span class="p">.</span><span class="nx">trim</span><span class="p">();</span>
|
||||
<span class="p">};</span>
|
||||
@ -123,8 +131,8 @@ it needs to be quoted in CSV output</p> </td> <td class=
|
||||
<span class="p">}());</span>
|
||||
|
||||
<span class="kd">function</span> <span class="nx">chomp</span><span class="p">(</span><span class="nx">s</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">s</span><span class="p">.</span><span class="nx">charAt</span><span class="p">(</span><span class="nx">s</span><span class="p">.</span><span class="nx">length</span> <span class="o">-</span> <span class="mi">1</span><span class="p">)</span> <span class="o">!==</span> <span class="s2">"\n"</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-21"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-21">¶</a> </div> <p>Does not end with \n, just return string</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="nx">s</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-22"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-22">¶</a> </div> <p>Remove the \n</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="nx">s</span><span class="p">.</span><span class="nx">substring</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="nx">s</span><span class="p">.</span><span class="nx">length</span> <span class="o">-</span> <span class="mi">1</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">s</span><span class="p">.</span><span class="nx">charAt</span><span class="p">(</span><span class="nx">s</span><span class="p">.</span><span class="nx">length</span> <span class="o">-</span> <span class="mi">1</span><span class="p">)</span> <span class="o">!==</span> <span class="s2">"\n"</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-20"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-20">¶</a> </div> <p>Does not end with \n, just return string</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="nx">s</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-21"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-21">¶</a> </div> <p>Remove the \n</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="nx">s</span><span class="p">.</span><span class="nx">substring</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="nx">s</span><span class="p">.</span><span class="nx">length</span> <span class="o">-</span> <span class="mi">1</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
63
docs/src/backend.dataproxy.html
Normal file
63
docs/src/backend.dataproxy.html
Normal file
@ -0,0 +1,63 @@
|
||||
<!DOCTYPE html> <html> <head> <title>backend.dataproxy.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="backend.couchdb.html"> backend.couchdb.js </a> <a class="source" href="backend.csv.html"> backend.csv.js </a> <a class="source" href="backend.dataproxy.html"> backend.dataproxy.js </a> <a class="source" href="backend.elasticsearch.html"> backend.elasticsearch.js </a> <a class="source" href="backend.gdocs.html"> backend.gdocs.js </a> <a class="source" href="backend.memory.html"> backend.memory.js </a> <a class="source" href="costco.html"> costco.js </a> <a class="source" href="model.html"> model.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="view.transform.html"> view.transform.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> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> backend.dataproxy.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> </td> <td class="code"> <div class="highlight"><pre><span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">DataProxy</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">DataProxy</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
|
||||
<span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">$</span><span class="p">,</span> <span class="nx">my</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">my</span><span class="p">.</span><span class="nx">__type__</span> <span class="o">=</span> <span class="s1">'dataproxy'</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <p>URL for the dataproxy</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">dataproxy_url</span> <span class="o">=</span> <span class="s1">'http://jsonpdataproxy.appspot.com'</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <h2>load</h2>
|
||||
|
||||
<p>Load data from a URL via the <a href="http://github.com/okfn/dataproxy">DataProxy</a>.</p>
|
||||
|
||||
<p>Returns array of field names and array of arrays for records</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">fetch</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">dataset</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">data</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">url</span><span class="p">,</span>
|
||||
<span class="s1">'max-results'</span><span class="o">:</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">size</span> <span class="o">||</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">rows</span> <span class="o">||</span> <span class="mi">1000</span><span class="p">,</span>
|
||||
<span class="nx">type</span><span class="o">:</span> <span class="nx">dataset</span><span class="p">.</span><span class="nx">format</span> <span class="o">||</span> <span class="s1">''</span>
|
||||
<span class="p">};</span>
|
||||
<span class="kd">var</span> <span class="nx">jqxhr</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">ajax</span><span class="p">({</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="nx">my</span><span class="p">.</span><span class="nx">dataproxy_url</span><span class="p">,</span>
|
||||
<span class="nx">data</span><span class="o">:</span> <span class="nx">data</span><span class="p">,</span>
|
||||
<span class="nx">dataType</span><span class="o">:</span> <span class="s1">'jsonp'</span>
|
||||
<span class="p">});</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="nx">_wrapInTimeout</span><span class="p">(</span><span class="nx">jqxhr</span><span class="p">).</span><span class="nx">done</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">results</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">results</span><span class="p">.</span><span class="nx">error</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">reject</span><span class="p">(</span><span class="nx">results</span><span class="p">.</span><span class="nx">error</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">({</span>
|
||||
<span class="nx">records</span><span class="o">:</span> <span class="nx">results</span><span class="p">.</span><span class="nx">data</span><span class="p">,</span>
|
||||
<span class="nx">fields</span><span class="o">:</span> <span class="nx">results</span><span class="p">.</span><span class="nx">fields</span><span class="p">,</span>
|
||||
<span class="nx">useMemoryStore</span><span class="o">:</span> <span class="kc">true</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">})</span>
|
||||
<span class="p">.</span><span class="nx">fail</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">arguments</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">reject</span><span class="p">(</span><span class="nx">arguments</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-4">¶</a> </div> <h2>_wrapInTimeout</h2>
|
||||
|
||||
<p>Convenience method providing a crude way to catch backend errors on JSONP calls.
|
||||
Many of backends use JSONP and so will not get error messages and this is
|
||||
a crude way to catch those errors.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">_wrapInTimeout</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">ourFunction</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">timeout</span> <span class="o">=</span> <span class="mi">5000</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">timer</span> <span class="o">=</span> <span class="nx">setTimeout</span><span class="p">(</span><span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">reject</span><span class="p">({</span>
|
||||
<span class="nx">message</span><span class="o">:</span> <span class="s1">'Request Error: Backend did not respond after '</span> <span class="o">+</span> <span class="p">(</span><span class="nx">timeout</span> <span class="o">/</span> <span class="mi">1000</span><span class="p">)</span> <span class="o">+</span> <span class="s1">' seconds'</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">},</span> <span class="nx">timeout</span><span class="p">);</span>
|
||||
<span class="nx">ourFunction</span><span class="p">.</span><span class="nx">done</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">arguments</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">clearTimeout</span><span class="p">(</span><span class="nx">timer</span><span class="p">);</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">arguments</span><span class="p">);</span>
|
||||
<span class="p">})</span>
|
||||
<span class="p">.</span><span class="nx">fail</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">arguments</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">clearTimeout</span><span class="p">(</span><span class="nx">timer</span><span class="p">);</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">reject</span><span class="p">(</span><span class="nx">arguments</span><span class="p">);</span>
|
||||
<span class="p">})</span>
|
||||
<span class="p">;</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="p">}(</span><span class="nx">jQuery</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">DataProxy</span><span class="p">));</span>
|
||||
|
||||
</pre></div> </td> </tr> </tbody> </table> </div> </body> </html>
|
||||
225
docs/src/backend.elasticsearch.html
Normal file
225
docs/src/backend.elasticsearch.html
Normal file
@ -0,0 +1,225 @@
|
||||
<!DOCTYPE html> <html> <head> <title>backend.elasticsearch.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="backend.couchdb.html"> backend.couchdb.js </a> <a class="source" href="backend.csv.html"> backend.csv.js </a> <a class="source" href="backend.dataproxy.html"> backend.dataproxy.js </a> <a class="source" href="backend.elasticsearch.html"> backend.elasticsearch.js </a> <a class="source" href="backend.gdocs.html"> backend.gdocs.js </a> <a class="source" href="backend.memory.html"> backend.memory.js </a> <a class="source" href="costco.html"> costco.js </a> <a class="source" href="model.html"> model.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="view.transform.html"> view.transform.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> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> backend.elasticsearch.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> </td> <td class="code"> <div class="highlight"><pre><span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">ElasticSearch</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">ElasticSearch</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
|
||||
<span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">$</span><span class="p">,</span> <span class="nx">my</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">my</span><span class="p">.</span><span class="nx">__type__</span> <span class="o">=</span> <span class="s1">'elasticsearch'</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <h2>ElasticSearch Wrapper</h2>
|
||||
|
||||
<p>A simple JS wrapper around an <a href="http://www.elasticsearch.org/">ElasticSearch</a> endpoints.</p>
|
||||
|
||||
<p>@param {String} endpoint: url for ElasticSearch type/table, e.g. for ES running
|
||||
on http://localhost:9200 with index twitter and type tweet it would be:</p>
|
||||
|
||||
<pre>http://localhost:9200/twitter/tweet</pre>
|
||||
|
||||
<p>@param {Object} options: set of options such as:</p>
|
||||
|
||||
<ul>
|
||||
<li>headers - {dict of headers to add to each request}</li>
|
||||
<li>dataType: dataType for AJAx requests e.g. set to jsonp to make jsonp requests (default is json requests)</li>
|
||||
</ul> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">Wrapper</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">endpoint</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">endpoint</span> <span class="o">=</span> <span class="nx">endpoint</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">options</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">dataType</span><span class="o">:</span> <span class="s1">'json'</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">options</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <h3>mapping</h3>
|
||||
|
||||
<p>Get ES mapping for this type/table</p>
|
||||
|
||||
<p>@return promise compatible deferred object.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">mapping</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">schemaUrl</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">endpoint</span> <span class="o">+</span> <span class="s1">'/_mapping'</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">jqxhr</span> <span class="o">=</span> <span class="nx">makeRequest</span><span class="p">({</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="nx">schemaUrl</span><span class="p">,</span>
|
||||
<span class="nx">dataType</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">options</span><span class="p">.</span><span class="nx">dataType</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">jqxhr</span><span class="p">;</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-4">¶</a> </div> <h3>get</h3>
|
||||
|
||||
<p>Get record corresponding to specified id</p>
|
||||
|
||||
<p>@return promise compatible deferred object.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">get</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">id</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">base</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">endpoint</span> <span class="o">+</span> <span class="s1">'/'</span> <span class="o">+</span> <span class="nx">id</span><span class="p">;</span>
|
||||
<span class="k">return</span> <span class="nx">makeRequest</span><span class="p">({</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="nx">base</span><span class="p">,</span>
|
||||
<span class="nx">dataType</span><span class="o">:</span> <span class="s1">'json'</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <h3>upsert</h3>
|
||||
|
||||
<p>create / update a record to ElasticSearch backend</p>
|
||||
|
||||
<p>@param {Object} doc an object to insert to the index.
|
||||
@return deferred supporting promise API</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">upsert</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">data</span> <span class="o">=</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">stringify</span><span class="p">(</span><span class="nx">doc</span><span class="p">);</span>
|
||||
<span class="nx">url</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">endpoint</span><span class="p">;</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">doc</span><span class="p">.</span><span class="nx">id</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">url</span> <span class="o">+=</span> <span class="s1">'/'</span> <span class="o">+</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">id</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">makeRequest</span><span class="p">({</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="nx">url</span><span class="p">,</span>
|
||||
<span class="nx">type</span><span class="o">:</span> <span class="s1">'POST'</span><span class="p">,</span>
|
||||
<span class="nx">data</span><span class="o">:</span> <span class="nx">data</span><span class="p">,</span>
|
||||
<span class="nx">dataType</span><span class="o">:</span> <span class="s1">'json'</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <h3>delete</h3>
|
||||
|
||||
<p>Delete a record from the ElasticSearch backend.</p>
|
||||
|
||||
<p>@param {Object} id id of object to delete
|
||||
@return deferred supporting promise API</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="k">delete</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">id</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">url</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">endpoint</span><span class="p">;</span>
|
||||
<span class="nx">url</span> <span class="o">+=</span> <span class="s1">'/'</span> <span class="o">+</span> <span class="nx">id</span><span class="p">;</span>
|
||||
<span class="k">return</span> <span class="nx">makeRequest</span><span class="p">({</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="nx">url</span><span class="p">,</span>
|
||||
<span class="nx">type</span><span class="o">:</span> <span class="s1">'DELETE'</span><span class="p">,</span>
|
||||
<span class="nx">dataType</span><span class="o">:</span> <span class="s1">'json'</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_normalizeQuery</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">queryInfo</span> <span class="o">=</span> <span class="p">(</span><span class="nx">queryObj</span> <span class="o">&&</span> <span class="nx">queryObj</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">)</span> <span class="o">?</span> <span class="nx">queryObj</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">()</span> <span class="o">:</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">({},</span> <span class="nx">queryObj</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">out</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">constant_score</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="nx">query</span><span class="o">:</span> <span class="p">{}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">queryInfo</span><span class="p">.</span><span class="nx">q</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">out</span><span class="p">.</span><span class="nx">constant_score</span><span class="p">.</span><span class="nx">query</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">match_all</span><span class="o">:</span> <span class="p">{}</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">out</span><span class="p">.</span><span class="nx">constant_score</span><span class="p">.</span><span class="nx">query</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">query_string</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="nx">query</span><span class="o">:</span> <span class="nx">queryInfo</span><span class="p">.</span><span class="nx">q</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">queryInfo</span><span class="p">.</span><span class="nx">filters</span> <span class="o">&&</span> <span class="nx">queryInfo</span><span class="p">.</span><span class="nx">filters</span><span class="p">.</span><span class="nx">length</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">out</span><span class="p">.</span><span class="nx">constant_score</span><span class="p">.</span><span class="nx">filter</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">and</span><span class="o">:</span> <span class="p">[]</span>
|
||||
<span class="p">};</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">queryInfo</span><span class="p">.</span><span class="nx">filters</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">filter</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">out</span><span class="p">.</span><span class="nx">constant_score</span><span class="p">.</span><span class="nx">filter</span><span class="p">.</span><span class="nx">and</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">_convertFilter</span><span class="p">(</span><span class="nx">filter</span><span class="p">));</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">out</span><span class="p">;</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_convertFilter</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">filter</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">out</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="nx">out</span><span class="p">[</span><span class="nx">filter</span><span class="p">.</span><span class="nx">type</span><span class="p">]</span> <span class="o">=</span> <span class="p">{}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">filter</span><span class="p">.</span><span class="nx">type</span> <span class="o">===</span> <span class="s1">'term'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">out</span><span class="p">.</span><span class="nx">term</span><span class="p">[</span><span class="nx">filter</span><span class="p">.</span><span class="nx">field</span><span class="p">]</span> <span class="o">=</span> <span class="nx">filter</span><span class="p">.</span><span class="nx">term</span><span class="p">.</span><span class="nx">toLowerCase</span><span class="p">();</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">filter</span><span class="p">.</span><span class="nx">type</span> <span class="o">===</span> <span class="s1">'geo_distance'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">out</span><span class="p">.</span><span class="nx">geo_distance</span><span class="p">[</span><span class="nx">filter</span><span class="p">.</span><span class="nx">field</span><span class="p">]</span> <span class="o">=</span> <span class="nx">filter</span><span class="p">.</span><span class="nx">point</span><span class="p">;</span>
|
||||
<span class="nx">out</span><span class="p">.</span><span class="nx">geo_distance</span><span class="p">.</span><span class="nx">distance</span> <span class="o">=</span> <span class="nx">filter</span><span class="p">.</span><span class="nx">distance</span><span class="p">;</span>
|
||||
<span class="nx">out</span><span class="p">.</span><span class="nx">geo_distance</span><span class="p">.</span><span class="nx">unit</span> <span class="o">=</span> <span class="nx">filter</span><span class="p">.</span><span class="nx">unit</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">out</span><span class="p">;</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <h3>query</h3>
|
||||
|
||||
<p>@return deferred supporting promise API</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">query</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">esQuery</span> <span class="o">=</span> <span class="p">(</span><span class="nx">queryObj</span> <span class="o">&&</span> <span class="nx">queryObj</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">)</span> <span class="o">?</span> <span class="nx">queryObj</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">()</span> <span class="o">:</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">({},</span> <span class="nx">queryObj</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">queryNormalized</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">_normalizeQuery</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">);</span>
|
||||
<span class="k">delete</span> <span class="nx">esQuery</span><span class="p">.</span><span class="nx">q</span><span class="p">;</span>
|
||||
<span class="k">delete</span> <span class="nx">esQuery</span><span class="p">.</span><span class="nx">filters</span><span class="p">;</span>
|
||||
<span class="nx">esQuery</span><span class="p">.</span><span class="nx">query</span> <span class="o">=</span> <span class="nx">queryNormalized</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">data</span> <span class="o">=</span> <span class="p">{</span><span class="nx">source</span><span class="o">:</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">stringify</span><span class="p">(</span><span class="nx">esQuery</span><span class="p">)};</span>
|
||||
<span class="kd">var</span> <span class="nx">url</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">endpoint</span> <span class="o">+</span> <span class="s1">'/_search'</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">jqxhr</span> <span class="o">=</span> <span class="nx">makeRequest</span><span class="p">({</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="nx">url</span><span class="p">,</span>
|
||||
<span class="nx">data</span><span class="o">:</span> <span class="nx">data</span><span class="p">,</span>
|
||||
<span class="nx">dataType</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">options</span><span class="p">.</span><span class="nx">dataType</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">jqxhr</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">¶</a> </div> <h2>Recline Connectors</h2>
|
||||
|
||||
<p>Requires URL of ElasticSearch endpoint to be specified on the dataset
|
||||
via the url attribute.</p> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-9">¶</a> </div> <p>ES options which are passed through to <code>options</code> on Wrapper (see Wrapper for details)</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">esOptions</span> <span class="o">=</span> <span class="p">{};</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">¶</a> </div> <h3>fetch</h3> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">fetch</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">dataset</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">es</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Wrapper</span><span class="p">(</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">url</span><span class="p">,</span> <span class="nx">my</span><span class="p">.</span><span class="nx">esOptions</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="nx">es</span><span class="p">.</span><span class="nx">mapping</span><span class="p">().</span><span class="nx">done</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">schema</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-11">¶</a> </div> <p>only one top level key in ES = the type so we can ignore it</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">key</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">keys</span><span class="p">(</span><span class="nx">schema</span><span class="p">)[</span><span class="mi">0</span><span class="p">];</span>
|
||||
<span class="kd">var</span> <span class="nx">fieldData</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">schema</span><span class="p">[</span><span class="nx">key</span><span class="p">].</span><span class="nx">properties</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">dict</span><span class="p">,</span> <span class="nx">fieldName</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">dict</span><span class="p">.</span><span class="nx">id</span> <span class="o">=</span> <span class="nx">fieldName</span><span class="p">;</span>
|
||||
<span class="k">return</span> <span class="nx">dict</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">({</span>
|
||||
<span class="nx">fields</span><span class="o">:</span> <span class="nx">fieldData</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">})</span>
|
||||
<span class="p">.</span><span class="nx">fail</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">arguments</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">reject</span><span class="p">(</span><span class="nx">arguments</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-12">¶</a> </div> <h3>save</h3> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">save</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">changes</span><span class="p">,</span> <span class="nx">dataset</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">es</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Wrapper</span><span class="p">(</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">url</span><span class="p">,</span> <span class="nx">my</span><span class="p">.</span><span class="nx">esOptions</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">changes</span><span class="p">.</span><span class="nx">creates</span><span class="p">.</span><span class="nx">length</span> <span class="o">+</span> <span class="nx">changes</span><span class="p">.</span><span class="nx">updates</span><span class="p">.</span><span class="nx">length</span> <span class="o">+</span> <span class="nx">changes</span><span class="p">.</span><span class="nx">deletes</span><span class="p">.</span><span class="nx">length</span> <span class="o">></span> <span class="mi">1</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="nx">msg</span> <span class="o">=</span> <span class="s1">'Saving more than one item at a time not yet supported'</span><span class="p">;</span>
|
||||
<span class="nx">alert</span><span class="p">(</span><span class="nx">msg</span><span class="p">);</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">reject</span><span class="p">(</span><span class="nx">msg</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">changes</span><span class="p">.</span><span class="nx">creates</span><span class="p">.</span><span class="nx">length</span> <span class="o">></span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">es</span><span class="p">.</span><span class="nx">upsert</span><span class="p">(</span><span class="nx">changes</span><span class="p">.</span><span class="nx">creates</span><span class="p">[</span><span class="mi">0</span><span class="p">]);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">changes</span><span class="p">.</span><span class="nx">updates</span><span class="p">.</span><span class="nx">length</span> <span class="o">></span><span class="mi">0</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">es</span><span class="p">.</span><span class="nx">upsert</span><span class="p">(</span><span class="nx">changes</span><span class="p">.</span><span class="nx">updates</span><span class="p">[</span><span class="mi">0</span><span class="p">]);</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">changes</span><span class="p">.</span><span class="nx">deletes</span><span class="p">.</span><span class="nx">length</span> <span class="o">></span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">es</span><span class="p">.</span><span class="k">delete</span><span class="p">(</span><span class="nx">changes</span><span class="p">.</span><span class="nx">deletes</span><span class="p">[</span><span class="mi">0</span><span class="p">].</span><span class="nx">id</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-13">¶</a> </div> <h3>query</h3> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">query</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">,</span> <span class="nx">dataset</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">es</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Wrapper</span><span class="p">(</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">url</span><span class="p">,</span> <span class="nx">my</span><span class="p">.</span><span class="nx">esOptions</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">jqxhr</span> <span class="o">=</span> <span class="nx">es</span><span class="p">.</span><span class="nx">query</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">);</span>
|
||||
<span class="nx">jqxhr</span><span class="p">.</span><span class="nx">done</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">results</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">out</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">total</span><span class="o">:</span> <span class="nx">results</span><span class="p">.</span><span class="nx">hits</span><span class="p">.</span><span class="nx">total</span><span class="p">,</span>
|
||||
<span class="p">};</span>
|
||||
<span class="nx">out</span><span class="p">.</span><span class="nx">hits</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">results</span><span class="p">.</span><span class="nx">hits</span><span class="p">.</span><span class="nx">hits</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">hit</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="p">(</span><span class="s1">'id'</span> <span class="k">in</span> <span class="nx">hit</span><span class="p">.</span><span class="nx">_source</span><span class="p">)</span> <span class="o">&&</span> <span class="nx">hit</span><span class="p">.</span><span class="nx">_id</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">hit</span><span class="p">.</span><span class="nx">_source</span><span class="p">.</span><span class="nx">id</span> <span class="o">=</span> <span class="nx">hit</span><span class="p">.</span><span class="nx">_id</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">hit</span><span class="p">.</span><span class="nx">_source</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">results</span><span class="p">.</span><span class="nx">facets</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">out</span><span class="p">.</span><span class="nx">facets</span> <span class="o">=</span> <span class="nx">results</span><span class="p">.</span><span class="nx">facets</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">out</span><span class="p">);</span>
|
||||
<span class="p">}).</span><span class="nx">fail</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">errorObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">out</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">title</span><span class="o">:</span> <span class="s1">'Failed: '</span> <span class="o">+</span> <span class="nx">errorObj</span><span class="p">.</span><span class="nx">status</span> <span class="o">+</span> <span class="s1">' code'</span><span class="p">,</span>
|
||||
<span class="nx">message</span><span class="o">:</span> <span class="nx">errorObj</span><span class="p">.</span><span class="nx">responseText</span>
|
||||
<span class="p">};</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">reject</span><span class="p">(</span><span class="nx">out</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-14"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-14">¶</a> </div> <h3>makeRequest</h3>
|
||||
|
||||
<p>Just $.ajax but in any headers in the 'headers' attribute of this
|
||||
Backend instance. Example:</p>
|
||||
|
||||
<pre>
|
||||
var jqxhr = this._makeRequest({
|
||||
url: the-url
|
||||
});
|
||||
</pre> </td> <td class="code"> <div class="highlight"><pre><span class="kd">var</span> <span class="nx">makeRequest</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">data</span><span class="p">,</span> <span class="nx">headers</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">extras</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">headers</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">extras</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">beforeSend</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">req</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">headers</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">value</span><span class="p">,</span> <span class="nx">key</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">req</span><span class="p">.</span><span class="nx">setRequestHeader</span><span class="p">(</span><span class="nx">key</span><span class="p">,</span> <span class="nx">value</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">}</span>
|
||||
<span class="kd">var</span> <span class="nx">data</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span><span class="nx">extras</span><span class="p">,</span> <span class="nx">data</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="nx">$</span><span class="p">.</span><span class="nx">ajax</span><span class="p">(</span><span class="nx">data</span><span class="p">);</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="p">}(</span><span class="nx">jQuery</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">ElasticSearch</span><span class="p">));</span>
|
||||
|
||||
</pre></div> </td> </tr> </tbody> </table> </div> </body> </html>
|
||||
108
docs/src/backend.gdocs.html
Normal file
108
docs/src/backend.gdocs.html
Normal file
@ -0,0 +1,108 @@
|
||||
<!DOCTYPE html> <html> <head> <title>backend.gdocs.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="backend.couchdb.html"> backend.couchdb.js </a> <a class="source" href="backend.csv.html"> backend.csv.js </a> <a class="source" href="backend.dataproxy.html"> backend.dataproxy.js </a> <a class="source" href="backend.elasticsearch.html"> backend.elasticsearch.js </a> <a class="source" href="backend.gdocs.html"> backend.gdocs.js </a> <a class="source" href="backend.memory.html"> backend.memory.js </a> <a class="source" href="costco.html"> costco.js </a> <a class="source" href="model.html"> model.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="view.transform.html"> view.transform.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> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> backend.gdocs.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> </td> <td class="code"> <div class="highlight"><pre><span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">GDocs</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">GDocs</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
|
||||
<span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">$</span><span class="p">,</span> <span class="nx">my</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">my</span><span class="p">.</span><span class="nx">__type__</span> <span class="o">=</span> <span class="s1">'gdocs'</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <h2>Google spreadsheet backend</h2>
|
||||
|
||||
<p>Fetch data from a Google Docs spreadsheet.</p>
|
||||
|
||||
<p>Dataset must have a url attribute pointing to the Gdocs or its JSON feed e.g.</p>
|
||||
|
||||
<pre>
|
||||
var dataset = new recline.Model.Dataset({
|
||||
url: 'https://docs.google.com/spreadsheet/ccc?key=0Aon3JiuouxLUdGlQVDJnbjZRSU1tUUJWOUZXRG53VkE#gid=0'
|
||||
},
|
||||
'gdocs'
|
||||
);
|
||||
|
||||
var dataset = new recline.Model.Dataset({
|
||||
url: 'https://spreadsheets.google.com/feeds/list/0Aon3JiuouxLUdDQwZE1JdV94cUd6NWtuZ0IyWTBjLWc/od6/public/values?alt=json'
|
||||
},
|
||||
'gdocs'
|
||||
);
|
||||
</pre>
|
||||
|
||||
<p>@return object with two attributes</p>
|
||||
|
||||
<ul>
|
||||
<li>fields: array of Field objects</li>
|
||||
<li>records: array of objects for each row</li>
|
||||
</ul> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">fetch</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">dataset</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">url</span> <span class="o">=</span> <span class="nx">my</span><span class="p">.</span><span class="nx">getSpreadsheetAPIUrl</span><span class="p">(</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">url</span><span class="p">);</span>
|
||||
<span class="nx">$</span><span class="p">.</span><span class="nx">getJSON</span><span class="p">(</span><span class="nx">url</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">d</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">result</span> <span class="o">=</span> <span class="nx">my</span><span class="p">.</span><span class="nx">parseData</span><span class="p">(</span><span class="nx">d</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">fields</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">result</span><span class="p">.</span><span class="nx">fields</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">fieldId</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{</span><span class="nx">id</span><span class="o">:</span> <span class="nx">fieldId</span><span class="p">};</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">({</span>
|
||||
<span class="nx">records</span><span class="o">:</span> <span class="nx">result</span><span class="p">.</span><span class="nx">records</span><span class="p">,</span>
|
||||
<span class="nx">fields</span><span class="o">:</span> <span class="nx">fields</span><span class="p">,</span>
|
||||
<span class="nx">useMemoryStore</span><span class="o">:</span> <span class="kc">true</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <h2>parseData</h2>
|
||||
|
||||
<p>Parse data from Google Docs API into a reasonable form</p>
|
||||
|
||||
<p>:options: (optional) optional argument dictionary:
|
||||
columnsToUse: list of columns to use (specified by field names)
|
||||
colTypes: dictionary (with column names as keys) specifying types (e.g. range, percent for use in conversion).
|
||||
:return: tabular data object (hash with keys: field and data).</p>
|
||||
|
||||
<p>Issues: seems google docs return columns in rows in random order and not even sure whether consistent across rows.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">parseData</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">gdocsSpreadsheet</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">options</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">arguments</span><span class="p">.</span><span class="nx">length</span> <span class="o">></span> <span class="mi">1</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">options</span> <span class="o">=</span> <span class="nx">arguments</span><span class="p">[</span><span class="mi">1</span><span class="p">];</span>
|
||||
<span class="p">}</span>
|
||||
<span class="kd">var</span> <span class="nx">results</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">fields</span><span class="o">:</span> <span class="p">[],</span>
|
||||
<span class="nx">records</span><span class="o">:</span> <span class="p">[]</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-4">¶</a> </div> <p>default is no special info on type of columns</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">colTypes</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">options</span><span class="p">.</span><span class="nx">colTypes</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">colTypes</span> <span class="o">=</span> <span class="nx">options</span><span class="p">.</span><span class="nx">colTypes</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">gdocsSpreadsheet</span><span class="p">.</span><span class="nx">feed</span><span class="p">.</span><span class="nx">entry</span><span class="p">.</span><span class="nx">length</span> <span class="o">></span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">k</span> <span class="k">in</span> <span class="nx">gdocsSpreadsheet</span><span class="p">.</span><span class="nx">feed</span><span class="p">.</span><span class="nx">entry</span><span class="p">[</span><span class="mi">0</span><span class="p">])</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">k</span><span class="p">.</span><span class="nx">substr</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="mi">3</span><span class="p">)</span> <span class="o">==</span> <span class="s1">'gsx'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">col</span> <span class="o">=</span> <span class="nx">k</span><span class="p">.</span><span class="nx">substr</span><span class="p">(</span><span class="mi">4</span><span class="p">);</span>
|
||||
<span class="nx">results</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">col</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <p>converts non numberical values that should be numerical (22.3%[string] -> 0.223[float])</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">rep</span> <span class="o">=</span> <span class="sr">/^([\d\.\-]+)\%$/</span><span class="p">;</span>
|
||||
<span class="nx">results</span><span class="p">.</span><span class="nx">records</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">gdocsSpreadsheet</span><span class="p">.</span><span class="nx">feed</span><span class="p">.</span><span class="nx">entry</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">entry</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">row</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">results</span><span class="p">.</span><span class="nx">fields</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">col</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">_keyname</span> <span class="o">=</span> <span class="s1">'gsx$'</span> <span class="o">+</span> <span class="nx">col</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">value</span> <span class="o">=</span> <span class="nx">entry</span><span class="p">[</span><span class="nx">_keyname</span><span class="p">][</span><span class="s1">'$t'</span><span class="p">];</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <p>if labelled as % and value contains %, convert</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">colTypes</span><span class="p">[</span><span class="nx">col</span><span class="p">]</span> <span class="o">==</span> <span class="s1">'percent'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">rep</span><span class="p">.</span><span class="nx">test</span><span class="p">(</span><span class="nx">value</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">value2</span> <span class="o">=</span> <span class="nx">rep</span><span class="p">.</span><span class="nx">exec</span><span class="p">(</span><span class="nx">value</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">value3</span> <span class="o">=</span> <span class="nb">parseFloat</span><span class="p">(</span><span class="nx">value2</span><span class="p">);</span>
|
||||
<span class="nx">value</span> <span class="o">=</span> <span class="nx">value3</span> <span class="o">/</span> <span class="mi">100</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">row</span><span class="p">[</span><span class="nx">col</span><span class="p">]</span> <span class="o">=</span> <span class="nx">value</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">row</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">results</span><span class="p">;</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <p>Convenience function to get GDocs JSON API Url from standard URL</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">getSpreadsheetAPIUrl</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">url</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">url</span><span class="p">.</span><span class="nx">indexOf</span><span class="p">(</span><span class="s1">'feeds/list'</span><span class="p">)</span> <span class="o">!=</span> <span class="o">-</span><span class="mi">1</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">url</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">¶</a> </div> <p>https://docs.google.com/spreadsheet/ccc?key=XXXX#gid=0</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">regex</span> <span class="o">=</span> <span class="sr">/.*spreadsheet\/ccc?.*key=([^#?&+]+).*/</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">matches</span> <span class="o">=</span> <span class="nx">url</span><span class="p">.</span><span class="nx">match</span><span class="p">(</span><span class="nx">regex</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">matches</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">key</span> <span class="o">=</span> <span class="nx">matches</span><span class="p">[</span><span class="mi">1</span><span class="p">];</span>
|
||||
<span class="kd">var</span> <span class="nx">worksheet</span> <span class="o">=</span> <span class="mi">1</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">out</span> <span class="o">=</span> <span class="s1">'https://spreadsheets.google.com/feeds/list/'</span> <span class="o">+</span> <span class="nx">key</span> <span class="o">+</span> <span class="s1">'/'</span> <span class="o">+</span> <span class="nx">worksheet</span> <span class="o">+</span> <span class="s1">'/public/values?alt=json'</span><span class="p">;</span>
|
||||
<span class="k">return</span> <span class="nx">out</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">alert</span><span class="p">(</span><span class="s1">'Failed to extract gdocs key from '</span> <span class="o">+</span> <span class="nx">url</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">}(</span><span class="nx">jQuery</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">GDocs</span><span class="p">));</span>
|
||||
|
||||
</pre></div> </td> </tr> </tbody> </table> </div> </body> </html>
|
||||
@ -1,30 +1,19 @@
|
||||
<!DOCTYPE html> <html> <head> <title>memory.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="base.html"> base.js </a> <a class="source" href="csv.html"> csv.js </a> <a class="source" href="dataproxy.html"> dataproxy.js </a> <a class="source" href="elasticsearch.html"> elasticsearch.js </a> <a class="source" href="gdocs.html"> gdocs.js </a> <a class="source" href="memory.html"> memory.js </a> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> memory.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> </td> <td class="code"> <div class="highlight"><pre><span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<!DOCTYPE html> <html> <head> <title>backend.memory.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="backend.couchdb.html"> backend.couchdb.js </a> <a class="source" href="backend.csv.html"> backend.csv.js </a> <a class="source" href="backend.dataproxy.html"> backend.dataproxy.js </a> <a class="source" href="backend.elasticsearch.html"> backend.elasticsearch.js </a> <a class="source" href="backend.gdocs.html"> backend.gdocs.js </a> <a class="source" href="backend.memory.html"> backend.memory.js </a> <a class="source" href="costco.html"> costco.js </a> <a class="source" href="model.html"> model.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="view.transform.html"> view.transform.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> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> backend.memory.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> </td> <td class="code"> <div class="highlight"><pre><span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">Memory</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">Memory</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
|
||||
<span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">$</span><span class="p">,</span> <span class="nx">my</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <h2>createDataset</h2>
|
||||
|
||||
<p>Convenience function to create a simple 'in-memory' dataset in one step.</p>
|
||||
|
||||
<p>@param data: list of hashes for each document/row in the data ({key:
|
||||
value, key: value})
|
||||
@param fields: (optional) list of field hashes (each hash defining a hash
|
||||
as per recline.Model.Field). If fields not specified they will be taken
|
||||
from the data.
|
||||
@param metadata: (optional) dataset metadata - see recline.Model.Dataset.
|
||||
If not defined (or id not provided) id will be autogenerated.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">createDataset</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">data</span><span class="p">,</span> <span class="nx">fields</span><span class="p">,</span> <span class="nx">metadata</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">wrapper</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">DataWrapper</span><span class="p">(</span><span class="nx">data</span><span class="p">,</span> <span class="nx">fields</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">backend</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Backbone</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">dataset</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">Dataset</span><span class="p">(</span><span class="nx">metadata</span><span class="p">,</span> <span class="nx">backend</span><span class="p">);</span>
|
||||
<span class="nx">dataset</span><span class="p">.</span><span class="nx">_dataCache</span> <span class="o">=</span> <span class="nx">wrapper</span><span class="p">;</span>
|
||||
<span class="nx">dataset</span><span class="p">.</span><span class="nx">fetch</span><span class="p">();</span>
|
||||
<span class="nx">dataset</span><span class="p">.</span><span class="nx">query</span><span class="p">();</span>
|
||||
<span class="k">return</span> <span class="nx">dataset</span><span class="p">;</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <h2>Data Wrapper</h2>
|
||||
<span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">$</span><span class="p">,</span> <span class="nx">my</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">my</span><span class="p">.</span><span class="nx">__type__</span> <span class="o">=</span> <span class="s1">'memory'</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <h2>Data Wrapper</h2>
|
||||
|
||||
<p>Turn a simple array of JS objects into a mini data-store with
|
||||
functionality like querying, faceting, updating (by ID) and deleting (by
|
||||
ID).</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">DataWrapper</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">data</span><span class="p">,</span> <span class="nx">fields</span><span class="p">)</span> <span class="p">{</span>
|
||||
ID).</p>
|
||||
|
||||
<p>@param data list of hashes for each record/row in the data ({key:
|
||||
value, key: value})
|
||||
@param fields (optional) list of field hashes (each hash defining a field
|
||||
as per recline.Model.Field). If fields not specified they will be taken
|
||||
from the data.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">Store</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">data</span><span class="p">,</span> <span class="nx">fields</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">data</span> <span class="o">=</span> <span class="nx">data</span><span class="p">;</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">fields</span><span class="p">)</span> <span class="p">{</span>
|
||||
@ -52,7 +41,20 @@ ID).</p> </td> <td class="code"> <div clas
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">data</span> <span class="o">=</span> <span class="nx">newdocs</span><span class="p">;</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">save</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">changes</span><span class="p">,</span> <span class="nx">dataset</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <p>TODO _.each(changes.creates) { ... }</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">changes</span><span class="p">.</span><span class="nx">updates</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">record</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">update</span><span class="p">(</span><span class="nx">record</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">changes</span><span class="p">.</span><span class="nx">deletes</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">record</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="k">delete</span><span class="p">(</span><span class="nx">record</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">();</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">query</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">numRows</span> <span class="o">=</span> <span class="nx">queryObj</span><span class="p">.</span><span class="nx">size</span> <span class="o">||</span> <span class="k">this</span><span class="p">.</span><span class="nx">data</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">start</span> <span class="o">=</span> <span class="nx">queryObj</span><span class="p">.</span><span class="nx">from</span> <span class="o">||</span> <span class="mi">0</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">results</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">data</span><span class="p">;</span>
|
||||
@ -61,26 +63,29 @@ ID).</p> </td> <td class="code"> <div clas
|
||||
<span class="kd">var</span> <span class="nx">fieldName</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">keys</span><span class="p">(</span><span class="nx">sortObj</span><span class="p">)[</span><span class="mi">0</span><span class="p">];</span>
|
||||
<span class="nx">results</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">sortBy</span><span class="p">(</span><span class="nx">results</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">_out</span> <span class="o">=</span> <span class="nx">doc</span><span class="p">[</span><span class="nx">fieldName</span><span class="p">];</span>
|
||||
<span class="k">return</span> <span class="p">(</span><span class="nx">sortObj</span><span class="p">[</span><span class="nx">fieldName</span><span class="p">].</span><span class="nx">order</span> <span class="o">==</span> <span class="s1">'asc'</span><span class="p">)</span> <span class="o">?</span> <span class="nx">_out</span> <span class="o">:</span> <span class="o">-</span><span class="mi">1</span><span class="o">*</span><span class="nx">_out</span><span class="p">;</span>
|
||||
<span class="k">return</span> <span class="nx">_out</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">sortObj</span><span class="p">[</span><span class="nx">fieldName</span><span class="p">].</span><span class="nx">order</span> <span class="o">==</span> <span class="s1">'desc'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">results</span><span class="p">.</span><span class="nx">reverse</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
<span class="kd">var</span> <span class="nx">total</span> <span class="o">=</span> <span class="nx">results</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">facets</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">computeFacets</span><span class="p">(</span><span class="nx">results</span><span class="p">,</span> <span class="nx">queryObj</span><span class="p">);</span>
|
||||
<span class="nx">results</span> <span class="o">=</span> <span class="nx">results</span><span class="p">.</span><span class="nx">slice</span><span class="p">(</span><span class="nx">start</span><span class="p">,</span> <span class="nx">start</span><span class="o">+</span><span class="nx">numRows</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="p">{</span>
|
||||
<span class="nx">total</span><span class="o">:</span> <span class="nx">total</span><span class="p">,</span>
|
||||
<span class="nx">documents</span><span class="o">:</span> <span class="nx">results</span><span class="p">,</span>
|
||||
<span class="kd">var</span> <span class="nx">out</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">total</span><span class="o">:</span> <span class="nx">results</span><span class="p">.</span><span class="nx">length</span><span class="p">,</span>
|
||||
<span class="nx">hits</span><span class="o">:</span> <span class="nx">results</span><span class="p">.</span><span class="nx">slice</span><span class="p">(</span><span class="nx">start</span><span class="p">,</span> <span class="nx">start</span><span class="o">+</span><span class="nx">numRows</span><span class="p">),</span>
|
||||
<span class="nx">facets</span><span class="o">:</span> <span class="nx">facets</span>
|
||||
<span class="p">};</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">out</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <p>in place filtering</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">_applyFilters</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">results</span><span class="p">,</span> <span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">.</span><span class="nx">filters</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">filter</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">results</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">filter</span><span class="p">(</span><span class="nx">results</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">fieldId</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">keys</span><span class="p">(</span><span class="nx">filter</span><span class="p">.</span><span class="nx">term</span><span class="p">)[</span><span class="mi">0</span><span class="p">];</span>
|
||||
<span class="k">return</span> <span class="p">(</span><span class="nx">doc</span><span class="p">[</span><span class="nx">fieldId</span><span class="p">]</span> <span class="o">==</span> <span class="nx">filter</span><span class="p">.</span><span class="nx">term</span><span class="p">[</span><span class="nx">fieldId</span><span class="p">]);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">.</span><span class="nx">filters</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">filter</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <p>if a term filter ...</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">filter</span><span class="p">.</span><span class="nx">type</span> <span class="o">===</span> <span class="s1">'term'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">results</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">filter</span><span class="p">(</span><span class="nx">results</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">(</span><span class="nx">doc</span><span class="p">[</span><span class="nx">filter</span><span class="p">.</span><span class="nx">field</span><span class="p">]</span> <span class="o">==</span> <span class="nx">filter</span><span class="p">.</span><span class="nx">term</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">results</span><span class="p">;</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <p>we OR across fields but AND across terms in query string</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">_applyFreeTextQuery</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">results</span><span class="p">,</span> <span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <p>we OR across fields but AND across terms in query string</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">_applyFreeTextQuery</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">results</span><span class="p">,</span> <span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">queryObj</span><span class="p">.</span><span class="nx">q</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">terms</span> <span class="o">=</span> <span class="nx">queryObj</span><span class="p">.</span><span class="nx">q</span><span class="p">.</span><span class="nx">split</span><span class="p">(</span><span class="s1">' '</span><span class="p">);</span>
|
||||
<span class="nx">results</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">filter</span><span class="p">(</span><span class="nx">results</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">rawdoc</span><span class="p">)</span> <span class="p">{</span>
|
||||
@ -89,9 +94,9 @@ ID).</p> </td> <td class="code"> <div clas
|
||||
<span class="kd">var</span> <span class="nx">foundmatch</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">fields</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">field</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">value</span> <span class="o">=</span> <span class="nx">rawdoc</span><span class="p">[</span><span class="nx">field</span><span class="p">.</span><span class="nx">id</span><span class="p">];</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">value</span> <span class="o">!==</span> <span class="kc">null</span><span class="p">)</span> <span class="p">{</span> <span class="nx">value</span> <span class="o">=</span> <span class="nx">value</span><span class="p">.</span><span class="nx">toString</span><span class="p">();</span> <span class="p">}</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <p>TODO regexes?</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">foundmatch</span> <span class="o">=</span> <span class="nx">foundmatch</span> <span class="o">||</span> <span class="p">(</span><span class="nx">value</span> <span class="o">===</span> <span class="nx">term</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">¶</a> </div> <p>TODO: early out (once we are true should break to spare unnecessary testing)
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">value</span> <span class="o">!==</span> <span class="kc">null</span><span class="p">)</span> <span class="p">{</span> <span class="nx">value</span> <span class="o">=</span> <span class="nx">value</span><span class="p">.</span><span class="nx">toString</span><span class="p">();</span> <span class="p">}</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">¶</a> </div> <p>TODO regexes?</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">foundmatch</span> <span class="o">=</span> <span class="nx">foundmatch</span> <span class="o">||</span> <span class="p">(</span><span class="nx">value</span><span class="p">.</span><span class="nx">toLowerCase</span><span class="p">()</span> <span class="o">===</span> <span class="nx">term</span><span class="p">.</span><span class="nx">toLowerCase</span><span class="p">());</span></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-9">¶</a> </div> <p>TODO: early out (once we are true should break to spare unnecessary testing)
|
||||
if (foundmatch) return true;</p> </td> <td class="code"> <div class="highlight"><pre> <span class="p">});</span>
|
||||
<span class="nx">matches</span> <span class="o">=</span> <span class="nx">matches</span> <span class="o">&&</span> <span class="nx">foundmatch</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-9">¶</a> </div> <p>TODO: early out (once false should break to spare unnecessary testing)
|
||||
<span class="nx">matches</span> <span class="o">=</span> <span class="nx">matches</span> <span class="o">&&</span> <span class="nx">foundmatch</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">¶</a> </div> <p>TODO: early out (once false should break to spare unnecessary testing)
|
||||
if (!matches) return false;</p> </td> <td class="code"> <div class="highlight"><pre> <span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">matches</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
@ -99,14 +104,14 @@ if (!matches) return false;</p> </td> <td class="code">
|
||||
<span class="k">return</span> <span class="nx">results</span><span class="p">;</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">computeFacets</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">documents</span><span class="p">,</span> <span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">computeFacets</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">records</span><span class="p">,</span> <span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">facetResults</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">queryObj</span><span class="p">.</span><span class="nx">facets</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">facetResults</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">.</span><span class="nx">facets</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">query</span><span class="p">,</span> <span class="nx">facetId</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">¶</a> </div> <p>TODO: remove dependency on recline.Model</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">facetResults</span><span class="p">[</span><span class="nx">facetId</span><span class="p">]</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">Facet</span><span class="p">({</span><span class="nx">id</span><span class="o">:</span> <span class="nx">facetId</span><span class="p">}).</span><span class="nx">toJSON</span><span class="p">();</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">.</span><span class="nx">facets</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">query</span><span class="p">,</span> <span class="nx">facetId</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-11">¶</a> </div> <p>TODO: remove dependency on recline.Model</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">facetResults</span><span class="p">[</span><span class="nx">facetId</span><span class="p">]</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">Facet</span><span class="p">({</span><span class="nx">id</span><span class="o">:</span> <span class="nx">facetId</span><span class="p">}).</span><span class="nx">toJSON</span><span class="p">();</span>
|
||||
<span class="nx">facetResults</span><span class="p">[</span><span class="nx">facetId</span><span class="p">].</span><span class="nx">termsall</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-11">¶</a> </div> <p>faceting</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">documents</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-12">¶</a> </div> <p>faceting</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">records</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">.</span><span class="nx">facets</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">query</span><span class="p">,</span> <span class="nx">facetId</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">fieldId</span> <span class="o">=</span> <span class="nx">query</span><span class="p">.</span><span class="nx">terms</span><span class="p">.</span><span class="nx">field</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">val</span> <span class="o">=</span> <span class="nx">doc</span><span class="p">[</span><span class="nx">fieldId</span><span class="p">];</span>
|
||||
@ -123,58 +128,13 @@ if (!matches) return false;</p> </td> <td class="code">
|
||||
<span class="kd">var</span> <span class="nx">terms</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">tmp</span><span class="p">.</span><span class="nx">termsall</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">count</span><span class="p">,</span> <span class="nx">term</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{</span> <span class="nx">term</span><span class="o">:</span> <span class="nx">term</span><span class="p">,</span> <span class="nx">count</span><span class="o">:</span> <span class="nx">count</span> <span class="p">};</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">tmp</span><span class="p">.</span><span class="nx">terms</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">sortBy</span><span class="p">(</span><span class="nx">terms</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">item</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-12">¶</a> </div> <p>want descending order</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="o">-</span><span class="nx">item</span><span class="p">.</span><span class="nx">count</span><span class="p">;</span>
|
||||
<span class="nx">tmp</span><span class="p">.</span><span class="nx">terms</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">sortBy</span><span class="p">(</span><span class="nx">terms</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">item</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-13">¶</a> </div> <p>want descending order</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="o">-</span><span class="nx">item</span><span class="p">.</span><span class="nx">count</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">tmp</span><span class="p">.</span><span class="nx">terms</span> <span class="o">=</span> <span class="nx">tmp</span><span class="p">.</span><span class="nx">terms</span><span class="p">.</span><span class="nx">slice</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="mi">10</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">facetResults</span><span class="p">;</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">};</span>
|
||||
</pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-13">¶</a> </div> <h2>Backbone</h2>
|
||||
|
||||
<p>Backbone connector for memory store attached to a Dataset object</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">my</span><span class="p">.</span><span class="nx">Backbone</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">__type__</span> <span class="o">=</span> <span class="s1">'memory'</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">sync</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">method</span><span class="p">,</span> <span class="nx">model</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">method</span> <span class="o">===</span> <span class="s2">"read"</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">model</span><span class="p">.</span><span class="nx">__type__</span> <span class="o">==</span> <span class="s1">'Dataset'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">reset</span><span class="p">(</span><span class="nx">model</span><span class="p">.</span><span class="nx">_dataCache</span><span class="p">.</span><span class="nx">fields</span><span class="p">);</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">model</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">method</span> <span class="o">===</span> <span class="s1">'update'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">model</span><span class="p">.</span><span class="nx">__type__</span> <span class="o">==</span> <span class="s1">'Document'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">model</span><span class="p">.</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">_dataCache</span><span class="p">.</span><span class="nx">update</span><span class="p">(</span><span class="nx">model</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">());</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">model</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">method</span> <span class="o">===</span> <span class="s1">'delete'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">model</span><span class="p">.</span><span class="nx">__type__</span> <span class="o">==</span> <span class="s1">'Document'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">model</span><span class="p">.</span><span class="nx">dataset</span><span class="p">.</span><span class="nx">_dataCache</span><span class="p">.</span><span class="k">delete</span><span class="p">(</span><span class="nx">model</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">());</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">model</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">alert</span><span class="p">(</span><span class="s1">'Not supported: sync on Memory backend with method '</span> <span class="o">+</span> <span class="nx">method</span> <span class="o">+</span> <span class="s1">' and model '</span> <span class="o">+</span> <span class="nx">model</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">query</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">model</span><span class="p">,</span> <span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">results</span> <span class="o">=</span> <span class="nx">model</span><span class="p">.</span><span class="nx">_dataCache</span><span class="p">.</span><span class="nx">query</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">hits</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">results</span><span class="p">.</span><span class="nx">documents</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">row</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{</span> <span class="nx">_source</span><span class="o">:</span> <span class="nx">row</span> <span class="p">};</span>
|
||||
<span class="p">});</span>
|
||||
<span class="kd">var</span> <span class="nx">out</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">total</span><span class="o">:</span> <span class="nx">results</span><span class="p">.</span><span class="nx">total</span><span class="p">,</span>
|
||||
<span class="nx">hits</span><span class="o">:</span> <span class="nx">hits</span><span class="p">,</span>
|
||||
<span class="nx">facets</span><span class="o">:</span> <span class="nx">results</span><span class="p">.</span><span class="nx">facets</span>
|
||||
<span class="p">};</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">out</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="p">}(</span><span class="nx">jQuery</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">Memory</span><span class="p">));</span>
|
||||
|
||||
435
docs/src/model.html
Normal file
435
docs/src/model.html
Normal file
@ -0,0 +1,435 @@
|
||||
<!DOCTYPE html> <html> <head> <title>model.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="backend.couchdb.html"> backend.couchdb.js </a> <a class="source" href="backend.csv.html"> backend.csv.js </a> <a class="source" href="backend.dataproxy.html"> backend.dataproxy.js </a> <a class="source" href="backend.elasticsearch.html"> backend.elasticsearch.js </a> <a class="source" href="backend.gdocs.html"> backend.gdocs.js </a> <a class="source" href="backend.memory.html"> backend.memory.js </a> <a class="source" href="costco.html"> costco.js </a> <a class="source" href="model.html"> model.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="view.transform.html"> view.transform.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> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> model.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> <h1>Recline Backbone Models</h1> </td> <td class="code"> <div class="highlight"><pre><span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
|
||||
<span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">$</span><span class="p">,</span> <span class="nx">my</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <h2><a id="dataset">Dataset</a></h2> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">Dataset</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">__type__</span><span class="o">:</span> <span class="s1">'Dataset'</span><span class="p">,</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <h3>initialize</h3> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">initialize</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">bindAll</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="s1">'query'</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">backend</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'backend'</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">backend</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">_backendFromString</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'backend'</span><span class="p">));</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span> <span class="c1">// try to guess backend ...</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'records'</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">backend</span> <span class="o">=</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">Memory</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">fields</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">FieldList</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">currentRecords</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">RecordList</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_changes</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">deletes</span><span class="o">:</span> <span class="p">[],</span>
|
||||
<span class="nx">updates</span><span class="o">:</span> <span class="p">[],</span>
|
||||
<span class="nx">creates</span><span class="o">:</span> <span class="p">[]</span>
|
||||
<span class="p">};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">facets</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">FacetList</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">docCount</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">queryState</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Query</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">queryState</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'change'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">query</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">queryState</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'facet:add'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">query</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-4">¶</a> </div> <p>store is what we query and save against
|
||||
store will either be the backend or be a memory store if Backend fetch
|
||||
tells us to use memory store</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">_store</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">backend</span><span class="p">;</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">backend</span> <span class="o">==</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">Memory</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">fetch</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <h3>fetch</h3>
|
||||
|
||||
<p>Retrieve dataset and (some) records from the backend.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">fetch</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">backend</span> <span class="o">!==</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">Memory</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">backend</span><span class="p">.</span><span class="nx">fetch</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">())</span>
|
||||
<span class="p">.</span><span class="nx">done</span><span class="p">(</span><span class="nx">handleResults</span><span class="p">)</span>
|
||||
<span class="p">.</span><span class="nx">fail</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">arguments</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">reject</span><span class="p">(</span><span class="nx">arguments</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <p>special case where we have been given data directly</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">handleResults</span><span class="p">({</span>
|
||||
<span class="nx">records</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'records'</span><span class="p">),</span>
|
||||
<span class="nx">fields</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'fields'</span><span class="p">),</span>
|
||||
<span class="nx">useMemoryStore</span><span class="o">:</span> <span class="kc">true</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="kd">function</span> <span class="nx">handleResults</span><span class="p">(</span><span class="nx">results</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">out</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">_normalizeRecordsAndFields</span><span class="p">(</span><span class="nx">results</span><span class="p">.</span><span class="nx">records</span><span class="p">,</span> <span class="nx">results</span><span class="p">.</span><span class="nx">fields</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">results</span><span class="p">.</span><span class="nx">useMemoryStore</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">_store</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">.</span><span class="nx">Memory</span><span class="p">.</span><span class="nx">Store</span><span class="p">(</span><span class="nx">out</span><span class="p">.</span><span class="nx">records</span><span class="p">,</span> <span class="nx">out</span><span class="p">.</span><span class="nx">fields</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">set</span><span class="p">(</span><span class="nx">results</span><span class="p">.</span><span class="nx">metadata</span><span class="p">);</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">reset</span><span class="p">(</span><span class="nx">out</span><span class="p">.</span><span class="nx">fields</span><span class="p">);</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">query</span><span class="p">()</span>
|
||||
<span class="p">.</span><span class="nx">done</span><span class="p">(</span><span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">self</span><span class="p">);</span>
|
||||
<span class="p">})</span>
|
||||
<span class="p">.</span><span class="nx">fail</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">arguments</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">reject</span><span class="p">(</span><span class="nx">arguments</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <h3>_normalizeRecordsAndFields</h3>
|
||||
|
||||
<p>Get a proper set of fields and records from incoming set of fields and records either of which may be null or arrays or objects</p>
|
||||
|
||||
<p>e.g. fields = ['a', 'b', 'c'] and records = [ [1,2,3] ] =>
|
||||
fields = [ {id: a}, {id: b}, {id: c}], records = [ {a: 1}, {b: 2}, {c: 3}]</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_normalizeRecordsAndFields</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">records</span><span class="p">,</span> <span class="nx">fields</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">¶</a> </div> <p>if no fields get them from records</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">fields</span> <span class="o">&&</span> <span class="nx">records</span> <span class="o">&&</span> <span class="nx">records</span><span class="p">.</span><span class="nx">length</span> <span class="o">></span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-9">¶</a> </div> <p>records is array then fields is first row of records ...</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">records</span><span class="p">[</span><span class="mi">0</span><span class="p">]</span> <span class="k">instanceof</span> <span class="nb">Array</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">fields</span> <span class="o">=</span> <span class="nx">records</span><span class="p">[</span><span class="mi">0</span><span class="p">];</span>
|
||||
<span class="nx">records</span> <span class="o">=</span> <span class="nx">records</span><span class="p">.</span><span class="nx">slice</span><span class="p">(</span><span class="mi">1</span><span class="p">);</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">fields</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">_</span><span class="p">.</span><span class="nx">keys</span><span class="p">(</span><span class="nx">records</span><span class="p">[</span><span class="mi">0</span><span class="p">]),</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{</span><span class="nx">id</span><span class="o">:</span> <span class="nx">key</span><span class="p">};</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span> </pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">¶</a> </div> <p>fields is an array of strings (i.e. list of field headings/ids)</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">fields</span> <span class="o">&&</span> <span class="nx">fields</span><span class="p">.</span><span class="nx">length</span> <span class="o">></span> <span class="mi">0</span> <span class="o">&&</span> <span class="k">typeof</span> <span class="nx">fields</span><span class="p">[</span><span class="mi">0</span><span class="p">]</span> <span class="o">===</span> <span class="s1">'string'</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-11">¶</a> </div> <p>Rename duplicate fieldIds as each field name needs to be
|
||||
unique.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">seen</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="nx">fields</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">fields</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">field</span><span class="p">,</span> <span class="nx">index</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-12">¶</a> </div> <p>cannot use trim as not supported by IE7</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">fieldId</span> <span class="o">=</span> <span class="nx">field</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="sr">/^\s+|\s+$/g</span><span class="p">,</span> <span class="s1">''</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">fieldId</span> <span class="o">===</span> <span class="s1">''</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">fieldId</span> <span class="o">=</span> <span class="s1">'_noname_'</span><span class="p">;</span>
|
||||
<span class="nx">field</span> <span class="o">=</span> <span class="nx">fieldId</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">while</span> <span class="p">(</span><span class="nx">fieldId</span> <span class="k">in</span> <span class="nx">seen</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">seen</span><span class="p">[</span><span class="nx">field</span><span class="p">]</span> <span class="o">+=</span> <span class="mi">1</span><span class="p">;</span>
|
||||
<span class="nx">fieldId</span> <span class="o">=</span> <span class="nx">field</span> <span class="o">+</span> <span class="nx">seen</span><span class="p">[</span><span class="nx">field</span><span class="p">];</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="p">(</span><span class="nx">field</span> <span class="k">in</span> <span class="nx">seen</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="nx">seen</span><span class="p">[</span><span class="nx">field</span><span class="p">]</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-13">¶</a> </div> <p>TODO: decide whether to keep original name as label ...
|
||||
return { id: fieldId, label: field || fieldId }</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="p">{</span> <span class="nx">id</span><span class="o">:</span> <span class="nx">fieldId</span> <span class="p">};</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-14"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-14">¶</a> </div> <p>records is provided as arrays so need to zip together with fields
|
||||
NB: this requires you to have fields to match arrays</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">records</span> <span class="o">&&</span> <span class="nx">records</span><span class="p">.</span><span class="nx">length</span> <span class="o">></span> <span class="mi">0</span> <span class="o">&&</span> <span class="nx">records</span><span class="p">[</span><span class="mi">0</span><span class="p">]</span> <span class="k">instanceof</span> <span class="nb">Array</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">records</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">records</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">tmp</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">fields</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">field</span><span class="p">,</span> <span class="nx">idx</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">tmp</span><span class="p">[</span><span class="nx">field</span><span class="p">.</span><span class="nx">id</span><span class="p">]</span> <span class="o">=</span> <span class="nx">doc</span><span class="p">[</span><span class="nx">idx</span><span class="p">];</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">tmp</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="p">{</span>
|
||||
<span class="nx">fields</span><span class="o">:</span> <span class="nx">fields</span><span class="p">,</span>
|
||||
<span class="nx">records</span><span class="o">:</span> <span class="nx">records</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">save</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-15"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-15">¶</a> </div> <p>TODO: need to reset the changes ...</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">_store</span><span class="p">.</span><span class="nx">save</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_changes</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">());</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-16"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-16">¶</a> </div> <h3>query</h3>
|
||||
|
||||
<p>AJAX method with promise API to get records from the backend.</p>
|
||||
|
||||
<p>It will query based on current query state (given by this.queryState)
|
||||
updated by queryObj (if provided).</p>
|
||||
|
||||
<p>Resulting RecordList are used to reset this.currentRecords and are
|
||||
also returned.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">query</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'query:start'</span><span class="p">);</span>
|
||||
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">queryObj</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">queryState</span><span class="p">.</span><span class="nx">set</span><span class="p">(</span><span class="nx">queryObj</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="kd">var</span> <span class="nx">actualQuery</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">queryState</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">();</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_store</span><span class="p">.</span><span class="nx">query</span><span class="p">(</span><span class="nx">actualQuery</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">())</span>
|
||||
<span class="p">.</span><span class="nx">done</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">queryResult</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">_handleQueryResult</span><span class="p">(</span><span class="nx">queryResult</span><span class="p">);</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'query:done'</span><span class="p">);</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">);</span>
|
||||
<span class="p">})</span>
|
||||
<span class="p">.</span><span class="nx">fail</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">arguments</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'query:fail'</span><span class="p">,</span> <span class="nx">arguments</span><span class="p">);</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">reject</span><span class="p">(</span><span class="nx">arguments</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">_handleQueryResult</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">queryResult</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">docCount</span> <span class="o">=</span> <span class="nx">queryResult</span><span class="p">.</span><span class="nx">total</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">docs</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">queryResult</span><span class="p">.</span><span class="nx">hits</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">hit</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">_doc</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Record</span><span class="p">(</span><span class="nx">hit</span><span class="p">);</span>
|
||||
<span class="nx">_doc</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'change'</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">_changes</span><span class="p">.</span><span class="nx">updates</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">doc</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">());</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">_doc</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'destroy'</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">_changes</span><span class="p">.</span><span class="nx">deletes</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">doc</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">());</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">_doc</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">reset</span><span class="p">(</span><span class="nx">docs</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">queryResult</span><span class="p">.</span><span class="nx">facets</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">facets</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">queryResult</span><span class="p">.</span><span class="nx">facets</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">facetResult</span><span class="p">,</span> <span class="nx">facetId</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">facetResult</span><span class="p">.</span><span class="nx">id</span> <span class="o">=</span> <span class="nx">facetId</span><span class="p">;</span>
|
||||
<span class="k">return</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Facet</span><span class="p">(</span><span class="nx">facetResult</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">facets</span><span class="p">.</span><span class="nx">reset</span><span class="p">(</span><span class="nx">facets</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">toTemplateJSON</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">data</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">();</span>
|
||||
<span class="nx">data</span><span class="p">.</span><span class="nx">docCount</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">docCount</span><span class="p">;</span>
|
||||
<span class="nx">data</span><span class="p">.</span><span class="nx">fields</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">();</span>
|
||||
<span class="k">return</span> <span class="nx">data</span><span class="p">;</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-17"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-17">¶</a> </div> <p>Get a summary for each field in the form of a <code>Facet</code>.</p>
|
||||
|
||||
<p>@return null as this is async function. Provides deferred/promise interface.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">getFieldsSummary</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">query</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Query</span><span class="p">();</span>
|
||||
<span class="nx">query</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span><span class="nx">size</span><span class="o">:</span> <span class="mi">0</span><span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">field</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">query</span><span class="p">.</span><span class="nx">addFacet</span><span class="p">(</span><span class="nx">field</span><span class="p">.</span><span class="nx">id</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="kd">var</span> <span class="nx">dfd</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">Deferred</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_store</span><span class="p">.</span><span class="nx">query</span><span class="p">(</span><span class="nx">query</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">(),</span> <span class="k">this</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">()).</span><span class="nx">done</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">queryResult</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">queryResult</span><span class="p">.</span><span class="nx">facets</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">queryResult</span><span class="p">.</span><span class="nx">facets</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">facetResult</span><span class="p">,</span> <span class="nx">facetId</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">facetResult</span><span class="p">.</span><span class="nx">id</span> <span class="o">=</span> <span class="nx">facetId</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">facet</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Facet</span><span class="p">(</span><span class="nx">facetResult</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-18"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-18">¶</a> </div> <p>TODO: probably want replace rather than reset (i.e. just replace the facet with this id)</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">self</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">facetId</span><span class="p">).</span><span class="nx">facets</span><span class="p">.</span><span class="nx">reset</span><span class="p">(</span><span class="nx">facet</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">dfd</span><span class="p">.</span><span class="nx">resolve</span><span class="p">(</span><span class="nx">queryResult</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">dfd</span><span class="p">.</span><span class="nx">promise</span><span class="p">();</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-19"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-19">¶</a> </div> <h3>_backendFromString(backendString)</h3>
|
||||
|
||||
<p>See backend argument to initialize for details</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_backendFromString</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">backendString</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">parts</span> <span class="o">=</span> <span class="nx">backendString</span><span class="p">.</span><span class="nx">split</span><span class="p">(</span><span class="s1">'.'</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-20"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-20">¶</a> </div> <p>walk through the specified path xxx.yyy.zzz to get the final object which should be backend class</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">current</span> <span class="o">=</span> <span class="nb">window</span><span class="p">;</span>
|
||||
<span class="k">for</span><span class="p">(</span><span class="nx">ii</span><span class="o">=</span><span class="mi">0</span><span class="p">;</span><span class="nx">ii</span><span class="o"><</span><span class="nx">parts</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span><span class="nx">ii</span><span class="o">++</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">current</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">break</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">current</span> <span class="o">=</span> <span class="nx">current</span><span class="p">[</span><span class="nx">parts</span><span class="p">[</span><span class="nx">ii</span><span class="p">]];</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">current</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">current</span><span class="p">;</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-21"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-21">¶</a> </div> <p>alternatively we just had a simple string</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">backend</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">recline</span> <span class="o">&&</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">_</span><span class="p">.</span><span class="nx">keys</span><span class="p">(</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">),</span> <span class="kd">function</span><span class="p">(</span><span class="nx">name</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">name</span><span class="p">.</span><span class="nx">toLowerCase</span><span class="p">()</span> <span class="o">===</span> <span class="nx">backendString</span><span class="p">.</span><span class="nx">toLowerCase</span><span class="p">())</span> <span class="p">{</span>
|
||||
<span class="nx">backend</span> <span class="o">=</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Backend</span><span class="p">[</span><span class="nx">name</span><span class="p">];</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">backend</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-22"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-22">¶</a> </div> <h3>Dataset.restore</h3>
|
||||
|
||||
<p>Restore a Dataset instance from a serialized state. Serialized state for a
|
||||
Dataset is an Object like:</p>
|
||||
|
||||
<p><pre>
|
||||
{
|
||||
backend: {backend type - i.e. value of dataset.backend.<strong>type</strong>}
|
||||
dataset: {dataset info needed for loading -- result of dataset.toJSON() would be sufficient but can be simpler }
|
||||
// convenience - if url provided and dataste not this be used as dataset url
|
||||
url: {dataset url}
|
||||
...
|
||||
}</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">Dataset</span><span class="p">.</span><span class="nx">restore</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">state</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dataset</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-23"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-23">¶</a> </div> <p>hack-y - restoring a memory dataset does not mean much ...</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">state</span><span class="p">.</span><span class="nx">backend</span> <span class="o">===</span> <span class="s1">'memory'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">datasetInfo</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">records</span><span class="o">:</span> <span class="p">[{</span><span class="nx">stub</span><span class="o">:</span> <span class="s1">'this is a stub dataset because we do not restore memory datasets'</span><span class="p">}]</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">datasetInfo</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="nx">state</span><span class="p">.</span><span class="nx">url</span><span class="p">,</span>
|
||||
<span class="nx">backend</span><span class="o">:</span> <span class="nx">state</span><span class="p">.</span><span class="nx">backend</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">dataset</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">Dataset</span><span class="p">(</span><span class="nx">datasetInfo</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="nx">dataset</span><span class="p">;</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-24"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-24">¶</a> </div> <h2><a id="record">A Record (aka Row)</a></h2>
|
||||
|
||||
<p>A single entry or row in the dataset</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">Record</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">__type__</span><span class="o">:</span> <span class="s1">'Record'</span><span class="p">,</span>
|
||||
<span class="nx">initialize</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">bindAll</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="s1">'getFieldValue'</span><span class="p">);</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-25"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-25">¶</a> </div> <h3>getFieldValue</h3>
|
||||
|
||||
<p>For the provided Field get the corresponding rendered computed data value
|
||||
for this record.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">getFieldValue</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">field</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">val</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">getFieldValueUnrendered</span><span class="p">(</span><span class="nx">field</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">field</span><span class="p">.</span><span class="nx">renderer</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">val</span> <span class="o">=</span> <span class="nx">field</span><span class="p">.</span><span class="nx">renderer</span><span class="p">(</span><span class="nx">val</span><span class="p">,</span> <span class="nx">field</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">());</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">val</span><span class="p">;</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-26"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-26">¶</a> </div> <h3>getFieldValueUnrendered</h3>
|
||||
|
||||
<p>For the provided Field get the corresponding computed data value
|
||||
for this record.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">getFieldValueUnrendered</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">field</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">val</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">field</span><span class="p">.</span><span class="nx">id</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">field</span><span class="p">.</span><span class="nx">deriver</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">val</span> <span class="o">=</span> <span class="nx">field</span><span class="p">.</span><span class="nx">deriver</span><span class="p">(</span><span class="nx">val</span><span class="p">,</span> <span class="nx">field</span><span class="p">,</span> <span class="k">this</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">val</span><span class="p">;</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">summary</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">fields</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">html</span> <span class="o">=</span> <span class="s1">''</span><span class="p">;</span>
|
||||
<span class="k">for</span> <span class="p">(</span><span class="nx">key</span> <span class="k">in</span> <span class="k">this</span><span class="p">.</span><span class="nx">attributes</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">key</span> <span class="o">!=</span> <span class="s1">'id'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">html</span> <span class="o">+=</span> <span class="s1">'<div><strong>'</span> <span class="o">+</span> <span class="nx">key</span> <span class="o">+</span> <span class="s1">'</strong>: '</span><span class="o">+</span> <span class="k">this</span><span class="p">.</span><span class="nx">attributes</span><span class="p">[</span><span class="nx">key</span><span class="p">]</span> <span class="o">+</span> <span class="s1">'</div>'</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">html</span><span class="p">;</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-27"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-27">¶</a> </div> <p>Override Backbone save, fetch and destroy so they do nothing
|
||||
Instead, Dataset object that created this Record should take care of
|
||||
handling these changes (discovery will occur via event notifications)
|
||||
WARNING: these will not persist <em>unless</em> you call save on Dataset</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">fetch</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{},</span>
|
||||
<span class="nx">save</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{},</span>
|
||||
<span class="nx">destroy</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span> <span class="k">this</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'destroy'</span><span class="p">,</span> <span class="k">this</span><span class="p">);</span> <span class="p">}</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-28"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-28">¶</a> </div> <h2>A Backbone collection of Records</h2> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">RecordList</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Collection</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">__type__</span><span class="o">:</span> <span class="s1">'RecordList'</span><span class="p">,</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Record</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-29"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-29">¶</a> </div> <h2><a id="field">A Field (aka Column) on a Dataset</a></h2> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">Field</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span></pre></div> </td> </tr> <tr id="section-30"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-30">¶</a> </div> <h3>defaults - define default values</h3> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">defaults</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="nx">label</span><span class="o">:</span> <span class="kc">null</span><span class="p">,</span>
|
||||
<span class="nx">type</span><span class="o">:</span> <span class="s1">'string'</span><span class="p">,</span>
|
||||
<span class="nx">format</span><span class="o">:</span> <span class="kc">null</span><span class="p">,</span>
|
||||
<span class="nx">is_derived</span><span class="o">:</span> <span class="kc">false</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-31"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-31">¶</a> </div> <h3>initialize</h3>
|
||||
|
||||
<p>@param {Object} data: standard Backbone model attributes</p>
|
||||
|
||||
<p>@param {Object} options: renderer and/or deriver functions.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">initialize</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">data</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-32"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-32">¶</a> </div> <p>if a hash not passed in the first argument throw error</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="s1">'0'</span> <span class="k">in</span> <span class="nx">data</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">throw</span> <span class="k">new</span> <span class="nb">Error</span><span class="p">(</span><span class="s1">'Looks like you did not pass a proper hash with id to Field constructor'</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">attributes</span><span class="p">.</span><span class="nx">label</span> <span class="o">===</span> <span class="kc">null</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span><span class="nx">label</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">id</span><span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">renderer</span> <span class="o">=</span> <span class="nx">options</span><span class="p">.</span><span class="nx">renderer</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">deriver</span> <span class="o">=</span> <span class="nx">options</span><span class="p">.</span><span class="nx">deriver</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">renderer</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">renderer</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">defaultRenderers</span><span class="p">[</span><span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'type'</span><span class="p">)];</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">facets</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">FacetList</span><span class="p">();</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">defaultRenderers</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="nx">object</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">val</span><span class="p">,</span> <span class="nx">field</span><span class="p">,</span> <span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">stringify</span><span class="p">(</span><span class="nx">val</span><span class="p">);</span>
|
||||
<span class="p">},</span>
|
||||
<span class="s1">'float'</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">val</span><span class="p">,</span> <span class="nx">field</span><span class="p">,</span> <span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">format</span> <span class="o">=</span> <span class="nx">field</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'format'</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">format</span> <span class="o">===</span> <span class="s1">'percentage'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">val</span> <span class="o">+</span> <span class="s1">'%'</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">val</span><span class="p">;</span>
|
||||
<span class="p">},</span>
|
||||
<span class="s1">'string'</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">val</span><span class="p">,</span> <span class="nx">field</span><span class="p">,</span> <span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">format</span> <span class="o">=</span> <span class="nx">field</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'format'</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">format</span> <span class="o">===</span> <span class="s1">'markdown'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">typeof</span> <span class="nx">Showdown</span> <span class="o">!==</span> <span class="s1">'undefined'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">showdown</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">Showdown</span><span class="p">.</span><span class="nx">converter</span><span class="p">();</span>
|
||||
<span class="nx">out</span> <span class="o">=</span> <span class="nx">showdown</span><span class="p">.</span><span class="nx">makeHtml</span><span class="p">(</span><span class="nx">val</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="nx">out</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">val</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">format</span> <span class="o">==</span> <span class="s1">'plain'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">val</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-33"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-33">¶</a> </div> <p>as this is the default and default type is string may get things
|
||||
here that are not actually strings</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">val</span> <span class="o">&&</span> <span class="k">typeof</span> <span class="nx">val</span> <span class="o">===</span> <span class="s1">'string'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">val</span> <span class="o">=</span> <span class="nx">val</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="sr">/(https?:\/\/[^ ]+)/g</span><span class="p">,</span> <span class="s1">'<a href="$1">$1</a>'</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">val</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
|
||||
<span class="nx">my</span><span class="p">.</span><span class="nx">FieldList</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Collection</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Field</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-34"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-34">¶</a> </div> <h2><a id="query">Query</a></h2> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">Query</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">defaults</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{</span>
|
||||
<span class="nx">size</span><span class="o">:</span> <span class="mi">100</span><span class="p">,</span>
|
||||
<span class="nx">from</span><span class="o">:</span> <span class="mi">0</span><span class="p">,</span>
|
||||
<span class="nx">q</span><span class="o">:</span> <span class="s1">''</span><span class="p">,</span>
|
||||
<span class="nx">facets</span><span class="o">:</span> <span class="p">{},</span>
|
||||
<span class="nx">filters</span><span class="o">:</span> <span class="p">[]</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">_filterTemplates</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="nx">term</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="nx">type</span><span class="o">:</span> <span class="s1">'term'</span><span class="p">,</span>
|
||||
<span class="nx">field</span><span class="o">:</span> <span class="s1">''</span><span class="p">,</span>
|
||||
<span class="nx">term</span><span class="o">:</span> <span class="s1">''</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">geo_distance</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="nx">distance</span><span class="o">:</span> <span class="mi">10</span><span class="p">,</span>
|
||||
<span class="nx">unit</span><span class="o">:</span> <span class="s1">'km'</span><span class="p">,</span>
|
||||
<span class="nx">point</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="nx">lon</span><span class="o">:</span> <span class="mi">0</span><span class="p">,</span>
|
||||
<span class="nx">lat</span><span class="o">:</span> <span class="mi">0</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span> </pre></div> </td> </tr> <tr id="section-35"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-35">¶</a> </div> <h3>addFilter</h3>
|
||||
|
||||
<p>Add a new filter (appended to the list of filters)</p>
|
||||
|
||||
<p>@param filter an object specifying the filter - see _filterTemplates for examples. If only type is provided will generate a filter by cloning _filterTemplates</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">addFilter</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">filter</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-36"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-36">¶</a> </div> <p>crude deep copy</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">ourfilter</span> <span class="o">=</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">parse</span><span class="p">(</span><span class="nx">JSON</span><span class="p">.</span><span class="nx">stringify</span><span class="p">(</span><span class="nx">filter</span><span class="p">));</span></pre></div> </td> </tr> <tr id="section-37"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-37">¶</a> </div> <p>not full specified so use template and over-write</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">_</span><span class="p">.</span><span class="nx">keys</span><span class="p">(</span><span class="nx">filter</span><span class="p">).</span><span class="nx">length</span> <span class="o"><=</span> <span class="mi">2</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">ourfilter</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_filterTemplates</span><span class="p">[</span><span class="nx">filter</span><span class="p">.</span><span class="nx">type</span><span class="p">],</span> <span class="nx">ourfilter</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="kd">var</span> <span class="nx">filters</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'filters'</span><span class="p">);</span>
|
||||
<span class="nx">filters</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">ourfilter</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'change:filters:new-blank'</span><span class="p">);</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">updateFilter</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">index</span><span class="p">,</span> <span class="nx">value</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-38"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-38">¶</a> </div> <h3>removeFilter</h3>
|
||||
|
||||
<p>Remove a filter from filters at index filterIndex</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">removeFilter</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">filterIndex</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">filters</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'filters'</span><span class="p">);</span>
|
||||
<span class="nx">filters</span><span class="p">.</span><span class="nx">splice</span><span class="p">(</span><span class="nx">filterIndex</span><span class="p">,</span> <span class="mi">1</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span><span class="nx">filters</span><span class="o">:</span> <span class="nx">filters</span><span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'change'</span><span class="p">);</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-39"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-39">¶</a> </div> <h3>addFacet</h3>
|
||||
|
||||
<p>Add a Facet to this query</p>
|
||||
|
||||
<p>See <a href="http://www.elasticsearch.org/guide/reference/api/search/facets/">http://www.elasticsearch.org/guide/reference/api/search/facets/</a></p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">addFacet</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">fieldId</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">facets</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'facets'</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-40"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-40">¶</a> </div> <p>Assume id and fieldId should be the same (TODO: this need not be true if we want to add two different type of facets on same field)</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">_</span><span class="p">.</span><span class="nx">contains</span><span class="p">(</span><span class="nx">_</span><span class="p">.</span><span class="nx">keys</span><span class="p">(</span><span class="nx">facets</span><span class="p">),</span> <span class="nx">fieldId</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="k">return</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">facets</span><span class="p">[</span><span class="nx">fieldId</span><span class="p">]</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">terms</span><span class="o">:</span> <span class="p">{</span> <span class="nx">field</span><span class="o">:</span> <span class="nx">fieldId</span> <span class="p">}</span>
|
||||
<span class="p">};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span><span class="nx">facets</span><span class="o">:</span> <span class="nx">facets</span><span class="p">},</span> <span class="p">{</span><span class="nx">silent</span><span class="o">:</span> <span class="kc">true</span><span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'facet:add'</span><span class="p">,</span> <span class="k">this</span><span class="p">);</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">addHistogramFacet</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">fieldId</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">facets</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'facets'</span><span class="p">);</span>
|
||||
<span class="nx">facets</span><span class="p">[</span><span class="nx">fieldId</span><span class="p">]</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">date_histogram</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="nx">field</span><span class="o">:</span> <span class="nx">fieldId</span><span class="p">,</span>
|
||||
<span class="nx">interval</span><span class="o">:</span> <span class="s1">'day'</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span><span class="nx">facets</span><span class="o">:</span> <span class="nx">facets</span><span class="p">},</span> <span class="p">{</span><span class="nx">silent</span><span class="o">:</span> <span class="kc">true</span><span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'facet:add'</span><span class="p">,</span> <span class="k">this</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-41"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-41">¶</a> </div> <h2><a id="facet">A Facet (Result)</a></h2> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">Facet</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">defaults</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{</span>
|
||||
<span class="nx">_type</span><span class="o">:</span> <span class="s1">'terms'</span><span class="p">,</span>
|
||||
<span class="nx">total</span><span class="o">:</span> <span class="mi">0</span><span class="p">,</span>
|
||||
<span class="nx">other</span><span class="o">:</span> <span class="mi">0</span><span class="p">,</span>
|
||||
<span class="nx">missing</span><span class="o">:</span> <span class="mi">0</span><span class="p">,</span>
|
||||
<span class="nx">terms</span><span class="o">:</span> <span class="p">[]</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-42"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-42">¶</a> </div> <h2>A Collection/List of Facets</h2> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">FacetList</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Collection</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Facet</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-43"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-43">¶</a> </div> <h2>Object State</h2>
|
||||
|
||||
<p>Convenience Backbone model for storing (configuration) state of objects like Views.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">ObjectState</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-44"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-44">¶</a> </div> <h2>Backbone.sync</h2>
|
||||
|
||||
<p>Override Backbone.sync to hand off to sync function in relevant backend</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">Backbone</span><span class="p">.</span><span class="nx">sync</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">method</span><span class="p">,</span> <span class="nx">model</span><span class="p">,</span> <span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">model</span><span class="p">.</span><span class="nx">backend</span><span class="p">.</span><span class="nx">sync</span><span class="p">(</span><span class="nx">method</span><span class="p">,</span> <span class="nx">model</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="p">}(</span><span class="nx">jQuery</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span><span class="p">));</span>
|
||||
|
||||
</pre></div> </td> </tr> </tbody> </table> </div> </body> </html>
|
||||
@ -1,4 +1,4 @@
|
||||
<!DOCTYPE html> <html> <head> <title>view-graph.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="model.html"> model.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.html"> view.js </a> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> view-graph.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> </td> <td class="code"> <div class="highlight"><pre><span class="cm">/*jshint multistr:true */</span>
|
||||
<!DOCTYPE html> <html> <head> <title>view.graph.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="backend.couchdb.html"> backend.couchdb.js </a> <a class="source" href="backend.csv.html"> backend.csv.js </a> <a class="source" href="backend.dataproxy.html"> backend.dataproxy.js </a> <a class="source" href="backend.elasticsearch.html"> backend.elasticsearch.js </a> <a class="source" href="backend.gdocs.html"> backend.gdocs.js </a> <a class="source" href="backend.memory.html"> backend.memory.js </a> <a class="source" href="costco.html"> costco.js </a> <a class="source" href="model.html"> model.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="view.transform.html"> view.transform.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> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> view.graph.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> </td> <td class="code"> <div class="highlight"><pre><span class="cm">/*jshint multistr:true */</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">View</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">View</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
@ -20,44 +20,10 @@
|
||||
|
||||
<p>NB: should <em>not</em> provide an el argument to the view but must let the view
|
||||
generate the element itself (you can then append view.el to the DOM.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">Graph</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">View</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
|
||||
<span class="nx">tagName</span><span class="o">:</span> <span class="s2">"div"</span><span class="p">,</span>
|
||||
<span class="nx">className</span><span class="o">:</span> <span class="s2">"recline-graph"</span><span class="p">,</span>
|
||||
|
||||
<span class="nx">template</span><span class="o">:</span> <span class="s1">' \</span>
|
||||
<span class="s1"> <div class="editor"> \</span>
|
||||
<span class="s1"> <form class="form-stacked"> \</span>
|
||||
<span class="s1"> <div class="clearfix"> \</span>
|
||||
<span class="s1"> <label>Graph Type</label> \</span>
|
||||
<span class="s1"> <div class="input editor-type"> \</span>
|
||||
<span class="s1"> <select> \</span>
|
||||
<span class="s1"> <option value="lines-and-points">Lines and Points</option> \</span>
|
||||
<span class="s1"> <option value="lines">Lines</option> \</span>
|
||||
<span class="s1"> <option value="points">Points</option> \</span>
|
||||
<span class="s1"> <option value="bars">Bars</option> \</span>
|
||||
<span class="s1"> </select> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> <label>Group Column (x-axis)</label> \</span>
|
||||
<span class="s1"> <div class="input editor-group"> \</span>
|
||||
<span class="s1"> <select> \</span>
|
||||
<span class="s1"> <option value="">Please choose ...</option> \</span>
|
||||
<span class="s1"> {{#fields}} \</span>
|
||||
<span class="s1"> <option value="{{id}}">{{label}}</option> \</span>
|
||||
<span class="s1"> {{/fields}} \</span>
|
||||
<span class="s1"> </select> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> <div class="editor-series-group"> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> <div class="editor-buttons"> \</span>
|
||||
<span class="s1"> <button class="btn editor-add">Add Series</button> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> <div class="editor-buttons editor-submit" comment="hidden temporarily" style="display: none;"> \</span>
|
||||
<span class="s1"> <button class="editor-save">Save</button> \</span>
|
||||
<span class="s1"> <input type="hidden" class="editor-id" value="chart-1" /> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> </form> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> <div class="panel graph"> \</span>
|
||||
<span class="s1"> <div class="js-temp-notice alert alert-block"> \</span>
|
||||
<span class="s1"> <h3 class="alert-heading">Hey there!</h3> \</span>
|
||||
@ -67,26 +33,6 @@ generate the element itself (you can then append view.el to the DOM.</p>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"></div> \</span>
|
||||
<span class="s1">'</span><span class="p">,</span>
|
||||
<span class="nx">templateSeriesEditor</span><span class="o">:</span> <span class="s1">' \</span>
|
||||
<span class="s1"> <div class="editor-series js-series-{{seriesIndex}}"> \</span>
|
||||
<span class="s1"> <label>Series <span>{{seriesName}} (y-axis)</span> \</span>
|
||||
<span class="s1"> [<a href="#remove" class="action-remove-series">Remove</a>] \</span>
|
||||
<span class="s1"> </label> \</span>
|
||||
<span class="s1"> <div class="input"> \</span>
|
||||
<span class="s1"> <select> \</span>
|
||||
<span class="s1"> {{#fields}} \</span>
|
||||
<span class="s1"> <option value="{{id}}">{{label}}</option> \</span>
|
||||
<span class="s1"> {{/fields}} \</span>
|
||||
<span class="s1"> </select> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> '</span><span class="p">,</span>
|
||||
|
||||
<span class="nx">events</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="s1">'change form select'</span><span class="o">:</span> <span class="s1">'onEditorSubmit'</span><span class="p">,</span>
|
||||
<span class="s1">'click .editor-add'</span><span class="o">:</span> <span class="s1">'_onAddSeries'</span><span class="p">,</span>
|
||||
<span class="s1">'click .action-remove-series'</span><span class="o">:</span> <span class="s1">'removeSeries'</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">initialize</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
@ -96,8 +42,8 @@ generate the element itself (you can then append view.el to the DOM.</p>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'change'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'reset'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'add'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'add'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">redraw</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'reset'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">redraw</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <p>because we cannot redraw when hidden we may need when becoming visible</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'view:show'</span><span class="p">,</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'add'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">redraw</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'reset'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">redraw</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <p>because we cannot redraw when hidden we may need when becoming visible</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'view:show'</span><span class="p">,</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">needToRedraw</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">redraw</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
@ -109,6 +55,15 @@ generate the element itself (you can then append view.el to the DOM.</p>
|
||||
<span class="nx">options</span><span class="p">.</span><span class="nx">state</span>
|
||||
<span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">state</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">ObjectState</span><span class="p">(</span><span class="nx">stateData</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">editor</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">GraphControls</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">,</span>
|
||||
<span class="nx">state</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">()</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">editor</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'change'</span><span class="p">,</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">set</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">editor</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">());</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">redraw</span><span class="p">();</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">elSidebar</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">editor</span><span class="p">.</span><span class="nx">el</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">();</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
@ -117,77 +72,39 @@ generate the element itself (you can then append view.el to the DOM.</p>
|
||||
<span class="kd">var</span> <span class="nx">tmplData</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">toTemplateJSON</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">htmls</span> <span class="o">=</span> <span class="nx">Mustache</span><span class="p">.</span><span class="nx">render</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">template</span><span class="p">,</span> <span class="nx">tmplData</span><span class="p">);</span>
|
||||
<span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">).</span><span class="nx">html</span><span class="p">(</span><span class="nx">htmls</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">$graph</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.panel.graph'</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <p>set up editor from state</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'graphType'</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_selectOption</span><span class="p">(</span><span class="s1">'.editor-type'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'graphType'</span><span class="p">));</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'group'</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_selectOption</span><span class="p">(</span><span class="s1">'.editor-group'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'group'</span><span class="p">));</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <p>ensure at least one series box shows up</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">tmpSeries</span> <span class="o">=</span> <span class="p">[</span><span class="s2">""</span><span class="p">];</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'series'</span><span class="p">).</span><span class="nx">length</span> <span class="o">></span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">tmpSeries</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'series'</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">tmpSeries</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">series</span><span class="p">,</span> <span class="nx">idx</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">addSeries</span><span class="p">(</span><span class="nx">idx</span><span class="p">);</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">_selectOption</span><span class="p">(</span><span class="s1">'.editor-series.js-series-'</span> <span class="o">+</span> <span class="nx">idx</span><span class="p">,</span> <span class="nx">series</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">$graph</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.panel.graph'</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <p>Private: Helper function to select an option from a select list</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_selectOption</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">id</span><span class="p">,</span><span class="nx">value</span><span class="p">){</span>
|
||||
<span class="kd">var</span> <span class="nx">options</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="nx">id</span> <span class="o">+</span> <span class="s1">' select > option'</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">options</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">opt</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">value</span> <span class="o">==</span> <span class="nx">value</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">).</span><span class="nx">attr</span><span class="p">(</span><span class="s1">'selected'</span><span class="p">,</span><span class="s1">'selected'</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="kc">false</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">onEditorSubmit</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">select</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.editor-group select'</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">$editor</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">$series</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.editor-series select'</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">series</span> <span class="o">=</span> <span class="nx">$series</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">).</span><span class="nx">val</span><span class="p">();</span>
|
||||
<span class="p">});</span>
|
||||
<span class="kd">var</span> <span class="nx">updatedState</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">series</span><span class="o">:</span> <span class="nx">$</span><span class="p">.</span><span class="nx">makeArray</span><span class="p">(</span><span class="nx">series</span><span class="p">),</span>
|
||||
<span class="nx">group</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.editor-group select'</span><span class="p">).</span><span class="nx">val</span><span class="p">(),</span>
|
||||
<span class="nx">graphType</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.editor-type select'</span><span class="p">).</span><span class="nx">val</span><span class="p">()</span>
|
||||
<span class="p">};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">set</span><span class="p">(</span><span class="nx">updatedState</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">redraw</span><span class="p">();</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">redraw</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">¶</a> </div> <p>There appear to be issues generating a Flot graph if either:</p> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-9">¶</a> </div> <ul>
|
||||
<span class="nx">redraw</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <p>There appear to be issues generating a Flot graph if either:</p> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <ul>
|
||||
<li><p>The relevant div that graph attaches to his hidden at the moment of creating the plot -- Flot will complain with</p>
|
||||
|
||||
<p>Uncaught Invalid dimensions for plot, width = 0, height = 0</p></li>
|
||||
<li>There is no data for the plot -- either same error or may have issues later with errors like 'non-existent node-value' </li>
|
||||
</ul> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">areWeVisible</span> <span class="o">=</span> <span class="o">!</span><span class="nx">jQuery</span><span class="p">.</span><span class="nx">expr</span><span class="p">.</span><span class="nx">filters</span><span class="p">.</span><span class="nx">hidden</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">[</span><span class="mi">0</span><span class="p">]);</span>
|
||||
<span class="k">if</span> <span class="p">((</span><span class="o">!</span><span class="nx">areWeVisible</span> <span class="o">||</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">length</span> <span class="o">===</span> <span class="mi">0</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">((</span><span class="o">!</span><span class="nx">areWeVisible</span> <span class="o">||</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">length</span> <span class="o">===</span> <span class="mi">0</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">needToRedraw</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
|
||||
<span class="k">return</span><span class="p">;</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">¶</a> </div> <p>check we have something to plot</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'group'</span><span class="p">)</span> <span class="o">&&</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'series'</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <p>check we have something to plot</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'group'</span><span class="p">)</span> <span class="o">&&</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'series'</span><span class="p">))</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">¶</a> </div> <p>faff around with width because flot draws axes <em>outside</em> of the element width which means graph can get push down as it hits element next to it</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">$graph</span><span class="p">.</span><span class="nx">width</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">width</span><span class="p">()</span> <span class="o">-</span> <span class="mi">20</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">series</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">createSeries</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">options</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">getGraphOptions</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">attributes</span><span class="p">.</span><span class="nx">graphType</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">plot</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">plot</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">$graph</span><span class="p">,</span> <span class="nx">series</span><span class="p">,</span> <span class="nx">options</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">setupTooltips</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-11">¶</a> </div> <h3>getGraphOptions</h3>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-9">¶</a> </div> <h3>getGraphOptions</h3>
|
||||
|
||||
<p>Get options for Flot Graph</p>
|
||||
|
||||
<p>needs to be function as can depend on state</p>
|
||||
|
||||
<p>@param typeId graphType id (lines, lines-and-points etc)</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">getGraphOptions</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">typeId</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-12">¶</a> </div> <p>special tickformatter to show labels rather than numbers
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">¶</a> </div> <p>special tickformatter to show labels rather than numbers
|
||||
TODO: we should really use tickFormatter and 1 interval ticks if (and
|
||||
only if) x-axis values are non-numeric
|
||||
However, that is non-trivial to work out from a dataset (datasets may
|
||||
have no field type info). Thus at present we only do this for bars.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">tickFormatter</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">val</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">models</span><span class="p">[</span><span class="nx">val</span><span class="p">])</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">out</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">models</span><span class="p">[</span><span class="nx">val</span><span class="p">].</span><span class="nx">get</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">attributes</span><span class="p">.</span><span class="nx">group</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-13">¶</a> </div> <p>if the value was in fact a number we want that not the </p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="k">typeof</span><span class="p">(</span><span class="nx">out</span><span class="p">)</span> <span class="o">==</span> <span class="s1">'number'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">models</span><span class="p">[</span><span class="nx">val</span><span class="p">])</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">out</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">models</span><span class="p">[</span><span class="nx">val</span><span class="p">].</span><span class="nx">get</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">attributes</span><span class="p">.</span><span class="nx">group</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-11">¶</a> </div> <p>if the value was in fact a number we want that not the </p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="k">typeof</span><span class="p">(</span><span class="nx">out</span><span class="p">)</span> <span class="o">==</span> <span class="s1">'number'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">val</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">out</span><span class="p">;</span>
|
||||
@ -196,7 +113,7 @@ have no field type info). Thus at present we only do this for bars.</p>
|
||||
<span class="k">return</span> <span class="nx">val</span><span class="p">;</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">xaxis</span> <span class="o">=</span> <span class="p">{};</span></pre></div> </td> </tr> <tr id="section-14"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-14">¶</a> </div> <p>check for time series on x-axis</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'group'</span><span class="p">)).</span><span class="nx">get</span><span class="p">(</span><span class="s1">'type'</span><span class="p">)</span> <span class="o">===</span> <span class="s1">'date'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">xaxis</span> <span class="o">=</span> <span class="p">{};</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-12">¶</a> </div> <p>check for time series on x-axis</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'group'</span><span class="p">)).</span><span class="nx">get</span><span class="p">(</span><span class="s1">'type'</span><span class="p">)</span> <span class="o">===</span> <span class="s1">'date'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">xaxis</span><span class="p">.</span><span class="nx">mode</span> <span class="o">=</span> <span class="s1">'time'</span><span class="p">;</span>
|
||||
<span class="nx">xaxis</span><span class="p">.</span><span class="nx">timeformat</span> <span class="o">=</span> <span class="s1">'%y-%b'</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
@ -239,7 +156,7 @@ have no field type info). Thus at present we only do this for bars.</p>
|
||||
<span class="nx">tickLength</span><span class="o">:</span> <span class="mi">1</span><span class="p">,</span>
|
||||
<span class="nx">tickFormatter</span><span class="o">:</span> <span class="nx">tickFormatter</span><span class="p">,</span>
|
||||
<span class="nx">min</span><span class="o">:</span> <span class="o">-</span><span class="mf">0.5</span><span class="p">,</span>
|
||||
<span class="nx">max</span><span class="o">:</span> <span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">length</span> <span class="o">-</span> <span class="mf">0.5</span>
|
||||
<span class="nx">max</span><span class="o">:</span> <span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">length</span> <span class="o">-</span> <span class="mf">0.5</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span>
|
||||
@ -269,16 +186,16 @@ have no field type info). Thus at present we only do this for bars.</p>
|
||||
|
||||
<span class="nx">$</span><span class="p">(</span><span class="s2">"#flot-tooltip"</span><span class="p">).</span><span class="nx">remove</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">x</span> <span class="o">=</span> <span class="nx">item</span><span class="p">.</span><span class="nx">datapoint</span><span class="p">[</span><span class="mi">0</span><span class="p">];</span>
|
||||
<span class="kd">var</span> <span class="nx">y</span> <span class="o">=</span> <span class="nx">item</span><span class="p">.</span><span class="nx">datapoint</span><span class="p">[</span><span class="mi">1</span><span class="p">];</span></pre></div> </td> </tr> <tr id="section-15"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-15">¶</a> </div> <p>it's horizontal so we have to flip</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">attributes</span><span class="p">.</span><span class="nx">graphType</span> <span class="o">===</span> <span class="s1">'bars'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">y</span> <span class="o">=</span> <span class="nx">item</span><span class="p">.</span><span class="nx">datapoint</span><span class="p">[</span><span class="mi">1</span><span class="p">];</span></pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-13">¶</a> </div> <p>it's horizontal so we have to flip</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">attributes</span><span class="p">.</span><span class="nx">graphType</span> <span class="o">===</span> <span class="s1">'bars'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">_tmp</span> <span class="o">=</span> <span class="nx">x</span><span class="p">;</span>
|
||||
<span class="nx">x</span> <span class="o">=</span> <span class="nx">y</span><span class="p">;</span>
|
||||
<span class="nx">y</span> <span class="o">=</span> <span class="nx">_tmp</span><span class="p">;</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-16"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-16">¶</a> </div> <p>convert back from 'index' value on x-axis (e.g. in cases where non-number values)</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">models</span><span class="p">[</span><span class="nx">x</span><span class="p">])</span> <span class="p">{</span>
|
||||
<span class="nx">x</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">models</span><span class="p">[</span><span class="nx">x</span><span class="p">].</span><span class="nx">get</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">attributes</span><span class="p">.</span><span class="nx">group</span><span class="p">);</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-14"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-14">¶</a> </div> <p>convert back from 'index' value on x-axis (e.g. in cases where non-number values)</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">models</span><span class="p">[</span><span class="nx">x</span><span class="p">])</span> <span class="p">{</span>
|
||||
<span class="nx">x</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">models</span><span class="p">[</span><span class="nx">x</span><span class="p">].</span><span class="nx">get</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">attributes</span><span class="p">.</span><span class="nx">group</span><span class="p">);</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">x</span> <span class="o">=</span> <span class="nx">x</span><span class="p">.</span><span class="nx">toFixed</span><span class="p">(</span><span class="mi">2</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">y</span> <span class="o">=</span> <span class="nx">y</span><span class="p">.</span><span class="nx">toFixed</span><span class="p">(</span><span class="mi">2</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-17"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-17">¶</a> </div> <p>is it time series</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">xfield</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">attributes</span><span class="p">.</span><span class="nx">group</span><span class="p">);</span>
|
||||
<span class="nx">y</span> <span class="o">=</span> <span class="nx">y</span><span class="p">.</span><span class="nx">toFixed</span><span class="p">(</span><span class="mi">2</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-15"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-15">¶</a> </div> <p>is it time series</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">xfield</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">attributes</span><span class="p">.</span><span class="nx">group</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">isDateTime</span> <span class="o">=</span> <span class="nx">xfield</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'type'</span><span class="p">)</span> <span class="o">===</span> <span class="s1">'date'</span><span class="p">;</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">isDateTime</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">x</span> <span class="o">=</span> <span class="k">new</span> <span class="nb">Date</span><span class="p">(</span><span class="nb">parseInt</span><span class="p">(</span><span class="nx">x</span><span class="p">)).</span><span class="nx">toLocaleDateString</span><span class="p">();</span>
|
||||
@ -305,17 +222,20 @@ have no field type info). Thus at present we only do this for bars.</p>
|
||||
<span class="kd">var</span> <span class="nx">series</span> <span class="o">=</span> <span class="p">[];</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">attributes</span><span class="p">.</span><span class="nx">series</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">field</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">points</span> <span class="o">=</span> <span class="p">[];</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">models</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">,</span> <span class="nx">index</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">models</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">,</span> <span class="nx">index</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">xfield</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">attributes</span><span class="p">.</span><span class="nx">group</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">x</span> <span class="o">=</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">getFieldValue</span><span class="p">(</span><span class="nx">xfield</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-18"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-18">¶</a> </div> <p>time series</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">isDateTime</span> <span class="o">=</span> <span class="nx">xfield</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'type'</span><span class="p">)</span> <span class="o">===</span> <span class="s1">'date'</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">x</span> <span class="o">=</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">getFieldValue</span><span class="p">(</span><span class="nx">xfield</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-16"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-16">¶</a> </div> <p>time series</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">isDateTime</span> <span class="o">=</span> <span class="nx">xfield</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'type'</span><span class="p">)</span> <span class="o">===</span> <span class="s1">'date'</span><span class="p">;</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">isDateTime</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">x</span> <span class="o">=</span> <span class="k">new</span> <span class="nb">Date</span><span class="p">(</span><span class="nx">x</span><span class="p">);</span>
|
||||
<span class="nx">x</span> <span class="o">=</span> <span class="nx">moment</span><span class="p">(</span><span class="nx">x</span><span class="p">).</span><span class="nx">toDate</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
<span class="kd">var</span> <span class="nx">yfield</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="nx">field</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">y</span> <span class="o">=</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">getFieldValue</span><span class="p">(</span><span class="nx">yfield</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">typeof</span> <span class="nx">x</span> <span class="o">===</span> <span class="s1">'string'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">x</span> <span class="o">=</span> <span class="nx">index</span><span class="p">;</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-19"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-19">¶</a> </div> <p>horizontal bar chart</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">attributes</span><span class="p">.</span><span class="nx">graphType</span> <span class="o">==</span> <span class="s1">'bars'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">x</span> <span class="o">=</span> <span class="nb">parseFloat</span><span class="p">(</span><span class="nx">x</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nb">isNaN</span><span class="p">(</span><span class="nx">x</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="nx">x</span> <span class="o">=</span> <span class="nx">index</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-17"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-17">¶</a> </div> <p>horizontal bar chart</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">attributes</span><span class="p">.</span><span class="nx">graphType</span> <span class="o">==</span> <span class="s1">'bars'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">points</span><span class="p">.</span><span class="nx">push</span><span class="p">([</span><span class="nx">y</span><span class="p">,</span> <span class="nx">x</span><span class="p">]);</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">points</span><span class="p">.</span><span class="nx">push</span><span class="p">([</span><span class="nx">x</span><span class="p">,</span> <span class="nx">y</span><span class="p">]);</span>
|
||||
@ -324,7 +244,120 @@ have no field type info). Thus at present we only do this for bars.</p>
|
||||
<span class="nx">series</span><span class="p">.</span><span class="nx">push</span><span class="p">({</span><span class="nx">data</span><span class="o">:</span> <span class="nx">points</span><span class="p">,</span> <span class="nx">label</span><span class="o">:</span> <span class="nx">field</span><span class="p">});</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">series</span><span class="p">;</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-20"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-20">¶</a> </div> <p>Public: Adds a new empty series select box to the editor.</p>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
|
||||
<span class="nx">my</span><span class="p">.</span><span class="nx">GraphControls</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">View</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">className</span><span class="o">:</span> <span class="s2">"editor"</span><span class="p">,</span>
|
||||
<span class="nx">template</span><span class="o">:</span> <span class="s1">' \</span>
|
||||
<span class="s1"> <div class="editor"> \</span>
|
||||
<span class="s1"> <form class="form-stacked"> \</span>
|
||||
<span class="s1"> <div class="clearfix"> \</span>
|
||||
<span class="s1"> <label>Graph Type</label> \</span>
|
||||
<span class="s1"> <div class="input editor-type"> \</span>
|
||||
<span class="s1"> <select> \</span>
|
||||
<span class="s1"> <option value="lines-and-points">Lines and Points</option> \</span>
|
||||
<span class="s1"> <option value="lines">Lines</option> \</span>
|
||||
<span class="s1"> <option value="points">Points</option> \</span>
|
||||
<span class="s1"> <option value="bars">Bars</option> \</span>
|
||||
<span class="s1"> </select> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> <label>Group Column (x-axis)</label> \</span>
|
||||
<span class="s1"> <div class="input editor-group"> \</span>
|
||||
<span class="s1"> <select> \</span>
|
||||
<span class="s1"> <option value="">Please choose ...</option> \</span>
|
||||
<span class="s1"> {{#fields}} \</span>
|
||||
<span class="s1"> <option value="{{id}}">{{label}}</option> \</span>
|
||||
<span class="s1"> {{/fields}} \</span>
|
||||
<span class="s1"> </select> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> <div class="editor-series-group"> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> <div class="editor-buttons"> \</span>
|
||||
<span class="s1"> <button class="btn editor-add">Add Series</button> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> <div class="editor-buttons editor-submit" comment="hidden temporarily" style="display: none;"> \</span>
|
||||
<span class="s1"> <button class="editor-save">Save</button> \</span>
|
||||
<span class="s1"> <input type="hidden" class="editor-id" value="chart-1" /> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> </form> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1">'</span><span class="p">,</span>
|
||||
<span class="nx">templateSeriesEditor</span><span class="o">:</span> <span class="s1">' \</span>
|
||||
<span class="s1"> <div class="editor-series js-series-{{seriesIndex}}"> \</span>
|
||||
<span class="s1"> <label>Series <span>{{seriesName}} (y-axis)</span> \</span>
|
||||
<span class="s1"> [<a href="#remove" class="action-remove-series">Remove</a>] \</span>
|
||||
<span class="s1"> </label> \</span>
|
||||
<span class="s1"> <div class="input"> \</span>
|
||||
<span class="s1"> <select> \</span>
|
||||
<span class="s1"> {{#fields}} \</span>
|
||||
<span class="s1"> <option value="{{id}}">{{label}}</option> \</span>
|
||||
<span class="s1"> {{/fields}} \</span>
|
||||
<span class="s1"> </select> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> '</span><span class="p">,</span>
|
||||
<span class="nx">events</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="s1">'change form select'</span><span class="o">:</span> <span class="s1">'onEditorSubmit'</span><span class="p">,</span>
|
||||
<span class="s1">'click .editor-add'</span><span class="o">:</span> <span class="s1">'_onAddSeries'</span><span class="p">,</span>
|
||||
<span class="s1">'click .action-remove-series'</span><span class="o">:</span> <span class="s1">'removeSeries'</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">initialize</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">);</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">bindAll</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="s1">'render'</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'reset'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'add'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">state</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">ObjectState</span><span class="p">(</span><span class="nx">options</span><span class="p">.</span><span class="nx">state</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">();</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">render</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">tmplData</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">toTemplateJSON</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">htmls</span> <span class="o">=</span> <span class="nx">Mustache</span><span class="p">.</span><span class="nx">render</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">template</span><span class="p">,</span> <span class="nx">tmplData</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">html</span><span class="p">(</span><span class="nx">htmls</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-18"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-18">¶</a> </div> <p>set up editor from state</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'graphType'</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_selectOption</span><span class="p">(</span><span class="s1">'.editor-type'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'graphType'</span><span class="p">));</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'group'</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_selectOption</span><span class="p">(</span><span class="s1">'.editor-group'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'group'</span><span class="p">));</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-19"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-19">¶</a> </div> <p>ensure at least one series box shows up</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">tmpSeries</span> <span class="o">=</span> <span class="p">[</span><span class="s2">""</span><span class="p">];</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'series'</span><span class="p">).</span><span class="nx">length</span> <span class="o">></span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">tmpSeries</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'series'</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">tmpSeries</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">series</span><span class="p">,</span> <span class="nx">idx</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">addSeries</span><span class="p">(</span><span class="nx">idx</span><span class="p">);</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">_selectOption</span><span class="p">(</span><span class="s1">'.editor-series.js-series-'</span> <span class="o">+</span> <span class="nx">idx</span><span class="p">,</span> <span class="nx">series</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-20"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-20">¶</a> </div> <p>Private: Helper function to select an option from a select list</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_selectOption</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">id</span><span class="p">,</span><span class="nx">value</span><span class="p">){</span>
|
||||
<span class="kd">var</span> <span class="nx">options</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="nx">id</span> <span class="o">+</span> <span class="s1">' select > option'</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">options</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">opt</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">value</span> <span class="o">==</span> <span class="nx">value</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">).</span><span class="nx">attr</span><span class="p">(</span><span class="s1">'selected'</span><span class="p">,</span><span class="s1">'selected'</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="kc">false</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">onEditorSubmit</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">select</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.editor-group select'</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">$editor</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">$series</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.editor-series select'</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">series</span> <span class="o">=</span> <span class="nx">$series</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="kd">function</span> <span class="p">()</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">).</span><span class="nx">val</span><span class="p">();</span>
|
||||
<span class="p">});</span>
|
||||
<span class="kd">var</span> <span class="nx">updatedState</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">series</span><span class="o">:</span> <span class="nx">$</span><span class="p">.</span><span class="nx">makeArray</span><span class="p">(</span><span class="nx">series</span><span class="p">),</span>
|
||||
<span class="nx">group</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.editor-group select'</span><span class="p">).</span><span class="nx">val</span><span class="p">(),</span>
|
||||
<span class="nx">graphType</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.editor-type select'</span><span class="p">).</span><span class="nx">val</span><span class="p">()</span>
|
||||
<span class="p">};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">set</span><span class="p">(</span><span class="nx">updatedState</span><span class="p">);</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-21"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-21">¶</a> </div> <p>Public: Adds a new empty series select box to the editor.</p>
|
||||
|
||||
<p>@param [int] idx index of this series in the list of series</p>
|
||||
|
||||
@ -342,7 +375,7 @@ have no field type info). Thus at present we only do this for bars.</p>
|
||||
<span class="nx">_onAddSeries</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">e</span><span class="p">.</span><span class="nx">preventDefault</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">addSeries</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'series'</span><span class="p">).</span><span class="nx">length</span><span class="p">);</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-21"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-21">¶</a> </div> <p>Public: Removes a series list item from the editor.</p>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-22"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-22">¶</a> </div> <p>Public: Removes a series list item from the editor.</p>
|
||||
|
||||
<p>Also updates the labels of the remaining series elements.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">removeSeries</span><span class="o">:</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">e</span><span class="p">.</span><span class="nx">preventDefault</span><span class="p">();</span>
|
||||
@ -1,4 +1,4 @@
|
||||
<!DOCTYPE html> <html> <head> <title>view-grid.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="model.html"> model.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.html"> view.js </a> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> view-grid.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> </td> <td class="code"> <div class="highlight"><pre><span class="cm">/*jshint multistr:true */</span>
|
||||
<!DOCTYPE html> <html> <head> <title>view.grid.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="backend.couchdb.html"> backend.couchdb.js </a> <a class="source" href="backend.csv.html"> backend.csv.js </a> <a class="source" href="backend.dataproxy.html"> backend.dataproxy.js </a> <a class="source" href="backend.elasticsearch.html"> backend.elasticsearch.js </a> <a class="source" href="backend.gdocs.html"> backend.gdocs.js </a> <a class="source" href="backend.memory.html"> backend.memory.js </a> <a class="source" href="costco.html"> costco.js </a> <a class="source" href="model.html"> model.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="view.transform.html"> view.transform.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> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> view.grid.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> </td> <td class="code"> <div class="highlight"><pre><span class="cm">/*jshint multistr:true */</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">View</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">View</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
@ -15,9 +15,9 @@
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">);</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">bindAll</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="s1">'render'</span><span class="p">,</span> <span class="s1">'onHorizontalScroll'</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'add'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'reset'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'remove'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'add'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'reset'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'remove'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">tempState</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="kd">var</span> <span class="nx">state</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">hiddenFields</span><span class="o">:</span> <span class="p">[]</span>
|
||||
@ -69,11 +69,11 @@ Column and row menus</p> </td> <td class="code">
|
||||
<span class="nx">showColumn</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span> <span class="nx">self</span><span class="p">.</span><span class="nx">showColumn</span><span class="p">(</span><span class="nx">e</span><span class="p">);</span> <span class="p">},</span>
|
||||
<span class="nx">deleteRow</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">doc</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">models</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <p>important this is == as the currentRow will be string (as comes
|
||||
<span class="kd">var</span> <span class="nx">doc</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">models</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <p>important this is == as the currentRow will be string (as comes
|
||||
from DOM) while id may be int</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">id</span> <span class="o">==</span> <span class="nx">self</span><span class="p">.</span><span class="nx">tempState</span><span class="p">.</span><span class="nx">currentRow</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">doc</span><span class="p">.</span><span class="nx">destroy</span><span class="p">().</span><span class="nx">then</span><span class="p">(</span><span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">remove</span><span class="p">(</span><span class="nx">doc</span><span class="p">);</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">remove</span><span class="p">(</span><span class="nx">doc</span><span class="p">);</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'recline:flash'</span><span class="p">,</span> <span class="p">{</span><span class="nx">message</span><span class="o">:</span> <span class="s2">"Row deleted successfully"</span><span class="p">});</span>
|
||||
<span class="p">}).</span><span class="nx">fail</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">err</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'recline:flash'</span><span class="p">,</span> <span class="p">{</span><span class="nx">message</span><span class="o">:</span> <span class="s2">"Errorz! "</span> <span class="o">+</span> <span class="nx">err</span><span class="p">});</span>
|
||||
@ -187,7 +187,7 @@ from DOM) while id may be int</p> </td> <td class="code"
|
||||
<span class="p">});</span>
|
||||
<span class="kd">var</span> <span class="nx">htmls</span> <span class="o">=</span> <span class="nx">Mustache</span><span class="p">.</span><span class="nx">render</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">template</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">toTemplateJSON</span><span class="p">());</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">html</span><span class="p">(</span><span class="nx">htmls</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">forEach</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">forEach</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">tr</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="s1">'<tr />'</span><span class="p">);</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'tbody'</span><span class="p">).</span><span class="nx">append</span><span class="p">(</span><span class="nx">tr</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">newView</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">GridRow</span><span class="p">({</span>
|
||||
@ -213,7 +213,7 @@ from DOM) while id may be int</p> </td> <td class="code"
|
||||
<span class="nx">$c</span><span class="p">.</span><span class="nx">remove</span><span class="p">();</span>
|
||||
<span class="k">return</span> <span class="nx">dim</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-16"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-16">¶</a> </div> <h2>GridRow View for rendering an individual document.</h2>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-16"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-16">¶</a> </div> <h2>GridRow View for rendering an individual record.</h2>
|
||||
|
||||
<p>Since we want this to update in place it is up to creator to provider the element to attach to.</p>
|
||||
|
||||
@ -223,7 +223,7 @@ from DOM) while id may be int</p> </td> <td class="code"
|
||||
|
||||
<pre>
|
||||
var row = new GridRow({
|
||||
model: dataset-document,
|
||||
model: dataset-record,
|
||||
el: dom-element,
|
||||
fields: mydatasets.fields // a FieldList object
|
||||
});
|
||||
@ -1,11 +1,11 @@
|
||||
<!DOCTYPE html> <html> <head> <title>view-map.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="model.html"> model.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.html"> view.js </a> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> view-map.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> </td> <td class="code"> <div class="highlight"><pre><span class="cm">/*jshint multistr:true */</span>
|
||||
<!DOCTYPE html> <html> <head> <title>view.map.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="backend.couchdb.html"> backend.couchdb.js </a> <a class="source" href="backend.csv.html"> backend.csv.js </a> <a class="source" href="backend.dataproxy.html"> backend.dataproxy.js </a> <a class="source" href="backend.elasticsearch.html"> backend.elasticsearch.js </a> <a class="source" href="backend.gdocs.html"> backend.gdocs.js </a> <a class="source" href="backend.memory.html"> backend.memory.js </a> <a class="source" href="costco.html"> costco.js </a> <a class="source" href="model.html"> model.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="view.transform.html"> view.transform.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> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> view.map.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> </td> <td class="code"> <div class="highlight"><pre><span class="cm">/*jshint multistr:true */</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">View</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">View</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
|
||||
<span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">$</span><span class="p">,</span> <span class="nx">my</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <h2>Map view for a Dataset using Leaflet mapping library.</h2>
|
||||
|
||||
<p>This view allows to plot gereferenced documents on a map. The location
|
||||
<p>This view allows to plot gereferenced records on a map. The location
|
||||
information can be provided either via a field with
|
||||
<a href="http://geojson.org">GeoJSON</a> objects or two fields with latitude and
|
||||
longitude coordinates.</p>
|
||||
@ -21,12 +21,300 @@ have the following (optional) configuration options:</p>
|
||||
latField: {id of field containing latitude in the dataset}
|
||||
}
|
||||
</pre> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">Map</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">View</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
|
||||
<span class="nx">tagName</span><span class="o">:</span> <span class="s1">'div'</span><span class="p">,</span>
|
||||
<span class="nx">className</span><span class="o">:</span> <span class="s1">'recline-map'</span><span class="p">,</span>
|
||||
|
||||
<span class="nx">template</span><span class="o">:</span> <span class="s1">' \</span>
|
||||
<span class="s1"> <div class="editor"> \</span>
|
||||
<span class="s1"> <div class="panel map"></div> \</span>
|
||||
<span class="s1">'</span><span class="p">,</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <p>These are the default (case-insensitive) names of field that are used if found.
|
||||
If not found, the user will need to define the fields via the editor.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">latitudeFieldNames</span><span class="o">:</span> <span class="p">[</span><span class="s1">'lat'</span><span class="p">,</span><span class="s1">'latitude'</span><span class="p">],</span>
|
||||
<span class="nx">longitudeFieldNames</span><span class="o">:</span> <span class="p">[</span><span class="s1">'lon'</span><span class="p">,</span><span class="s1">'longitude'</span><span class="p">],</span>
|
||||
<span class="nx">geometryFieldNames</span><span class="o">:</span> <span class="p">[</span><span class="s1">'geojson'</span><span class="p">,</span> <span class="s1">'geom'</span><span class="p">,</span><span class="s1">'the_geom'</span><span class="p">,</span><span class="s1">'geometry'</span><span class="p">,</span><span class="s1">'spatial'</span><span class="p">,</span><span class="s1">'location'</span><span class="p">],</span>
|
||||
|
||||
<span class="nx">initialize</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-4">¶</a> </div> <p>Listen to changes in the fields</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'change'</span><span class="p">,</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">_setupGeometryField</span><span class="p">()</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">render</span><span class="p">()</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <p>Listen to changes in the records</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'add'</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">){</span><span class="nx">self</span><span class="p">.</span><span class="nx">redraw</span><span class="p">(</span><span class="s1">'add'</span><span class="p">,</span><span class="nx">doc</span><span class="p">)});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'change'</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">){</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">redraw</span><span class="p">(</span><span class="s1">'remove'</span><span class="p">,</span><span class="nx">doc</span><span class="p">);</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">redraw</span><span class="p">(</span><span class="s1">'add'</span><span class="p">,</span><span class="nx">doc</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'remove'</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">){</span><span class="nx">self</span><span class="p">.</span><span class="nx">redraw</span><span class="p">(</span><span class="s1">'remove'</span><span class="p">,</span><span class="nx">doc</span><span class="p">)});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'reset'</span><span class="p">,</span> <span class="kd">function</span><span class="p">(){</span><span class="nx">self</span><span class="p">.</span><span class="nx">redraw</span><span class="p">(</span><span class="s1">'reset'</span><span class="p">)});</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'view:show'</span><span class="p">,</span><span class="kd">function</span><span class="p">(){</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <p>If the div was hidden, Leaflet needs to recalculate some sizes
|
||||
to display properly</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">map</span><span class="p">){</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">map</span><span class="p">.</span><span class="nx">invalidateSize</span><span class="p">();</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">_zoomPending</span> <span class="o">&&</span> <span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'autoZoom'</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">_zoomToFeatures</span><span class="p">();</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">_zoomPending</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">visible</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'view:hide'</span><span class="p">,</span><span class="kd">function</span><span class="p">(){</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">visible</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">stateData</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">geomField</span><span class="o">:</span> <span class="kc">null</span><span class="p">,</span>
|
||||
<span class="nx">lonField</span><span class="o">:</span> <span class="kc">null</span><span class="p">,</span>
|
||||
<span class="nx">latField</span><span class="o">:</span> <span class="kc">null</span><span class="p">,</span>
|
||||
<span class="nx">autoZoom</span><span class="o">:</span> <span class="kc">true</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">options</span><span class="p">.</span><span class="nx">state</span>
|
||||
<span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">state</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">ObjectState</span><span class="p">(</span><span class="nx">stateData</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">menu</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">MapMenu</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">,</span>
|
||||
<span class="nx">state</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">()</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'change'</span><span class="p">,</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">set</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">());</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">redraw</span><span class="p">();</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">elSidebar</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">el</span><span class="p">;</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">mapReady</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">redraw</span><span class="p">();</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <h3>Public: Adds the necessary elements to the page.</h3>
|
||||
|
||||
<p>Also sets up the editor fields and the map if necessary.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">render</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
|
||||
<span class="nx">htmls</span> <span class="o">=</span> <span class="nx">Mustache</span><span class="p">.</span><span class="nx">render</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">template</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">toTemplateJSON</span><span class="p">());</span>
|
||||
<span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">).</span><span class="nx">html</span><span class="p">(</span><span class="nx">htmls</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">$map</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.panel.map'</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">¶</a> </div> <h3>Public: Redraws the features on the map according to the action provided</h3>
|
||||
|
||||
<p>Actions can be:</p>
|
||||
|
||||
<ul>
|
||||
<li>reset: Clear all features</li>
|
||||
<li>add: Add one or n features (records)</li>
|
||||
<li>remove: Remove one or n features (records)</li>
|
||||
<li>refresh: Clear existing features and add all current records</li>
|
||||
</ul> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">redraw</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">action</span><span class="p">,</span> <span class="nx">doc</span><span class="p">){</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="nx">action</span> <span class="o">=</span> <span class="nx">action</span> <span class="o">||</span> <span class="s1">'refresh'</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-9">¶</a> </div> <p>try to set things up if not already</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">self</span><span class="p">.</span><span class="nx">_geomReady</span><span class="p">()){</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">_setupGeometryField</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">self</span><span class="p">.</span><span class="nx">mapReady</span><span class="p">){</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">_setupMap</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_geomReady</span><span class="p">()</span> <span class="o">&&</span> <span class="k">this</span><span class="p">.</span><span class="nx">mapReady</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">action</span> <span class="o">==</span> <span class="s1">'reset'</span> <span class="o">||</span> <span class="nx">action</span> <span class="o">==</span> <span class="s1">'refresh'</span><span class="p">){</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">features</span><span class="p">.</span><span class="nx">clearLayers</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_add</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentRecords</span><span class="p">.</span><span class="nx">models</span><span class="p">);</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">action</span> <span class="o">==</span> <span class="s1">'add'</span> <span class="o">&&</span> <span class="nx">doc</span><span class="p">){</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_add</span><span class="p">(</span><span class="nx">doc</span><span class="p">);</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">action</span> <span class="o">==</span> <span class="s1">'remove'</span> <span class="o">&&</span> <span class="nx">doc</span><span class="p">){</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_remove</span><span class="p">(</span><span class="nx">doc</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'autoZoom'</span><span class="p">)){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">visible</span><span class="p">){</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_zoomToFeatures</span><span class="p">();</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_zoomPending</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">_geomReady</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nb">Boolean</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'geomField'</span><span class="p">)</span> <span class="o">||</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'latField'</span><span class="p">)</span> <span class="o">&&</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'lonField'</span><span class="p">)));</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">¶</a> </div> <p>Private: Add one or n features to the map</p>
|
||||
|
||||
<p>For each record passed, a GeoJSON geometry will be extracted and added
|
||||
to the features layer. If an exception is thrown, the process will be
|
||||
stopped and an error notification shown.</p>
|
||||
|
||||
<p>Each feature will have a popup associated with all the record fields.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_add</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">docs</span><span class="p">){</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="p">(</span><span class="nx">docs</span> <span class="k">instanceof</span> <span class="nb">Array</span><span class="p">))</span> <span class="nx">docs</span> <span class="o">=</span> <span class="p">[</span><span class="nx">docs</span><span class="p">];</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">count</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">wrongSoFar</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">every</span><span class="p">(</span><span class="nx">docs</span><span class="p">,</span><span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">){</span>
|
||||
<span class="nx">count</span> <span class="o">+=</span> <span class="mi">1</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">feature</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">_getGeometryFromRecord</span><span class="p">(</span><span class="nx">doc</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">typeof</span> <span class="nx">feature</span> <span class="o">===</span> <span class="s1">'undefined'</span> <span class="o">||</span> <span class="nx">feature</span> <span class="o">===</span> <span class="kc">null</span><span class="p">){</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-11">¶</a> </div> <p>Empty field</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="kc">true</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">feature</span> <span class="k">instanceof</span> <span class="nb">Object</span><span class="p">){</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-12">¶</a> </div> <p>Build popup contents
|
||||
TODO: mustache?</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">html</span> <span class="o">=</span> <span class="s1">''</span>
|
||||
<span class="k">for</span> <span class="p">(</span><span class="nx">key</span> <span class="k">in</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">attributes</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'geomField'</span><span class="p">)</span> <span class="o">&&</span> <span class="nx">key</span> <span class="o">==</span> <span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'geomField'</span><span class="p">))){</span>
|
||||
<span class="nx">html</span> <span class="o">+=</span> <span class="s1">'<div><strong>'</span> <span class="o">+</span> <span class="nx">key</span> <span class="o">+</span> <span class="s1">'</strong>: '</span><span class="o">+</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">attributes</span><span class="p">[</span><span class="nx">key</span><span class="p">]</span> <span class="o">+</span> <span class="s1">'</div>'</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">feature</span><span class="p">.</span><span class="nx">properties</span> <span class="o">=</span> <span class="p">{</span><span class="nx">popupContent</span><span class="o">:</span> <span class="nx">html</span><span class="p">};</span></pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-13">¶</a> </div> <p>Add a reference to the model id, which will allow us to
|
||||
link this Leaflet layer to a Recline doc</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">feature</span><span class="p">.</span><span class="nx">properties</span><span class="p">.</span><span class="nx">cid</span> <span class="o">=</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">cid</span><span class="p">;</span>
|
||||
|
||||
<span class="k">try</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">features</span><span class="p">.</span><span class="nx">addGeoJSON</span><span class="p">(</span><span class="nx">feature</span><span class="p">);</span>
|
||||
<span class="p">}</span> <span class="k">catch</span> <span class="p">(</span><span class="nx">except</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">wrongSoFar</span> <span class="o">+=</span> <span class="mi">1</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">msg</span> <span class="o">=</span> <span class="s1">'Wrong geometry value'</span><span class="p">;</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">except</span><span class="p">.</span><span class="nx">message</span><span class="p">)</span> <span class="nx">msg</span> <span class="o">+=</span> <span class="s1">' ('</span> <span class="o">+</span> <span class="nx">except</span><span class="p">.</span><span class="nx">message</span> <span class="o">+</span> <span class="s1">')'</span><span class="p">;</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">wrongSoFar</span> <span class="o"><=</span> <span class="mi">10</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'recline:flash'</span><span class="p">,</span> <span class="p">{</span><span class="nx">message</span><span class="o">:</span> <span class="nx">msg</span><span class="p">,</span> <span class="nx">category</span><span class="o">:</span><span class="s1">'error'</span><span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">wrongSoFar</span> <span class="o">+=</span> <span class="mi">1</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">wrongSoFar</span> <span class="o"><=</span> <span class="mi">10</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'recline:flash'</span><span class="p">,</span> <span class="p">{</span><span class="nx">message</span><span class="o">:</span> <span class="s1">'Wrong geometry value'</span><span class="p">,</span> <span class="nx">category</span><span class="o">:</span><span class="s1">'error'</span><span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="kc">true</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-14"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-14">¶</a> </div> <p>Private: Remove one or n features to the map</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_remove</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">docs</span><span class="p">){</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="p">(</span><span class="nx">docs</span> <span class="k">instanceof</span> <span class="nb">Array</span><span class="p">))</span> <span class="nx">docs</span> <span class="o">=</span> <span class="p">[</span><span class="nx">docs</span><span class="p">];</span>
|
||||
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">docs</span><span class="p">,</span><span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">){</span>
|
||||
<span class="k">for</span> <span class="p">(</span><span class="nx">key</span> <span class="k">in</span> <span class="nx">self</span><span class="p">.</span><span class="nx">features</span><span class="p">.</span><span class="nx">_layers</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">features</span><span class="p">.</span><span class="nx">_layers</span><span class="p">[</span><span class="nx">key</span><span class="p">].</span><span class="nx">cid</span> <span class="o">==</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">cid</span><span class="p">){</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">features</span><span class="p">.</span><span class="nx">removeLayer</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">features</span><span class="p">.</span><span class="nx">_layers</span><span class="p">[</span><span class="nx">key</span><span class="p">]);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-15"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-15">¶</a> </div> <p>Private: Return a GeoJSON geomtry extracted from the record fields</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_getGeometryFromRecord</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'geomField'</span><span class="p">)){</span>
|
||||
<span class="kd">var</span> <span class="nx">value</span> <span class="o">=</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'geomField'</span><span class="p">));</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">typeof</span><span class="p">(</span><span class="nx">value</span><span class="p">)</span> <span class="o">===</span> <span class="s1">'string'</span><span class="p">){</span></pre></div> </td> </tr> <tr id="section-16"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-16">¶</a> </div> <p>We <em>may</em> have a GeoJSON string representation</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">try</span> <span class="p">{</span>
|
||||
<span class="nx">value</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">parseJSON</span><span class="p">(</span><span class="nx">value</span><span class="p">);</span>
|
||||
<span class="p">}</span> <span class="k">catch</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{}</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">typeof</span><span class="p">(</span><span class="nx">value</span><span class="p">)</span> <span class="o">===</span> <span class="s1">'string'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">value</span> <span class="o">=</span> <span class="nx">value</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="s1">'('</span><span class="p">,</span> <span class="s1">''</span><span class="p">).</span><span class="nx">replace</span><span class="p">(</span><span class="s1">')'</span><span class="p">,</span> <span class="s1">''</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">parts</span> <span class="o">=</span> <span class="nx">value</span><span class="p">.</span><span class="nx">split</span><span class="p">(</span><span class="s1">','</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">lat</span> <span class="o">=</span> <span class="nb">parseFloat</span><span class="p">(</span><span class="nx">parts</span><span class="p">[</span><span class="mi">0</span><span class="p">]);</span>
|
||||
<span class="kd">var</span> <span class="nx">lon</span> <span class="o">=</span> <span class="nb">parseFloat</span><span class="p">(</span><span class="nx">parts</span><span class="p">[</span><span class="mi">1</span><span class="p">]);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nb">isNaN</span><span class="p">(</span><span class="nx">lon</span><span class="p">)</span> <span class="o">&&</span> <span class="o">!</span><span class="nb">isNaN</span><span class="p">(</span><span class="nb">parseFloat</span><span class="p">(</span><span class="nx">lat</span><span class="p">)))</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{</span>
|
||||
<span class="s2">"type"</span><span class="o">:</span> <span class="s2">"Point"</span><span class="p">,</span>
|
||||
<span class="s2">"coordinates"</span><span class="o">:</span> <span class="p">[</span><span class="nx">lon</span><span class="p">,</span> <span class="nx">lat</span><span class="p">]</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="kc">null</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">value</span> <span class="o">&&</span> <span class="nx">value</span><span class="p">.</span><span class="nx">slice</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-17"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-17">¶</a> </div> <p>[ lon, lat ]</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="p">{</span>
|
||||
<span class="s2">"type"</span><span class="o">:</span> <span class="s2">"Point"</span><span class="p">,</span>
|
||||
<span class="s2">"coordinates"</span><span class="o">:</span> <span class="p">[</span><span class="nx">value</span><span class="p">[</span><span class="mi">0</span><span class="p">],</span> <span class="nx">value</span><span class="p">[</span><span class="mi">1</span><span class="p">]]</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">value</span> <span class="o">&&</span> <span class="nx">value</span><span class="p">.</span><span class="nx">lat</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-18"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-18">¶</a> </div> <p>of form { lat: ..., lon: ...}</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="p">{</span>
|
||||
<span class="s2">"type"</span><span class="o">:</span> <span class="s2">"Point"</span><span class="p">,</span>
|
||||
<span class="s2">"coordinates"</span><span class="o">:</span> <span class="p">[</span><span class="nx">value</span><span class="p">.</span><span class="nx">lon</span> <span class="o">||</span> <span class="nx">value</span><span class="p">.</span><span class="nx">lng</span><span class="p">,</span> <span class="nx">value</span><span class="p">.</span><span class="nx">lat</span><span class="p">]</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-19"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-19">¶</a> </div> <p>We o/w assume that contents of the field are a valid GeoJSON object</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="nx">value</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'lonField'</span><span class="p">)</span> <span class="o">&&</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'latField'</span><span class="p">)){</span></pre></div> </td> </tr> <tr id="section-20"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-20">¶</a> </div> <p>We'll create a GeoJSON like point object from the two lat/lon fields</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">lon</span> <span class="o">=</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'lonField'</span><span class="p">));</span>
|
||||
<span class="kd">var</span> <span class="nx">lat</span> <span class="o">=</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'latField'</span><span class="p">));</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nb">isNaN</span><span class="p">(</span><span class="nb">parseFloat</span><span class="p">(</span><span class="nx">lon</span><span class="p">))</span> <span class="o">&&</span> <span class="o">!</span><span class="nb">isNaN</span><span class="p">(</span><span class="nb">parseFloat</span><span class="p">(</span><span class="nx">lat</span><span class="p">)))</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{</span>
|
||||
<span class="nx">type</span><span class="o">:</span> <span class="s1">'Point'</span><span class="p">,</span>
|
||||
<span class="nx">coordinates</span><span class="o">:</span> <span class="p">[</span><span class="nx">lon</span><span class="p">,</span><span class="nx">lat</span><span class="p">]</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="kc">null</span><span class="p">;</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-21"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-21">¶</a> </div> <p>Private: Check if there is a field with GeoJSON geometries or alternatively,
|
||||
two fields with lat/lon values.</p>
|
||||
|
||||
<p>If not found, the user can define them via the UI form.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_setupGeometryField</span><span class="o">:</span> <span class="kd">function</span><span class="p">(){</span></pre></div> </td> </tr> <tr id="section-22"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-22">¶</a> </div> <p>should not overwrite if we have already set this (e.g. explicitly via state)</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">_geomReady</span><span class="p">())</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span>
|
||||
<span class="nx">geomField</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">_checkField</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">geometryFieldNames</span><span class="p">),</span>
|
||||
<span class="nx">latField</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">_checkField</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">latitudeFieldNames</span><span class="p">),</span>
|
||||
<span class="nx">lonField</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">_checkField</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">longitudeFieldNames</span><span class="p">)</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">set</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">());</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-23"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-23">¶</a> </div> <p>Private: Check if a field in the current model exists in the provided
|
||||
list of names.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_checkField</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">fieldNames</span><span class="p">){</span>
|
||||
<span class="kd">var</span> <span class="nx">field</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">modelFieldNames</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">pluck</span><span class="p">(</span><span class="s1">'id'</span><span class="p">);</span>
|
||||
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span> <span class="nx">i</span> <span class="o"><</span> <span class="nx">fieldNames</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="nx">i</span><span class="o">++</span><span class="p">){</span>
|
||||
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">j</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span> <span class="nx">j</span> <span class="o"><</span> <span class="nx">modelFieldNames</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="nx">j</span><span class="o">++</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">modelFieldNames</span><span class="p">[</span><span class="nx">j</span><span class="p">].</span><span class="nx">toLowerCase</span><span class="p">()</span> <span class="o">==</span> <span class="nx">fieldNames</span><span class="p">[</span><span class="nx">i</span><span class="p">].</span><span class="nx">toLowerCase</span><span class="p">())</span>
|
||||
<span class="k">return</span> <span class="nx">modelFieldNames</span><span class="p">[</span><span class="nx">j</span><span class="p">];</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="kc">null</span><span class="p">;</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-24"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-24">¶</a> </div> <p>Private: Zoom to map to current features extent if any, or to the full
|
||||
extent if none.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_zoomToFeatures</span><span class="o">:</span> <span class="kd">function</span><span class="p">(){</span>
|
||||
<span class="kd">var</span> <span class="nx">bounds</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">features</span><span class="p">.</span><span class="nx">getBounds</span><span class="p">();</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">bounds</span><span class="p">){</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">map</span><span class="p">.</span><span class="nx">fitBounds</span><span class="p">(</span><span class="nx">bounds</span><span class="p">);</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">map</span><span class="p">.</span><span class="nx">setView</span><span class="p">(</span><span class="k">new</span> <span class="nx">L</span><span class="p">.</span><span class="nx">LatLng</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="mi">0</span><span class="p">),</span> <span class="mi">2</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-25"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-25">¶</a> </div> <p>Private: Sets up the Leaflet map control and the features layer.</p>
|
||||
|
||||
<p>The map uses a base layer from <a href="http://www.mapquest.com">MapQuest</a> based
|
||||
on <a href="http://openstreetmap.org">OpenStreetMap</a>.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_setupMap</span><span class="o">:</span> <span class="kd">function</span><span class="p">(){</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">map</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">L</span><span class="p">.</span><span class="nx">Map</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">$map</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="mi">0</span><span class="p">));</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">mapUrl</span> <span class="o">=</span> <span class="s2">"http://otile{s}.mqcdn.com/tiles/1.0.0/osm/{z}/{x}/{y}.png"</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">osmAttribution</span> <span class="o">=</span> <span class="s1">'Map data &copy; 2011 OpenStreetMap contributors, Tiles Courtesy of <a href="http://www.mapquest.com/" target="_blank">MapQuest</a> <img src="http://developer.mapquest.com/content/osm/mq_logo.png">'</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">bg</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">L</span><span class="p">.</span><span class="nx">TileLayer</span><span class="p">(</span><span class="nx">mapUrl</span><span class="p">,</span> <span class="p">{</span><span class="nx">maxZoom</span><span class="o">:</span> <span class="mi">18</span><span class="p">,</span> <span class="nx">attribution</span><span class="o">:</span> <span class="nx">osmAttribution</span> <span class="p">,</span><span class="nx">subdomains</span><span class="o">:</span> <span class="s1">'1234'</span><span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">map</span><span class="p">.</span><span class="nx">addLayer</span><span class="p">(</span><span class="nx">bg</span><span class="p">);</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">features</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">L</span><span class="p">.</span><span class="nx">GeoJSON</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">features</span><span class="p">.</span><span class="nx">on</span><span class="p">(</span><span class="s1">'featureparse'</span><span class="p">,</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">properties</span> <span class="o">&&</span> <span class="nx">e</span><span class="p">.</span><span class="nx">properties</span><span class="p">.</span><span class="nx">popupContent</span><span class="p">){</span>
|
||||
<span class="nx">e</span><span class="p">.</span><span class="nx">layer</span><span class="p">.</span><span class="nx">bindPopup</span><span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">properties</span><span class="p">.</span><span class="nx">popupContent</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">properties</span> <span class="o">&&</span> <span class="nx">e</span><span class="p">.</span><span class="nx">properties</span><span class="p">.</span><span class="nx">cid</span><span class="p">){</span>
|
||||
<span class="nx">e</span><span class="p">.</span><span class="nx">layer</span><span class="p">.</span><span class="nx">cid</span> <span class="o">=</span> <span class="nx">e</span><span class="p">.</span><span class="nx">properties</span><span class="p">.</span><span class="nx">cid</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-26"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-26">¶</a> </div> <p>This will be available in the next Leaflet stable release.
|
||||
In the meantime we add it manually to our layer.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">features</span><span class="p">.</span><span class="nx">getBounds</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(){</span>
|
||||
<span class="kd">var</span> <span class="nx">bounds</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">L</span><span class="p">.</span><span class="nx">LatLngBounds</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_iterateLayers</span><span class="p">(</span><span class="kd">function</span> <span class="p">(</span><span class="nx">layer</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">layer</span> <span class="k">instanceof</span> <span class="nx">L</span><span class="p">.</span><span class="nx">Marker</span><span class="p">){</span>
|
||||
<span class="nx">bounds</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span><span class="nx">layer</span><span class="p">.</span><span class="nx">getLatLng</span><span class="p">());</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">layer</span><span class="p">.</span><span class="nx">getBounds</span><span class="p">){</span>
|
||||
<span class="nx">bounds</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span><span class="nx">layer</span><span class="p">.</span><span class="nx">getBounds</span><span class="p">().</span><span class="nx">getNorthEast</span><span class="p">());</span>
|
||||
<span class="nx">bounds</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span><span class="nx">layer</span><span class="p">.</span><span class="nx">getBounds</span><span class="p">().</span><span class="nx">getSouthWest</span><span class="p">());</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span> <span class="k">this</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="p">(</span><span class="k">typeof</span> <span class="nx">bounds</span><span class="p">.</span><span class="nx">getNorthEast</span><span class="p">()</span> <span class="o">!==</span> <span class="s1">'undefined'</span><span class="p">)</span> <span class="o">?</span> <span class="nx">bounds</span> <span class="o">:</span> <span class="kc">null</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">map</span><span class="p">.</span><span class="nx">addLayer</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">features</span><span class="p">);</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">map</span><span class="p">.</span><span class="nx">setView</span><span class="p">(</span><span class="k">new</span> <span class="nx">L</span><span class="p">.</span><span class="nx">LatLng</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="mi">0</span><span class="p">),</span> <span class="mi">2</span><span class="p">);</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">mapReady</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-27"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-27">¶</a> </div> <p>Private: Helper function to select an option from a select list</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_selectOption</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">id</span><span class="p">,</span><span class="nx">value</span><span class="p">){</span>
|
||||
<span class="kd">var</span> <span class="nx">options</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="s1">'.'</span> <span class="o">+</span> <span class="nx">id</span> <span class="o">+</span> <span class="s1">' > select > option'</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">options</span><span class="p">){</span>
|
||||
<span class="nx">options</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">opt</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">value</span> <span class="o">==</span> <span class="nx">value</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">).</span><span class="nx">attr</span><span class="p">(</span><span class="s1">'selected'</span><span class="p">,</span><span class="s1">'selected'</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="kc">false</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
|
||||
<span class="nx">my</span><span class="p">.</span><span class="nx">MapMenu</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">View</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">className</span><span class="o">:</span> <span class="s1">'editor'</span><span class="p">,</span>
|
||||
|
||||
<span class="nx">template</span><span class="o">:</span> <span class="s1">' \</span>
|
||||
<span class="s1"> <form class="form-stacked"> \</span>
|
||||
<span class="s1"> <div class="clearfix"> \</span>
|
||||
<span class="s1"> <div class="editor-field-type"> \</span>
|
||||
@ -80,309 +368,82 @@ have the following (optional) configuration options:</p>
|
||||
<span class="s1"> <input type="hidden" class="editor-id" value="map-1" /> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> </form> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"><div class="panel map"> \</span>
|
||||
<span class="s1"></div> \</span>
|
||||
<span class="s1">'</span><span class="p">,</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <p>These are the default (case-insensitive) names of field that are used if found.
|
||||
If not found, the user will need to define the fields via the editor.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">latitudeFieldNames</span><span class="o">:</span> <span class="p">[</span><span class="s1">'lat'</span><span class="p">,</span><span class="s1">'latitude'</span><span class="p">],</span>
|
||||
<span class="nx">longitudeFieldNames</span><span class="o">:</span> <span class="p">[</span><span class="s1">'lon'</span><span class="p">,</span><span class="s1">'longitude'</span><span class="p">],</span>
|
||||
<span class="nx">geometryFieldNames</span><span class="o">:</span> <span class="p">[</span><span class="s1">'geom'</span><span class="p">,</span><span class="s1">'the_geom'</span><span class="p">,</span><span class="s1">'geometry'</span><span class="p">,</span><span class="s1">'spatial'</span><span class="p">,</span><span class="s1">'location'</span><span class="p">],</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-4">¶</a> </div> <p>Define here events for UI elements</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">events</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="s1">'</span><span class="p">,</span></pre></div> </td> </tr> <tr id="section-28"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-28">¶</a> </div> <p>Define here events for UI elements</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">events</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="s1">'click .editor-update-map'</span><span class="o">:</span> <span class="s1">'onEditorSubmit'</span><span class="p">,</span>
|
||||
<span class="s1">'change .editor-field-type'</span><span class="o">:</span> <span class="s1">'onFieldTypeChange'</span><span class="p">,</span>
|
||||
<span class="s1">'change #editor-auto-zoom'</span><span class="o">:</span> <span class="s1">'onAutoZoomChange'</span>
|
||||
<span class="s1">'click #editor-auto-zoom'</span><span class="o">:</span> <span class="s1">'onAutoZoomChange'</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">initialize</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <p>Listen to changes in the fields</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'change'</span><span class="p">,</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">_setupGeometryField</span><span class="p">();</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'add'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'reset'</span><span class="p">,</span> <span class="kd">function</span><span class="p">(){</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">_setupGeometryField</span><span class="p">()</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">render</span><span class="p">()</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <p>Listen to changes in the documents</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'add'</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">){</span><span class="nx">self</span><span class="p">.</span><span class="nx">redraw</span><span class="p">(</span><span class="s1">'add'</span><span class="p">,</span><span class="nx">doc</span><span class="p">)});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'change'</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">){</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">redraw</span><span class="p">(</span><span class="s1">'remove'</span><span class="p">,</span><span class="nx">doc</span><span class="p">);</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">redraw</span><span class="p">(</span><span class="s1">'add'</span><span class="p">,</span><span class="nx">doc</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'remove'</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">){</span><span class="nx">self</span><span class="p">.</span><span class="nx">redraw</span><span class="p">(</span><span class="s1">'remove'</span><span class="p">,</span><span class="nx">doc</span><span class="p">)});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'reset'</span><span class="p">,</span> <span class="kd">function</span><span class="p">(){</span><span class="nx">self</span><span class="p">.</span><span class="nx">redraw</span><span class="p">(</span><span class="s1">'reset'</span><span class="p">)});</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'view:show'</span><span class="p">,</span><span class="kd">function</span><span class="p">(){</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <p>If the div was hidden, Leaflet needs to recalculate some sizes
|
||||
to display properly</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">map</span><span class="p">){</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">map</span><span class="p">.</span><span class="nx">invalidateSize</span><span class="p">();</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">_zoomPending</span> <span class="o">&&</span> <span class="nx">self</span><span class="p">.</span><span class="nx">autoZoom</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">_zoomToFeatures</span><span class="p">();</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">_zoomPending</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">visible</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'view:hide'</span><span class="p">,</span><span class="kd">function</span><span class="p">(){</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">visible</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">stateData</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">geomField</span><span class="o">:</span> <span class="kc">null</span><span class="p">,</span>
|
||||
<span class="nx">lonField</span><span class="o">:</span> <span class="kc">null</span><span class="p">,</span>
|
||||
<span class="nx">latField</span><span class="o">:</span> <span class="kc">null</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">options</span><span class="p">.</span><span class="nx">state</span>
|
||||
<span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">state</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">ObjectState</span><span class="p">(</span><span class="nx">stateData</span><span class="p">);</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">autoZoom</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">mapReady</span> <span class="o">=</span> <span class="kc">false</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">);</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">bindAll</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="s1">'render'</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'change'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">state</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">ObjectState</span><span class="p">(</span><span class="nx">options</span><span class="p">.</span><span class="nx">state</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'change'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">();</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">¶</a> </div> <h3>Public: Adds the necessary elements to the page.</h3>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-29"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-29">¶</a> </div> <h3>Public: Adds the necessary elements to the page.</h3>
|
||||
|
||||
<p>Also sets up the editor fields and the map if necessary.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">render</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
|
||||
<span class="nx">htmls</span> <span class="o">=</span> <span class="nx">Mustache</span><span class="p">.</span><span class="nx">render</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">template</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">toTemplateJSON</span><span class="p">());</span>
|
||||
|
||||
<span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">).</span><span class="nx">html</span><span class="p">(</span><span class="nx">htmls</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">$map</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.panel.map'</span><span class="p">);</span>
|
||||
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">geomReady</span> <span class="o">&&</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">length</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">_geomReady</span><span class="p">()</span> <span class="o">&&</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">length</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'geomField'</span><span class="p">)){</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_selectOption</span><span class="p">(</span><span class="s1">'editor-geom-field'</span><span class="p">,</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'geomField'</span><span class="p">));</span>
|
||||
<span class="nx">$</span><span class="p">(</span><span class="s1">'#editor-field-type-geom'</span><span class="p">).</span><span class="nx">attr</span><span class="p">(</span><span class="s1">'checked'</span><span class="p">,</span><span class="s1">'checked'</span><span class="p">).</span><span class="nx">change</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'#editor-field-type-geom'</span><span class="p">).</span><span class="nx">attr</span><span class="p">(</span><span class="s1">'checked'</span><span class="p">,</span><span class="s1">'checked'</span><span class="p">).</span><span class="nx">change</span><span class="p">();</span>
|
||||
<span class="p">}</span> <span class="k">else</span><span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_selectOption</span><span class="p">(</span><span class="s1">'editor-lon-field'</span><span class="p">,</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'lonField'</span><span class="p">));</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_selectOption</span><span class="p">(</span><span class="s1">'editor-lat-field'</span><span class="p">,</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'latField'</span><span class="p">));</span>
|
||||
<span class="nx">$</span><span class="p">(</span><span class="s1">'#editor-field-type-latlon'</span><span class="p">).</span><span class="nx">attr</span><span class="p">(</span><span class="s1">'checked'</span><span class="p">,</span><span class="s1">'checked'</span><span class="p">).</span><span class="nx">change</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'#editor-field-type-latlon'</span><span class="p">).</span><span class="nx">attr</span><span class="p">(</span><span class="s1">'checked'</span><span class="p">,</span><span class="s1">'checked'</span><span class="p">).</span><span class="nx">change</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'autoZoom'</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'#editor-auto-zoom'</span><span class="p">).</span><span class="nx">attr</span><span class="p">(</span><span class="s1">'checked'</span><span class="p">,</span> <span class="s1">'checked'</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'#editor-auto-zoom'</span><span class="p">).</span><span class="nx">removeAttr</span><span class="p">(</span><span class="s1">'checked'</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-9">¶</a> </div> <h3>Public: Redraws the features on the map according to the action provided</h3>
|
||||
<span class="p">},</span>
|
||||
|
||||
<p>Actions can be:</p>
|
||||
|
||||
<ul>
|
||||
<li>reset: Clear all features</li>
|
||||
<li>add: Add one or n features (documents)</li>
|
||||
<li>remove: Remove one or n features (documents)</li>
|
||||
<li>refresh: Clear existing features and add all current documents</li>
|
||||
</ul> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">redraw</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">action</span><span class="p">,</span> <span class="nx">doc</span><span class="p">){</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="nx">action</span> <span class="o">=</span> <span class="nx">action</span> <span class="o">||</span> <span class="s1">'refresh'</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">¶</a> </div> <p>try to set things up if not already</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">self</span><span class="p">.</span><span class="nx">geomReady</span><span class="p">){</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">_setupGeometryField</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">self</span><span class="p">.</span><span class="nx">mapReady</span><span class="p">){</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">_setupMap</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">geomReady</span> <span class="o">&&</span> <span class="k">this</span><span class="p">.</span><span class="nx">mapReady</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">action</span> <span class="o">==</span> <span class="s1">'reset'</span> <span class="o">||</span> <span class="nx">action</span> <span class="o">==</span> <span class="s1">'refresh'</span><span class="p">){</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">features</span><span class="p">.</span><span class="nx">clearLayers</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_add</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">currentDocuments</span><span class="p">.</span><span class="nx">models</span><span class="p">);</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">action</span> <span class="o">==</span> <span class="s1">'add'</span> <span class="o">&&</span> <span class="nx">doc</span><span class="p">){</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_add</span><span class="p">(</span><span class="nx">doc</span><span class="p">);</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">action</span> <span class="o">==</span> <span class="s1">'remove'</span> <span class="o">&&</span> <span class="nx">doc</span><span class="p">){</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_remove</span><span class="p">(</span><span class="nx">doc</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">autoZoom</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">visible</span><span class="p">){</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_zoomToFeatures</span><span class="p">();</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_zoomPending</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-11">¶</a> </div> <p>UI Event handlers</p> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-12">¶</a> </div> <p>Public: Update map with user options</p>
|
||||
<span class="nx">_geomReady</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nb">Boolean</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'geomField'</span><span class="p">)</span> <span class="o">||</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'latField'</span><span class="p">)</span> <span class="o">&&</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'lonField'</span><span class="p">)));</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-30"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-30">¶</a> </div> <h2>UI Event handlers</h2> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="section-31"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-31">¶</a> </div> <p>Public: Update map with user options</p>
|
||||
|
||||
<p>Right now the only configurable option is what field(s) contains the
|
||||
location information.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">onEditorSubmit</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">){</span>
|
||||
<span class="nx">e</span><span class="p">.</span><span class="nx">preventDefault</span><span class="p">();</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">$</span><span class="p">(</span><span class="s1">'#editor-field-type-geom'</span><span class="p">).</span><span class="nx">attr</span><span class="p">(</span><span class="s1">'checked'</span><span class="p">)){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'#editor-field-type-geom'</span><span class="p">).</span><span class="nx">attr</span><span class="p">(</span><span class="s1">'checked'</span><span class="p">)){</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span>
|
||||
<span class="nx">geomField</span><span class="o">:</span> <span class="nx">$</span><span class="p">(</span><span class="s1">'.editor-geom-field > select > option:selected'</span><span class="p">).</span><span class="nx">val</span><span class="p">(),</span>
|
||||
<span class="nx">geomField</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.editor-geom-field > select > option:selected'</span><span class="p">).</span><span class="nx">val</span><span class="p">(),</span>
|
||||
<span class="nx">lonField</span><span class="o">:</span> <span class="kc">null</span><span class="p">,</span>
|
||||
<span class="nx">latField</span><span class="o">:</span> <span class="kc">null</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span>
|
||||
<span class="nx">geomField</span><span class="o">:</span> <span class="kc">null</span><span class="p">,</span>
|
||||
<span class="nx">lonField</span><span class="o">:</span> <span class="nx">$</span><span class="p">(</span><span class="s1">'.editor-lon-field > select > option:selected'</span><span class="p">).</span><span class="nx">val</span><span class="p">(),</span>
|
||||
<span class="nx">latField</span><span class="o">:</span> <span class="nx">$</span><span class="p">(</span><span class="s1">'.editor-lat-field > select > option:selected'</span><span class="p">).</span><span class="nx">val</span><span class="p">()</span>
|
||||
<span class="nx">lonField</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.editor-lon-field > select > option:selected'</span><span class="p">).</span><span class="nx">val</span><span class="p">(),</span>
|
||||
<span class="nx">latField</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.editor-lat-field > select > option:selected'</span><span class="p">).</span><span class="nx">val</span><span class="p">()</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">geomReady</span> <span class="o">=</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'geomField'</span><span class="p">)</span> <span class="o">||</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'latField'</span><span class="p">)</span> <span class="o">&&</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'lonField'</span><span class="p">)));</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">redraw</span><span class="p">();</span>
|
||||
|
||||
<span class="k">return</span> <span class="kc">false</span><span class="p">;</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-13">¶</a> </div> <p>Public: Shows the relevant select lists depending on the location field
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-32"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-32">¶</a> </div> <p>Public: Shows the relevant select lists depending on the location field
|
||||
type selected.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">onFieldTypeChange</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">target</span><span class="p">.</span><span class="nx">value</span> <span class="o">==</span> <span class="s1">'geom'</span><span class="p">){</span>
|
||||
<span class="nx">$</span><span class="p">(</span><span class="s1">'.editor-field-type-geom'</span><span class="p">).</span><span class="nx">show</span><span class="p">();</span>
|
||||
<span class="nx">$</span><span class="p">(</span><span class="s1">'.editor-field-type-latlon'</span><span class="p">).</span><span class="nx">hide</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.editor-field-type-geom'</span><span class="p">).</span><span class="nx">show</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.editor-field-type-latlon'</span><span class="p">).</span><span class="nx">hide</span><span class="p">();</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">$</span><span class="p">(</span><span class="s1">'.editor-field-type-geom'</span><span class="p">).</span><span class="nx">hide</span><span class="p">();</span>
|
||||
<span class="nx">$</span><span class="p">(</span><span class="s1">'.editor-field-type-latlon'</span><span class="p">).</span><span class="nx">show</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.editor-field-type-geom'</span><span class="p">).</span><span class="nx">hide</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.editor-field-type-latlon'</span><span class="p">).</span><span class="nx">show</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">onAutoZoomChange</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">){</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">autoZoom</span> <span class="o">=</span> <span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">autoZoom</span><span class="p">;</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-14"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-14">¶</a> </div> <p>Private: Add one or n features to the map</p>
|
||||
|
||||
<p>For each document passed, a GeoJSON geometry will be extracted and added
|
||||
to the features layer. If an exception is thrown, the process will be
|
||||
stopped and an error notification shown.</p>
|
||||
|
||||
<p>Each feature will have a popup associated with all the document fields.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_add</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">docs</span><span class="p">){</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="p">(</span><span class="nx">docs</span> <span class="k">instanceof</span> <span class="nb">Array</span><span class="p">))</span> <span class="nx">docs</span> <span class="o">=</span> <span class="p">[</span><span class="nx">docs</span><span class="p">];</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">count</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">wrongSoFar</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">every</span><span class="p">(</span><span class="nx">docs</span><span class="p">,</span><span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">){</span>
|
||||
<span class="nx">count</span> <span class="o">+=</span> <span class="mi">1</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">feature</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">_getGeometryFromDocument</span><span class="p">(</span><span class="nx">doc</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">typeof</span> <span class="nx">feature</span> <span class="o">===</span> <span class="s1">'undefined'</span> <span class="o">||</span> <span class="nx">feature</span> <span class="o">===</span> <span class="kc">null</span><span class="p">){</span></pre></div> </td> </tr> <tr id="section-15"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-15">¶</a> </div> <p>Empty field</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="kc">true</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">feature</span> <span class="k">instanceof</span> <span class="nb">Object</span><span class="p">){</span></pre></div> </td> </tr> <tr id="section-16"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-16">¶</a> </div> <p>Build popup contents
|
||||
TODO: mustache?</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">html</span> <span class="o">=</span> <span class="s1">''</span>
|
||||
<span class="k">for</span> <span class="p">(</span><span class="nx">key</span> <span class="k">in</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">attributes</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'geomField'</span><span class="p">)</span> <span class="o">&&</span> <span class="nx">key</span> <span class="o">==</span> <span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'geomField'</span><span class="p">))){</span>
|
||||
<span class="nx">html</span> <span class="o">+=</span> <span class="s1">'<div><strong>'</span> <span class="o">+</span> <span class="nx">key</span> <span class="o">+</span> <span class="s1">'</strong>: '</span><span class="o">+</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">attributes</span><span class="p">[</span><span class="nx">key</span><span class="p">]</span> <span class="o">+</span> <span class="s1">'</div>'</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">feature</span><span class="p">.</span><span class="nx">properties</span> <span class="o">=</span> <span class="p">{</span><span class="nx">popupContent</span><span class="o">:</span> <span class="nx">html</span><span class="p">};</span></pre></div> </td> </tr> <tr id="section-17"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-17">¶</a> </div> <p>Add a reference to the model id, which will allow us to
|
||||
link this Leaflet layer to a Recline doc</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">feature</span><span class="p">.</span><span class="nx">properties</span><span class="p">.</span><span class="nx">cid</span> <span class="o">=</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">cid</span><span class="p">;</span>
|
||||
|
||||
<span class="k">try</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">features</span><span class="p">.</span><span class="nx">addGeoJSON</span><span class="p">(</span><span class="nx">feature</span><span class="p">);</span>
|
||||
<span class="p">}</span> <span class="k">catch</span> <span class="p">(</span><span class="nx">except</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">wrongSoFar</span> <span class="o">+=</span> <span class="mi">1</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">msg</span> <span class="o">=</span> <span class="s1">'Wrong geometry value'</span><span class="p">;</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">except</span><span class="p">.</span><span class="nx">message</span><span class="p">)</span> <span class="nx">msg</span> <span class="o">+=</span> <span class="s1">' ('</span> <span class="o">+</span> <span class="nx">except</span><span class="p">.</span><span class="nx">message</span> <span class="o">+</span> <span class="s1">')'</span><span class="p">;</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">wrongSoFar</span> <span class="o"><=</span> <span class="mi">10</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'recline:flash'</span><span class="p">,</span> <span class="p">{</span><span class="nx">message</span><span class="o">:</span> <span class="nx">msg</span><span class="p">,</span> <span class="nx">category</span><span class="o">:</span><span class="s1">'error'</span><span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">wrongSoFar</span> <span class="o">+=</span> <span class="mi">1</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">wrongSoFar</span> <span class="o"><=</span> <span class="mi">10</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'recline:flash'</span><span class="p">,</span> <span class="p">{</span><span class="nx">message</span><span class="o">:</span> <span class="s1">'Wrong geometry value'</span><span class="p">,</span> <span class="nx">category</span><span class="o">:</span><span class="s1">'error'</span><span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="kc">true</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-18"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-18">¶</a> </div> <p>Private: Remove one or n features to the map</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_remove</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">docs</span><span class="p">){</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="p">(</span><span class="nx">docs</span> <span class="k">instanceof</span> <span class="nb">Array</span><span class="p">))</span> <span class="nx">docs</span> <span class="o">=</span> <span class="p">[</span><span class="nx">docs</span><span class="p">];</span>
|
||||
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">docs</span><span class="p">,</span><span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">){</span>
|
||||
<span class="k">for</span> <span class="p">(</span><span class="nx">key</span> <span class="k">in</span> <span class="nx">self</span><span class="p">.</span><span class="nx">features</span><span class="p">.</span><span class="nx">_layers</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">features</span><span class="p">.</span><span class="nx">_layers</span><span class="p">[</span><span class="nx">key</span><span class="p">].</span><span class="nx">cid</span> <span class="o">==</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">cid</span><span class="p">){</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">features</span><span class="p">.</span><span class="nx">removeLayer</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">features</span><span class="p">.</span><span class="nx">_layers</span><span class="p">[</span><span class="nx">key</span><span class="p">]);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-19"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-19">¶</a> </div> <p>Private: Return a GeoJSON geomtry extracted from the document fields</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_getGeometryFromDocument</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">doc</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">geomReady</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'geomField'</span><span class="p">)){</span>
|
||||
<span class="kd">var</span> <span class="nx">value</span> <span class="o">=</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'geomField'</span><span class="p">));</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">typeof</span><span class="p">(</span><span class="nx">value</span><span class="p">)</span> <span class="o">===</span> <span class="s1">'string'</span><span class="p">){</span></pre></div> </td> </tr> <tr id="section-20"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-20">¶</a> </div> <p>We <em>may</em> have a GeoJSON string representation</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">try</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">$</span><span class="p">.</span><span class="nx">parseJSON</span><span class="p">(</span><span class="nx">value</span><span class="p">);</span>
|
||||
<span class="p">}</span> <span class="k">catch</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-21"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-21">¶</a> </div> <p>We assume that the contents of the field are a valid GeoJSON object</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="nx">value</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'lonField'</span><span class="p">)</span> <span class="o">&&</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'latField'</span><span class="p">)){</span></pre></div> </td> </tr> <tr id="section-22"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-22">¶</a> </div> <p>We'll create a GeoJSON like point object from the two lat/lon fields</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">lon</span> <span class="o">=</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'lonField'</span><span class="p">));</span>
|
||||
<span class="kd">var</span> <span class="nx">lat</span> <span class="o">=</span> <span class="nx">doc</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'latField'</span><span class="p">));</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nb">isNaN</span><span class="p">(</span><span class="nb">parseFloat</span><span class="p">(</span><span class="nx">lon</span><span class="p">))</span> <span class="o">&&</span> <span class="o">!</span><span class="nb">isNaN</span><span class="p">(</span><span class="nb">parseFloat</span><span class="p">(</span><span class="nx">lat</span><span class="p">)))</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{</span>
|
||||
<span class="nx">type</span><span class="o">:</span> <span class="s1">'Point'</span><span class="p">,</span>
|
||||
<span class="nx">coordinates</span><span class="o">:</span> <span class="p">[</span><span class="nx">lon</span><span class="p">,</span><span class="nx">lat</span><span class="p">]</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="kc">null</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-23"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-23">¶</a> </div> <p>Private: Check if there is a field with GeoJSON geometries or alternatively,
|
||||
two fields with lat/lon values.</p>
|
||||
|
||||
<p>If not found, the user can define them via the UI form.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_setupGeometryField</span><span class="o">:</span> <span class="kd">function</span><span class="p">(){</span>
|
||||
<span class="kd">var</span> <span class="nx">geomField</span><span class="p">,</span> <span class="nx">latField</span><span class="p">,</span> <span class="nx">lonField</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">geomReady</span> <span class="o">=</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'geomField'</span><span class="p">)</span> <span class="o">||</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'latField'</span><span class="p">)</span> <span class="o">&&</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'lonField'</span><span class="p">)));</span></pre></div> </td> </tr> <tr id="section-24"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-24">¶</a> </div> <p>should not overwrite if we have already set this (e.g. explicitly via state)</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">geomReady</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span>
|
||||
<span class="nx">geomField</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">_checkField</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">geometryFieldNames</span><span class="p">),</span>
|
||||
<span class="nx">latField</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">_checkField</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">latitudeFieldNames</span><span class="p">),</span>
|
||||
<span class="nx">lonField</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">_checkField</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">longitudeFieldNames</span><span class="p">)</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">geomReady</span> <span class="o">=</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'geomField'</span><span class="p">)</span> <span class="o">||</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'latField'</span><span class="p">)</span> <span class="o">&&</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'lonField'</span><span class="p">)));</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-25"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-25">¶</a> </div> <p>Private: Check if a field in the current model exists in the provided
|
||||
list of names.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_checkField</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">fieldNames</span><span class="p">){</span>
|
||||
<span class="kd">var</span> <span class="nx">field</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">modelFieldNames</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">pluck</span><span class="p">(</span><span class="s1">'id'</span><span class="p">);</span>
|
||||
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">i</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span> <span class="nx">i</span> <span class="o"><</span> <span class="nx">fieldNames</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="nx">i</span><span class="o">++</span><span class="p">){</span>
|
||||
<span class="k">for</span> <span class="p">(</span><span class="kd">var</span> <span class="nx">j</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span> <span class="nx">j</span> <span class="o"><</span> <span class="nx">modelFieldNames</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span> <span class="nx">j</span><span class="o">++</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">modelFieldNames</span><span class="p">[</span><span class="nx">j</span><span class="p">].</span><span class="nx">toLowerCase</span><span class="p">()</span> <span class="o">==</span> <span class="nx">fieldNames</span><span class="p">[</span><span class="nx">i</span><span class="p">].</span><span class="nx">toLowerCase</span><span class="p">())</span>
|
||||
<span class="k">return</span> <span class="nx">modelFieldNames</span><span class="p">[</span><span class="nx">j</span><span class="p">];</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="kc">null</span><span class="p">;</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-26"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-26">¶</a> </div> <p>Private: Zoom to map to current features extent if any, or to the full
|
||||
extent if none.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_zoomToFeatures</span><span class="o">:</span> <span class="kd">function</span><span class="p">(){</span>
|
||||
<span class="kd">var</span> <span class="nx">bounds</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">features</span><span class="p">.</span><span class="nx">getBounds</span><span class="p">();</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">bounds</span><span class="p">){</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">map</span><span class="p">.</span><span class="nx">fitBounds</span><span class="p">(</span><span class="nx">bounds</span><span class="p">);</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">map</span><span class="p">.</span><span class="nx">setView</span><span class="p">(</span><span class="k">new</span> <span class="nx">L</span><span class="p">.</span><span class="nx">LatLng</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="mi">0</span><span class="p">),</span> <span class="mi">2</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-27"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-27">¶</a> </div> <p>Private: Sets up the Leaflet map control and the features layer.</p>
|
||||
|
||||
<p>The map uses a base layer from <a href="http://www.mapquest.com">MapQuest</a> based
|
||||
on <a href="http://openstreetmap.org">OpenStreetMap</a>.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_setupMap</span><span class="o">:</span> <span class="kd">function</span><span class="p">(){</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">map</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">L</span><span class="p">.</span><span class="nx">Map</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">$map</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="mi">0</span><span class="p">));</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">mapUrl</span> <span class="o">=</span> <span class="s2">"http://otile{s}.mqcdn.com/tiles/1.0.0/osm/{z}/{x}/{y}.png"</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">osmAttribution</span> <span class="o">=</span> <span class="s1">'Map data &copy; 2011 OpenStreetMap contributors, Tiles Courtesy of <a href="http://www.mapquest.com/" target="_blank">MapQuest</a> <img src="http://developer.mapquest.com/content/osm/mq_logo.png">'</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">bg</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">L</span><span class="p">.</span><span class="nx">TileLayer</span><span class="p">(</span><span class="nx">mapUrl</span><span class="p">,</span> <span class="p">{</span><span class="nx">maxZoom</span><span class="o">:</span> <span class="mi">18</span><span class="p">,</span> <span class="nx">attribution</span><span class="o">:</span> <span class="nx">osmAttribution</span> <span class="p">,</span><span class="nx">subdomains</span><span class="o">:</span> <span class="s1">'1234'</span><span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">map</span><span class="p">.</span><span class="nx">addLayer</span><span class="p">(</span><span class="nx">bg</span><span class="p">);</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">features</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">L</span><span class="p">.</span><span class="nx">GeoJSON</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">features</span><span class="p">.</span><span class="nx">on</span><span class="p">(</span><span class="s1">'featureparse'</span><span class="p">,</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">properties</span> <span class="o">&&</span> <span class="nx">e</span><span class="p">.</span><span class="nx">properties</span><span class="p">.</span><span class="nx">popupContent</span><span class="p">){</span>
|
||||
<span class="nx">e</span><span class="p">.</span><span class="nx">layer</span><span class="p">.</span><span class="nx">bindPopup</span><span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">properties</span><span class="p">.</span><span class="nx">popupContent</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">properties</span> <span class="o">&&</span> <span class="nx">e</span><span class="p">.</span><span class="nx">properties</span><span class="p">.</span><span class="nx">cid</span><span class="p">){</span>
|
||||
<span class="nx">e</span><span class="p">.</span><span class="nx">layer</span><span class="p">.</span><span class="nx">cid</span> <span class="o">=</span> <span class="nx">e</span><span class="p">.</span><span class="nx">properties</span><span class="p">.</span><span class="nx">cid</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-28"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-28">¶</a> </div> <p>This will be available in the next Leaflet stable release.
|
||||
In the meantime we add it manually to our layer.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">features</span><span class="p">.</span><span class="nx">getBounds</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(){</span>
|
||||
<span class="kd">var</span> <span class="nx">bounds</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">L</span><span class="p">.</span><span class="nx">LatLngBounds</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_iterateLayers</span><span class="p">(</span><span class="kd">function</span> <span class="p">(</span><span class="nx">layer</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">layer</span> <span class="k">instanceof</span> <span class="nx">L</span><span class="p">.</span><span class="nx">Marker</span><span class="p">){</span>
|
||||
<span class="nx">bounds</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span><span class="nx">layer</span><span class="p">.</span><span class="nx">getLatLng</span><span class="p">());</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">layer</span><span class="p">.</span><span class="nx">getBounds</span><span class="p">){</span>
|
||||
<span class="nx">bounds</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span><span class="nx">layer</span><span class="p">.</span><span class="nx">getBounds</span><span class="p">().</span><span class="nx">getNorthEast</span><span class="p">());</span>
|
||||
<span class="nx">bounds</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span><span class="nx">layer</span><span class="p">.</span><span class="nx">getBounds</span><span class="p">().</span><span class="nx">getSouthWest</span><span class="p">());</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span> <span class="k">this</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="p">(</span><span class="k">typeof</span> <span class="nx">bounds</span><span class="p">.</span><span class="nx">getNorthEast</span><span class="p">()</span> <span class="o">!==</span> <span class="s1">'undefined'</span><span class="p">)</span> <span class="o">?</span> <span class="nx">bounds</span> <span class="o">:</span> <span class="kc">null</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">map</span><span class="p">.</span><span class="nx">addLayer</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">features</span><span class="p">);</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">map</span><span class="p">.</span><span class="nx">setView</span><span class="p">(</span><span class="k">new</span> <span class="nx">L</span><span class="p">.</span><span class="nx">LatLng</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="mi">0</span><span class="p">),</span> <span class="mi">2</span><span class="p">);</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">mapReady</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-29"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-29">¶</a> </div> <p>Private: Helper function to select an option from a select list</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_selectOption</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">id</span><span class="p">,</span><span class="nx">value</span><span class="p">){</span>
|
||||
<span class="kd">var</span> <span class="nx">options</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="s1">'.'</span> <span class="o">+</span> <span class="nx">id</span> <span class="o">+</span> <span class="s1">' > select > option'</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span><span class="nx">autoZoom</span><span class="o">:</span> <span class="o">!</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'autoZoom'</span><span class="p">)});</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-33"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-33">¶</a> </div> <p>Private: Helper function to select an option from a select list</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_selectOption</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">id</span><span class="p">,</span><span class="nx">value</span><span class="p">){</span>
|
||||
<span class="kd">var</span> <span class="nx">options</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.'</span> <span class="o">+</span> <span class="nx">id</span> <span class="o">+</span> <span class="s1">' > select > option'</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">options</span><span class="p">){</span>
|
||||
<span class="nx">options</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">opt</span><span class="p">){</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">value</span> <span class="o">==</span> <span class="nx">value</span><span class="p">)</span> <span class="p">{</span>
|
||||
@ -392,8 +453,7 @@ In the meantime we add it manually to our layer.</p> </td>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="p">});</span>
|
||||
<span class="p">});</span>
|
||||
|
||||
<span class="p">})(</span><span class="nx">jQuery</span><span class="p">,</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">View</span><span class="p">);</span>
|
||||
|
||||
410
docs/src/view.multiview.html
Normal file
410
docs/src/view.multiview.html
Normal file
@ -0,0 +1,410 @@
|
||||
<!DOCTYPE html> <html> <head> <title>view.multiview.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="backend.couchdb.html"> backend.couchdb.js </a> <a class="source" href="backend.csv.html"> backend.csv.js </a> <a class="source" href="backend.dataproxy.html"> backend.dataproxy.js </a> <a class="source" href="backend.elasticsearch.html"> backend.elasticsearch.js </a> <a class="source" href="backend.gdocs.html"> backend.gdocs.js </a> <a class="source" href="backend.memory.html"> backend.memory.js </a> <a class="source" href="costco.html"> costco.js </a> <a class="source" href="model.html"> model.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="view.transform.html"> view.transform.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> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> view.multiview.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> </td> <td class="code"> <div class="highlight"><pre><span class="cm">/*jshint multistr:true */</span></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <p>Standard JS module setup</p> </td> <td class="code"> <div class="highlight"><pre><span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">View</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">View</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
|
||||
<span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">$</span><span class="p">,</span> <span class="nx">my</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <h2>MultiView</h2>
|
||||
|
||||
<p>Manage multiple views together along with query editor etc. Usage:</p>
|
||||
|
||||
<pre>
|
||||
var myExplorer = new model.recline.MultiView({
|
||||
model: {{recline.Model.Dataset instance}}
|
||||
el: {{an existing dom element}}
|
||||
views: {{dataset views}}
|
||||
state: {{state configuration -- see below}}
|
||||
});
|
||||
</pre>
|
||||
|
||||
<h3>Parameters</h3>
|
||||
|
||||
<p><strong>model</strong>: (required) recline.model.Dataset instance.</p>
|
||||
|
||||
<p><strong>el</strong>: (required) DOM element to bind to. NB: the element already
|
||||
being in the DOM is important for rendering of some subviews (e.g.
|
||||
Graph).</p>
|
||||
|
||||
<p><strong>views</strong>: (optional) the dataset views (Grid, Graph etc) for
|
||||
MultiView to show. This is an array of view hashes. If not provided
|
||||
initialize with (recline.View.)Grid, Graph, and Map views (with obvious id
|
||||
and labels!).</p>
|
||||
|
||||
<pre>
|
||||
var views = [
|
||||
{
|
||||
id: 'grid', // used for routing
|
||||
label: 'Grid', // used for view switcher
|
||||
view: new recline.View.Grid({
|
||||
model: dataset
|
||||
})
|
||||
},
|
||||
{
|
||||
id: 'graph',
|
||||
label: 'Graph',
|
||||
view: new recline.View.Graph({
|
||||
model: dataset
|
||||
})
|
||||
}
|
||||
];
|
||||
</pre>
|
||||
|
||||
<p><strong>state</strong>: standard state config for this view. This state is slightly
|
||||
special as it includes config of many of the subviews.</p>
|
||||
|
||||
<pre>
|
||||
state = {
|
||||
query: {dataset query state - see dataset.queryState object}
|
||||
view-{id1}: {view-state for this view}
|
||||
view-{id2}: {view-state for }
|
||||
...
|
||||
// Explorer
|
||||
currentView: id of current view (defaults to first view if not specified)
|
||||
readOnly: (default: false) run in read-only mode
|
||||
}
|
||||
</pre>
|
||||
|
||||
<p>Note that at present we do <em>not</em> serialize information about the actual set
|
||||
of views in use -- e.g. those specified by the views argument -- but instead
|
||||
expect either that the default views are fine or that the client to have
|
||||
initialized the MultiView with the relevant views themselves.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">MultiView</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">View</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">template</span><span class="o">:</span> <span class="s1">' \</span>
|
||||
<span class="s1"> <div class="recline-data-explorer"> \</span>
|
||||
<span class="s1"> <div class="alert-messages"></div> \</span>
|
||||
<span class="s1"> \</span>
|
||||
<span class="s1"> <div class="header"> \</span>
|
||||
<span class="s1"> <div class="navigation"> \</span>
|
||||
<span class="s1"> <div class="btn-group" data-toggle="buttons-radio"> \</span>
|
||||
<span class="s1"> {{#views}} \</span>
|
||||
<span class="s1"> <a href="#{{id}}" data-view="{{id}}" class="btn">{{label}}</a> \</span>
|
||||
<span class="s1"> {{/views}} \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> <div class="recline-results-info"> \</span>
|
||||
<span class="s1"> Results found <span class="doc-count">{{docCount}}</span> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> <div class="menu-right"> \</span>
|
||||
<span class="s1"> <div class="btn-group" data-toggle="buttons-checkbox"> \</span>
|
||||
<span class="s1"> <a href="#" class="btn active" data-action="filters">Filters</a> \</span>
|
||||
<span class="s1"> <a href="#" class="btn active" data-action="fields">Fields</a> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> <div class="query-editor-here" style="display:inline;"></div> \</span>
|
||||
<span class="s1"> <div class="clearfix"></div> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> <div class="data-view-sidebar"></div> \</span>
|
||||
<span class="s1"> <div class="data-view-container"></div> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> '</span><span class="p">,</span>
|
||||
<span class="nx">events</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="s1">'click .menu-right a'</span><span class="o">:</span> <span class="s1">'_onMenuClick'</span><span class="p">,</span>
|
||||
<span class="s1">'click .navigation a'</span><span class="o">:</span> <span class="s1">'_onSwitchView'</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">initialize</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_setupState</span><span class="p">(</span><span class="nx">options</span><span class="p">.</span><span class="nx">state</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-4">¶</a> </div> <p>Hash of 'page' views (i.e. those for whole page) keyed by page name</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">options</span><span class="p">.</span><span class="nx">views</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">pageViews</span> <span class="o">=</span> <span class="nx">options</span><span class="p">.</span><span class="nx">views</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">pageViews</span> <span class="o">=</span> <span class="p">[{</span>
|
||||
<span class="nx">id</span><span class="o">:</span> <span class="s1">'grid'</span><span class="p">,</span>
|
||||
<span class="nx">label</span><span class="o">:</span> <span class="s1">'Grid'</span><span class="p">,</span>
|
||||
<span class="nx">view</span><span class="o">:</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Grid</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">,</span>
|
||||
<span class="nx">state</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'view-grid'</span><span class="p">)</span>
|
||||
<span class="p">}),</span>
|
||||
<span class="p">},</span> <span class="p">{</span>
|
||||
<span class="nx">id</span><span class="o">:</span> <span class="s1">'graph'</span><span class="p">,</span>
|
||||
<span class="nx">label</span><span class="o">:</span> <span class="s1">'Graph'</span><span class="p">,</span>
|
||||
<span class="nx">view</span><span class="o">:</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Graph</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">,</span>
|
||||
<span class="nx">state</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'view-graph'</span><span class="p">)</span>
|
||||
<span class="p">}),</span>
|
||||
<span class="p">},</span> <span class="p">{</span>
|
||||
<span class="nx">id</span><span class="o">:</span> <span class="s1">'map'</span><span class="p">,</span>
|
||||
<span class="nx">label</span><span class="o">:</span> <span class="s1">'Map'</span><span class="p">,</span>
|
||||
<span class="nx">view</span><span class="o">:</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Map</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">,</span>
|
||||
<span class="nx">state</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'view-map'</span><span class="p">)</span>
|
||||
<span class="p">}),</span>
|
||||
<span class="p">},</span> <span class="p">{</span>
|
||||
<span class="nx">id</span><span class="o">:</span> <span class="s1">'timeline'</span><span class="p">,</span>
|
||||
<span class="nx">label</span><span class="o">:</span> <span class="s1">'Timeline'</span><span class="p">,</span>
|
||||
<span class="nx">view</span><span class="o">:</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Timeline</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">,</span>
|
||||
<span class="nx">state</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'view-timeline'</span><span class="p">)</span>
|
||||
<span class="p">}),</span>
|
||||
<span class="p">}];</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <p>these must be called after pageViews are created</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_bindStateChanges</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_bindFlashNotifications</span><span class="p">();</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <p>now do updates based on state (need to come after render)</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'readOnly'</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">setReadOnly</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'currentView'</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">updateNav</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'currentView'</span><span class="p">));</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">updateNav</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">pageViews</span><span class="p">[</span><span class="mi">0</span><span class="p">].</span><span class="nx">id</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'query:start'</span><span class="p">,</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">notify</span><span class="p">({</span><span class="nx">loader</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span> <span class="nx">persist</span><span class="o">:</span> <span class="kc">true</span><span class="p">});</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'query:done'</span><span class="p">,</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">clearNotifications</span><span class="p">();</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.doc-count'</span><span class="p">).</span><span class="nx">text</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">docCount</span> <span class="o">||</span> <span class="s1">'Unknown'</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'query:fail'</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">error</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">clearNotifications</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">msg</span> <span class="o">=</span> <span class="s1">''</span><span class="p">;</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">typeof</span><span class="p">(</span><span class="nx">error</span><span class="p">)</span> <span class="o">==</span> <span class="s1">'string'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">msg</span> <span class="o">=</span> <span class="nx">error</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="k">typeof</span><span class="p">(</span><span class="nx">error</span><span class="p">)</span> <span class="o">==</span> <span class="s1">'object'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">error</span><span class="p">.</span><span class="nx">title</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">msg</span> <span class="o">=</span> <span class="nx">error</span><span class="p">.</span><span class="nx">title</span> <span class="o">+</span> <span class="s1">': '</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">error</span><span class="p">.</span><span class="nx">message</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">msg</span> <span class="o">+=</span> <span class="nx">error</span><span class="p">.</span><span class="nx">message</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">msg</span> <span class="o">=</span> <span class="s1">'There was an error querying the backend'</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">notify</span><span class="p">({</span><span class="nx">message</span><span class="o">:</span> <span class="nx">msg</span><span class="p">,</span> <span class="nx">category</span><span class="o">:</span> <span class="s1">'error'</span><span class="p">,</span> <span class="nx">persist</span><span class="o">:</span> <span class="kc">true</span><span class="p">});</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <p>retrieve basic data like fields etc
|
||||
note this.model and dataset returned are the same
|
||||
TODO: set query state ...?</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">queryState</span><span class="p">.</span><span class="nx">set</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'query'</span><span class="p">),</span> <span class="p">{</span><span class="nx">silent</span><span class="o">:</span> <span class="kc">true</span><span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fetch</span><span class="p">()</span>
|
||||
<span class="p">.</span><span class="nx">fail</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">error</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">notify</span><span class="p">({</span><span class="nx">message</span><span class="o">:</span> <span class="nx">error</span><span class="p">.</span><span class="nx">message</span><span class="p">,</span> <span class="nx">category</span><span class="o">:</span> <span class="s1">'error'</span><span class="p">,</span> <span class="nx">persist</span><span class="o">:</span> <span class="kc">true</span><span class="p">});</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">setReadOnly</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">addClass</span><span class="p">(</span><span class="s1">'recline-read-only'</span><span class="p">);</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">render</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">tmplData</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">toTemplateJSON</span><span class="p">();</span>
|
||||
<span class="nx">tmplData</span><span class="p">.</span><span class="nx">views</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">pageViews</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">template</span> <span class="o">=</span> <span class="nx">Mustache</span><span class="p">.</span><span class="nx">render</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">template</span><span class="p">,</span> <span class="nx">tmplData</span><span class="p">);</span>
|
||||
<span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">).</span><span class="nx">html</span><span class="p">(</span><span class="nx">template</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">¶</a> </div> <p>now create and append other views</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">$dataViewContainer</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.data-view-container'</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">$dataSidebar</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.data-view-sidebar'</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-9">¶</a> </div> <p>the main views</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">pageViews</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">view</span><span class="p">,</span> <span class="nx">pageName</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">$dataViewContainer</span><span class="p">.</span><span class="nx">append</span><span class="p">(</span><span class="nx">view</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">el</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">view</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">elSidebar</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">$dataSidebar</span><span class="p">.</span><span class="nx">append</span><span class="p">(</span><span class="nx">view</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">elSidebar</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">pager</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">View</span><span class="p">.</span><span class="nx">Pager</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">queryState</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.recline-results-info'</span><span class="p">).</span><span class="nx">after</span><span class="p">(</span><span class="nx">pager</span><span class="p">.</span><span class="nx">el</span><span class="p">);</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">queryEditor</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">View</span><span class="p">.</span><span class="nx">QueryEditor</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">queryState</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.query-editor-here'</span><span class="p">).</span><span class="nx">append</span><span class="p">(</span><span class="nx">queryEditor</span><span class="p">.</span><span class="nx">el</span><span class="p">);</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">filterEditor</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">View</span><span class="p">.</span><span class="nx">FilterEditor</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">$filterEditor</span> <span class="o">=</span> <span class="nx">filterEditor</span><span class="p">.</span><span class="nx">el</span><span class="p">;</span>
|
||||
<span class="nx">$dataSidebar</span><span class="p">.</span><span class="nx">append</span><span class="p">(</span><span class="nx">filterEditor</span><span class="p">.</span><span class="nx">el</span><span class="p">);</span>
|
||||
|
||||
<span class="kd">var</span> <span class="nx">fieldsView</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">View</span><span class="p">.</span><span class="nx">Fields</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">$fieldsView</span> <span class="o">=</span> <span class="nx">fieldsView</span><span class="p">.</span><span class="nx">el</span><span class="p">;</span>
|
||||
<span class="nx">$dataSidebar</span><span class="p">.</span><span class="nx">append</span><span class="p">(</span><span class="nx">fieldsView</span><span class="p">.</span><span class="nx">el</span><span class="p">);</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">updateNav</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">pageName</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.navigation a'</span><span class="p">).</span><span class="nx">removeClass</span><span class="p">(</span><span class="s1">'active'</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">$el</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.navigation a[data-view="'</span> <span class="o">+</span> <span class="nx">pageName</span> <span class="o">+</span> <span class="s1">'"]'</span><span class="p">);</span>
|
||||
<span class="nx">$el</span><span class="p">.</span><span class="nx">addClass</span><span class="p">(</span><span class="s1">'active'</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">¶</a> </div> <p>show the specific page</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">pageViews</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">view</span><span class="p">,</span> <span class="nx">idx</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">view</span><span class="p">.</span><span class="nx">id</span> <span class="o">===</span> <span class="nx">pageName</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">view</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">show</span><span class="p">();</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">view</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">elSidebar</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">view</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">elSidebar</span><span class="p">.</span><span class="nx">show</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">view</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'view:show'</span><span class="p">);</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">view</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">hide</span><span class="p">();</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">view</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">elSidebar</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">view</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">elSidebar</span><span class="p">.</span><span class="nx">hide</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">view</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'view:hide'</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">_onMenuClick</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">e</span><span class="p">.</span><span class="nx">preventDefault</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">action</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">target</span><span class="p">).</span><span class="nx">attr</span><span class="p">(</span><span class="s1">'data-action'</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">action</span> <span class="o">===</span> <span class="s1">'filters'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">$filterEditor</span><span class="p">.</span><span class="nx">toggle</span><span class="p">();</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">action</span> <span class="o">===</span> <span class="s1">'fields'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">$fieldsView</span><span class="p">.</span><span class="nx">toggle</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">_onSwitchView</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">e</span><span class="p">.</span><span class="nx">preventDefault</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">viewName</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">target</span><span class="p">).</span><span class="nx">attr</span><span class="p">(</span><span class="s1">'data-view'</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">updateNav</span><span class="p">(</span><span class="nx">viewName</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span><span class="nx">currentView</span><span class="o">:</span> <span class="nx">viewName</span><span class="p">});</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-11">¶</a> </div> <p>create a state object for this view and do the job of</p>
|
||||
|
||||
<p>a) initializing it from both data passed in and other sources (e.g. hash url)</p>
|
||||
|
||||
<p>b) ensure the state object is updated in responese to changes in subviews, query etc.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_setupState</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">initialState</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-12">¶</a> </div> <p>get data from the query string / hash url plus some defaults</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">qs</span> <span class="o">=</span> <span class="nx">my</span><span class="p">.</span><span class="nx">parseHashQueryString</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">query</span> <span class="o">=</span> <span class="nx">qs</span><span class="p">.</span><span class="nx">reclineQuery</span><span class="p">;</span>
|
||||
<span class="nx">query</span> <span class="o">=</span> <span class="nx">query</span> <span class="o">?</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">parse</span><span class="p">(</span><span class="nx">query</span><span class="p">)</span> <span class="o">:</span> <span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">queryState</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">();</span></pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-13">¶</a> </div> <p>backwards compatability (now named view-graph but was named graph)</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">graphState</span> <span class="o">=</span> <span class="nx">qs</span><span class="p">[</span><span class="s1">'view-graph'</span><span class="p">]</span> <span class="o">||</span> <span class="nx">qs</span><span class="p">.</span><span class="nx">graph</span><span class="p">;</span>
|
||||
<span class="nx">graphState</span> <span class="o">=</span> <span class="nx">graphState</span> <span class="o">?</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">parse</span><span class="p">(</span><span class="nx">graphState</span><span class="p">)</span> <span class="o">:</span> <span class="p">{};</span></pre></div> </td> </tr> <tr id="section-14"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-14">¶</a> </div> <p>now get default data + hash url plus initial state and initial our state object with it</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">stateData</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">query</span><span class="o">:</span> <span class="nx">query</span><span class="p">,</span>
|
||||
<span class="s1">'view-graph'</span><span class="o">:</span> <span class="nx">graphState</span><span class="p">,</span>
|
||||
<span class="nx">backend</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">backend</span><span class="p">.</span><span class="nx">__type__</span><span class="p">,</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'url'</span><span class="p">),</span>
|
||||
<span class="nx">currentView</span><span class="o">:</span> <span class="kc">null</span><span class="p">,</span>
|
||||
<span class="nx">readOnly</span><span class="o">:</span> <span class="kc">false</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">initialState</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">state</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">ObjectState</span><span class="p">(</span><span class="nx">stateData</span><span class="p">);</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">_bindStateChanges</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-15"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-15">¶</a> </div> <p>finally ensure we update our state object when state of sub-object changes so that state is always up to date</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">queryState</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'change'</span><span class="p">,</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span><span class="nx">query</span><span class="o">:</span> <span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">queryState</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">()});</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">pageViews</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">pageView</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">pageView</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">state</span> <span class="o">&&</span> <span class="nx">pageView</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">bind</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">update</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="nx">update</span><span class="p">[</span><span class="s1">'view-'</span> <span class="o">+</span> <span class="nx">pageView</span><span class="p">.</span><span class="nx">id</span><span class="p">]</span> <span class="o">=</span> <span class="nx">pageView</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">();</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">set</span><span class="p">(</span><span class="nx">update</span><span class="p">);</span>
|
||||
<span class="nx">pageView</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'change'</span><span class="p">,</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">update</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="nx">update</span><span class="p">[</span><span class="s1">'view-'</span> <span class="o">+</span> <span class="nx">pageView</span><span class="p">.</span><span class="nx">id</span><span class="p">]</span> <span class="o">=</span> <span class="nx">pageView</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">();</span></pre></div> </td> </tr> <tr id="section-16"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-16">¶</a> </div> <p>had problems where change not being triggered for e.g. grid view so let's do it explicitly</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">set</span><span class="p">(</span><span class="nx">update</span><span class="p">,</span> <span class="p">{</span><span class="nx">silent</span><span class="o">:</span> <span class="kc">true</span><span class="p">});</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'change'</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">_bindFlashNotifications</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">pageViews</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">pageView</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">pageView</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'recline:flash'</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">flash</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">notify</span><span class="p">(</span><span class="nx">flash</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-17"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-17">¶</a> </div> <h3>notify</h3>
|
||||
|
||||
<p>Create a notification (a div.alert in div.alert-messsages) using provided
|
||||
flash object. Flash attributes (all are optional):</p>
|
||||
|
||||
<ul>
|
||||
<li>message: message to show.</li>
|
||||
<li>category: warning (default), success, error</li>
|
||||
<li>persist: if true alert is persistent, o/w hidden after 3s (default = false)</li>
|
||||
<li>loader: if true show loading spinner</li>
|
||||
</ul> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">notify</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">flash</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">tmplData</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">message</span><span class="o">:</span> <span class="s1">'Loading'</span><span class="p">,</span>
|
||||
<span class="nx">category</span><span class="o">:</span> <span class="s1">'warning'</span><span class="p">,</span>
|
||||
<span class="nx">loader</span><span class="o">:</span> <span class="kc">false</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">flash</span>
|
||||
<span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">tmplData</span><span class="p">.</span><span class="nx">loader</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">_template</span> <span class="o">=</span> <span class="s1">' \</span>
|
||||
<span class="s1"> <div class="alert alert-info alert-loader"> \</span>
|
||||
<span class="s1"> {{message}} \</span>
|
||||
<span class="s1"> <span class="notification-loader">&nbsp;</span> \</span>
|
||||
<span class="s1"> </div>'</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">_template</span> <span class="o">=</span> <span class="s1">' \</span>
|
||||
<span class="s1"> <div class="alert alert-{{category}} fade in" data-alert="alert"><a class="close" data-dismiss="alert" href="#">×</a> \</span>
|
||||
<span class="s1"> {{message}} \</span>
|
||||
<span class="s1"> </div>'</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="kd">var</span> <span class="nx">_templated</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="nx">Mustache</span><span class="p">.</span><span class="nx">render</span><span class="p">(</span><span class="nx">_template</span><span class="p">,</span> <span class="nx">tmplData</span><span class="p">));</span>
|
||||
<span class="nx">_templated</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="nx">_templated</span><span class="p">).</span><span class="nx">appendTo</span><span class="p">(</span><span class="nx">$</span><span class="p">(</span><span class="s1">'.recline-data-explorer .alert-messages'</span><span class="p">));</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">flash</span><span class="p">.</span><span class="nx">persist</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">setTimeout</span><span class="p">(</span><span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">$</span><span class="p">(</span><span class="nx">_templated</span><span class="p">).</span><span class="nx">fadeOut</span><span class="p">(</span><span class="mi">1000</span><span class="p">,</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">).</span><span class="nx">remove</span><span class="p">();</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">},</span> <span class="mi">1000</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-18"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-18">¶</a> </div> <h3>clearNotifications</h3>
|
||||
|
||||
<p>Clear all existing notifications</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">clearNotifications</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">$notifications</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="s1">'.recline-data-explorer .alert-messages .alert'</span><span class="p">);</span>
|
||||
<span class="nx">$notifications</span><span class="p">.</span><span class="nx">fadeOut</span><span class="p">(</span><span class="mi">1500</span><span class="p">,</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">).</span><span class="nx">remove</span><span class="p">();</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-19"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-19">¶</a> </div> <h3>MultiView.restore</h3>
|
||||
|
||||
<p>Restore a MultiView instance from a serialized state including the associated dataset</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">MultiView</span><span class="p">.</span><span class="nx">restore</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">state</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dataset</span> <span class="o">=</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">Dataset</span><span class="p">.</span><span class="nx">restore</span><span class="p">(</span><span class="nx">state</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">explorer</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">MultiView</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="nx">dataset</span><span class="p">,</span>
|
||||
<span class="nx">state</span><span class="o">:</span> <span class="nx">state</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">explorer</span><span class="p">;</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-20"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-20">¶</a> </div> <h2>Miscellaneous Utilities</h2> </td> <td class="code"> <div class="highlight"><pre><span class="kd">var</span> <span class="nx">urlPathRegex</span> <span class="o">=</span> <span class="sr">/^([^?]+)(\?.*)?/</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-21"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-21">¶</a> </div> <p>Parse the Hash section of a URL into path and query string</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">parseHashUrl</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">hashUrl</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">parsed</span> <span class="o">=</span> <span class="nx">urlPathRegex</span><span class="p">.</span><span class="nx">exec</span><span class="p">(</span><span class="nx">hashUrl</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">parsed</span> <span class="o">===</span> <span class="kc">null</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{};</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{</span>
|
||||
<span class="nx">path</span><span class="o">:</span> <span class="nx">parsed</span><span class="p">[</span><span class="mi">1</span><span class="p">],</span>
|
||||
<span class="nx">query</span><span class="o">:</span> <span class="nx">parsed</span><span class="p">[</span><span class="mi">2</span><span class="p">]</span> <span class="o">||</span> <span class="s1">''</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-22"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-22">¶</a> </div> <p>Parse a URL query string (?xyz=abc...) into a dictionary.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">parseQueryString</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">q</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">q</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="p">{};</span>
|
||||
<span class="p">}</span>
|
||||
<span class="kd">var</span> <span class="nx">urlParams</span> <span class="o">=</span> <span class="p">{},</span>
|
||||
<span class="nx">e</span><span class="p">,</span> <span class="nx">d</span> <span class="o">=</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">s</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">unescape</span><span class="p">(</span><span class="nx">s</span><span class="p">.</span><span class="nx">replace</span><span class="p">(</span><span class="sr">/\+/g</span><span class="p">,</span> <span class="s2">" "</span><span class="p">));</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">r</span> <span class="o">=</span> <span class="sr">/([^&=]+)=?([^&]*)/g</span><span class="p">;</span>
|
||||
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">q</span> <span class="o">&&</span> <span class="nx">q</span><span class="p">.</span><span class="nx">length</span> <span class="o">&&</span> <span class="nx">q</span><span class="p">[</span><span class="mi">0</span><span class="p">]</span> <span class="o">===</span> <span class="s1">'?'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">q</span> <span class="o">=</span> <span class="nx">q</span><span class="p">.</span><span class="nx">slice</span><span class="p">(</span><span class="mi">1</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">while</span> <span class="p">(</span><span class="nx">e</span> <span class="o">=</span> <span class="nx">r</span><span class="p">.</span><span class="nx">exec</span><span class="p">(</span><span class="nx">q</span><span class="p">))</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-23"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-23">¶</a> </div> <p>TODO: have values be array as query string allow repetition of keys</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">urlParams</span><span class="p">[</span><span class="nx">d</span><span class="p">(</span><span class="nx">e</span><span class="p">[</span><span class="mi">1</span><span class="p">])]</span> <span class="o">=</span> <span class="nx">d</span><span class="p">(</span><span class="nx">e</span><span class="p">[</span><span class="mi">2</span><span class="p">]);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">urlParams</span><span class="p">;</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-24"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-24">¶</a> </div> <p>Parse the query string out of the URL hash</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">parseHashQueryString</span> <span class="o">=</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">q</span> <span class="o">=</span> <span class="nx">my</span><span class="p">.</span><span class="nx">parseHashUrl</span><span class="p">(</span><span class="nb">window</span><span class="p">.</span><span class="nx">location</span><span class="p">.</span><span class="nx">hash</span><span class="p">).</span><span class="nx">query</span><span class="p">;</span>
|
||||
<span class="k">return</span> <span class="nx">my</span><span class="p">.</span><span class="nx">parseQueryString</span><span class="p">(</span><span class="nx">q</span><span class="p">);</span>
|
||||
<span class="p">};</span></pre></div> </td> </tr> <tr id="section-25"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-25">¶</a> </div> <p>Compse a Query String</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">composeQueryString</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">queryParams</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">queryString</span> <span class="o">=</span> <span class="s1">'?'</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">items</span> <span class="o">=</span> <span class="p">[];</span>
|
||||
<span class="nx">$</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">queryParams</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">key</span><span class="p">,</span> <span class="nx">value</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">typeof</span><span class="p">(</span><span class="nx">value</span><span class="p">)</span> <span class="o">===</span> <span class="s1">'object'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">value</span> <span class="o">=</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">stringify</span><span class="p">(</span><span class="nx">value</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">items</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">key</span> <span class="o">+</span> <span class="s1">'='</span> <span class="o">+</span> <span class="nb">encodeURIComponent</span><span class="p">(</span><span class="nx">value</span><span class="p">));</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">queryString</span> <span class="o">+=</span> <span class="nx">items</span><span class="p">.</span><span class="nx">join</span><span class="p">(</span><span class="s1">'&'</span><span class="p">);</span>
|
||||
<span class="k">return</span> <span class="nx">queryString</span><span class="p">;</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="nx">my</span><span class="p">.</span><span class="nx">getNewHashForQueryString</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">queryParams</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">queryPart</span> <span class="o">=</span> <span class="nx">my</span><span class="p">.</span><span class="nx">composeQueryString</span><span class="p">(</span><span class="nx">queryParams</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nb">window</span><span class="p">.</span><span class="nx">location</span><span class="p">.</span><span class="nx">hash</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-26"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-26">¶</a> </div> <p>slice(1) to remove # at start</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">return</span> <span class="nb">window</span><span class="p">.</span><span class="nx">location</span><span class="p">.</span><span class="nx">hash</span><span class="p">.</span><span class="nx">split</span><span class="p">(</span><span class="s1">'?'</span><span class="p">)[</span><span class="mi">0</span><span class="p">].</span><span class="nx">slice</span><span class="p">(</span><span class="mi">1</span><span class="p">)</span> <span class="o">+</span> <span class="nx">queryPart</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">queryPart</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="nx">my</span><span class="p">.</span><span class="nx">setHashQueryString</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">queryParams</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nb">window</span><span class="p">.</span><span class="nx">location</span><span class="p">.</span><span class="nx">hash</span> <span class="o">=</span> <span class="nx">my</span><span class="p">.</span><span class="nx">getNewHashForQueryString</span><span class="p">(</span><span class="nx">queryParams</span><span class="p">);</span>
|
||||
<span class="p">};</span>
|
||||
|
||||
<span class="p">})(</span><span class="nx">jQuery</span><span class="p">,</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">View</span><span class="p">);</span>
|
||||
|
||||
</pre></div> </td> </tr> </tbody> </table> </div> </body> </html>
|
||||
657
docs/view.html
657
docs/view.html
@ -1,657 +0,0 @@
|
||||
<!DOCTYPE html> <html> <head> <title>view.js</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <link rel="stylesheet" media="all" href="docco.css" /> </head> <body> <div id="container"> <div id="background"></div> <div id="jump_to"> Jump To … <div id="jump_wrapper"> <div id="jump_page"> <a class="source" href="model.html"> model.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.html"> view.js </a> </div> </div> </div> <table cellpadding="0" cellspacing="0"> <thead> <tr> <th class="docs"> <h1> view.js </h1> </th> <th class="code"> </th> </tr> </thead> <tbody> <tr id="section-1"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-1">¶</a> </div> </td> <td class="code"> <div class="highlight"><pre><span class="cm">/*jshint multistr:true */</span></pre></div> </td> </tr> <tr id="section-2"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-2">¶</a> </div> <h1>Recline Views</h1>
|
||||
|
||||
<p>Recline Views are instances of Backbone Views and they act as 'WUI' (web
|
||||
user interface) component displaying some model object in the DOM. Like all
|
||||
Backbone views they have a pointer to a model (or a collection) and have an
|
||||
associated DOM-style element (usually this element will be bound into the
|
||||
page at some point).</p>
|
||||
|
||||
<p>Views provided by core Recline are crudely divided into two types:</p>
|
||||
|
||||
<ul>
|
||||
<li>Dataset Views: a View intended for displaying a recline.Model.Dataset
|
||||
in some fashion. Examples are the Grid, Graph and Map views.</li>
|
||||
<li>Widget Views: a widget used for displaying some specific (and
|
||||
smaller) aspect of a dataset or the application. Examples are
|
||||
QueryEditor and FilterEditor which both provide a way for editing (a
|
||||
part of) a <code>recline.Model.Query</code> associated to a Dataset.</li>
|
||||
</ul>
|
||||
|
||||
<h2>Dataset View</h2>
|
||||
|
||||
<p>These views are just Backbone views with a few additional conventions:</p>
|
||||
|
||||
<ol>
|
||||
<li>The model passed to the View should always be a recline.Model.Dataset instance</li>
|
||||
<li>Views should generate their own root element rather than having it passed
|
||||
in.</li>
|
||||
<li>Views should apply a css class named 'recline-{view-name-lower-cased} to
|
||||
the root element (and for all CSS for this view to be qualified using this
|
||||
CSS class)</li>
|
||||
<li>Read-only mode: CSS for this view should respect/utilize
|
||||
recline-read-only class to trigger read-only behaviour (this class will
|
||||
usually be set on some parent element of the view's root element.</li>
|
||||
<li><p>State: state (configuration) information for the view should be stored on
|
||||
an attribute named state that is an instance of a Backbone Model (or, more
|
||||
speficially, be an instance of <code>recline.Model.ObjectState</code>). In addition,
|
||||
a state attribute may be specified in the Hash passed to a View on
|
||||
iniitialization and this information should be used to set the initial
|
||||
state of the view.</p>
|
||||
|
||||
<p>Example of state would be the set of fields being plotted in a graph
|
||||
view.</p>
|
||||
|
||||
<p>More information about State can be found below.</p></li>
|
||||
</ol>
|
||||
|
||||
<p>To summarize some of this, the initialize function for a Dataset View should
|
||||
look like:</p>
|
||||
|
||||
<pre>
|
||||
initialize: {
|
||||
model: {a recline.Model.Dataset instance}
|
||||
// el: {do not specify - instead view should create}
|
||||
state: {(optional) Object / Hash specifying initial state}
|
||||
...
|
||||
}
|
||||
</pre>
|
||||
|
||||
<p>Note: Dataset Views in core Recline have a common layout on disk as
|
||||
follows, where ViewName is the named of View class:</p>
|
||||
|
||||
<pre>
|
||||
src/view-{lower-case-ViewName}.js
|
||||
css/{lower-case-ViewName}.css
|
||||
test/view-{lower-case-ViewName}.js
|
||||
</pre>
|
||||
|
||||
<h3>State</h3>
|
||||
|
||||
<p>State information exists in order to support state serialization into the
|
||||
url or elsewhere and reloading of application from a stored state.</p>
|
||||
|
||||
<p>State is available not only for individual views (as described above) but
|
||||
for the dataset (e.g. the current query). For an example of pulling together
|
||||
state from across multiple components see <code>recline.View.DataExplorer</code>.</p>
|
||||
|
||||
<h3>Flash Messages / Notifications</h3>
|
||||
|
||||
<p>To send 'flash messages' or notifications the convention is that views
|
||||
should fire an event named <code>recline:flash</code> with a payload that is a
|
||||
flash object with the following attributes (all optional):</p>
|
||||
|
||||
<ul>
|
||||
<li>message: message to show.</li>
|
||||
<li>category: warning (default), success, error</li>
|
||||
<li>persist: if true alert is persistent, o/w hidden after 3s (default=false)</li>
|
||||
<li>loader: if true show a loading message</li>
|
||||
</ul>
|
||||
|
||||
<p>Objects or views wishing to bind to flash messages may then subscribe to
|
||||
these events and take some action such as displaying them to the user. For
|
||||
an example of such behaviour see the DataExplorer view.</p>
|
||||
|
||||
<h3>Writing your own Views</h3>
|
||||
|
||||
<p>See the existing Views.</p>
|
||||
|
||||
<hr /> </td> <td class="code"> <div class="highlight"><pre></pre></div> </td> </tr> <tr id="section-3"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-3">¶</a> </div> <p>Standard JS module setup</p> </td> <td class="code"> <div class="highlight"><pre><span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">View</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">recline</span><span class="p">.</span><span class="nx">View</span> <span class="o">||</span> <span class="p">{};</span>
|
||||
|
||||
<span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">$</span><span class="p">,</span> <span class="nx">my</span><span class="p">)</span> <span class="p">{</span></pre></div> </td> </tr> <tr id="section-4"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-4">¶</a> </div> <h2>DataExplorer</h2>
|
||||
|
||||
<p>The primary view for the entire application. Usage:</p>
|
||||
|
||||
<pre>
|
||||
var myExplorer = new model.recline.DataExplorer({
|
||||
model: {{recline.Model.Dataset instance}}
|
||||
el: {{an existing dom element}}
|
||||
views: {{dataset views}}
|
||||
state: {{state configuration -- see below}}
|
||||
});
|
||||
</pre>
|
||||
|
||||
<h3>Parameters</h3>
|
||||
|
||||
<p><strong>model</strong>: (required) recline.model.Dataset instance.</p>
|
||||
|
||||
<p><strong>el</strong>: (required) DOM element to bind to. NB: the element already
|
||||
being in the DOM is important for rendering of some subviews (e.g.
|
||||
Graph).</p>
|
||||
|
||||
<p><strong>views</strong>: (optional) the dataset views (Grid, Graph etc) for
|
||||
DataExplorer to show. This is an array of view hashes. If not provided
|
||||
initialize with (recline.View.)Grid, Graph, and Map views (with obvious id
|
||||
and labels!).</p>
|
||||
|
||||
<pre>
|
||||
var views = [
|
||||
{
|
||||
id: 'grid', // used for routing
|
||||
label: 'Grid', // used for view switcher
|
||||
view: new recline.View.Grid({
|
||||
model: dataset
|
||||
})
|
||||
},
|
||||
{
|
||||
id: 'graph',
|
||||
label: 'Graph',
|
||||
view: new recline.View.Graph({
|
||||
model: dataset
|
||||
})
|
||||
}
|
||||
];
|
||||
</pre>
|
||||
|
||||
<p><strong>state</strong>: standard state config for this view. This state is slightly
|
||||
special as it includes config of many of the subviews.</p>
|
||||
|
||||
<pre>
|
||||
state = {
|
||||
query: {dataset query state - see dataset.queryState object}
|
||||
view-{id1}: {view-state for this view}
|
||||
view-{id2}: {view-state for }
|
||||
...
|
||||
// Explorer
|
||||
currentView: id of current view (defaults to first view if not specified)
|
||||
readOnly: (default: false) run in read-only mode
|
||||
}
|
||||
</pre>
|
||||
|
||||
<p>Note that at present we do <em>not</em> serialize information about the actual set
|
||||
of views in use -- e.g. those specified by the views argument -- but instead
|
||||
expect either that the default views are fine or that the client to have
|
||||
initialized the DataExplorer with the relevant views themselves.</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">DataExplorer</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">View</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">template</span><span class="o">:</span> <span class="s1">' \</span>
|
||||
<span class="s1"> <div class="recline-data-explorer"> \</span>
|
||||
<span class="s1"> <div class="alert-messages"></div> \</span>
|
||||
<span class="s1"> \</span>
|
||||
<span class="s1"> <div class="header"> \</span>
|
||||
<span class="s1"> <ul class="navigation"> \</span>
|
||||
<span class="s1"> {{#views}} \</span>
|
||||
<span class="s1"> <li><a href="#{{id}}" data-view="{{id}}" class="btn">{{label}}</a> \</span>
|
||||
<span class="s1"> {{/views}} \</span>
|
||||
<span class="s1"> </ul> \</span>
|
||||
<span class="s1"> <div class="recline-results-info"> \</span>
|
||||
<span class="s1"> Results found <span class="doc-count">{{docCount}}</span> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> <div class="menu-right"> \</span>
|
||||
<span class="s1"> <a href="#" class="btn" data-action="filters">Filters</a> \</span>
|
||||
<span class="s1"> <a href="#" class="btn" data-action="facets">Facets</a> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> <div class="query-editor-here" style="display:inline;"></div> \</span>
|
||||
<span class="s1"> <div class="clearfix"></div> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> <div class="data-view-container"></div> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> '</span><span class="p">,</span>
|
||||
<span class="nx">events</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="s1">'click .menu-right a'</span><span class="o">:</span> <span class="s1">'_onMenuClick'</span><span class="p">,</span>
|
||||
<span class="s1">'click .navigation a'</span><span class="o">:</span> <span class="s1">'_onSwitchView'</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">initialize</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">options</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_setupState</span><span class="p">(</span><span class="nx">options</span><span class="p">.</span><span class="nx">state</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-5"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-5">¶</a> </div> <p>Hash of 'page' views (i.e. those for whole page) keyed by page name</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="nx">options</span><span class="p">.</span><span class="nx">views</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">pageViews</span> <span class="o">=</span> <span class="nx">options</span><span class="p">.</span><span class="nx">views</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">pageViews</span> <span class="o">=</span> <span class="p">[{</span>
|
||||
<span class="nx">id</span><span class="o">:</span> <span class="s1">'grid'</span><span class="p">,</span>
|
||||
<span class="nx">label</span><span class="o">:</span> <span class="s1">'Grid'</span><span class="p">,</span>
|
||||
<span class="nx">view</span><span class="o">:</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Grid</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">,</span>
|
||||
<span class="nx">state</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'view-grid'</span><span class="p">)</span>
|
||||
<span class="p">}),</span>
|
||||
<span class="p">},</span> <span class="p">{</span>
|
||||
<span class="nx">id</span><span class="o">:</span> <span class="s1">'graph'</span><span class="p">,</span>
|
||||
<span class="nx">label</span><span class="o">:</span> <span class="s1">'Graph'</span><span class="p">,</span>
|
||||
<span class="nx">view</span><span class="o">:</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Graph</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">,</span>
|
||||
<span class="nx">state</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'view-graph'</span><span class="p">)</span>
|
||||
<span class="p">}),</span>
|
||||
<span class="p">},</span> <span class="p">{</span>
|
||||
<span class="nx">id</span><span class="o">:</span> <span class="s1">'map'</span><span class="p">,</span>
|
||||
<span class="nx">label</span><span class="o">:</span> <span class="s1">'Map'</span><span class="p">,</span>
|
||||
<span class="nx">view</span><span class="o">:</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Map</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">,</span>
|
||||
<span class="nx">state</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'view-map'</span><span class="p">)</span>
|
||||
<span class="p">}),</span>
|
||||
<span class="p">},</span> <span class="p">{</span>
|
||||
<span class="nx">id</span><span class="o">:</span> <span class="s1">'timeline'</span><span class="p">,</span>
|
||||
<span class="nx">label</span><span class="o">:</span> <span class="s1">'Timeline'</span><span class="p">,</span>
|
||||
<span class="nx">view</span><span class="o">:</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">Timeline</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">,</span>
|
||||
<span class="nx">state</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'view-timeline'</span><span class="p">)</span>
|
||||
<span class="p">}),</span>
|
||||
<span class="p">}];</span>
|
||||
<span class="p">}</span></pre></div> </td> </tr> <tr id="section-6"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-6">¶</a> </div> <p>these must be called after pageViews are created</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_bindStateChanges</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">_bindFlashNotifications</span><span class="p">();</span></pre></div> </td> </tr> <tr id="section-7"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-7">¶</a> </div> <p>now do updates based on state (need to come after render)</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'readOnly'</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">setReadOnly</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'currentView'</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">updateNav</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'currentView'</span><span class="p">));</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">updateNav</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">pageViews</span><span class="p">[</span><span class="mi">0</span><span class="p">].</span><span class="nx">id</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'query:start'</span><span class="p">,</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">notify</span><span class="p">({</span><span class="nx">loader</span><span class="o">:</span> <span class="kc">true</span><span class="p">,</span> <span class="nx">persist</span><span class="o">:</span> <span class="kc">true</span><span class="p">});</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'query:done'</span><span class="p">,</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">clearNotifications</span><span class="p">();</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.doc-count'</span><span class="p">).</span><span class="nx">text</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">docCount</span> <span class="o">||</span> <span class="s1">'Unknown'</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'query:fail'</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">error</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">clearNotifications</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">msg</span> <span class="o">=</span> <span class="s1">''</span><span class="p">;</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="k">typeof</span><span class="p">(</span><span class="nx">error</span><span class="p">)</span> <span class="o">==</span> <span class="s1">'string'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">msg</span> <span class="o">=</span> <span class="nx">error</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="k">typeof</span><span class="p">(</span><span class="nx">error</span><span class="p">)</span> <span class="o">==</span> <span class="s1">'object'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">error</span><span class="p">.</span><span class="nx">title</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">msg</span> <span class="o">=</span> <span class="nx">error</span><span class="p">.</span><span class="nx">title</span> <span class="o">+</span> <span class="s1">': '</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">error</span><span class="p">.</span><span class="nx">message</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">msg</span> <span class="o">+=</span> <span class="nx">error</span><span class="p">.</span><span class="nx">message</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">msg</span> <span class="o">=</span> <span class="s1">'There was an error querying the backend'</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">notify</span><span class="p">({</span><span class="nx">message</span><span class="o">:</span> <span class="nx">msg</span><span class="p">,</span> <span class="nx">category</span><span class="o">:</span> <span class="s1">'error'</span><span class="p">,</span> <span class="nx">persist</span><span class="o">:</span> <span class="kc">true</span><span class="p">});</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-8"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-8">¶</a> </div> <p>retrieve basic data like fields etc
|
||||
note this.model and dataset returned are the same</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fetch</span><span class="p">()</span>
|
||||
<span class="p">.</span><span class="nx">done</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">dataset</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">query</span><span class="p">(</span><span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'query'</span><span class="p">));</span>
|
||||
<span class="p">})</span>
|
||||
<span class="p">.</span><span class="nx">fail</span><span class="p">(</span><span class="kd">function</span><span class="p">(</span><span class="nx">error</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">notify</span><span class="p">({</span><span class="nx">message</span><span class="o">:</span> <span class="nx">error</span><span class="p">.</span><span class="nx">message</span><span class="p">,</span> <span class="nx">category</span><span class="o">:</span> <span class="s1">'error'</span><span class="p">,</span> <span class="nx">persist</span><span class="o">:</span> <span class="kc">true</span><span class="p">});</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">setReadOnly</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">addClass</span><span class="p">(</span><span class="s1">'recline-read-only'</span><span class="p">);</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">render</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">tmplData</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">toTemplateJSON</span><span class="p">();</span>
|
||||
<span class="nx">tmplData</span><span class="p">.</span><span class="nx">views</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">pageViews</span><span class="p">;</span>
|
||||
<span class="kd">var</span> <span class="nx">template</span> <span class="o">=</span> <span class="nx">Mustache</span><span class="p">.</span><span class="nx">render</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">template</span><span class="p">,</span> <span class="nx">tmplData</span><span class="p">);</span>
|
||||
<span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">).</span><span class="nx">html</span><span class="p">(</span><span class="nx">template</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">$dataViewContainer</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.data-view-container'</span><span class="p">);</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">pageViews</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">view</span><span class="p">,</span> <span class="nx">pageName</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">$dataViewContainer</span><span class="p">.</span><span class="nx">append</span><span class="p">(</span><span class="nx">view</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">el</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="kd">var</span> <span class="nx">queryEditor</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">QueryEditor</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">queryState</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.query-editor-here'</span><span class="p">).</span><span class="nx">append</span><span class="p">(</span><span class="nx">queryEditor</span><span class="p">.</span><span class="nx">el</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">filterEditor</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">FilterEditor</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">queryState</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">$filterEditor</span> <span class="o">=</span> <span class="nx">filterEditor</span><span class="p">.</span><span class="nx">el</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.header'</span><span class="p">).</span><span class="nx">append</span><span class="p">(</span><span class="nx">filterEditor</span><span class="p">.</span><span class="nx">el</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">facetViewer</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">FacetViewer</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">$facetViewer</span> <span class="o">=</span> <span class="nx">facetViewer</span><span class="p">.</span><span class="nx">el</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.header'</span><span class="p">).</span><span class="nx">append</span><span class="p">(</span><span class="nx">facetViewer</span><span class="p">.</span><span class="nx">el</span><span class="p">);</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">updateNav</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">pageName</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.navigation li'</span><span class="p">).</span><span class="nx">removeClass</span><span class="p">(</span><span class="s1">'active'</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.navigation li a'</span><span class="p">).</span><span class="nx">removeClass</span><span class="p">(</span><span class="s1">'disabled'</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">$el</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.navigation li a[data-view="'</span> <span class="o">+</span> <span class="nx">pageName</span> <span class="o">+</span> <span class="s1">'"]'</span><span class="p">);</span>
|
||||
<span class="nx">$el</span><span class="p">.</span><span class="nx">parent</span><span class="p">().</span><span class="nx">addClass</span><span class="p">(</span><span class="s1">'active'</span><span class="p">);</span>
|
||||
<span class="nx">$el</span><span class="p">.</span><span class="nx">addClass</span><span class="p">(</span><span class="s1">'disabled'</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-9"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-9">¶</a> </div> <p>show the specific page</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">pageViews</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">view</span><span class="p">,</span> <span class="nx">idx</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">view</span><span class="p">.</span><span class="nx">id</span> <span class="o">===</span> <span class="nx">pageName</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">view</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">show</span><span class="p">();</span>
|
||||
<span class="nx">view</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'view:show'</span><span class="p">);</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">view</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">hide</span><span class="p">();</span>
|
||||
<span class="nx">view</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'view:hide'</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">_onMenuClick</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">e</span><span class="p">.</span><span class="nx">preventDefault</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">action</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">target</span><span class="p">).</span><span class="nx">attr</span><span class="p">(</span><span class="s1">'data-action'</span><span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">action</span> <span class="o">===</span> <span class="s1">'filters'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">$filterEditor</span><span class="p">.</span><span class="nx">show</span><span class="p">();</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">action</span> <span class="o">===</span> <span class="s1">'facets'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">$facetViewer</span><span class="p">.</span><span class="nx">show</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">_onSwitchView</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">e</span><span class="p">.</span><span class="nx">preventDefault</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">viewName</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">target</span><span class="p">).</span><span class="nx">attr</span><span class="p">(</span><span class="s1">'data-view'</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">updateNav</span><span class="p">(</span><span class="nx">viewName</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span><span class="nx">currentView</span><span class="o">:</span> <span class="nx">viewName</span><span class="p">});</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-10"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-10">¶</a> </div> <p>create a state object for this view and do the job of</p>
|
||||
|
||||
<p>a) initializing it from both data passed in and other sources (e.g. hash url)</p>
|
||||
|
||||
<p>b) ensure the state object is updated in responese to changes in subviews, query etc.</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">_setupState</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">initialState</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-11"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-11">¶</a> </div> <p>get data from the query string / hash url plus some defaults</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">qs</span> <span class="o">=</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Util</span><span class="p">.</span><span class="nx">parseHashQueryString</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">query</span> <span class="o">=</span> <span class="nx">qs</span><span class="p">.</span><span class="nx">reclineQuery</span><span class="p">;</span>
|
||||
<span class="nx">query</span> <span class="o">=</span> <span class="nx">query</span> <span class="o">?</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">parse</span><span class="p">(</span><span class="nx">query</span><span class="p">)</span> <span class="o">:</span> <span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">queryState</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">();</span></pre></div> </td> </tr> <tr id="section-12"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-12">¶</a> </div> <p>backwards compatability (now named view-graph but was named graph)</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">graphState</span> <span class="o">=</span> <span class="nx">qs</span><span class="p">[</span><span class="s1">'view-graph'</span><span class="p">]</span> <span class="o">||</span> <span class="nx">qs</span><span class="p">.</span><span class="nx">graph</span><span class="p">;</span>
|
||||
<span class="nx">graphState</span> <span class="o">=</span> <span class="nx">graphState</span> <span class="o">?</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">parse</span><span class="p">(</span><span class="nx">graphState</span><span class="p">)</span> <span class="o">:</span> <span class="p">{};</span></pre></div> </td> </tr> <tr id="section-13"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-13">¶</a> </div> <p>now get default data + hash url plus initial state and initial our state object with it</p> </td> <td class="code"> <div class="highlight"><pre> <span class="kd">var</span> <span class="nx">stateData</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">query</span><span class="o">:</span> <span class="nx">query</span><span class="p">,</span>
|
||||
<span class="s1">'view-graph'</span><span class="o">:</span> <span class="nx">graphState</span><span class="p">,</span>
|
||||
<span class="nx">backend</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">backend</span><span class="p">.</span><span class="nx">__type__</span><span class="p">,</span>
|
||||
<span class="nx">url</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'url'</span><span class="p">),</span>
|
||||
<span class="nx">currentView</span><span class="o">:</span> <span class="kc">null</span><span class="p">,</span>
|
||||
<span class="nx">readOnly</span><span class="o">:</span> <span class="kc">false</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">initialState</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">state</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">ObjectState</span><span class="p">(</span><span class="nx">stateData</span><span class="p">);</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">_bindStateChanges</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span></pre></div> </td> </tr> <tr id="section-14"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-14">¶</a> </div> <p>finally ensure we update our state object when state of sub-object changes so that state is always up to date</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">queryState</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'change'</span><span class="p">,</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span><span class="nx">query</span><span class="o">:</span> <span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">queryState</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">()});</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">pageViews</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">pageView</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">pageView</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">state</span> <span class="o">&&</span> <span class="nx">pageView</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">bind</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">update</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="nx">update</span><span class="p">[</span><span class="s1">'view-'</span> <span class="o">+</span> <span class="nx">pageView</span><span class="p">.</span><span class="nx">id</span><span class="p">]</span> <span class="o">=</span> <span class="nx">pageView</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">();</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">set</span><span class="p">(</span><span class="nx">update</span><span class="p">);</span>
|
||||
<span class="nx">pageView</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'change'</span><span class="p">,</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">update</span> <span class="o">=</span> <span class="p">{};</span>
|
||||
<span class="nx">update</span><span class="p">[</span><span class="s1">'view-'</span> <span class="o">+</span> <span class="nx">pageView</span><span class="p">.</span><span class="nx">id</span><span class="p">]</span> <span class="o">=</span> <span class="nx">pageView</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">();</span></pre></div> </td> </tr> <tr id="section-15"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-15">¶</a> </div> <p>had problems where change not being triggered for e.g. grid view so let's do it explicitly</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">set</span><span class="p">(</span><span class="nx">update</span><span class="p">,</span> <span class="p">{</span><span class="nx">silent</span><span class="o">:</span> <span class="kc">true</span><span class="p">});</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'change'</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">_bindFlashNotifications</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">pageViews</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">pageView</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">pageView</span><span class="p">.</span><span class="nx">view</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'recline:flash'</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">flash</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">notify</span><span class="p">(</span><span class="nx">flash</span><span class="p">);</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-16"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-16">¶</a> </div> <h3>notify</h3>
|
||||
|
||||
<p>Create a notification (a div.alert in div.alert-messsages) using provided
|
||||
flash object. Flash attributes (all are optional):</p>
|
||||
|
||||
<ul>
|
||||
<li>message: message to show.</li>
|
||||
<li>category: warning (default), success, error</li>
|
||||
<li>persist: if true alert is persistent, o/w hidden after 3s (default = false)</li>
|
||||
<li>loader: if true show loading spinner</li>
|
||||
</ul> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">notify</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">flash</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">tmplData</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">message</span><span class="o">:</span> <span class="s1">'Loading'</span><span class="p">,</span>
|
||||
<span class="nx">category</span><span class="o">:</span> <span class="s1">'warning'</span><span class="p">,</span>
|
||||
<span class="nx">loader</span><span class="o">:</span> <span class="kc">false</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">flash</span>
|
||||
<span class="p">);</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">tmplData</span><span class="p">.</span><span class="nx">loader</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">_template</span> <span class="o">=</span> <span class="s1">' \</span>
|
||||
<span class="s1"> <div class="alert alert-info alert-loader"> \</span>
|
||||
<span class="s1"> {{message}} \</span>
|
||||
<span class="s1"> <span class="notification-loader">&nbsp;</span> \</span>
|
||||
<span class="s1"> </div>'</span><span class="p">;</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">_template</span> <span class="o">=</span> <span class="s1">' \</span>
|
||||
<span class="s1"> <div class="alert alert-{{category}} fade in" data-alert="alert"><a class="close" data-dismiss="alert" href="#">×</a> \</span>
|
||||
<span class="s1"> {{message}} \</span>
|
||||
<span class="s1"> </div>'</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
<span class="kd">var</span> <span class="nx">_templated</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="nx">Mustache</span><span class="p">.</span><span class="nx">render</span><span class="p">(</span><span class="nx">_template</span><span class="p">,</span> <span class="nx">tmplData</span><span class="p">));</span>
|
||||
<span class="nx">_templated</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="nx">_templated</span><span class="p">).</span><span class="nx">appendTo</span><span class="p">(</span><span class="nx">$</span><span class="p">(</span><span class="s1">'.recline-data-explorer .alert-messages'</span><span class="p">));</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">flash</span><span class="p">.</span><span class="nx">persist</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">setTimeout</span><span class="p">(</span><span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">$</span><span class="p">(</span><span class="nx">_templated</span><span class="p">).</span><span class="nx">fadeOut</span><span class="p">(</span><span class="mi">1000</span><span class="p">,</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">).</span><span class="nx">remove</span><span class="p">();</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">},</span> <span class="mi">1000</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span></pre></div> </td> </tr> <tr id="section-17"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-17">¶</a> </div> <h3>clearNotifications</h3>
|
||||
|
||||
<p>Clear all existing notifications</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">clearNotifications</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">$notifications</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="s1">'.recline-data-explorer .alert-messages .alert'</span><span class="p">);</span>
|
||||
<span class="nx">$notifications</span><span class="p">.</span><span class="nx">fadeOut</span><span class="p">(</span><span class="mi">1500</span><span class="p">,</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">).</span><span class="nx">remove</span><span class="p">();</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span></pre></div> </td> </tr> <tr id="section-18"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-18">¶</a> </div> <h3>DataExplorer.restore</h3>
|
||||
|
||||
<p>Restore a DataExplorer instance from a serialized state including the associated dataset</p> </td> <td class="code"> <div class="highlight"><pre><span class="nx">my</span><span class="p">.</span><span class="nx">DataExplorer</span><span class="p">.</span><span class="nx">restore</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">state</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">dataset</span> <span class="o">=</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">Model</span><span class="p">.</span><span class="nx">Dataset</span><span class="p">.</span><span class="nx">restore</span><span class="p">(</span><span class="nx">state</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">explorer</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">my</span><span class="p">.</span><span class="nx">DataExplorer</span><span class="p">({</span>
|
||||
<span class="nx">model</span><span class="o">:</span> <span class="nx">dataset</span><span class="p">,</span>
|
||||
<span class="nx">state</span><span class="o">:</span> <span class="nx">state</span>
|
||||
<span class="p">});</span>
|
||||
<span class="k">return</span> <span class="nx">explorer</span><span class="p">;</span>
|
||||
<span class="p">}</span>
|
||||
|
||||
<span class="nx">my</span><span class="p">.</span><span class="nx">QueryEditor</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">View</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">className</span><span class="o">:</span> <span class="s1">'recline-query-editor'</span><span class="p">,</span>
|
||||
<span class="nx">template</span><span class="o">:</span> <span class="s1">' \</span>
|
||||
<span class="s1"> <form action="" method="GET" class="form-inline"> \</span>
|
||||
<span class="s1"> <div class="input-prepend text-query"> \</span>
|
||||
<span class="s1"> <span class="add-on"><i class="icon-search"></i></span> \</span>
|
||||
<span class="s1"> <input type="text" name="q" value="{{q}}" class="span2" placeholder="Search data ..." class="search-query" /> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> <div class="pagination"> \</span>
|
||||
<span class="s1"> <ul> \</span>
|
||||
<span class="s1"> <li class="prev action-pagination-update"><a href="">&laquo;</a></li> \</span>
|
||||
<span class="s1"> <li class="active"><a><input name="from" type="text" value="{{from}}" /> &ndash; <input name="to" type="text" value="{{to}}" /> </a></li> \</span>
|
||||
<span class="s1"> <li class="next action-pagination-update"><a href="">&raquo;</a></li> \</span>
|
||||
<span class="s1"> </ul> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> <button type="submit" class="btn">Go &raquo;</button> \</span>
|
||||
<span class="s1"> </form> \</span>
|
||||
<span class="s1"> '</span><span class="p">,</span>
|
||||
|
||||
<span class="nx">events</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="s1">'submit form'</span><span class="o">:</span> <span class="s1">'onFormSubmit'</span><span class="p">,</span>
|
||||
<span class="s1">'click .action-pagination-update'</span><span class="o">:</span> <span class="s1">'onPaginationUpdate'</span>
|
||||
<span class="p">},</span>
|
||||
|
||||
<span class="nx">initialize</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">bindAll</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="s1">'render'</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'change'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">();</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">onFormSubmit</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">e</span><span class="p">.</span><span class="nx">preventDefault</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">query</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'.text-query input'</span><span class="p">).</span><span class="nx">val</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">newFrom</span> <span class="o">=</span> <span class="nb">parseInt</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'input[name="from"]'</span><span class="p">).</span><span class="nx">val</span><span class="p">());</span>
|
||||
<span class="kd">var</span> <span class="nx">newSize</span> <span class="o">=</span> <span class="nb">parseInt</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'input[name="to"]'</span><span class="p">).</span><span class="nx">val</span><span class="p">())</span> <span class="o">-</span> <span class="nx">newFrom</span><span class="p">;</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span><span class="nx">size</span><span class="o">:</span> <span class="nx">newSize</span><span class="p">,</span> <span class="nx">from</span><span class="o">:</span> <span class="nx">newFrom</span><span class="p">,</span> <span class="nx">q</span><span class="o">:</span> <span class="nx">query</span><span class="p">});</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">onPaginationUpdate</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">e</span><span class="p">.</span><span class="nx">preventDefault</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">$el</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">target</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">newFrom</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">$el</span><span class="p">.</span><span class="nx">parent</span><span class="p">().</span><span class="nx">hasClass</span><span class="p">(</span><span class="s1">'prev'</span><span class="p">))</span> <span class="p">{</span>
|
||||
<span class="nx">newFrom</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'from'</span><span class="p">)</span> <span class="o">-</span> <span class="nb">Math</span><span class="p">.</span><span class="nx">max</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'size'</span><span class="p">));</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="nx">newFrom</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'from'</span><span class="p">)</span> <span class="o">+</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'size'</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span><span class="nx">from</span><span class="o">:</span> <span class="nx">newFrom</span><span class="p">});</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">render</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">tmplData</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">();</span>
|
||||
<span class="nx">tmplData</span><span class="p">.</span><span class="nx">to</span> <span class="o">=</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'from'</span><span class="p">)</span> <span class="o">+</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'size'</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">templated</span> <span class="o">=</span> <span class="nx">Mustache</span><span class="p">.</span><span class="nx">render</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">template</span><span class="p">,</span> <span class="nx">tmplData</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">html</span><span class="p">(</span><span class="nx">templated</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
|
||||
<span class="nx">my</span><span class="p">.</span><span class="nx">FilterEditor</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">View</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">className</span><span class="o">:</span> <span class="s1">'recline-filter-editor well'</span><span class="p">,</span>
|
||||
<span class="nx">template</span><span class="o">:</span> <span class="s1">' \</span>
|
||||
<span class="s1"> <a class="close js-hide" href="#">&times;</a> \</span>
|
||||
<span class="s1"> <div class="row filters"> \</span>
|
||||
<span class="s1"> <div class="span1"> \</span>
|
||||
<span class="s1"> <h3>Filters</h3> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> <div class="span11"> \</span>
|
||||
<span class="s1"> <form class="form-horizontal"> \</span>
|
||||
<span class="s1"> <div class="row"> \</span>
|
||||
<span class="s1"> <div class="span6"> \</span>
|
||||
<span class="s1"> {{#termFilters}} \</span>
|
||||
<span class="s1"> <div class="control-group filter-term filter" data-filter-id={{id}}> \</span>
|
||||
<span class="s1"> <label class="control-label" for="">{{label}}</label> \</span>
|
||||
<span class="s1"> <div class="controls"> \</span>
|
||||
<span class="s1"> <div class="input-append"> \</span>
|
||||
<span class="s1"> <input type="text" value="{{value}}" name="{{fieldId}}" class="span4" data-filter-field="{{fieldId}}" data-filter-id="{{id}}" data-filter-type="term" /> \</span>
|
||||
<span class="s1"> <a class="btn js-remove-filter"><i class="icon-remove"></i></a> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> {{/termFilters}} \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> <div class="span4"> \</span>
|
||||
<span class="s1"> <p>To add a filter use the column menu in the grid view.</p> \</span>
|
||||
<span class="s1"> <button type="submit" class="btn">Update</button> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> </form> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> '</span><span class="p">,</span>
|
||||
<span class="nx">events</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="s1">'click .js-hide'</span><span class="o">:</span> <span class="s1">'onHide'</span><span class="p">,</span>
|
||||
<span class="s1">'click .js-remove-filter'</span><span class="o">:</span> <span class="s1">'onRemoveFilter'</span><span class="p">,</span>
|
||||
<span class="s1">'submit form'</span><span class="o">:</span> <span class="s1">'onTermFiltersUpdate'</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">initialize</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">);</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">bindAll</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="s1">'render'</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'change'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'change:filters:new-blank'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">();</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">render</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">tmplData</span> <span class="o">=</span> <span class="nx">$</span><span class="p">.</span><span class="nx">extend</span><span class="p">(</span><span class="kc">true</span><span class="p">,</span> <span class="p">{},</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">());</span></pre></div> </td> </tr> <tr id="section-19"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-19">¶</a> </div> <p>we will use idx in list as there id ...</p> </td> <td class="code"> <div class="highlight"><pre> <span class="nx">tmplData</span><span class="p">.</span><span class="nx">filters</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">tmplData</span><span class="p">.</span><span class="nx">filters</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">filter</span><span class="p">,</span> <span class="nx">idx</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">filter</span><span class="p">.</span><span class="nx">id</span> <span class="o">=</span> <span class="nx">idx</span><span class="p">;</span>
|
||||
<span class="k">return</span> <span class="nx">filter</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">tmplData</span><span class="p">.</span><span class="nx">termFilters</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">filter</span><span class="p">(</span><span class="nx">tmplData</span><span class="p">.</span><span class="nx">filters</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">filter</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">return</span> <span class="nx">filter</span><span class="p">.</span><span class="nx">term</span> <span class="o">!==</span> <span class="kc">undefined</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">tmplData</span><span class="p">.</span><span class="nx">termFilters</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">tmplData</span><span class="p">.</span><span class="nx">termFilters</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">filter</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">fieldId</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">keys</span><span class="p">(</span><span class="nx">filter</span><span class="p">.</span><span class="nx">term</span><span class="p">)[</span><span class="mi">0</span><span class="p">];</span>
|
||||
<span class="k">return</span> <span class="p">{</span>
|
||||
<span class="nx">id</span><span class="o">:</span> <span class="nx">filter</span><span class="p">.</span><span class="nx">id</span><span class="p">,</span>
|
||||
<span class="nx">fieldId</span><span class="o">:</span> <span class="nx">fieldId</span><span class="p">,</span>
|
||||
<span class="nx">label</span><span class="o">:</span> <span class="nx">fieldId</span><span class="p">,</span>
|
||||
<span class="nx">value</span><span class="o">:</span> <span class="nx">filter</span><span class="p">.</span><span class="nx">term</span><span class="p">[</span><span class="nx">fieldId</span><span class="p">]</span>
|
||||
<span class="p">};</span>
|
||||
<span class="p">});</span>
|
||||
<span class="kd">var</span> <span class="nx">out</span> <span class="o">=</span> <span class="nx">Mustache</span><span class="p">.</span><span class="nx">render</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">template</span><span class="p">,</span> <span class="nx">tmplData</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">html</span><span class="p">(</span><span class="nx">out</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-20"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-20">¶</a> </div> <p>are there actually any facets to show?</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'filters'</span><span class="p">).</span><span class="nx">length</span> <span class="o">></span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">show</span><span class="p">();</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">hide</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">onHide</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">e</span><span class="p">.</span><span class="nx">preventDefault</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">hide</span><span class="p">();</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">onRemoveFilter</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">e</span><span class="p">.</span><span class="nx">preventDefault</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">$target</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">target</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">filterId</span> <span class="o">=</span> <span class="nx">$target</span><span class="p">.</span><span class="nx">closest</span><span class="p">(</span><span class="s1">'.filter'</span><span class="p">).</span><span class="nx">attr</span><span class="p">(</span><span class="s1">'data-filter-id'</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">removeFilter</span><span class="p">(</span><span class="nx">filterId</span><span class="p">);</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">onTermFiltersUpdate</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">self</span> <span class="o">=</span> <span class="k">this</span><span class="p">;</span>
|
||||
<span class="nx">e</span><span class="p">.</span><span class="nx">preventDefault</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">filters</span> <span class="o">=</span> <span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">get</span><span class="p">(</span><span class="s1">'filters'</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">$form</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">target</span><span class="p">);</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">each</span><span class="p">(</span><span class="nx">$form</span><span class="p">.</span><span class="nx">find</span><span class="p">(</span><span class="s1">'input'</span><span class="p">),</span> <span class="kd">function</span><span class="p">(</span><span class="nx">input</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">$input</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="nx">input</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">filterIndex</span> <span class="o">=</span> <span class="nb">parseInt</span><span class="p">(</span><span class="nx">$input</span><span class="p">.</span><span class="nx">attr</span><span class="p">(</span><span class="s1">'data-filter-id'</span><span class="p">));</span>
|
||||
<span class="kd">var</span> <span class="nx">value</span> <span class="o">=</span> <span class="nx">$input</span><span class="p">.</span><span class="nx">val</span><span class="p">();</span>
|
||||
<span class="kd">var</span> <span class="nx">fieldId</span> <span class="o">=</span> <span class="nx">$input</span><span class="p">.</span><span class="nx">attr</span><span class="p">(</span><span class="s1">'data-filter-field'</span><span class="p">);</span>
|
||||
<span class="nx">filters</span><span class="p">[</span><span class="nx">filterIndex</span><span class="p">].</span><span class="nx">term</span><span class="p">[</span><span class="nx">fieldId</span><span class="p">]</span> <span class="o">=</span> <span class="nx">value</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">set</span><span class="p">({</span><span class="nx">filters</span><span class="o">:</span> <span class="nx">filters</span><span class="p">});</span>
|
||||
<span class="nx">self</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">trigger</span><span class="p">(</span><span class="s1">'change'</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
|
||||
<span class="nx">my</span><span class="p">.</span><span class="nx">FacetViewer</span> <span class="o">=</span> <span class="nx">Backbone</span><span class="p">.</span><span class="nx">View</span><span class="p">.</span><span class="nx">extend</span><span class="p">({</span>
|
||||
<span class="nx">className</span><span class="o">:</span> <span class="s1">'recline-facet-viewer well'</span><span class="p">,</span>
|
||||
<span class="nx">template</span><span class="o">:</span> <span class="s1">' \</span>
|
||||
<span class="s1"> <a class="close js-hide" href="#">&times;</a> \</span>
|
||||
<span class="s1"> <div class="facets row"> \</span>
|
||||
<span class="s1"> <div class="span1"> \</span>
|
||||
<span class="s1"> <h3>Facets</h3> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> {{#facets}} \</span>
|
||||
<span class="s1"> <div class="facet-summary span2 dropdown" data-facet="{{id}}"> \</span>
|
||||
<span class="s1"> <a class="btn dropdown-toggle" data-toggle="dropdown" href="#"><i class="icon-chevron-down"></i> {{id}} {{label}}</a> \</span>
|
||||
<span class="s1"> <ul class="facet-items dropdown-menu"> \</span>
|
||||
<span class="s1"> {{#terms}} \</span>
|
||||
<span class="s1"> <li><a class="facet-choice js-facet-filter" data-value="{{term}}">{{term}} ({{count}})</a></li> \</span>
|
||||
<span class="s1"> {{/terms}} \</span>
|
||||
<span class="s1"> {{#entries}} \</span>
|
||||
<span class="s1"> <li><a class="facet-choice js-facet-filter" data-value="{{time}}">{{term}} ({{count}})</a></li> \</span>
|
||||
<span class="s1"> {{/entries}} \</span>
|
||||
<span class="s1"> </ul> \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> {{/facets}} \</span>
|
||||
<span class="s1"> </div> \</span>
|
||||
<span class="s1"> '</span><span class="p">,</span>
|
||||
|
||||
<span class="nx">events</span><span class="o">:</span> <span class="p">{</span>
|
||||
<span class="s1">'click .js-hide'</span><span class="o">:</span> <span class="s1">'onHide'</span><span class="p">,</span>
|
||||
<span class="s1">'click .js-facet-filter'</span><span class="o">:</span> <span class="s1">'onFacetFilter'</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">initialize</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">model</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">_</span><span class="p">.</span><span class="nx">bindAll</span><span class="p">(</span><span class="k">this</span><span class="p">,</span> <span class="s1">'render'</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">facets</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'all'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">bind</span><span class="p">(</span><span class="s1">'all'</span><span class="p">,</span> <span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">render</span><span class="p">();</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">render</span><span class="o">:</span> <span class="kd">function</span><span class="p">()</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">tmplData</span> <span class="o">=</span> <span class="p">{</span>
|
||||
<span class="nx">facets</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">facets</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">(),</span>
|
||||
<span class="nx">fields</span><span class="o">:</span> <span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">fields</span><span class="p">.</span><span class="nx">toJSON</span><span class="p">()</span>
|
||||
<span class="p">};</span>
|
||||
<span class="nx">tmplData</span><span class="p">.</span><span class="nx">facets</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">tmplData</span><span class="p">.</span><span class="nx">facets</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">facet</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">if</span> <span class="p">(</span><span class="nx">facet</span><span class="p">.</span><span class="nx">_type</span> <span class="o">===</span> <span class="s1">'date_histogram'</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">facet</span><span class="p">.</span><span class="nx">entries</span> <span class="o">=</span> <span class="nx">_</span><span class="p">.</span><span class="nx">map</span><span class="p">(</span><span class="nx">facet</span><span class="p">.</span><span class="nx">entries</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">entry</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">entry</span><span class="p">.</span><span class="nx">term</span> <span class="o">=</span> <span class="k">new</span> <span class="nb">Date</span><span class="p">(</span><span class="nx">entry</span><span class="p">.</span><span class="nx">time</span><span class="p">).</span><span class="nx">toDateString</span><span class="p">();</span>
|
||||
<span class="k">return</span> <span class="nx">entry</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="p">}</span>
|
||||
<span class="k">return</span> <span class="nx">facet</span><span class="p">;</span>
|
||||
<span class="p">});</span>
|
||||
<span class="kd">var</span> <span class="nx">templated</span> <span class="o">=</span> <span class="nx">Mustache</span><span class="p">.</span><span class="nx">render</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">template</span><span class="p">,</span> <span class="nx">tmplData</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">html</span><span class="p">(</span><span class="nx">templated</span><span class="p">);</span></pre></div> </td> </tr> <tr id="section-21"> <td class="docs"> <div class="pilwrap"> <a class="pilcrow" href="#section-21">¶</a> </div> <p>are there actually any facets to show?</p> </td> <td class="code"> <div class="highlight"><pre> <span class="k">if</span> <span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">facets</span><span class="p">.</span><span class="nx">length</span> <span class="o">></span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">show</span><span class="p">();</span>
|
||||
<span class="p">}</span> <span class="k">else</span> <span class="p">{</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">hide</span><span class="p">();</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">onHide</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="nx">e</span><span class="p">.</span><span class="nx">preventDefault</span><span class="p">();</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">el</span><span class="p">.</span><span class="nx">hide</span><span class="p">();</span>
|
||||
<span class="p">},</span>
|
||||
<span class="nx">onFacetFilter</span><span class="o">:</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span>
|
||||
<span class="kd">var</span> <span class="nx">$target</span><span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">target</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">fieldId</span> <span class="o">=</span> <span class="nx">$target</span><span class="p">.</span><span class="nx">closest</span><span class="p">(</span><span class="s1">'.facet-summary'</span><span class="p">).</span><span class="nx">attr</span><span class="p">(</span><span class="s1">'data-facet'</span><span class="p">);</span>
|
||||
<span class="kd">var</span> <span class="nx">value</span> <span class="o">=</span> <span class="nx">$target</span><span class="p">.</span><span class="nx">attr</span><span class="p">(</span><span class="s1">'data-value'</span><span class="p">);</span>
|
||||
<span class="k">this</span><span class="p">.</span><span class="nx">model</span><span class="p">.</span><span class="nx">queryState</span><span class="p">.</span><span class="nx">addTermFilter</span><span class="p">(</span><span class="nx">fieldId</span><span class="p">,</span> <span class="nx">value</span><span class="p">);</span>
|
||||
<span class="p">}</span>
|
||||
<span class="p">});</span>
|
||||
|
||||
|
||||
<span class="p">})(</span><span class="nx">jQuery</span><span class="p">,</span> <span class="nx">recline</span><span class="p">.</span><span class="nx">View</span><span class="p">);</span>
|
||||
|
||||
</pre></div> </td> </tr> </tbody> </table> </div> </body> </html>
|
||||
@ -8,7 +8,7 @@ title: Home
|
||||
<div class="row">
|
||||
<div class="span8 offset4">
|
||||
<h1>
|
||||
<img src="images/logo.png" width="455" height="190" alt="Recline Data Explorer and Library">
|
||||
<a href="docs/"><img src="images/logo.png" width="455" height="190" alt="Recline Data Explorer and Library"></a>
|
||||
</h1>
|
||||
<div class="inner">
|
||||
A simple but powerful library for building data applications in
|
||||
|
||||
9
make
9
make
@ -5,7 +5,7 @@ import os
|
||||
|
||||
def cat():
|
||||
print("** Combining js files")
|
||||
cmd = 'cat src/*.js src/backend/*.js > dist/recline.js'
|
||||
cmd = 'ls src/*.js | grep -v couchdb | xargs cat > dist/recline.js'
|
||||
os.system(cmd)
|
||||
print("** Combining css files")
|
||||
cmd = 'cat css/*.css > dist/recline.css'
|
||||
@ -16,14 +16,11 @@ def docs():
|
||||
print("** Building docs")
|
||||
|
||||
docco_executable = os.environ.get('DOCCO_EXECUTABLE','docco')
|
||||
cmd = '%s src/*.js' % (docco_executable)
|
||||
os.system(cmd)
|
||||
if os.path.exists('/tmp/recline-docs'):
|
||||
shutil.rmtree('/tmp/recline-docs')
|
||||
os.makedirs('/tmp/recline-docs')
|
||||
os.system('mkdir -p docs/backend')
|
||||
files = '%s/src/backend/*.js' % os.getcwd()
|
||||
dest = '%s/docs/backend' % os.getcwd()
|
||||
files = '%s/src/*.js' % os.getcwd()
|
||||
dest = '%s/docs/src' % os.getcwd()
|
||||
os.system('cd /tmp/recline-docs && %s %s && mv docs/* %s' % (docco_executable,files, dest))
|
||||
print("** Docs built ok")
|
||||
|
||||
|
||||
499
src/backend.couchdb.js
Normal file
499
src/backend.couchdb.js
Normal file
@ -0,0 +1,499 @@
|
||||
this.recline = this.recline || {};
|
||||
this.recline.Backend = this.recline.Backend || {};
|
||||
this.recline.Backend.CouchDB = this.recline.Backend.CouchDB || {};
|
||||
|
||||
(function($, my) {
|
||||
my.__type__ = 'couchdb';
|
||||
|
||||
// ## CouchDB Wrapper
|
||||
//
|
||||
// Connecting to [CouchDB] (http://www.couchdb.apache.org/) endpoints.
|
||||
// @param {String} endpoint: url for CouchDB database, e.g. for Couchdb running
|
||||
// on localhost:5984 with database // ckan-std it would be:
|
||||
//
|
||||
// <pre>http://localhost:5984/ckan-std</pre>
|
||||
//
|
||||
// TODO Add user/password arguments for couchdb authentication support.
|
||||
my.CouchDBWrapper = function(db_url, view_url, options) {
|
||||
var self = this;
|
||||
self.endpoint = db_url;
|
||||
self.view_url = (view_url) ? view_url : db_url+'/'+'_all_docs';
|
||||
self.options = _.extend({
|
||||
dataType: 'json'
|
||||
},
|
||||
options);
|
||||
|
||||
this._makeRequest = function(data, headers) {
|
||||
var extras = {};
|
||||
if (headers) {
|
||||
extras = {
|
||||
beforeSend: function(req) {
|
||||
_.each(headers, function(value, key) {
|
||||
req.setRequestHeader(key, value);
|
||||
});
|
||||
}
|
||||
};
|
||||
}
|
||||
data = _.extend(extras, data);
|
||||
return $.ajax(data);
|
||||
};
|
||||
|
||||
// ### mapping
|
||||
//
|
||||
// Get mapping for this database.
|
||||
// Assume all docs in the view have the same schema so
|
||||
// limit query to single result.
|
||||
//
|
||||
// @return promise compatible deferred object.
|
||||
this.mapping = function() {
|
||||
var schemaUrl = self.view_url + '?limit=1&include_docs=true';
|
||||
var jqxhr = self._makeRequest({
|
||||
url: schemaUrl,
|
||||
dataType: self.options.dataType
|
||||
});
|
||||
return jqxhr;
|
||||
};
|
||||
|
||||
// ### get
|
||||
//
|
||||
// Get record corresponding to specified id
|
||||
//
|
||||
// @return promise compatible deferred object.
|
||||
this.get = function(_id) {
|
||||
var base = self.endpoint + '/' + _id;
|
||||
return self._makeRequest({
|
||||
url: base,
|
||||
dataType: 'json'
|
||||
});
|
||||
};
|
||||
|
||||
// ### upsert
|
||||
//
|
||||
// create / update a record to CouchDB backend
|
||||
//
|
||||
// @param {Object} doc an object to insert to the index.
|
||||
// @return deferred supporting promise API
|
||||
this.upsert = function(doc) {
|
||||
var data = JSON.stringify(doc);
|
||||
url = self.endpoint;
|
||||
if (doc._id) {
|
||||
url += '/' + doc._id;
|
||||
}
|
||||
// use a PUT, not a POST to update the document:
|
||||
// http://wiki.apache.org/couchdb/HTTP_Document_API#POST
|
||||
return self._makeRequest({
|
||||
url: url,
|
||||
type: 'PUT',
|
||||
data: data,
|
||||
dataType: 'json',
|
||||
contentType: 'application/json'
|
||||
});
|
||||
};
|
||||
|
||||
// ### delete
|
||||
//
|
||||
// Delete a record from the CouchDB backend.
|
||||
//
|
||||
// @param {Object} id id of object to delete
|
||||
// @return deferred supporting promise API
|
||||
this.delete = function(_id) {
|
||||
url = self.endpoint;
|
||||
url += '/' + _id;
|
||||
return self._makeRequest({
|
||||
url: url,
|
||||
type: 'DELETE',
|
||||
dataType: 'json'
|
||||
});
|
||||
};
|
||||
|
||||
// ### _normalizeQuery
|
||||
//
|
||||
// Convert the query object from Elastic Search format to a
|
||||
// Couchdb View API compatible format.
|
||||
// See: http://wiki.apache.org/couchdb/HTTP_view_API
|
||||
//
|
||||
this._normalizeQuery = function(queryObj) {
|
||||
var out = queryObj && queryObj.toJSON ? queryObj.toJSON() : _.extend({}, queryObj);
|
||||
delete out.sort;
|
||||
delete out.query;
|
||||
delete out.filters;
|
||||
delete out.fields;
|
||||
delete out.facets;
|
||||
out['skip'] = out.from || 0;
|
||||
out['limit'] = out.size || 100;
|
||||
delete out.from;
|
||||
delete out.size;
|
||||
out['include_docs'] = true;
|
||||
return out;
|
||||
};
|
||||
|
||||
// ### query
|
||||
//
|
||||
// @param {Object} recline.Query instance.
|
||||
// @param {Object} additional couchdb view query options.
|
||||
// @return deferred supporting promise API
|
||||
this.query = function(query_object, query_options) {
|
||||
var norm_q = self._normalizeQuery(query_object);
|
||||
var url = self.view_url;
|
||||
var q = _.extend(query_options, norm_q);
|
||||
|
||||
var jqxhr = self._makeRequest({
|
||||
url: url,
|
||||
data: JSON.stringify(q),
|
||||
dataType: self.options.dataType,
|
||||
});
|
||||
return jqxhr;
|
||||
}
|
||||
};
|
||||
|
||||
// ## CouchDB Backend
|
||||
//
|
||||
// Backbone connector for a CouchDB backend.
|
||||
//
|
||||
// Usage:
|
||||
//
|
||||
// var backend = new recline.Backend.CouchDB();
|
||||
// var dataset = new recline.Model.Dataset({
|
||||
// db_url: '/couchdb/mydb',
|
||||
// view_url: '/couchdb/mydb/_design/design1/_views/view1',
|
||||
// query_options: {
|
||||
// 'key': 'some_document_key'
|
||||
// }
|
||||
// });
|
||||
// backend.fetch(dataset.toJSON());
|
||||
// backend.query(query, dataset.toJSON()).done(function () { ... });
|
||||
//
|
||||
// Alternatively:
|
||||
// var dataset = new recline.Model.Dataset({ ... }, 'couchdb');
|
||||
// dataset.fetch();
|
||||
// var results = dataset.query(query_obj);
|
||||
//
|
||||
// Additionally, the Dataset instance may define three methods:
|
||||
// function record_update (record, document) { ... }
|
||||
// function record_delete (record, document) { ... }
|
||||
// function record_create (record, document) { ... }
|
||||
// Where `record` is the JSON representation of the Record/Document instance
|
||||
// and `document` is the JSON document stored in couchdb.
|
||||
// When _all_docs view is used (default), a record is the same as a document
|
||||
// so these methods need not be defined.
|
||||
// They are most useful when using a custom view that performs a map-reduce
|
||||
// operation on each document to yield a record. Hence, when the record is
|
||||
// created, updated or deleted, an inverse operation must be performed on the original
|
||||
// document.
|
||||
//
|
||||
// @param {string} url of couchdb database.
|
||||
// @param {string} (optional) url of couchdb view. default:`db_url`/_all_docs
|
||||
// @param {Object} (optional) query options accepted by couchdb views.
|
||||
//
|
||||
|
||||
my.couchOptions = {};
|
||||
|
||||
// ### fetch
|
||||
// @param {object} dataset json object with the db_url, view_url, and query_options args.
|
||||
// @return promise object that resolves to the document mapping.
|
||||
my.fetch = function (dataset) {
|
||||
var db_url = dataset.db_url;
|
||||
var view_url = dataset.view_url;
|
||||
var cdb = new my.CouchDBWrapper(db_url, view_url);
|
||||
var dfd = $.Deferred();
|
||||
|
||||
// if 'doc' attribute is present, return schema of that
|
||||
// else return schema of 'value' attribute which contains
|
||||
// the map-reduced document.
|
||||
cdb.mapping().done(function(result) {
|
||||
var row = result.rows[0];
|
||||
var keys = [];
|
||||
if (view_url.search("_all_docs") !== -1) {
|
||||
keys = _.keys(row['doc']);
|
||||
keys = _.filter(keys, function (k) { return k.charAt(0) !== '_' });
|
||||
}
|
||||
else {
|
||||
keys = _.keys(row['value']);
|
||||
}
|
||||
|
||||
var fieldData = _.map(keys, function(k) {
|
||||
return { 'id' : k };
|
||||
});
|
||||
dfd.resolve({
|
||||
fields: fieldData
|
||||
});
|
||||
})
|
||||
.fail(function(arguments) {
|
||||
dfd.reject(arguments);
|
||||
});
|
||||
return dfd.promise();
|
||||
};
|
||||
|
||||
// ### save
|
||||
//
|
||||
// Iterate through all the changes and save them to the server.
|
||||
// N.B. This method is asynchronous and attempts to do multiple
|
||||
// operation concurrently. This can be problematic when more than
|
||||
// one operation is requested on the same document (as in the case
|
||||
// of bulk column transforms).
|
||||
//
|
||||
// @param {object} lists of create, update, delete.
|
||||
// @param {object} dataset json object.
|
||||
//
|
||||
//
|
||||
my.save = function (changes, dataset) {
|
||||
var dfd = $.Deferred();
|
||||
var total = changes.creates.length + changes.updates.length + changes.deletes.length;
|
||||
var results = {'done': [], 'fail': [] };
|
||||
|
||||
var decr_cb = function () { total -= 1; }
|
||||
var resolve_cb = function () { if (total == 0) dfd.resolve(results); }
|
||||
|
||||
for (var i in changes.creates) {
|
||||
var new_doc = changes.creates[i];
|
||||
var succ_cb = function (msg) {results.done.push({'op': 'create', 'record': new_doc, 'reason': ''}); }
|
||||
var fail_cb = function (msg) {results.fail.push({'op': 'create', 'record': new_doc, 'reason': msg}); }
|
||||
|
||||
_createDocument(new_doc, dataset).then([decr_cb, succ_cb, resolve_cb], [decr_cb, fail_cb, resolve_cb]);
|
||||
}
|
||||
|
||||
for (var i in changes.updates) {
|
||||
var new_doc = changes.updates[i];
|
||||
var succ_cb = function (msg) {results.done.push({'op': 'update', 'record': new_doc, 'reason': ''}); }
|
||||
var fail_cb = function (msg) {results.fail.push({'op': 'update', 'record': new_doc, 'reason': msg}); }
|
||||
|
||||
_updateDocument(new_doc, dataset).then([decr_cb, succ_cb, resolve_cb], [decr_cb, fail_cb, resolve_cb]);
|
||||
}
|
||||
|
||||
for (var i in changes.deletes) {
|
||||
var old_doc = changes.deletes[i];
|
||||
var succ_cb = function (msg) {results.done.push({'op': 'delete', 'record': old_doc, 'reason': ''}); }
|
||||
var fail_cb = function (msg) {results.fail.push({'op': 'delete', 'record': old_doc, 'reason': msg}); }
|
||||
|
||||
_deleteDocument(new_doc, dataset).then([decr_cb, succ_cb, resolve_cb], [decr_cb, fail_cb, resolve_cb]);
|
||||
}
|
||||
|
||||
return dfd.promise();
|
||||
};
|
||||
|
||||
|
||||
// ### query
|
||||
//
|
||||
// fetch the data from the couchdb view and filter it.
|
||||
// @param {Object} recline.Dataset instance
|
||||
// @param {Object} recline.Query instance.
|
||||
my.query = function(queryObj, dataset) {
|
||||
var dfd = $.Deferred();
|
||||
var db_url = dataset.db_url;
|
||||
var view_url = dataset.view_url;
|
||||
var query_options = dataset.query_options;
|
||||
|
||||
var cdb = new my.CouchDBWrapper(db_url, view_url);
|
||||
var cdb_q = cdb._normalizeQuery(queryObj, query_options);
|
||||
|
||||
cdb.query(queryObj, query_options).done(function(records){
|
||||
|
||||
var query_result = { hits: [], total: 0 };
|
||||
_.each(records.rows, function(record) {
|
||||
var doc = {};
|
||||
if (record.hasOwnProperty('doc')) {
|
||||
doc = record['doc'];
|
||||
// couchdb uses _id to identify documents, Backbone models use id.
|
||||
// we add this fix so backbone.Model works correctly.
|
||||
doc['id'] = doc['_id'];
|
||||
}
|
||||
else {
|
||||
doc = record['value'];
|
||||
// using dunder to create compound id. need something more robust.
|
||||
// couchdb uses _id to identify documents, Backbone models use id.
|
||||
// we add this fix so backbone.Model works correctly.
|
||||
doc['_id'] = doc['id'] = record['id'] + '__' + record['key'];
|
||||
}
|
||||
query_result.total += 1;
|
||||
query_result.hits.push(doc);
|
||||
});
|
||||
|
||||
// the following block is borrowed verbatim from recline.backend.Memory
|
||||
// search (with filtering, faceting, and sorting) should be factored
|
||||
// out into a separate library.
|
||||
query_result.hits = _applyFilters(query_result.hits, queryObj);
|
||||
query_result.hits = _applyFreeTextQuery(query_result.hits, queryObj);
|
||||
// not complete sorting!
|
||||
_.each(queryObj.sort, function(sortObj) {
|
||||
var fieldName = _.keys(sortObj)[0];
|
||||
query_result.hits = _.sortBy(query_result.hits, function(doc) {
|
||||
var _out = doc[fieldName];
|
||||
return (sortObj[fieldName].order == 'asc') ? _out : -1*_out;
|
||||
});
|
||||
});
|
||||
query_result.total = query_result.hits.length;
|
||||
query_result.facets = _computeFacets(query_result.hits, queryObj);
|
||||
query_result.hits = query_result.hits.slice(cdb_q.skip, cdb_q.skip + cdb_q.limit+1);
|
||||
dfd.resolve(query_result);
|
||||
|
||||
});
|
||||
|
||||
return dfd.promise();
|
||||
};
|
||||
|
||||
// in place filtering
|
||||
_applyFilters = function(results, queryObj) {
|
||||
_.each(queryObj.filters, function(filter) {
|
||||
results = _.filter(results, function(doc) {
|
||||
var fieldId = _.keys(filter.term)[0];
|
||||
return (doc[fieldId] == filter.term[fieldId]);
|
||||
});
|
||||
});
|
||||
return results;
|
||||
};
|
||||
|
||||
// we OR across fields but AND across terms in query string
|
||||
_applyFreeTextQuery = function(results, queryObj) {
|
||||
if (queryObj.q) {
|
||||
var terms = queryObj.q.split(' ');
|
||||
results = _.filter(results, function(rawdoc) {
|
||||
var matches = true;
|
||||
_.each(terms, function(term) {
|
||||
var foundmatch = false;
|
||||
_.each(_.keys(rawdoc), function(field) {
|
||||
var value = rawdoc[field];
|
||||
if (value !== null) { value = value.toString(); }
|
||||
// TODO regexes?
|
||||
foundmatch = foundmatch || (value === term);
|
||||
// TODO: early out (once we are true should break to spare unnecessary testing)
|
||||
// if (foundmatch) return true;
|
||||
});
|
||||
matches = matches && foundmatch;
|
||||
// TODO: early out (once false should break to spare unnecessary testing)
|
||||
// if (!matches) return false;
|
||||
});
|
||||
return matches;
|
||||
});
|
||||
}
|
||||
return results;
|
||||
};
|
||||
|
||||
_computeFacets = function(records, queryObj) {
|
||||
var facetResults = {};
|
||||
if (!queryObj.facets) {
|
||||
return facetResults;
|
||||
}
|
||||
_.each(queryObj.facets, function(query, facetId) {
|
||||
// TODO: remove dependency on recline.Model
|
||||
facetResults[facetId] = new recline.Model.Facet({id: facetId}).toJSON();
|
||||
facetResults[facetId].termsall = {};
|
||||
});
|
||||
// faceting
|
||||
_.each(records, function(doc) {
|
||||
_.each(queryObj.facets, function(query, facetId) {
|
||||
var fieldId = query.terms.field;
|
||||
var val = doc[fieldId];
|
||||
var tmp = facetResults[facetId];
|
||||
if (val) {
|
||||
tmp.termsall[val] = tmp.termsall[val] ? tmp.termsall[val] + 1 : 1;
|
||||
} else {
|
||||
tmp.missing = tmp.missing + 1;
|
||||
}
|
||||
});
|
||||
});
|
||||
_.each(queryObj.facets, function(query, facetId) {
|
||||
var tmp = facetResults[facetId];
|
||||
var terms = _.map(tmp.termsall, function(count, term) {
|
||||
return { term: term, count: count };
|
||||
});
|
||||
tmp.terms = _.sortBy(terms, function(item) {
|
||||
// want descending order
|
||||
return -item.count;
|
||||
});
|
||||
tmp.terms = tmp.terms.slice(0, 10);
|
||||
});
|
||||
return facetResults;
|
||||
};
|
||||
|
||||
_createDocument = function (new_doc, dataset) {
|
||||
var dfd = $.Deferred();
|
||||
var db_url = dataset.db_url;
|
||||
var view_url = dataset.view_url;
|
||||
var _id = new_doc['id'];
|
||||
var cdb = new my.CouchDBWrapper(db_url, view_url);
|
||||
|
||||
delete new_doc['id'];
|
||||
|
||||
if (view_url.search('_all_docs') !== -1) {
|
||||
jqxhr = cdb.get(_id);
|
||||
}
|
||||
else {
|
||||
_id = new_doc['_id'].split('__')[0];
|
||||
jqxhr = cdb.get(_id);
|
||||
}
|
||||
|
||||
jqxhr.done(function(old_doc){
|
||||
if (dataset.record_create)
|
||||
new_doc = dataset.record_create(new_doc, old_doc);
|
||||
new_doc = _.extend(old_doc, new_doc);
|
||||
new_doc['_id'] = _id;
|
||||
dfd.resolve(cdb.upsert(new_doc));
|
||||
}).fail(function(args){
|
||||
dfd.reject(args);
|
||||
});
|
||||
|
||||
return dfd.promise();
|
||||
};
|
||||
|
||||
_updateDocument = function (new_doc, dataset) {
|
||||
var dfd = $.Deferred();
|
||||
var db_url = dataset.db_url;
|
||||
var view_url = dataset.view_url;
|
||||
var _id = new_doc['id'];
|
||||
var cdb = new my.CouchDBWrapper(db_url, view_url);
|
||||
|
||||
delete new_doc['id'];
|
||||
|
||||
if (view_url.search('_all_docs') !== -1) {
|
||||
jqxhr = cdb.get(_id);
|
||||
}
|
||||
else {
|
||||
_id = new_doc['_id'].split('__')[0];
|
||||
jqxhr = cdb.get(_id);
|
||||
}
|
||||
|
||||
jqxhr.done(function(old_doc){
|
||||
if (dataset.record_update)
|
||||
new_doc = dataset.record_update(new_doc, old_doc);
|
||||
new_doc = _.extend(old_doc, new_doc);
|
||||
new_doc['_id'] = _id;
|
||||
dfd.resolve(cdb.upsert(new_doc));
|
||||
}).fail(function(args){
|
||||
dfd.reject(args);
|
||||
});
|
||||
|
||||
return dfd.promise();
|
||||
};
|
||||
|
||||
_deleteDocument = function (del_doc, dataset) {
|
||||
var dfd = $.Deferred();
|
||||
var db_url = dataset.db_url;
|
||||
var view_url = dataset.view_url;
|
||||
var _id = del_doc['id'];
|
||||
var cdb = new my.CouchDBWrapper(db_url, view_url);
|
||||
|
||||
if (view_url.search('_all_docs') !== -1)
|
||||
return cdb.delete(_id);
|
||||
else {
|
||||
_id = model.get('_id').split('__')[0];
|
||||
var jqxhr = cdb.get(_id);
|
||||
|
||||
jqxhr.done(function(old_doc){
|
||||
if (dataset.record_delete)
|
||||
old_doc = dataset.record_delete(del_doc, old_doc);
|
||||
if (_.isNull(del_doc))
|
||||
dfd.resolve(cdb.delete(_id)); // XXX is this the right thing to do?
|
||||
else {
|
||||
// couchdb uses _id to identify documents, Backbone models use id.
|
||||
// we should remove it before sending it to the server.
|
||||
old_doc['_id'] = _id;
|
||||
delete old_doc['id'];
|
||||
dfd.resolve(cdb.upsert(old_doc));
|
||||
}
|
||||
}).fail(function(args){
|
||||
dfd.reject(args);
|
||||
});
|
||||
return dfd.promise();
|
||||
};
|
||||
|
||||
}(jQuery, this.recline.Backend.CouchDB));
|
||||
@ -161,6 +161,15 @@ this.recline.Backend.Memory = this.recline.Backend.Memory || {};
|
||||
});
|
||||
return facetResults;
|
||||
};
|
||||
|
||||
this.transform = function(editFunc) {
|
||||
var toUpdate = costco.mapDocs(this.data, editFunc);
|
||||
// TODO: very inefficient -- could probably just walk the documents and updates in tandem and update
|
||||
_.each(toUpdate.updates, function(record, idx) {
|
||||
self.data[idx] = record;
|
||||
});
|
||||
return this.save(toUpdate);
|
||||
};
|
||||
};
|
||||
|
||||
}(jQuery, this.recline.Backend.Memory));
|
||||
@ -1,463 +0,0 @@
|
||||
this.recline = this.recline || {};
|
||||
this.recline.Backend = this.recline.Backend || {};
|
||||
this.recline.Backend.CouchDB = this.recline.Backend.CouchDB || {};
|
||||
|
||||
(function($, my) {
|
||||
// ## CouchDB Wrapper
|
||||
//
|
||||
// Connecting to [CouchDB] (http://www.couchdb.apache.org/) endpoints.
|
||||
// @param {String} endpoint: url for CouchDB database, e.g. for Couchdb running
|
||||
// on localhost:5984 with database // ckan-std it would be:
|
||||
//
|
||||
// <pre>http://localhost:5984/ckan-std</pre>
|
||||
//
|
||||
// TODO Add user/password arguments for couchdb authentication support.
|
||||
my.CouchDBWrapper = function(db_url, view_url, options) {
|
||||
var self = this;
|
||||
self.endpoint = db_url;
|
||||
self.view_url = (view_url) ? view_url : db_url+'/'+'_all_docs';
|
||||
self.options = _.extend({
|
||||
dataType: 'json'
|
||||
},
|
||||
options);
|
||||
|
||||
this._makeRequest = function(data, headers) {
|
||||
var extras = {};
|
||||
if (headers) {
|
||||
extras = {
|
||||
beforeSend: function(req) {
|
||||
_.each(headers, function(value, key) {
|
||||
req.setRequestHeader(key, value);
|
||||
});
|
||||
}
|
||||
};
|
||||
}
|
||||
var data = _.extend(extras, data);
|
||||
return $.ajax(data);
|
||||
};
|
||||
|
||||
// ### mapping
|
||||
//
|
||||
// Get mapping for this database.
|
||||
// Assume all docs in the view have the same schema so
|
||||
// limit query to single result.
|
||||
//
|
||||
// @return promise compatible deferred object.
|
||||
this.mapping = function() {
|
||||
var schemaUrl = self.view_url + '?limit=1&include_docs=true';
|
||||
var jqxhr = self._makeRequest({
|
||||
url: schemaUrl,
|
||||
dataType: self.options.dataType
|
||||
});
|
||||
return jqxhr;
|
||||
};
|
||||
|
||||
// ### get
|
||||
//
|
||||
// Get record corresponding to specified id
|
||||
//
|
||||
// @return promise compatible deferred object.
|
||||
this.get = function(_id) {
|
||||
var base = self.endpoint + '/' + _id;
|
||||
return self._makeRequest({
|
||||
url: base,
|
||||
dataType: 'json'
|
||||
});
|
||||
};
|
||||
|
||||
// ### upsert
|
||||
//
|
||||
// create / update a record to CouchDB backend
|
||||
//
|
||||
// @param {Object} doc an object to insert to the index.
|
||||
// @return deferred supporting promise API
|
||||
this.upsert = function(doc) {
|
||||
var data = JSON.stringify(doc);
|
||||
url = self.endpoint;
|
||||
if (doc._id) {
|
||||
url += '/' + doc._id;
|
||||
}
|
||||
// use a PUT, not a POST to update the document:
|
||||
// http://wiki.apache.org/couchdb/HTTP_Document_API#POST
|
||||
return self._makeRequest({
|
||||
url: url,
|
||||
type: 'PUT',
|
||||
data: data,
|
||||
dataType: 'json',
|
||||
contentType: 'application/json'
|
||||
});
|
||||
};
|
||||
|
||||
// ### delete
|
||||
//
|
||||
// Delete a record from the CouchDB backend.
|
||||
//
|
||||
// @param {Object} id id of object to delete
|
||||
// @return deferred supporting promise API
|
||||
this.delete = function(_id) {
|
||||
url = self.endpoint;
|
||||
url += '/' + _id;
|
||||
return self._makeRequest({
|
||||
url: url,
|
||||
type: 'DELETE',
|
||||
dataType: 'json'
|
||||
});
|
||||
};
|
||||
|
||||
// ### _normalizeQuery
|
||||
//
|
||||
// Convert the query object from Elastic Search format to a
|
||||
// Couchdb View API compatible format.
|
||||
// See: http://wiki.apache.org/couchdb/HTTP_view_API
|
||||
//
|
||||
this._normalizeQuery = function(queryObj) {
|
||||
var out = queryObj && queryObj.toJSON ? queryObj.toJSON() : _.extend({}, queryObj);
|
||||
delete out.sort;
|
||||
delete out.query;
|
||||
delete out.filters;
|
||||
delete out.fields;
|
||||
delete out.facets;
|
||||
out['skip'] = out.from || 0;
|
||||
out['limit'] = out.size || 100;
|
||||
delete out.from;
|
||||
delete out.size;
|
||||
out['include_docs'] = true;
|
||||
return out;
|
||||
};
|
||||
|
||||
// ### query
|
||||
//
|
||||
// @param {Object} recline.Query instance.
|
||||
// @param {Object} additional couchdb view query options.
|
||||
// @return deferred supporting promise API
|
||||
this.query = function(query_object, query_options) {
|
||||
var norm_q = self._normalizeQuery(query_object);
|
||||
var url = self.view_url;
|
||||
var q = _.extend(query_options, norm_q);
|
||||
|
||||
var jqxhr = self._makeRequest({
|
||||
url: url,
|
||||
data: JSON.stringify(q),
|
||||
dataType: self.options.dataType,
|
||||
});
|
||||
return jqxhr;
|
||||
}
|
||||
};
|
||||
|
||||
// ## CouchDB Backend
|
||||
//
|
||||
// Backbone connector for a CouchDB backend.
|
||||
//
|
||||
// Usage:
|
||||
//
|
||||
// var backend = new recline.Backend.CouchDB({
|
||||
// db_url: '/couchdb/mydb',
|
||||
// view_url: '/couchdb/mydb/_design/design1/_views/view1',
|
||||
// query_options: {
|
||||
// 'key': 'some_document_key'
|
||||
// }
|
||||
// });
|
||||
//
|
||||
// If these options are not passed to the constructor, the model
|
||||
// object is checked for the presence of these arguments.
|
||||
//
|
||||
// Additionally, the Dataset instance may define two methods:
|
||||
// function record_update (record, document) { ... }
|
||||
// function record_delete (record, document) { ... }
|
||||
// Where `record` is the JSON representation of the Record/Document instance
|
||||
// and `document` is the JSON document stored in couchdb.
|
||||
// When _all_docs view is used (default), a record is the same as a document
|
||||
// so these methods need not be defined.
|
||||
// They are most useful when using a custom view that performs a map-reduce
|
||||
// operation on each document to yield a record. Hence, when the record is
|
||||
// updated or deleted, an inverse operation must be performed on the original
|
||||
// document.
|
||||
//
|
||||
// @param {string} url of couchdb database.
|
||||
// @param {string} (optional) url of couchdb view. default:`db_url`/_all_docs
|
||||
// @param {Object} (optional) query options accepted by couchdb views.
|
||||
// @param {string} (optional) url of Elastic Search engine.
|
||||
//
|
||||
my.Backbone = function(options) {
|
||||
var self = this;
|
||||
this.__type__ ='couchdb';
|
||||
this.db_url = options['db_url'] || '';
|
||||
this.view_url = options['view_url'] || this.db_url + '/_all_docs';
|
||||
this.query_options = options['query_options'] || {};
|
||||
|
||||
// ### sync
|
||||
//
|
||||
// Backbone sync implementation for this backend.
|
||||
//
|
||||
this.sync = function (method, model, options) {
|
||||
var dataset = null
|
||||
if (model.__type__ == 'Dataset')
|
||||
dataset = model;
|
||||
else
|
||||
dataset = model.dataset;
|
||||
|
||||
var db_url = dataset.get('db_url') || self.db_url;
|
||||
var view_url = dataset.get('view_url') || self.view_url;
|
||||
var query_options = dataset.get('query_options') || self.query_options;
|
||||
|
||||
var cdb = new my.CouchDBWrapper(db_url, view_url);
|
||||
|
||||
if (method === "read") {
|
||||
if (model.__type__ == 'Dataset') {
|
||||
var dfd = $.Deferred();
|
||||
|
||||
// if 'doc' attribute is present, return schema of that
|
||||
// else return schema of 'value' attribute which contains
|
||||
// the map-reduce document.
|
||||
cdb.mapping().done(function(result) {
|
||||
var row = result.rows[0];
|
||||
var keys = [];
|
||||
if (view_url.search("_all_docs") !== -1) {
|
||||
keys = _.keys(row['doc']);
|
||||
keys = _.filter(keys, function (k) { return k.charAt(0) !== '_' });
|
||||
}
|
||||
else {
|
||||
keys = _.keys(row['value']);
|
||||
}
|
||||
|
||||
var fieldData = _.map(keys, function(k) {
|
||||
return { 'id' : k };
|
||||
});
|
||||
model.fields.reset(fieldData);
|
||||
|
||||
dfd.resolve(model);
|
||||
})
|
||||
.fail(function(arguments) {
|
||||
dfd.reject(arguments);
|
||||
});
|
||||
return dfd.promise();
|
||||
} else if (model.__type__ == 'Record' || model.__type__ == 'Document') {
|
||||
if (view_url.search("_all_docs") !== -1) {
|
||||
return cdb.get(model.get('_id'));
|
||||
}
|
||||
else {
|
||||
var dfd = $.Deferred();
|
||||
// decompose _id
|
||||
var id = model.get('_id').split('__')[0];
|
||||
var key = model.get('_id').split('__')[1];
|
||||
var jqxhr = cdb.query(model.dataset.get('query_options'));
|
||||
|
||||
jqxhr.done(function(records) {
|
||||
var doc = {};
|
||||
var rec = _.filter(records, function (record) {
|
||||
record['id'] == id && record['key'] == key;
|
||||
});
|
||||
doc = rec[0]; // XXX check len first
|
||||
doc['id'] = doc['_id'] = model.get('_id');
|
||||
dfd.resolve(doc);
|
||||
}).fail(function(args) {
|
||||
dfd.reject(args);
|
||||
});
|
||||
return dfd.promise();
|
||||
}
|
||||
}
|
||||
} else if (method === 'update') {
|
||||
if (model.__type__ == 'Record' || model.__type__ == 'Document') {
|
||||
var dfd = $.Deferred();
|
||||
var _id = null;
|
||||
var jqxhr;
|
||||
var new_doc = model.toJSON();
|
||||
// couchdb uses _id to identify documents, Backbone models use id.
|
||||
// we should remove it before sending it to the server.
|
||||
delete new_doc['id'];
|
||||
if (view_url.search('_all_docs') !== -1) {
|
||||
_id = model.get('_id');
|
||||
jqxhr = cdb.get(_id);
|
||||
}
|
||||
else {
|
||||
_id = model.get('_id').split('__')[0];
|
||||
jqxhr = cdb.get(_id);
|
||||
}
|
||||
|
||||
jqxhr.done(function(old_doc){
|
||||
if (model.dataset.record_update)
|
||||
new_doc = model.dataset.record_update(new_doc, old_doc);
|
||||
new_doc = _.extend(old_doc, new_doc);
|
||||
new_doc['_id'] = _id;
|
||||
// XXX upsert can fail during a bulk column transform due to revision conflict.
|
||||
// the correct way to handle bulk column transforms is to use
|
||||
// a queue which is processed by a web worker.
|
||||
dfd.resolve(cdb.upsert(new_doc));
|
||||
}).fail(function(args){
|
||||
dfd.reject(args);
|
||||
});
|
||||
|
||||
return dfd.promise();
|
||||
}
|
||||
} else if (method === 'delete') {
|
||||
if (model.__type__ == 'Record' || model.__type__ == 'Document') {
|
||||
if (view_url.search('_all_docs') !== -1)
|
||||
return cdb.delete(model.get('_id'));
|
||||
else {
|
||||
var dfd = $.Deferred();
|
||||
var _id = model.get('_id').split('__')[0];
|
||||
var new_doc = null;
|
||||
var jqxhr = cdb.get(_id);
|
||||
|
||||
jqxhr.done(function(old_doc){
|
||||
if (model.dataset.record_delete)
|
||||
new_doc = model.dataset.record_delete(model.toJSON(), old_doc);
|
||||
if (_.isNull(new_doc))
|
||||
dfd.resolve(cdb.delete(_id)); // XXX is this the right thing to do?
|
||||
else {
|
||||
// couchdb uses _id to identify documents, Backbone models use id.
|
||||
// we should remove it before sending it to the server.
|
||||
new_doc['_id'] = _id;
|
||||
delete new_doc['id'];
|
||||
dfd.resolve(cdb.upsert(new_doc));
|
||||
}
|
||||
}).fail(function(args){
|
||||
dfd.reject(args);
|
||||
});
|
||||
return dfd.promise();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
// ### query
|
||||
//
|
||||
// fetch the data from the couchdb view and filter it.
|
||||
// @param {Object} recline.Dataset instance
|
||||
// @param {Object} recline.Query instance.
|
||||
this.query = function(model, queryObj) {
|
||||
var dfd = $.Deferred();
|
||||
var db_url = model.get('db_url') || self.db_url;
|
||||
var view_url = model.get('view_url') || self.view_url;
|
||||
var query_options = model.get('query_options') || self.query_options;
|
||||
|
||||
var cdb = new my.CouchDBWrapper(db_url, view_url);
|
||||
var cdb_q = cdb._normalizeQuery(queryObj, query_options);
|
||||
|
||||
cdb.query(queryObj, query_options).done(function(records){
|
||||
|
||||
var query_result = { hits: [], total: 0 };
|
||||
_.each(records.rows, function(record) {
|
||||
var doc = {};
|
||||
if (record.hasOwnProperty('doc')) {
|
||||
doc['_source'] = record['doc'];
|
||||
// couchdb uses _id to identify documents, Backbone models use id.
|
||||
// we add this fix so backbone.Model works correctly.
|
||||
doc['_source']['id'] = doc['_source']['_id'];
|
||||
}
|
||||
else {
|
||||
doc['_source'] = record['value'];
|
||||
// using dunder to create compound id. need something more robust.
|
||||
doc['_source']['_id'] = record['id'] + '__' + record['key'];
|
||||
// couchdb uses _id to identify documents, Backbone models use id.
|
||||
// we add this fix so backbone.Model works correctly.
|
||||
doc['_source']['id'] = doc['_source']['_id'];
|
||||
}
|
||||
query_result.total += 1;
|
||||
query_result.hits.push(doc);
|
||||
});
|
||||
|
||||
// the following block is borrowed verbatim from recline.backend.Memory
|
||||
// search (with filtering, faceting, and sorting) should be factored
|
||||
// out into a separate library.
|
||||
query_result.hits = self._applyFilters(query_result.hits, queryObj);
|
||||
query_result.hits = self._applyFreeTextQuery(query_result.hits, queryObj);
|
||||
// not complete sorting!
|
||||
_.each(queryObj.sort, function(sortObj) {
|
||||
var fieldName = _.keys(sortObj)[0];
|
||||
query_result.hits = _.sortBy(query_result.hits, function(doc) {
|
||||
var _out = doc[fieldName];
|
||||
return (sortObj[fieldName].order == 'asc') ? _out : -1*_out;
|
||||
});
|
||||
});
|
||||
query_result.total = query_result.hits.length;
|
||||
query_result.facets = self.computeFacets(query_result.hits, queryObj);
|
||||
query_result.hits = query_result.hits.slice(cdb_q.skip, cdb_q.skip + cdb_q.limit+1);
|
||||
dfd.resolve(query_result);
|
||||
|
||||
});
|
||||
|
||||
return dfd.promise();
|
||||
},
|
||||
|
||||
// in place filtering
|
||||
_applyFilters: function(results, queryObj) {
|
||||
_.each(queryObj.filters, function(filter) {
|
||||
results = _.filter(results, function(doc) {
|
||||
var fieldId = _.keys(filter.term)[0];
|
||||
return (doc['_source'][fieldId] == filter.term[fieldId]);
|
||||
});
|
||||
});
|
||||
return results;
|
||||
},
|
||||
|
||||
// we OR across fields but AND across terms in query string
|
||||
_applyFreeTextQuery: function(results, queryObj) {
|
||||
if (queryObj.q) {
|
||||
var terms = queryObj.q.split(' ');
|
||||
results = _.filter(results, function(rawdoc) {
|
||||
rawdoc = rawdoc['_source'];
|
||||
var matches = true;
|
||||
_.each(terms, function(term) {
|
||||
var foundmatch = false;
|
||||
//_.each(self.fields, function(field) {
|
||||
_.each(_.keys(rawdoc), function(field) {
|
||||
var value = rawdoc[field];
|
||||
if (value !== null) { value = value.toString(); }
|
||||
// TODO regexes?
|
||||
foundmatch = foundmatch || (value === term);
|
||||
// TODO: early out (once we are true should break to spare unnecessary testing)
|
||||
// if (foundmatch) return true;
|
||||
});
|
||||
matches = matches && foundmatch;
|
||||
// TODO: early out (once false should break to spare unnecessary testing)
|
||||
// if (!matches) return false;
|
||||
});
|
||||
return matches;
|
||||
});
|
||||
}
|
||||
return results;
|
||||
},
|
||||
|
||||
computeFacets: function(records, queryObj) {
|
||||
var facetResults = {};
|
||||
if (!queryObj.facets) {
|
||||
return facetResults;
|
||||
}
|
||||
_.each(queryObj.facets, function(query, facetId) {
|
||||
// TODO: remove dependency on recline.Model
|
||||
facetResults[facetId] = new recline.Model.Facet({id: facetId}).toJSON();
|
||||
facetResults[facetId].termsall = {};
|
||||
});
|
||||
// faceting
|
||||
_.each(records, function(doc) {
|
||||
_.each(queryObj.facets, function(query, facetId) {
|
||||
var fieldId = query.terms.field;
|
||||
var val = doc['_source'][fieldId];
|
||||
var tmp = facetResults[facetId];
|
||||
if (val) {
|
||||
tmp.termsall[val] = tmp.termsall[val] ? tmp.termsall[val] + 1 : 1;
|
||||
} else {
|
||||
tmp.missing = tmp.missing + 1;
|
||||
}
|
||||
});
|
||||
});
|
||||
_.each(queryObj.facets, function(query, facetId) {
|
||||
var tmp = facetResults[facetId];
|
||||
var terms = _.map(tmp.termsall, function(count, term) {
|
||||
return { term: term, count: count };
|
||||
});
|
||||
tmp.terms = _.sortBy(terms, function(item) {
|
||||
// want descending order
|
||||
return -item.count;
|
||||
});
|
||||
tmp.terms = tmp.terms.slice(0, 10);
|
||||
});
|
||||
return facetResults;
|
||||
},
|
||||
|
||||
|
||||
});
|
||||
|
||||
}(jQuery, this.recline.Backend.CouchDB));
|
||||
@ -20,9 +20,9 @@ var costco = function() {
|
||||
;
|
||||
if (!after) after = {};
|
||||
if (currentColumn) {
|
||||
preview.push({before: JSON.stringify(before[currentColumn]), after: JSON.stringify(after[currentColumn])});
|
||||
preview.push({before: before[currentColumn], after: after[currentColumn]});
|
||||
} else {
|
||||
preview.push({before: JSON.stringify(before), after: JSON.stringify(after)});
|
||||
preview.push({before: before, after: after});
|
||||
}
|
||||
}
|
||||
return preview;
|
||||
@ -53,9 +53,9 @@ var costco = function() {
|
||||
});
|
||||
|
||||
return {
|
||||
edited: edited,
|
||||
updates: edited,
|
||||
docs: updatedDocs,
|
||||
deleted: deleted,
|
||||
deletes: deleted,
|
||||
failed: failed
|
||||
};
|
||||
}
|
||||
|
||||
82
src/model.js
82
src/model.js
@ -9,28 +9,16 @@ my.Dataset = Backbone.Model.extend({
|
||||
__type__: 'Dataset',
|
||||
|
||||
// ### initialize
|
||||
//
|
||||
// Sets up instance properties (see above)
|
||||
//
|
||||
// @param {Object} model: standard set of model attributes passed to Backbone models
|
||||
//
|
||||
// @param {Object or String} backend: Backend instance (see
|
||||
// `recline.Backend.Base`) or a string specifying that instance. The
|
||||
// string specifying may be a full class path e.g.
|
||||
// 'recline.Backend.ElasticSearch' or a simple name e.g.
|
||||
// 'elasticsearch' or 'ElasticSearch' (in this case must be a Backend in
|
||||
// recline.Backend module)
|
||||
initialize: function(model, backend) {
|
||||
initialize: function() {
|
||||
_.bindAll(this, 'query');
|
||||
this.backend = backend;
|
||||
if (typeof backend === 'undefined') {
|
||||
this.backend = null;
|
||||
if (this.get('backend')) {
|
||||
this.backend = this._backendFromString(this.get('backend'));
|
||||
} else { // try to guess backend ...
|
||||
if (this.get('records')) {
|
||||
this.backend = recline.Backend.Memory;
|
||||
}
|
||||
}
|
||||
if (typeof(backend) === 'string') {
|
||||
this.backend = this._backendFromString(backend);
|
||||
}
|
||||
this.fields = new my.FieldList();
|
||||
this.currentRecords = new my.RecordList();
|
||||
this._changes = {
|
||||
@ -43,6 +31,9 @@ my.Dataset = Backbone.Model.extend({
|
||||
this.queryState = new my.Query();
|
||||
this.queryState.bind('change', this.query);
|
||||
this.queryState.bind('facet:add', this.query);
|
||||
// store is what we query and save against
|
||||
// store will either be the backend or be a memory store if Backend fetch
|
||||
// tells us to use memory store
|
||||
this._store = this.backend;
|
||||
if (this.backend == recline.Backend.Memory) {
|
||||
this.fetch();
|
||||
@ -158,6 +149,20 @@ my.Dataset = Backbone.Model.extend({
|
||||
return this._store.save(this._changes, this.toJSON());
|
||||
},
|
||||
|
||||
transform: function(editFunc) {
|
||||
var self = this;
|
||||
if (!this._store.transform) {
|
||||
alert('Transform is not supported with this backend: ' + this.get('backend'));
|
||||
return;
|
||||
}
|
||||
this.trigger('recline:flash', {message: "Updating all visible docs. This could take a while...", persist: true, loader: true});
|
||||
this._store.transform(editFunc).done(function() {
|
||||
// reload data as records have changed
|
||||
self.query();
|
||||
self.trigger('recline:flash', {message: "Records updated successfully"});
|
||||
});
|
||||
},
|
||||
|
||||
// ### query
|
||||
//
|
||||
// AJAX method with promise API to get records from the backend.
|
||||
@ -298,13 +303,11 @@ my.Dataset.restore = function(state) {
|
||||
};
|
||||
} else {
|
||||
var datasetInfo = {
|
||||
url: state.url
|
||||
url: state.url,
|
||||
backend: state.backend
|
||||
};
|
||||
}
|
||||
dataset = new recline.Model.Dataset(
|
||||
datasetInfo,
|
||||
state.backend
|
||||
);
|
||||
dataset = new recline.Model.Dataset(datasetInfo);
|
||||
return dataset;
|
||||
};
|
||||
|
||||
@ -480,41 +483,6 @@ my.Query = Backbone.Model.extend({
|
||||
},
|
||||
updateFilter: function(index, value) {
|
||||
},
|
||||
// #### addTermFilter
|
||||
//
|
||||
// Set (update or add) a terms filter to filters
|
||||
//
|
||||
// See <http://www.elasticsearch.org/guide/reference/query-dsl/terms-filter.html>
|
||||
addTermFilter: function(fieldId, value) {
|
||||
var filters = this.get('filters');
|
||||
var filter = { term: {} };
|
||||
filter.term[fieldId] = value || '';
|
||||
filters.push(filter);
|
||||
this.set({filters: filters});
|
||||
// change does not seem to be triggered automatically
|
||||
if (value) {
|
||||
this.trigger('change');
|
||||
} else {
|
||||
// adding a new blank filter and do not want to trigger a new query
|
||||
this.trigger('change:filters:new-blank');
|
||||
}
|
||||
},
|
||||
addGeoDistanceFilter: function(field) {
|
||||
var filters = this.get('filters');
|
||||
var filter = {
|
||||
geo_distance: {
|
||||
distance: '10km',
|
||||
}
|
||||
};
|
||||
filter.geo_distance[field] = {
|
||||
'lon': 0,
|
||||
'lat': 0
|
||||
};
|
||||
filters.push(filter);
|
||||
this.set({filters: filters});
|
||||
// adding a new blank filter and do not want to trigger a new query
|
||||
this.trigger('change:filters:new-blank');
|
||||
},
|
||||
// ### removeFilter
|
||||
//
|
||||
// Remove a filter from filters at index filterIndex
|
||||
|
||||
@ -83,7 +83,7 @@ my.MultiView = Backbone.View.extend({
|
||||
</div> \
|
||||
</div> \
|
||||
<div class="recline-results-info"> \
|
||||
Results found <span class="doc-count">{{docCount}}</span> \
|
||||
<span class="doc-count">{{docCount}}</span> records\
|
||||
</div> \
|
||||
<div class="menu-right"> \
|
||||
<div class="btn-group" data-toggle="buttons-checkbox"> \
|
||||
@ -114,7 +114,7 @@ my.MultiView = Backbone.View.extend({
|
||||
this.pageViews = [{
|
||||
id: 'grid',
|
||||
label: 'Grid',
|
||||
view: new my.Grid({
|
||||
view: new my.SlickGrid({
|
||||
model: this.model,
|
||||
state: this.state.get('view-grid')
|
||||
}),
|
||||
@ -139,6 +139,12 @@ my.MultiView = Backbone.View.extend({
|
||||
model: this.model,
|
||||
state: this.state.get('view-timeline')
|
||||
}),
|
||||
}, {
|
||||
id: 'transform',
|
||||
label: 'Transform',
|
||||
view: new my.Transform({
|
||||
model: this.model
|
||||
})
|
||||
}];
|
||||
}
|
||||
// these must be called after pageViews are created
|
||||
@ -264,6 +270,8 @@ my.MultiView = Backbone.View.extend({
|
||||
this.$filterEditor.toggle();
|
||||
} else if (action === 'fields') {
|
||||
this.$fieldsView.toggle();
|
||||
} else if (action === 'transform') {
|
||||
this.transformView.el.toggle();
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@ -8,61 +8,23 @@ this.recline.View = this.recline.View || {};
|
||||
|
||||
// ## ColumnTransform
|
||||
//
|
||||
// View (Dialog) for doing data transformations (on columns of data).
|
||||
my.ColumnTransform = Backbone.View.extend({
|
||||
className: 'transform-column-view modal fade in',
|
||||
// View (Dialog) for doing data transformations
|
||||
my.Transform = Backbone.View.extend({
|
||||
className: 'recline-transform',
|
||||
template: ' \
|
||||
<div class="modal-header"> \
|
||||
<a class="close" data-dismiss="modal">×</a> \
|
||||
<h3>Functional transform on column {{name}}</h3> \
|
||||
<div class="script"> \
|
||||
<h2> \
|
||||
Transform Script \
|
||||
<button class="okButton btn btn-primary">Run on all records</button> \
|
||||
</h2> \
|
||||
<textarea class="expression-preview-code"></textarea> \
|
||||
</div> \
|
||||
<div class="modal-body"> \
|
||||
<div class="grid-layout layout-tight layout-full"> \
|
||||
<table> \
|
||||
<tbody> \
|
||||
<tr> \
|
||||
<td colspan="4"> \
|
||||
<div class="grid-layout layout-tight layout-full"> \
|
||||
<table rows="4" cols="4"> \
|
||||
<tbody> \
|
||||
<tr style="vertical-align: bottom;"> \
|
||||
<td colspan="4"> \
|
||||
Expression \
|
||||
</td> \
|
||||
</tr> \
|
||||
<tr> \
|
||||
<td colspan="3"> \
|
||||
<div class="input-container"> \
|
||||
<textarea class="expression-preview-code"></textarea> \
|
||||
</div> \
|
||||
</td> \
|
||||
<td class="expression-preview-parsing-status" width="150" style="vertical-align: top;"> \
|
||||
No syntax error. \
|
||||
</td> \
|
||||
</tr> \
|
||||
<tr> \
|
||||
<td colspan="4"> \
|
||||
<div id="expression-preview-tabs"> \
|
||||
<span>Preview</span> \
|
||||
<div id="expression-preview-tabs-preview"> \
|
||||
<div class="expression-preview-container"> \
|
||||
</div> \
|
||||
</div> \
|
||||
</div> \
|
||||
</td> \
|
||||
</tr> \
|
||||
</tbody> \
|
||||
</table> \
|
||||
</div> \
|
||||
</td> \
|
||||
</tr> \
|
||||
</tbody> \
|
||||
</table> \
|
||||
</div> \
|
||||
<div class="expression-preview-parsing-status"> \
|
||||
No syntax error. \
|
||||
</div> \
|
||||
<div class="modal-footer"> \
|
||||
<button class="okButton btn primary"> Update All </button> \
|
||||
<button class="cancelButton btn danger">Cancel</button> \
|
||||
<div class="preview"> \
|
||||
<h3>Preview</h3> \
|
||||
<div class="expression-preview-container"></div> \
|
||||
</div> \
|
||||
',
|
||||
|
||||
@ -71,19 +33,19 @@ my.ColumnTransform = Backbone.View.extend({
|
||||
'keydown .expression-preview-code': 'onEditorKeydown'
|
||||
},
|
||||
|
||||
initialize: function() {
|
||||
initialize: function(options) {
|
||||
this.el = $(this.el);
|
||||
this.render();
|
||||
},
|
||||
|
||||
render: function() {
|
||||
var htmls = Mustache.render(this.template,
|
||||
{name: this.state.currentColumn}
|
||||
);
|
||||
var htmls = Mustache.render(this.template);
|
||||
this.el.html(htmls);
|
||||
// Put in the basic (identity) transform script
|
||||
// TODO: put this into the template?
|
||||
var editor = this.el.find('.expression-preview-code');
|
||||
editor.val("function(doc) {\n doc['"+ this.state.currentColumn+"'] = doc['"+ this.state.currentColumn+"'];\n return doc;\n}");
|
||||
var col = this.model.fields.models[0].id;
|
||||
editor.val("function(doc) {\n doc['"+ col +"'] = doc['"+ col +"'];\n return doc;\n}");
|
||||
editor.focus().get(0).setSelectionRange(18, 18);
|
||||
editor.keydown();
|
||||
},
|
||||
@ -96,58 +58,38 @@ my.ColumnTransform = Backbone.View.extend({
|
||||
this.trigger('recline:flash', {message: "Error with function! " + editFunc.errorMessage});
|
||||
return;
|
||||
}
|
||||
this.el.modal('hide');
|
||||
this.trigger('recline:flash', {message: "Updating all visible docs. This could take a while...", persist: true, loader: true});
|
||||
var docs = self.model.currentRecords.map(function(doc) {
|
||||
return doc.toJSON();
|
||||
});
|
||||
// TODO: notify about failed docs?
|
||||
var toUpdate = costco.mapDocs(docs, editFunc).edited;
|
||||
var totalToUpdate = toUpdate.length;
|
||||
function onCompletedUpdate() {
|
||||
totalToUpdate += -1;
|
||||
if (totalToUpdate === 0) {
|
||||
self.trigger('recline:flash', {message: toUpdate.length + " records updated successfully"});
|
||||
alert('WARNING: We have only updated the docs in this view. (Updating of all docs not yet implemented!)');
|
||||
self.remove();
|
||||
}
|
||||
}
|
||||
// TODO: Very inefficient as we search through all docs every time!
|
||||
_.each(toUpdate, function(editedDoc) {
|
||||
var realDoc = self.model.currentRecords.get(editedDoc.id);
|
||||
realDoc.set(editedDoc);
|
||||
realDoc.save().then(onCompletedUpdate).fail(onCompletedUpdate);
|
||||
});
|
||||
this.el.remove();
|
||||
this.model.transform(editFunc);
|
||||
},
|
||||
|
||||
editPreviewTemplate: ' \
|
||||
<div class="expression-preview-table-wrapper"> \
|
||||
<table class="table table-condensed"> \
|
||||
<table class="table table-condensed table-bordered"> \
|
||||
<thead> \
|
||||
<tr> \
|
||||
<th class="expression-preview-heading"> \
|
||||
before \
|
||||
</th> \
|
||||
<th class="expression-preview-heading"> \
|
||||
after \
|
||||
</th> \
|
||||
<th></th> \
|
||||
{{#fields}} \
|
||||
<th>{{id}}</th> \
|
||||
{{/fields}} \
|
||||
</tr> \
|
||||
</thead> \
|
||||
<tbody> \
|
||||
{{#rows}} \
|
||||
<tr> \
|
||||
<th>Before</th> \
|
||||
{{#row.before}} \
|
||||
<td class="expression-preview-value"> \
|
||||
{{before}} \
|
||||
</td> \
|
||||
<td class="expression-preview-value"> \
|
||||
{{after}} \
|
||||
{{.}} \
|
||||
</td> \
|
||||
{{/row.before}} \
|
||||
</tr> \
|
||||
<tr> \
|
||||
<th>After</th> \
|
||||
{{#row.after}} \
|
||||
<td class="expression-preview-value"> \
|
||||
{{.}} \
|
||||
</td> \
|
||||
{{/row.after}} \
|
||||
</tr> \
|
||||
{{/rows}} \
|
||||
</tbody> \
|
||||
</table> \
|
||||
</div> \
|
||||
',
|
||||
|
||||
onEditorKeydown: function(e) {
|
||||
@ -161,10 +103,27 @@ my.ColumnTransform = Backbone.View.extend({
|
||||
var docs = self.model.currentRecords.map(function(doc) {
|
||||
return doc.toJSON();
|
||||
});
|
||||
var previewData = costco.previewTransform(docs, editFunc, self.state.currentColumn);
|
||||
var previewData = costco.previewTransform(docs, editFunc);
|
||||
var $el = self.el.find('.expression-preview-container');
|
||||
var templated = Mustache.render(self.editPreviewTemplate, {rows: previewData.slice(0,4)});
|
||||
$el.html(templated);
|
||||
var fields = self.model.fields.toJSON();
|
||||
var rows = _.map(previewData.slice(0,4), function(row) {
|
||||
return {
|
||||
before: _.map(fields, function(field) {
|
||||
return row.before[field.id];
|
||||
}),
|
||||
after: _.map(fields, function(field) {
|
||||
return row.after[field.id];
|
||||
})
|
||||
};
|
||||
});
|
||||
$el.html('');
|
||||
_.each(rows, function(row) {
|
||||
var templated = Mustache.render(self.editPreviewTemplate, {
|
||||
fields: fields,
|
||||
row: row
|
||||
});
|
||||
$el.append(templated);
|
||||
});
|
||||
} else {
|
||||
errors.text(editFunc.errorMessage);
|
||||
}
|
||||
|
||||
@ -25,10 +25,9 @@ test("parseCSV", function() {
|
||||
'"Xyz ""ABC"" O\'Brien", 11:35\n' +
|
||||
'"Other, AN", 12:35\n';
|
||||
var dataset = new recline.Model.Dataset({
|
||||
data: csv
|
||||
},
|
||||
'csv'
|
||||
);
|
||||
data: csv,
|
||||
backend: 'csv'
|
||||
});
|
||||
dataset.fetch();
|
||||
equal(dataset.currentRecords.length, 3);
|
||||
var row = dataset.currentRecords.models[0].toJSON();
|
||||
@ -71,9 +71,9 @@ test('DataProxy Backend', function() {
|
||||
equal(backend.__type__, 'dataproxy');
|
||||
|
||||
var dataset = new recline.Model.Dataset({
|
||||
url: 'http://webstore.thedatahub.org/rufuspollock/gold_prices/data.csv'
|
||||
},
|
||||
'dataproxy'
|
||||
url: 'http://webstore.thedatahub.org/rufuspollock/gold_prices/data.csv',
|
||||
backend: 'dataproxy'
|
||||
}
|
||||
);
|
||||
|
||||
var stub = sinon.stub($, 'ajax', function(options) {
|
||||
@ -250,10 +250,9 @@ module("Backend ElasticSearch - Recline");
|
||||
|
||||
test("query", function() {
|
||||
var dataset = new recline.Model.Dataset({
|
||||
url: 'https://localhost:9200/my-es-db/my-es-type'
|
||||
},
|
||||
'elasticsearch'
|
||||
);
|
||||
url: 'https://localhost:9200/my-es-db/my-es-type',
|
||||
backend: 'elasticsearch'
|
||||
});
|
||||
|
||||
var stub = sinon.stub($, 'ajax', function(options) {
|
||||
if (options.url.indexOf('_mapping') != -1) {
|
||||
@ -292,10 +291,9 @@ test("query", function() {
|
||||
|
||||
test("write", function() {
|
||||
var dataset = new recline.Model.Dataset({
|
||||
url: 'http://localhost:9200/recline-test/es-write'
|
||||
},
|
||||
'elasticsearch'
|
||||
);
|
||||
url: 'http://localhost:9200/recline-test/es-write',
|
||||
backend: 'elasticsearch'
|
||||
});
|
||||
|
||||
stop();
|
||||
|
||||
@ -169,10 +169,9 @@ var sample_gdocs_spreadsheet_data = {
|
||||
|
||||
test("GDocs Backend", function() {
|
||||
var dataset = new recline.Model.Dataset({
|
||||
url: 'https://spreadsheets.google.com/feeds/list/0Aon3JiuouxLUdDQwZE1JdV94cUd6NWtuZ0IyWTBjLWc/od6/public/values?alt=json'
|
||||
},
|
||||
'gdocs'
|
||||
);
|
||||
url: 'https://spreadsheets.google.com/feeds/list/0Aon3JiuouxLUdDQwZE1JdV94cUd6NWtuZ0IyWTBjLWc/od6/public/values?alt=json',
|
||||
backend: 'gdocs'
|
||||
});
|
||||
|
||||
var stub = sinon.stub($, 'getJSON', function(options, cb) {
|
||||
var partialUrl = 'spreadsheets.google.com';
|
||||
@ -29,19 +29,18 @@
|
||||
|
||||
<!-- model and backend tests -->
|
||||
<script type="text/javascript" src="../src/model.js"></script>
|
||||
<script type="text/javascript" src="../src/backend/base.js"></script>
|
||||
<script type="text/javascript" src="../src/backend/memory.js"></script>
|
||||
<script type="text/javascript" src="../src/backend/dataproxy.js"></script>
|
||||
<script type="text/javascript" src="../src/backend/gdocs.js"></script>
|
||||
<script type="text/javascript" src="../src/backend/elasticsearch.js"></script>
|
||||
<script type="text/javascript" src="../src/backend/csv.js"></script>
|
||||
<script type="text/javascript" src="../src/backend.memory.js"></script>
|
||||
<script type="text/javascript" src="../src/backend.dataproxy.js"></script>
|
||||
<script type="text/javascript" src="../src/backend.gdocs.js"></script>
|
||||
<script type="text/javascript" src="../src/backend.elasticsearch.js"></script>
|
||||
<script type="text/javascript" src="../src/backend.csv.js"></script>
|
||||
|
||||
<script type="text/javascript" src="model.test.js"></script>
|
||||
<script type="text/javascript" src="backend/memory.test.js"></script>
|
||||
<script type="text/javascript" src="backend/dataproxy.test.js"></script>
|
||||
<script type="text/javascript" src="backend/gdocs.test.js"></script>
|
||||
<script type="text/javascript" src="backend/elasticsearch.test.js"></script>
|
||||
<script type="text/javascript" src="backend/csv.test.js"></script>
|
||||
<script type="text/javascript" src="backend.memory.test.js"></script>
|
||||
<script type="text/javascript" src="backend.dataproxy.test.js"></script>
|
||||
<script type="text/javascript" src="backend.gdocs.test.js"></script>
|
||||
<script type="text/javascript" src="backend.elasticsearch.test.js"></script>
|
||||
<script type="text/javascript" src="backend.csv.test.js"></script>
|
||||
|
||||
<!-- views and view tests -->
|
||||
<script type="text/javascript" src="../src/view.grid.js"></script>
|
||||
|
||||
@ -274,10 +274,4 @@ test('Query.addFilter', function () {
|
||||
deepEqual(exp, query.get('filters')[1]);
|
||||
});
|
||||
|
||||
test('Query.addTermFilter', function () {
|
||||
var query = new recline.Model.Query();
|
||||
query.addTermFilter('xyz', 'this-value');
|
||||
deepEqual({term: {xyz: 'this-value'}}, query.get('filters')[0]);
|
||||
});
|
||||
|
||||
})(this.jQuery);
|
||||
|
||||
@ -30,7 +30,6 @@ test('get State', function () {
|
||||
equal(state.get('readOnly'), false);
|
||||
equal(state.get('currentView'), null);
|
||||
equal(state.get('query').size, 100);
|
||||
deepEqual(state.get('view-grid').hiddenFields, []);
|
||||
deepEqual(state.get('view-graph').group, null);
|
||||
equal(state.get('backend'), 'memory');
|
||||
ok(state.get('url') === url);
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user