misc/babystats
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Display child name on the flip side.

Browse Source
This commit is contained in:
Ian Gulliver
2015-12-30 19:09:21 -08:00
parent 37389dd45c
commit 7584855c42
1 changed files with 18 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
static/babystats.js
View File

@@ -185,6 +185,7 @@ BabyStats.prototype.handleMessage_ = function(isEvent, message) {
this.checkOverlay_(); this.checkOverlay_();
} }
document.title = message.message.child_name; document.title = message.message.child_name;
this.displayChildName_.textContent = message.message.child_name;
break; break;
default: default:
@@ -324,6 +325,7 @@ BabyStats.prototype.buildStylesheet_ = function() {
front.style.backfaceVisibility = 'hidden'; front.style.backfaceVisibility = 'hidden';
front.style.transform = 'rotateY(180deg)'; front.style.transform = 'rotateY(180deg)';
// Front side
style.sheet.insertRule('.babyStatsChildName, .babyStatsYourName {}', 0); style.sheet.insertRule('.babyStatsChildName, .babyStatsYourName {}', 0);
var inputs = style.sheet.cssRules[0]; var inputs = style.sheet.cssRules[0];
inputs.style.display = 'block'; inputs.style.display = 'block';
@@ -466,6 +468,14 @@ BabyStats.prototype.buildStylesheet_ = function() {
this.cellOverlayRule_.style.color = 'rgb(189,21,80)'; this.cellOverlayRule_.style.color = 'rgb(189,21,80)';
this.cellOverlayRule_.style.borderRadius = '15px'; this.cellOverlayRule_.style.borderRadius = '15px';
this.cellOverlayRule_.style.opacity = 0.0; this.cellOverlayRule_.style.opacity = 0.0;
// Back side
style.sheet.insertRule('babyStatsDisplayChildName {}', 0);
var displayChildName = style.sheet.cssRules[0];
displayChildName.style.fontSize = '5vw';
displayChildName.style.fontWeight = 'bold';
displayChildName.style.color = 'rgb(138,155,15)';
}; };
@@ -636,8 +646,12 @@ BabyStats.prototype.buildLayout_ = function() {
flipper.appendChild(front); flipper.appendChild(front);
var back = document.createElement('babyStatsFlipperBack'); var back = document.createElement('babyStatsFlipperBack');
back.style.display = 'block';
back.style.textAlign = 'center';
back.style.padding = '15px';
flipper.appendChild(back); flipper.appendChild(back);
// Front (writable) side
this.childName_ = document.createElement('input'); this.childName_ = document.createElement('input');
this.addCSSClass_(this.childName_, 'babyStatsChildName'); this.addCSSClass_(this.childName_, 'babyStatsChildName');
this.childName_.placeholder = 'Child name'; this.childName_.placeholder = 'Child name';
@@ -665,6 +679,10 @@ BabyStats.prototype.buildLayout_ = function() {
this.gridOverlay_ = document.createElement('babyStatsGridOverlay'); this.gridOverlay_ = document.createElement('babyStatsGridOverlay');
front.appendChild(this.gridOverlay_); front.appendChild(this.gridOverlay_);
// Back (read-only) side
this.displayChildName_ = document.createElement('babyStatsDisplayChildName');
back.appendChild(this.displayChildName_);
var flip = document.createElement('img'); var flip = document.createElement('img');
this.addCSSClass_(flip, 'babyStatsFlip'); this.addCSSClass_(flip, 'babyStatsFlip');
flip.src = '/static/flip.svg'; flip.src = '/static/flip.svg';