diff --git a/controllets/animated-grid-controllet/animated-grid-controllet.html b/controllets/animated-grid-controllet/animated-grid-controllet.html
index 35d002d..42d2d74 100644
--- a/controllets/animated-grid-controllet/animated-grid-controllet.html
+++ b/controllets/animated-grid-controllet/animated-grid-controllet.html
@@ -30,41 +30,47 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
/* ---- grid-item ---- */
- .grid-item
+ ::content .grid-item {float: left;box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;border: 3px solid white;}
+ ::content .grid-sizer {width: 200px;}
+ ::content .grid-item-w20 {width: 200px;}
+ ::content .grid-item-w40 {width: 400px;}
+ ::content .grid-item-w60 {width: 600px;}
+ ::content .grid-item-w80 {width: 80%;}
+ ::content .grid-item-w100 {width: 100%;}
+
+ ::content .grid-item-h200 {height: 200px;}
+ ::content .grid-item-h400 {height: 400px;}
+ ::content .grid-item-h600 {height: 600px;}
+ ::content .grid-item-h800 {height: 800px;}
+
+ ::content .grid-item-c0 {background-color: #0D47A1;}
+ ::content .grid-item-c1 {background-color: #1976D2;}
+ ::content .grid-item-c2 {background-color: #2196F3;}
+ ::content .grid-item-c3 {background-color: #64B5F6;}
+ ::content .grid-item-c4 {background-color: #BBDEFB;}
+
+ ::content .room-body {background-color: #BBDEFB;}
+
+ ::content .room-subject
{
- float: left;
- box-sizing: border-box;
- -moz-box-sizing: border-box;
- -webkit-box-sizing: border-box;
- border: 4px solid white;
+ position: absolute;
+ width: 100%;
+ height: 30px;
+ bottom: 20px;
+ background-color: rgba(0,0,0,0.6);
+ vertical-align: middle;
+ color: #FFFFFF;
}
- .grid-sizer {width: 200px;}
- .grid-item-w20 {width: 200px;}
- .grid-item-w40 {width: 400px;}
- .grid-item-w60 {width: 600px;}
- .grid-item-w80 {width: 80%;}
- .grid-item-w100 {width: 100%;}
-
- .grid-item-h200 {height: 200px;}
- .grid-item-h400 {height: 400px;}
- .grid-item-h600 {height: 600px;}
- .grid-item-h800 {height: 800px;}
-
- .grid-item-c0 {background-color: #0D47A1;}
- .grid-item-c1 {background-color: #1976D2;}
- .grid-item-c2 {background-color: #2196F3;}
- .grid-item-c3 {background-color: #64B5F6;}
- .grid-item-c4 {background-color: #BBDEFB;}
-
</style>
<template>
- <div class="grid">
- <template is="dom-repeat" items="{{data}}">
+ <div id="grid-container" class="grid">
+ <!--<template is="dom-repeat" items="{{data}}">
<div class$="{{item.b}} {{item.w}} {{item.h}} {{item.c}}">{{index}}</div>
- </template>
+ </template>-->
+ <content></content>
</div>
<div class="grid-sizer"></div>
@@ -104,7 +110,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
ready : function()
{
- var randW = 0;
+ /*var randW = 0;
var randH = 0;
var randC = 0;
this.data = [];
@@ -121,7 +127,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
h: 'grid-item-h'+((randH*200)+200),
c: 'grid-item-c'+randC});
- }
+ }*/
},
attached : function()
@@ -152,7 +158,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
this.fire('tile-click', {
tile: target,
- data: {color: target._templateInstance.item.c}
+ //data: {color: target._templateInstance.item.c}
+ data: {color: target.classList[3], id:target.id}
});
}
diff --git a/controllets/fullsize-page-with-card-controllet/fullsize-page-with-card-controllet.html b/controllets/fullsize-page-with-card-controllet/fullsize-page-with-card-controllet.html
index ec48fb1..2eaf278 100644
--- a/controllets/fullsize-page-with-card-controllet/fullsize-page-with-card-controllet.html
+++ b/controllets/fullsize-page-with-card-controllet/fullsize-page-with-card-controllet.html
@@ -9,7 +9,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<link rel="import" href="../../bower_components/polymer/polymer.html">
<link rel="import" href="../../bower_components/neon-animation/neon-shared-element-animatable-behavior.html">
-<dom-module id="fullsize-page-with-card">
+<dom-module id="fullsize-page-with-card-controllet">
<style>
@@ -21,14 +21,14 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
position: absolute;
top: 0;
left: 0;
- height: 100vh;
+ height: 100%;
width: 100vw;
}
.card {
position: relative;
margin: 20px 20px 20px 20px;
- height: 700px;
+ height: 90%;
}
.grid-item-c0 {background-color: #0D47A1;}
@@ -48,7 +48,11 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<template>
<div id="fixed" class$="[[_computeFixedBackgroundClass(color)]]"></div>
- <div id="card" class$="[[_computeCardClass(color)]]"></div>
+ <div id="card" class$="[[_computeCardClass(color)]]">
+ <template is="dom-if" if="{{_checkUndefined(publicRoom)}}">
+ <iframe src="/public-room/{{publicRoom}}" width="100%" height="100%"></iframe>
+ </template>
+ </div>
</template>
@@ -58,7 +62,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
Polymer({
- is: 'fullsize-page-with-card',
+ is: 'fullsize-page-with-card-controllet',
behaviors: [
Polymer.NeonSharedElementAnimatableBehavior
@@ -66,6 +70,10 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
properties: {
+ publicRoom : {
+ type: String
+ },
+
color: {
type: String
},
@@ -111,6 +119,13 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
},
+ _checkUndefined: function(variable)
+ {
+ if(typeof variable === 'undefined')
+ return false;
+ return true;
+ },
+
_computeCardClass: function(color) {
var cls = 'card';
return cls + ' ' + color;