1 // Copyright (c) 2011 The Chromium Authors. All rights reserved. 2 // Use of this source code is governed by a BSD-style license that can be 3 // found in the LICENSE file. 4 5 cr.define('options.internet', function() { 6 /** 7 * Creates a new network list div. 8 * @param {Object=} opt_propertyBag Optional properties. 9 * @constructor 10 * @extends {HTMLDivElement} 11 */ 12 var CellularPlanElement = cr.ui.define('div'); 13 14 CellularPlanElement.prototype = { 15 __proto__: HTMLDivElement.prototype, 16 17 /** @inheritDoc */ 18 decorate: function() { 19 }, 20 21 /** 22 * Loads given network list. 23 * @param {Array} networks An array of network object. 24 */ 25 load: function(plans) { 26 this.textContent = ''; 27 if (!plans || !plans.length) { 28 var noplansDiv = this.ownerDocument.createElement('div'); 29 noplansDiv.textContent = localStrings.getString('noPlansFound'); 30 this.appendChild(detailsTable); 31 } else { 32 for (var i = 0; i < plans.length; ++i) { 33 this.appendChild(new CellularPlanItem(i, plans[i])); 34 } 35 } 36 } 37 }; 38 39 /** 40 * Creates a new network item. 41 * @param {Object} network The network this represents. 42 * @constructor 43 * @extends {HTMLDivElement} 44 */ 45 function CellularPlanItem(idx, plan) { 46 var el = cr.doc.createElement('div'); 47 el.data = { 48 idx: idx, 49 planType: plan.planType, 50 name: plan.name, 51 planSummary: plan.planSummary, 52 dataRemaining: plan.dataRemaining, 53 planExpires: plan.planExpires, 54 warning: plan.warning 55 }; 56 CellularPlanItem.decorate(el); 57 return el; 58 } 59 60 61 /** 62 * Decorates an element as a network item. 63 * @param {!HTMLElement} el The element to decorate. 64 */ 65 CellularPlanItem.decorate = function(el) { 66 el.__proto__ = CellularPlanItem.prototype; 67 el.decorate(); 68 }; 69 70 CellularPlanItem.prototype = { 71 __proto__: HTMLDivElement.prototype, 72 73 /** @inheritDoc */ 74 decorate: function() { 75 this.className = 'cellular-plan'; 76 var detailsTable = this.createTable_('details-plan-table', 77 'option-control-table'); 78 this.addRow_(detailsTable, 'plan-details-info', 79 'option-name', 'planSummary', this.data.planSummary); 80 this.addRow_(detailsTable, 'plan-details-info', 81 'option-name', null, localStrings.getString('planName'), 82 'option-value', 'planName', this.data.name); 83 this.addRow_(detailsTable, 'plan-details-info', 84 'option-name', null, localStrings.getString('dataRemaining'), 85 'option-value', 'dataRemaining', this.data.dataRemaining); 86 this.addRow_(detailsTable, 'plan-details-info', 87 'option-name', null, localStrings.getString('planExpires'), 88 'option-value', 'dataRemaining', this.data.planExpires); 89 if (this.data.warning && this.data.warning != "") { 90 this.addRow_(detailsTable, 'plan-details-info', 91 'option-name', 'planWarning', this.data.warning); 92 } 93 this.appendChild(detailsTable); 94 this.appendChild(this.ownerDocument.createElement('hr')); 95 }, 96 97 createTable_: function(tableId, tableClass) { 98 var table = this.ownerDocument.createElement('table'); 99 table.id = tableId; 100 table.className = tableClass; 101 return table; 102 }, 103 104 addRow_: function(table, rowClass, col1Class, col1Id, col1Value, 105 col2Class, col2Id, col2Value) { 106 var row = this.ownerDocument.createElement('tr'); 107 if (rowClass) 108 row.className = rowClass; 109 var col1 = this.ownerDocument.createElement('td'); 110 col1.className = col1Class; 111 if (col1Id) 112 col1.id = col1Id; 113 col1.textContent = col1Value; 114 if (!col2Class) 115 col1.setAttribute('colspan','2'); 116 row.appendChild(col1); 117 if (col2Class) { 118 var col2 = this.ownerDocument.createElement('td'); 119 col2.className = col2Class; 120 if (col2Id) 121 col2.id = col2Id; 122 col2.textContent = col2Value; 123 row.appendChild(col2); 124 } 125 table.appendChild(row); 126 } 127 }; 128 129 return { 130 CellularPlanElement: CellularPlanElement 131 }; 132 }); 133