src/examples/device/app/view/contacts/Detail.js

   1 Ext.define('Device.view.contacts.Detail', {
   2     extend: 'Ext.Container',
   3
   4     config: {
   5         title: 'Information',
   6         scrollable: true,
   7         tpl: [
   8             '<div class="person">',
   9
  10                 '<div class="thumbnail" style="background-image:url({thumbnail});"></div>',
  11                 '<div class="name">{first} {last}</div>',
  12                 '<div class="company">{company}</div>',
  13
  14                 '<tpl if="phones">',
  15                 '<ul>',
  16                 '<table cellpadding="0" cellspacing="0">',
  17                     '{% for (val in values.phones) { %}',
  18                         '<tr>',
  19                             '<td><span>{[val]}</span></td>',
  20                             '<td width="100%">{[values.phones[val]]}</td>',
  21                         '</tr>',
  22                     '{% } %}',
  23                 '</table>',
  24                 '</ul>',
  25                 '</tpl>',
  26
  27                 '<tpl if="emails">',
  28                 '<ul>',
  29                 '<table cellpadding="0" cellspacing="0">',
  30                     '{% for (val in values.emails) { %}',
  31                         '<tr>',
  32                             '<td><span>{[val]}</span></td>',
  33                             '<td width="100%">{[values.emails[val]]}</td>',
  34                         '</tr>',
  35                     '{% } %}',
  36                 '</table>',
  37                 '</ul>',
  38                 '</tpl>',
  39
  40                 '<tpl if="urls">',
  41                 '<ul>',
  42                 '<table cellpadding="0" cellspacing="0">',
  43                     '{% for (val in values.urls) { %}',
  44                         '<tr>',
  45                             '<td><span>{[val]}</span></td>',
  46                             '<td width="100%">{[values.urls[val]]}</td>',
  47                         '</tr>',
  48                     '{% } %}',
  49                 '</table>',
  50                 '</ul>',
  51                 '</tpl>',
  52
  53                 '<tpl if="addresses">',
  54                 '<ul>',
  55                 '<table cellpadding="0" cellspacing="0">',
  56                     '{% for (val in values.addresses) { %}',
  57                         '<tr>',
  58                             '<td><span>{[val]}</span></td>',
  59                             '<td width="100%">',
  60                                 '{[values.addresses[val].Street]}</br >',
  61                                 '{[values.addresses[val].City]}, {[values.addresses[val].State]}</br >',
  62                                 '{[values.addresses[val].ZIP]}</br >',
  63                             '</td>',
  64                         '</tr>',
  65                     '{% } %}',
  66                 '</table>',
  67                 '</ul>',
  68                 '</tpl>',
  69
  70             '</div>'
  71         ].join('')
  72     }
  73 });