<commit_before><!doctype html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">

	<title>Cosmoz Omnitable demo</title>

	<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
	<link rel="import" href="../../polymer/polymer.html">
	<link rel="import" href="../../iron-flex-layout/iron-flex-layout.html">
	<link rel="import" href="../../iron-flex-layout/iron-flex-layout-classes.html">
	<link rel="import" href="../../iron-icons/editor-icons.html">
	<link rel="import" href="../../iron-icons/iron-icons.html">
	<link rel="import" href="../../paper-button/paper-button.html">
	<link rel="import" href="../../cosmoz-i18next/cosmoz-i18next.html">
	<link rel="import" href="../cosmoz-omnitable.html">
	<link rel="import" href="multi-filter-column.html">

	<link rel="import" href="table-demo-behavior.html">

	<style is="custom-style" include="iron-flex iron-flex-alignment iron-positioning">

	</style>

</head>
<body class="fullbleed">
	<dom-module id="x-page">
		<template>
			<style include="iron-flex iron-positioning">
				:host {
					display: block;
					position: relative;
				}

				.action {
					padding: 5px;
					margin: 5px 5px 10px 5px;
				}
			</style>
			<div class="layout vertical fit">
				<h3>Cosmoz omnitable multi value filter demo</h3>

				<div class="layout horizontal center">
					<button class="action" on-tap="changeData">Generate a new data set</button>
					<div class="action">
						Selected items count: <span>{{selectedItems.length}}</span>
					</div>
				</div>
				<div class="layout vertical">
					<div>Id filters</div>
					<ul>
						<template is="dom-repeat" items="{{idFilters}}">
							<li>{{item}}</li>
						</template>
					</ul>
				</div>

				<cosmoz-omnitable id="omnitable" data="[[data]]" class="flex" selection-enabled selected-items="{{selectedItems}}">
					<multi-filter-column title="Id" value-path="id" filter="{{idFilters}}">
					</multi-filter-column>
					<cosmoz-omnitable-column-boolean title="Boolean" value-path="bool" filter="{{boolFilter}}"
						true-label="Oui" false-label="Non"></cosmoz-omnitable-column-boolean>
					<cosmoz-omnitable-column-number title="Value" value-path="value" locale="{{locale}}" filter="{{numberFilter}}"></cosmoz-omnitable-column-number>
					<cosmoz-omnitable-column-amount title="Amount" value-path="amount" filter="{{amountFilter}}"></cosmoz-omnitable-column-amount>
					<cosmoz-omnitable-column-date title="Date" value-path="dateJSON" locale="sv" filter="{{dateFilter}}"></cosmoz-omnitable-column-date>
					<cosmoz-omnitable-column title="Sub-property" value-path="sub.subProp"></cosmoz-omnitable-column>
					<cosmoz-omnitable-column title="Name" value-path="name" filter="{{nameFilter}}">
					</cosmoz-omnitable-column>
				</cosmoz-omnitable>
			</div>
		</template>
	</dom-module>

	<x-page class="fit"></x-page>

	<script type="text/javascript">
/*global document, window, Cosmoz, Polymer */
(function () {
	'use strict';


	Polymer({
		is: 'x-page',

		properties: {
			data: {
				type: Array
			},
			selectedItems: {
				type: Array
			},
			nameFilter: {
				type: String
			},
			boolFilter: {
				type: Boolean
			},
			idFiltersString: {
				type: String,
			}
		},

		behaviors: [
			Cosmoz.TableDemoBehavior
		],

		ready: function () {
			//this.changeData();
		},

		attached: function () {
			this.data = this.generateTableDemoData(20,25, 25);
		},

		changeData: function () {
			this.data = this.generateTableDemoData(20,25, 10);
		},

		_computeLabel: function (text, count) {<commit_msg>[eslint] demo/multi-filter-demo<commit_after><!doctype html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">

	<title>Cosmoz Omnitable demo</title>

	<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
	<link rel="import" href="../../polymer/polymer.html">
	<link rel="import" href="../../iron-flex-layout/iron-flex-layout.html">
	<link rel="import" href="../../iron-flex-layout/iron-flex-layout-classes.html">
	<link rel="import" href="../../iron-icons/editor-icons.html">
	<link rel="import" href="../../iron-icons/iron-icons.html">
	<link rel="import" href="../../paper-button/paper-button.html">
	<link rel="import" href="../../cosmoz-i18next/cosmoz-i18next.html">
	<link rel="import" href="../cosmoz-omnitable.html">
	<link rel="import" href="multi-filter-column.html">

	<link rel="import" href="table-demo-behavior.html">

	<style is="custom-style" include="iron-flex iron-flex-alignment iron-positioning">

	</style>

</head>
<body class="fullbleed">
	<dom-module id="x-page">
		<template>
			<style include="iron-flex iron-positioning">
				:host {
					display: block;
					position: relative;
				}

				.action {
					padding: 5px;
					margin: 5px 5px 10px 5px;
				}
			</style>
			<div class="layout vertical fit">
				<h3>Cosmoz omnitable multi value filter demo</h3>

				<div class="layout horizontal center">
					<button class="action" on-tap="changeData">Generate a new data set</button>
					<div class="action">
						Selected items count: <span>{{selectedItems.length}}</span>
					</div>
				</div>
				<div class="layout vertical">
					<div>Id filters</div>
					<ul>
						<template is="dom-repeat" items="{{idFilters}}">
							<li>{{item}}</li>
						</template>
					</ul>
				</div>

				<cosmoz-omnitable id="omnitable" data="[[data]]" class="flex" selection-enabled selected-items="{{selectedItems}}">
					<multi-filter-column title="Id" value-path="id" filter="{{idFilters}}">
					</multi-filter-column>
					<cosmoz-omnitable-column-boolean title="Boolean" value-path="bool" filter="{{boolFilter}}"
						true-label="Oui" false-label="Non"></cosmoz-omnitable-column-boolean>
					<cosmoz-omnitable-column-number title="Value" value-path="value" locale="{{locale}}" filter="{{numberFilter}}"></cosmoz-omnitable-column-number>
					<cosmoz-omnitable-column-amount title="Amount" value-path="amount" filter="{{amountFilter}}"></cosmoz-omnitable-column-amount>
					<cosmoz-omnitable-column-date title="Date" value-path="dateJSON" locale="sv" filter="{{dateFilter}}"></cosmoz-omnitable-column-date>
					<cosmoz-omnitable-column title="Sub-property" value-path="sub.subProp"></cosmoz-omnitable-column>
					<cosmoz-omnitable-column title="Name" value-path="name" filter="{{nameFilter}}">
					</cosmoz-omnitable-column>
				</cosmoz-omnitable>
			</div>
		</template>
	</dom-module>

	<x-page class="fit"></x-page>

	<script type="text/javascript">
/*global document, window, Cosmoz, Polymer */
(function () {
	'use strict';


	Polymer({
		is: 'x-page',

		properties: {
			data: {
				type: Array
			},
			selectedItems: {
				type: Array
			},
			nameFilter: {
				type: String
			},
			boolFilter: {
				type: Boolean
			},
			idFiltersString: {
				type: String,
			}
		},

		behaviors: [
			Cosmoz.TableDemoBehavior
		],

		ready: function () {
			//this.changeData();
		},

		attached: function () {
			this.data = this.generateTableDemoData(20, 25, 25);
		},

		changeData: function () {
			this.data = this.generateTableDemoData(20, 25, 10);
		},

		_computeLabel: function (text, count) {
{'fraction_non_alphanumeric': 0.19574881911642122, 'fraction_numerical': 0.0075020839121978326, 'mean_word_length': 3.7330703484549637, 'pattern_counts': {'":': 0, '<': 143, '<?xml version=': 0, '>': 143, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4198102', 'n_tokens_mistral': 2895, 'n_tokens_neox': 2389, 'n_words': 421}