Skip to content

Commit

Permalink
Merge branch 'develop'
Browse files Browse the repository at this point in the history
  • Loading branch information
budnix committed Jul 17, 2017
2 parents 934aabb + 2f98836 commit 34de7ab
Show file tree
Hide file tree
Showing 34 changed files with 694 additions and 1,394 deletions.
32 changes: 27 additions & 5 deletions bower.json
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,10 @@
"grid",
"table"
],
"dependencies": {
"polymer": "Polymer/polymer#^2.0.0",
"handsontable": "~0.24.0"
},
"ignore": [
"**/.*",
"node_modules",
Expand All @@ -19,11 +23,29 @@
"test",
"tests"
],
"dependencies": {
"polymer": "Polymer/polymer#^1.2.0",
"handsontable": "~0.24.0"
},
"devDependencies": {
"google-map": "GoogleWebComponents/google-map#^1.1.7"
"iron-demo-helpers": "PolymerElements/iron-demo-helpers#^2.0.0",
"web-component-tester": "Polymer/web-component-tester#^6.0.0",
"webcomponentsjs": "webcomponents/webcomponentsjs#^v1.0.0",
"google-map": "GoogleWebComponents/google-map#^1.2.0"
},
"variants": {
"1.x": {
"dependencies": {
"polymer": "Polymer/polymer#^1.9"
},
"devDependencies": {
"iron-demo-helpers": "PolymerElements/iron-demo-helpers#^1.0.0",
"web-component-tester": "^4.0.0",
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0",
"google-map": "GoogleWebComponents/google-map#^1.2.0"
},
"resolutions": {
"webcomponentsjs": "^0.7"
}
}
},
"resolutions": {
"polymer": "^2.0.0"
}
}
95 changes: 27 additions & 68 deletions examples/bind-rows-with-headers.html
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,9 @@
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/styles/default.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/highlight.min.js"></script>

<!-- Pikaday styles -->
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/pikaday/1.6.1/css/pikaday.min.css">

<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/main.css"/>

Expand All @@ -19,57 +22,13 @@
<link rel="import" href="components/bold-renderer.html">

<!-- Handsontable PRO trial files -->
<link rel="stylesheet" href="//handsontable.com/static/bower_components/handsontable-pro/dist/handsontable.full.min.css">
<script src="//handsontable.com/static/bower_components/handsontable-pro/dist/handsontable.full.min.js"></script>
<link rel="stylesheet" href="//docs.handsontable.com/pro/1.10.0/bower_components/handsontable-pro/dist/handsontable.full.min.css">
<script src="//docs.handsontable.com/pro/1.10.0/bower_components/handsontable-pro/dist/handsontable.full.min.js"></script>

<style>
hot-table {
font-size: 12px;
}
hot-table google-map {
height: 200px;
width: 400px;
}
hot-table .map-editor {
background-color: white;
width: 400px;
padding: 5px;
box-shadow: 0 0 5px 0 #ddd;
}
hot-table .languages-editor {
background-color: white;
width: 169px;
padding: 5px;
box-shadow: 0 0 5px 0 #ddd;
}
hot-table .color-editor {
width: 100%;
height: 100%;
}
.no-padding {
padding: 0 !important;
}
.color-editor div {
height: 100%;
}
.black {
background-color: black;
}
.blue {
background-color: blue;
}
.green {
background-color: green;
}
.orange {
background-color: orange;
}
.red {
background-color: red;
}
.yellow {
background-color: yellow;
}
</style>
</head>
<body>
Expand All @@ -83,20 +42,22 @@ <h2 class="logo-desc">Binding rows with headers demo</h2>
<h2>Simple Example (strict mode)</h2>

<div class="example">
<template id="tpl" is="dom-bind">
<hot-table width="420" height="280" datarows="{{ people }}" row-headers context-menu bind-rows-with-headers="strict">
<hot-column width="50" read-only value="id" header="ID" type="numeric"></hot-column>
<hot-column width="100" value="name.first" header="First Name"></hot-column>
<hot-column width="100" value="name.last" header="Last Name">
<template data-hot-role="renderer" is="dom-template">
<bold-renderer value="{{ value }}"></bold-renderer>
</template>
</hot-column>
<hot-column width="100" value="gender" type="dropdown" source="genderList" header="Gender">
<template data-hot-role="renderer" is="dom-template">(<span>{{ value }}</span>)</template>
</hot-column>
</hot-table>
</template>
<dom-bind>
<template id="tpl" is="dom-bind">
<hot-table width="420" height="280" datarows="{{ people }}" row-headers context-menu bind-rows-with-headers="strict">
<hot-column width="50" read-only value="id" header="ID" type="numeric"></hot-column>
<hot-column width="100" value="name.first" header="First Name"></hot-column>
<hot-column width="100" value="name.last" header="Last Name">
<template data-hot-role="renderer" is="dom-template">
<bold-renderer value="{{ value }}"></bold-renderer>
</template>
</hot-column>
<hot-column width="100" value="gender" type="dropdown" source="genderList" header="Gender">
<template data-hot-role="renderer" is="dom-template">(<span>{{ value }}</span>)</template>
</hot-column>
</hot-table>
</template>
</dom-bind>
</div>

<p>
Expand Down Expand Up @@ -148,15 +109,13 @@ <h2>Code</h2>
coordinates: {lat: 59.3288242, lng: 18.0729393}, languages: ['us']}
];

window.addEventListener('dom-change', function () {
var tpl = document.getElementById('tpl');
var domBind = document.querySelector('dom-bind');

tpl.people = people;
tpl.genderList = genderList;
tpl.languagesComputedSrc = function(code) {
return 'resources/flags/' + code + '.png';
}
});
domBind.people = people;
domBind.genderList = genderList;
domBind.languagesComputedSrc = function(code) {
return 'resources/flags/' + code + '.png';
}
</script>
<script>hljs.initHighlightingOnLoad();</script>
</div>
Expand Down
79 changes: 37 additions & 42 deletions examples/collapsing-columns.html
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,9 @@
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/styles/default.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/highlight.min.js"></script>

<!-- Pikaday styles -->
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/pikaday/1.6.1/css/pikaday.min.css">

<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/main.css"/>

Expand All @@ -19,8 +22,8 @@
<link rel="import" href="components/bold-renderer.html">

<!-- Handsontable PRO trial files -->
<link rel="stylesheet" href="//handsontable.com/static/bower_components/handsontable-pro/dist/handsontable.full.min.css">
<script src="//handsontable.com/static/bower_components/handsontable-pro/dist/handsontable.full.min.js"></script>
<link rel="stylesheet" href="//docs.handsontable.com/pro/1.10.0/bower_components/handsontable-pro/dist/handsontable.full.min.css">
<script src="//docs.handsontable.com/pro/1.10.0/bower_components/handsontable-pro/dist/handsontable.full.min.js"></script>
</head>
<body>

Expand All @@ -33,19 +36,21 @@ <h2 class="logo-desc">Collapsing columns with nested headers demo</h2>
<h2>Simple Example</h2>

<div class="example">
<template id="tpl" is="dom-bind">
<hot-table width="570" height="500" datarows="{{ people }}" row-headers context-menu hidden-columns
nested-headers="{{ settings.nestedHeaders }}" collapsible-columns="{{ settings.collapsibleColumns }}">
<hot-column width="125" value="name" header="Full Name"></hot-column>
<hot-column width="125" value="address" header="Address"></hot-column>
<hot-column width="125" value="registered" header="Registered" type="date" date-format="YYYY-MM-DD"></hot-column>
<hot-column width="125" value="balance" header="Balance" type="numeric">
<template data-hot-role="renderer" is="dom-template">
<bold-renderer value="{{ value }}"></bold-renderer>
</template>
</hot-column>
</hot-table>
</template>
<dom-bind>
<template id="tpl" is="dom-bind">
<hot-table width="570" height="500" datarows="{{ people }}" row-headers context-menu hidden-columns
nested-headers="{{ settings.nestedHeaders }}" collapsible-columns="{{ settings.collapsibleColumns }}">
<hot-column width="125" value="name" header="Full Name"></hot-column>
<hot-column width="125" value="address" header="Address"></hot-column>
<hot-column width="125" value="registered" header="Registered" type="date" date-format="YYYY-MM-DD"></hot-column>
<hot-column width="125" value="balance" header="Balance" type="numeric">
<template data-hot-role="renderer" is="dom-template">
<bold-renderer value="{{ value }}"></bold-renderer>
</template>
</hot-column>
</hot-table>
</template>
</dom-bind>
</div>

<h2>Code</h2>
Expand All @@ -67,34 +72,24 @@ <h2>Code</h2>


<script>
var pDomChange = new Promise(function(resolve, reject) {
window.addEventListener('dom-change', resolve);
});

function initUntill() {
Promise.all(arguments).then(function(responses) {
var tpl = document.getElementById('tpl');

tpl.people = responses[0];
tpl.settings = {
nestedHeaders: [
['A', {label: 'B', colspan: 3}],
['C', {label: 'D', colspan: 2}, {label: 'E', colspan: 1}],
['F', 'G', 'H', 'I'],
['J', {label: 'K', colspan: 2}, 'L']
],
collapsibleColumns: [
{row: -4, col: 1, collapsible: true},
{row: -3, col: 1, collapsible: true},
{row: -2, col: 1, collapsible: true},
{row: -2, col: 3, collapsible: true}
],
};
})
}

function _hotData(data) {
initUntill(Promise.resolve(data), pDomChange);
var domBind = document.querySelector('dom-bind');

domBind.people = data;
domBind.settings = {
nestedHeaders: [
['A', {label: 'B', colspan: 3}],
['C', {label: 'D', colspan: 2}, {label: 'E', colspan: 1}],
['F', 'G', 'H', 'I'],
['J', {label: 'K', colspan: 2}, 'L']
],
collapsibleColumns: [
{row: -4, col: 1, collapsible: true},
{row: -3, col: 1, collapsible: true},
{row: -2, col: 1, collapsible: true},
{row: -2, col: 3, collapsible: true}
],
};
}
</script>
<script async defer src="js/data.js"></script>
Expand Down
1 change: 0 additions & 1 deletion examples/components/age-renderer.html
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@

<template id="template">
<style>
#message {
Expand Down
16 changes: 8 additions & 8 deletions examples/components/bold-renderer.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,15 +3,15 @@
<link rel="import" href="../../../polymer/polymer.html">

<dom-module id="bold-renderer">
<style>
:host {
white-space: normal;
}
.bold-value {
font-weight: bold;
}
</style>
<template>
<style>
:host {
white-space: normal;
}
.bold-value {
font-weight: bold;
}
</style>
<span class="bold-value">{{ value }}</span>
</template>
<script src="bold-renderer.js"></script>
Expand Down
10 changes: 5 additions & 5 deletions examples/components/colored-renderer.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,12 +3,12 @@
<link rel="import" href="../../../polymer/polymer.html">

<dom-module id="colored-renderer">
<style>
:host {
white-space: normal;
}
</style>
<template>
<style>
:host {
white-space: normal;
}
</style>
<template is="dom-repeat" items="{{ splitedValue }}" as="v" index-as="i"><span style$="{{computeStyle(i)}}">{{ v }}</span></template>
</template>
<script src="colored-renderer.js"></script>
Expand Down
Loading

0 comments on commit 34de7ab

Please sign in to comment.