How to use the tabris.device.platform function in tabris

device.set({language});
device.language = language;
device.onLanguageChanged(function() {});

const model = device.model;
device.set({model});
device.model = model;
device.onModelChanged(function() {});

const orientation = device.orientation;
device.set({orientation});
device.orientation = orientation;

const platform = device.platform;
device.set({platform});
device.platform = platform;
device.onPlatformChanged(function() {});

const scaleFactor = device.scaleFactor;
device.set({scaleFactor});
device.scaleFactor = scaleFactor;
device.onScaleFactorChanged(function() {});

const screenHeight = device.screenHeight;
device.set({screenHeight});
device.screenHeight = screenHeight;
device.onScreenHeightChanged(function() {});

const screenWidth = device.screenWidth;
device.set({screenWidth});
device.screenWidth = screenWidth;
device.onScreenWidthChanged(function() {});

function showPopover() {
  const popover = new Popover({width: 300, height: 400, anchor: button})
    .on('close', () => console.log('Popover closed'))
    .open();
  const navigationView = new NavigationView({
    layoutData: {left: 0, right: 0, top: 0, bottom: 0},
    navigationAction: new Action({
      title: 'Close',
      image: {
        src: device.platform === 'iOS' ? 'resources/close-black-24dp@3x.png' : 'resources/close-white-24dp@3x.png',
        scale: 3
      }
    }).on('select', () => popover.close())
  }).appendTo(popover.contentView);
  const page = new Page({title: 'Popover'}).appendTo(navigationView);
  new TextView({centerX: 0, centerY: 0, text: 'Hello popover'}).appendTo(page);
}

createCheckBox('Custom navigation action', ({value: checked}) => {
  if (checked) {
    navigationView.navigationAction = new Action({
      title: 'Close',
      image: {
        src: device.platform === 'iOS' ? 'resources/close-black-24dp@3x.png' : 'resources/close-white-24dp@3x.png',
        scale: 3
      }
    }).on('select', () => console.log('navigationAction selected'));
  } else {
    navigationView.navigationAction = null;
  }
}, false);

background: '#E8E8E8'
}).appendTo(contentView);

const label = new TextView({
  left: 16, top: 'prev() 16', right: 16,
  font: 'italic 14px',
  text: 'You can press home and reopen the app to it to see how long you were away.'
}).appendTo(contentView);

new Button({
  left: 16, right: 16, bottom: 16,
  text: 'Reload app'
}).on('select', () => app.reload())
  .appendTo(contentView);

if (device.platform === 'Android') {
  new Button({
    left: 16, right: 16, bottom: 'prev() 16',
    text: 'Close app'
  }).on('select', () => app.close())
    .appendTo(contentView);
}

app.on('pause', () => paused = Date.now())
  .on('resume', () => {
    if (paused > 0) {
      const diff = Date.now() - paused;
      label.text = ' Welcome back!\n You were gone for ' + (diff / 1000).toFixed(1) + ' seconds.';
    }
  });

app.onBackNavigation(event => {

function getImage(image) {
  return 'resources/' + image + (device.platform === 'iOS' ? '-black-24dp@3x.png' : '-white-24dp@3x.png');
}

import {ImageView, TextView, CheckBox, Slider, Composite, contentView, device} from 'tabris';

const imageView = new ImageView({
  left: 0, right: 0, top: 0, bottom: '#controls',
  image: 'resources/salad.jpg',
  background: '#f5f5f5',
  zoomEnabled: true
}).onZoom(({zoomLevel}) => zoomLevelSlider.selection = zoomLevel * 10)
  .appendTo(contentView);

const controls = new Composite({
  id: 'controls',
  left: 0, right: 0, bottom: 0, height: device.platform === 'iOS' ? 204 : undefined,
  background: 'white',
  padding: {left: 16, right: 16, top: 16, bottom: 24},
  elevation: 8
}).appendTo(contentView);

new CheckBox({
  id: 'zoomEnabled',
  left: 0, right: 0, top: 0,
  checked: true,
  text: 'Zoom enabled'
}).onCheckedChanged(({target: checkBox, value: zoomEnabled}) => {
  zoomLevelSlider.selection = 10;
  minZoomSlider.selection = 10;
  maxZoomSlider.selection = 30;
  imageView.zoomEnabled = zoomEnabled;
  controls.children().filter(widget => widget !== checkBox).set({enabled: zoomEnabled});

function actionSnippet(parent) {
  dimen(parent, large);
  const navigationView = new NavigationView({
    left: 16, right: 16, top: 16, bottom: 16, actionColor: device.platform === 'iOS' ? 'black' : 'white'
  }).appendTo(parent);
  new Page({title: 'Action'}).appendTo(navigationView);
  if (device.platform === 'Android') { new Action({title: 'Share'}).appendTo(navigationView); }
  new Action({image: 'resources/search-black-24dp@3x.png'}).appendTo(navigationView);
}

import {app, contentView, device, ImageView, TextInput, WebView} from 'tabris';

const MARGIN = 8;
const NAV_SIZE = device.platform === 'Android' ? 48 : 30;

contentView.set({background: '#f5f5f5'});

const back = new ImageView({
  left: MARGIN, width: NAV_SIZE, top: MARGIN, bottom: ['#webView', MARGIN],
  highlightOnTouch: true,
  image: {src: 'resources/arrow-back-black-24dp@3x.png', scale: 3}
}).onTap(() => webView.goBack())
  .appendTo(contentView);

const forward = new ImageView({
  left: back, width: NAV_SIZE, top: MARGIN, bottom: ['#webView', MARGIN],
  highlightOnTouch: true,
  image: {src: 'resources/arrow-forward-black-24dp@3x.png', scale: 3}
}).onTap(() => webView.goForward())
  .appendTo(contentView);

import {Action, NavigationView, Page, Popover, Button, TextView, contentView, device} from 'tabris';

contentView.set({padding: 16}).append(
  <button>Show Popover</button>
);

const IMG_CLOSE = device.platform === 'iOS' ? 'resources/close-black-24dp@3x.png' : 'resources/close-white-24dp@3x.png';
const button = $(Button).only();

function showPopover() {
  const popover = Popover.open(
    
      
         popover.close()}/&gt;
        
          Hello Popover
        
      
    
  );
}

function renderDeviceProperties() {
  $(TextView).only().text =
    <$>
      <b>Platform:</b> {device.platform}<br>
      <b>Version:</b> {device.version}<br>
      <b>Model:</b> {device.model}<br>
      <b>Vendor:</b> {device.vendor}<br>
      <b>Name:</b> {device.name}<br>
      <b>Language:</b> {device.language}<br>
      <b>Orientation:</b> {device.orientation}<br>
      <b>Screen:</b> {device.screenWidth} x {device.screenHeight}<br>
      <b>Scale:</b> {device.scaleFactor}<br>
      <b>Cameras:</b> {device.cameras ? device.cameras.map(camera =&gt; camera.position).join(', ') : 'none'}<br>
    
  ;
}