Download - Pengenalan blaast platform sdk
![Page 1: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/1.jpg)
Pengenalan Blaast Platform SDK
Arief Bayu PurwantoR&D App Manager
PT. Integra ASP.http://about.me/ariefbayu
![Page 2: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/2.jpg)
Platform Features JavaScript on both Client and Server
code Server Code using Node.js API Server Storage using Redis.io Client code using proprietary API
![Page 3: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/3.jpg)
Source Files Project-dir
• controller/ => javascript untuk setiap page• res/ => semua resources aplikasi (gambar, music, etc)
• views/ => definisi setiap page, berupa .json• backend.js => berisi kode2 server• bootstrap.js => kode yang dijalankan pertama kali
• metadata.json => detail informasi aplikasi
Satu controller HARUS ada 1 pasangan views:-controller/main.js
-views/main.json
![Page 4: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/4.jpg)
Controller files Handle client methods:
var _ = require('common/util');
_.extend(exports, {':load': function() { console.log('View was loaded'); },
':resized': function(width, height) { console.log('View was resized to ' + width + 'x' + height);
},
':keydown': function(key) { console.log('Key down: '+ key); },
':keyup': function(key) { console.log('Key up: ' + key); },
':keypress': function(key) { console.log('Key press: ' + key); },
':active': function() { console.log('View is active'); },
':inactive': function() { console.log('View is inactive'); }});
![Page 5: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/5.jpg)
Layout and control
![Page 6: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/6.jpg)
Layout & ControlLinear Layout
var LinearLayout = require('ui').LinearLayout;
new LinearLayout( { style:{ orientation: orientationDefinition } });
orientationDefinition: horizontal // vertical
Class turunan: * Hlayout => LinearLayout.orientation = “vertical” * Vlayout => LinearLayout.orientation = “horizontal”
![Page 7: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/7.jpg)
Layout & ControlCell Layout
var CellLayout = require('ui').CellLayout;
new CellLayout( { columns: columnCount, cellSize: { width: theWidth, height: theHeight } } });
![Page 8: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/8.jpg)
Layout & ControlPanel Layout
var Panels = require('ui/panels').Panels;
var p = new Panels();
p.add('first', 'firstView');p.add('second', 'secondView');
![Page 9: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/9.jpg)
Layout & ControlTextView
var TextView = require(‘ui’).TextView;
new TextView();
new TextView( { label: theLabel });
![Page 10: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/10.jpg)
Layout & ControlTextInput
var InputBox = require(‘ui’).InputBox;
new InputBox();
new InputBox( { constraint: theConstraint, label: theLabel, 'multi-line': flag });
Constraint: normal // password‘multi-line’: true // false
![Page 11: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/11.jpg)
Layout & ControlImageView
var ImageView = require('ui').ImageView;
var ui = require('ui');var ImageView = ui.ImageView;
new ImageView();new ImageView({ src: srcUrl, load: loadStrategy, retain: shouldRetain});
Load: direct // lazyretain: true // false
src => for images in res/resource => for images from outside. Need companion app.setResourceHandler() on backend.js
![Page 12: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/12.jpg)
Layout & ControlSceneView
var SceneView = require(‘ui’).SceneView;var scene = new SceneView();scene.setLayers();sceneView.defineSpritesheet('anim', app.imageURL('anim.png'), 25, 25);scene.add( { sprite: 'anim', x: 100, y: 100, layer: 0, frame: 0 });
![Page 13: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/13.jpg)
Client – server communication
![Page 14: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/14.jpg)
Client – Server Communication
app.setResourceHandler(function(request, response) {
function sendReply(response, error, imageType, data) { if (error) { app.warn('Failed to load image: ' + error);
response.failed(); } else { app.debug('Loaded image.');
response.reply(imageType, data); } } scaling.scale(request.id, 120, 120, 'image/jpeg', function(err, data) { sendReply(response, err, 'image/jpeg', data); });});
app.setResourceHandler:
![Page 15: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/15.jpg)
Client – Server Communication
Client:app.msg(‘commandMessage', {parameter});
Server:app.message( function(client, action, param){ if(action === ‘commandMessage’){ //Do whatever you want } });
Step one: client send command to server
![Page 16: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/16.jpg)
Client – Server Communication
Server:app.message( function(client, action, param){ if(action === ‘commandMessage’){ client.msg( action, { parameter } ); } });
Client (on ‘:load’ handler):app.on(‘commandMessage', function(action, param) { //do whatever you want with returning parameter });
Step two: server send back result to client
![Page 17: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/17.jpg)
Data Storage
![Page 18: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/18.jpg)
Client Storage
Initialize Storage Variable:var storage = app.storage('storage-name');
Get Stored Data:var data = storage.get('object-name');
Set Stored Data:storage.set('object-name', daa);
![Page 19: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/19.jpg)
Server Storage Initialize Storage Variable:
var storage = require('blaast/simple-data');
Get Stored Data:storage.get(key, function(err, value) { if (value && value.data) { self.data = value.data; } else { //failed to get server storage }});
Set Stored Data:storage.set(key, data, function(err, oldData) { if (err) { //failed to set server storage } else { //server storage successfully stored }});
Removing Stored Data:storage.remove(key);
![Page 20: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/20.jpg)
User Handling
![Page 21: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/21.jpg)
User – Server Method client.id => unique device id client.user.id => name of currently logged in user app.realtime()app.realtime(function(client, event) { if (event === 'CONNECTED') { clients[client.id] = client; clients[client.user.id] = client; } else if (event === 'DISCONNECTED') { delete clients[client.id]; delete clients[client.user.id]; }});
![Page 22: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/22.jpg)
User – Client Method app.user.id => name currently logged in
user
![Page 23: Pengenalan blaast platform sdk](https://reader033.vdokumen.com/reader033/viewer/2022061616/55514f21b4c905bd1c8b55f1/html5/thumbnails/23.jpg)
Questions?