More Related Content
Similar to Big Data for each one of us
Similar to Big Data for each one of us (20)
More from OSCON Byrum (20)
Big Data for each one of us
- 27. REST http://api.fluxtream.com/calendar/all/date/2012-05-27
{
"tbounds":{"start":1338069600000,"end":1338155999999},
"solarInfo":{"sunrise":333,"sunset":1293,},
"updateNeeded":["google_calendar"],
"addresses":{...},
"cities":[...],
"inTransit":"UNKNOWN",
"travelType":"UNKNOWN",
"minTempC":10.0,...
"settings":{
"temperatureUnit":"FAHRENHEIT",
...
},
"haveDataConnectors":[...],
"haveNoDataConnectors":[...],
"selectedConnectors":[...],
"hourlyWeatherData":[...],
"cachedData":{
"bodymedia-burn":[...],
"picasa-photo":[...],
"google_latitude-location":[...],
"fitbit-activity_summary":[...]
}
}
- 29. Requirejs define(["applications/calendar/tabs/Tab",
"applications/calendar/App", "applications/calendar/tabs/photos/PhotoUtils"], function(Tab,
Calendar, PhotoUtils) {
var maxWidth = 200;
// other private variables
// ...
function render(dgest, timeUnit, calendarState, cEn) {
this.getTemplate("text!applications/calendar/tabs/photos/photos.html", "photos", function() {
...
});
}
function setup(digest, cEn){...}
function showNoPhotos(){...}
function onDataReceived(photos){...}
function connectorToggled(connectorName,objectTypeNames,enabled){...}
function connectorDisplayable(connector){...}
var photosTab = new Tab("photos", "Justin Loutsenhizer", "icon-camera", true);
photosTab.render = render;
photosTab.connectorToggled = connectorToggled;
photosTab.connectorDisplayable = connectorDisplayable;
return photosTab;
});
- 31. requirejs
total size of the
compiled code (gziped): 70kb
- 32. Mustache / Hogan
<div id="availableConnectors">
{{^rows}}
<div style="margin: 60px 0 75px 0; width: 100%; text-align: center">You have added all
available connectors</div>
{{/rows}}
{{#rows}}
<div class="row-fluid">
{{#connectors}}
<div class="span4">
<a href="javascript:App.addConnector('{{connectUrl}}')">
<img src="{{image}}" alt="" width=158 Height=89>
</a>
<p>{{text}}</p>
</div>
{{/connectors}}
</div>
{{/rows}}
</div>
- 35. A Manifest
{
"WidgetDescription" : {"en" : "Average Daily Steps Taken per day,
week or year"},
"WidgetIcon" : "averageSteps.png",
"WidgetName" : "averageSteps",
"WidgetTitle" : {"en" : "Average Steps"},
"HasSettings" : true,
"SupportedLanguages" : "en",
"VendorIdentifier" : "Fluxtream.com",
"RequiredConnectors":"bodymedia, fitbit"
}
- 37. the widget’s contents template
<div class="flx-widget-typo">
<section class="main-widget-data">
{{#steps}}
<div class="big-data-figure" style="color:{{color}}">{{steps}}<span class="data-
unit">steps</span></div>
{{/steps}}
{{#noMeasure}}
<div class="big-data-figure"><span class="data-unit">{{noMeasureMsg}}</span></div>
{{/noMeasure}}
</section>
</div>
- 38. the widget’s settings template
<form class="form-horizontal">
<fieldset>
<div class="control-group">
<label class="control-label" for="input01">Steps threshold:</label>
<div class="controls">
<input type="text" class="input-xlarge"
id="averageStepsHappyDailyThreshold">
<p class="help-block">Number of steps that make you happy.</p>
</div>
</div>
</fieldset>
</form>
- 39. the widget’s controller code
define(["core/DashboardWidget"], function(DashboardWidget) {
var StepsTaken = new DashboardWidget();
StepsTaken.postLoad = function() {
// ...
// using this.digest, this.settings, this.manifest
var params = {"manifest" : this.manifest,
"settings" : this.settings,
"color" : color,
"steps" : averageSteps>0?steps:null,
"noMeasure" : averageSteps===0,
"noMeasureMsg" : StepsTaken.noSteps()};
$("#averageSteps-widget .flx-body").empty();
$("#averageSteps-widget .flx-body").append(
this.template.render(params)
);
};
StepsTaken.validateSettings = function() {...};
StepsTaken.bindWidgetSettings = function(widgetSettings) {...}
StepsTaken.defaultSettings = function(widgetSettings) {...}
return StepsTaken;
})
