YannBrrd/app.js

## app.js
// app.js
angular.module('cs_demo', [
    'controllers',
    'elasticjs.service',
    'ui.bootstrap'
]);

## controller.js
// controllers.js
angular.module('controllers', [])
    .controller('CSProjectCtrl', function($scope, ejsResource) {

        var ejs = ejsResource('http://localhost:9200');

        $scope.Math = window.Math;

        $scope.noOfPages = 1;
        $scope.currentPage = 1;
        $scope.maxSize = 5;

        $scope.search = function(pageNum) {

            if($scope.ssnumber == null)
                return;

            $scope.currentPage = pageNum;

            var oQuery = ejs.BoolQuery().must(ejs.TermQuery("cliName", $scope.cliname));

            var mysearches = ejs.Request()
                .indices('myindex')
                .types('mytype')
                .from(($scope.currentPage - 1) * 10);

            $scope.results = mysearches
                .query(oQuery.must((ejs.QueryStringQuery($scope.queryTerm || '*'))))
                .doSearch();
        };

        $scope.$watch('currentPage', function() {
            $scope.search($scope.currentPage);
        });
    });

## index.html
<!DOCTYPE html>
<html ng-app="cs_demo">
    <head>
        <link rel="stylesheet" href="common/css/bootstrap.min.css">
        <link href="common/css/bootstrap-responsive.css" rel="stylesheet">
        <link href="common/css/bootstrap-combobox.css" media="screen" rel="stylesheet" type="text/css">
        <link href="common/css/dangle.css" media="screen" rel="stylesheet" type="text/css">
        <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
        <!--[if lt IE 9]>
          <script src="../assets/js/html5shiv.js"></script>
        <![endif]-->

        <!-- project dependency libs -->
        <script src="common/lib/jquery.js"></script>
        <script src="common/lib/angular.min.js"></script>
        <script src="common/lib/elastic.min.js"></script>
        <script src="common/lib/elastic-angular-client.min.js"></script>
        <script src="common/lib/ui-bootstrap-tpls-0.2.0.min.js"></script>

        <!-- project specific files -->
        <script src="js/app.js"></script>
        <script src="js/controllers.js"></script>
    </head>
    <body ng-controller="CSProjectCtrl">
        <div class="masthead">
            <h3 class="muted">My data</h3>
        </div>
        <div class="container-fluid" >
            <div class="span5 offset1" id="cliSearchSearch" ><!-- ssnumber -->
                <form class="form-inline">
                        <input type="text" class="input-large search-query" placeholder="client ID..." ng-model="cliname" >&nbsp;&nbsp;<button type="submit" ng-click="search(1)" class="btn">Filtrer</button>
                </form>
            </div>
            <div class="span5 offset1" style="float:left">
                <h3>ID</h3>
                    <span ng-repeat="doc in results.hits.hits">
                        <span ng-show="$first">
                            Name : {{doc._source.clientName}}<br/>
                            Data count : {{results.hits.total}}<br/>
                        </span>
                    </span>
            </div>
        </div>

        <hr />
        <div class="container-fluid">
             <div class="row-fluid">
                <div class="span12 pagination-centered" id="eventSearch"><!-- event search -->
                    <form class="form-inline">
                        <input type="text" class="input-large search-query" placeholder="Search" ng-model="queryTerm" >&nbsp;&nbsp;<button type="submit" ng-click="search(1)" class="btn">My data</button>
                    </form>
                    <table class="table table-bordered table-striped table-condensed">
                         <thead>
                            <tr>
                                <th>Client ID</th>
                                <th>Payment</th>
                                <th>Type</th>
                                <th>Date</th>
                                <th>Value</th>
                                <th>Real value</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr ng-repeat="doc in results.hits.hits">
                                <td>{{doc._source.cliname}}</td>
                                <td>{{doc._source.payment}}</td>
                                <td>{{doc._source.type}}</td>
                                <td>{{doc._source.value}}</td>
                                <td>{{doc._source.realvalue}}</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
            <div align="center">
                <pagination num-pages="Math.floor(results.hits.total / 10 - 0.1) + 1" current-page="currentPage" class="pagination-small" previous-text="&laquo;" next-text="&raquo;"></pagination>
            </div>
        </div>
        </div>
    </body>
</html>
	// app.js
	angular.module('cs_demo', [
	'controllers',
	'elasticjs.service',
	'ui.bootstrap'
	]);
	// controllers.js
	angular.module('controllers', [])
	.controller('CSProjectCtrl', function($scope, ejsResource) {

	var ejs = ejsResource('http://localhost:9200');

	$scope.Math = window.Math;

	$scope.noOfPages = 1;
	$scope.currentPage = 1;
	$scope.maxSize = 5;

	$scope.search = function(pageNum) {

	if($scope.ssnumber == null)
	return;

	$scope.currentPage = pageNum;

	var oQuery = ejs.BoolQuery().must(ejs.TermQuery("cliName", $scope.cliname));

	var mysearches = ejs.Request()
	.indices('myindex')
	.types('mytype')
	.from(($scope.currentPage - 1) * 10);

	$scope.results = mysearches
	.query(oQuery.must((ejs.QueryStringQuery($scope.queryTerm \|\| '*'))))
	.doSearch();
	};

	$scope.$watch('currentPage', function() {
	$scope.search($scope.currentPage);
	});
	});
	<!DOCTYPE html>
	<html ng-app="cs_demo">
	<head>
	<link rel="stylesheet" href="common/css/bootstrap.min.css">
	<link href="common/css/bootstrap-responsive.css" rel="stylesheet">
	<link href="common/css/bootstrap-combobox.css" media="screen" rel="stylesheet" type="text/css">
	<link href="common/css/dangle.css" media="screen" rel="stylesheet" type="text/css">
	<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
	<!--[if lt IE 9]>
	<script src="../assets/js/html5shiv.js"></script>
	<![endif]-->

	<!-- project dependency libs -->
	<script src="common/lib/jquery.js"></script>
	<script src="common/lib/angular.min.js"></script>
	<script src="common/lib/elastic.min.js"></script>
	<script src="common/lib/elastic-angular-client.min.js"></script>
	<script src="common/lib/ui-bootstrap-tpls-0.2.0.min.js"></script>

	<!-- project specific files -->
	<script src="js/app.js"></script>
	<script src="js/controllers.js"></script>
	</head>
	<body ng-controller="CSProjectCtrl">
	<div class="masthead">
	<h3 class="muted">My data</h3>
	</div>
	<div class="container-fluid" >
	<div class="span5 offset1" id="cliSearchSearch" ><!-- ssnumber -->
	<form class="form-inline">
	<input type="text" class="input-large search-query" placeholder="client ID..." ng-model="cliname" >  <button type="submit" ng-click="search(1)" class="btn">Filtrer</button>
	</form>
	</div>
	<div class="span5 offset1" style="float:left">
	<h3>ID</h3>
	<span ng-repeat="doc in results.hits.hits">
	<span ng-show="$first">
	Name : {{doc._source.clientName}}<br/>
	Data count : {{results.hits.total}}<br/>
	</span>
	</span>
	</div>
	</div>

	<hr />
	<div class="container-fluid">
	<div class="row-fluid">
	<div class="span12 pagination-centered" id="eventSearch"><!-- event search -->
	<form class="form-inline">
	<input type="text" class="input-large search-query" placeholder="Search" ng-model="queryTerm" >  <button type="submit" ng-click="search(1)" class="btn">My data</button>
	</form>
	<table class="table table-bordered table-striped table-condensed">
	<thead>
	<tr>
	<th>Client ID</th>
	<th>Payment</th>
	<th>Type</th>
	<th>Date</th>
	<th>Value</th>
	<th>Real value</th>
	</tr>
	</thead>
	<tbody>
	<tr ng-repeat="doc in results.hits.hits">
	<td>{{doc._source.cliname}}</td>
	<td>{{doc._source.payment}}</td>
	<td>{{doc._source.type}}</td>
	<td>{{doc._source.value}}</td>
	<td>{{doc._source.realvalue}}</td>
	</tr>
	</tbody>
	</table>
	</div>
	</div>
	<div align="center">
	<pagination num-pages="Math.floor(results.hits.total / 10 - 0.1) + 1" current-page="currentPage" class="pagination-small" previous-text="«" next-text="»"></pagination>
	</div>
	</div>
	</div>
	</body>
	</html>