1 <script> 2 (function () { 3 // Contains all notifications received since the page was loaded as a 4 // map from each data type to the number of notifications received for 5 // it. 6 chrome.sync.notifications = {}; 7 8 function updateNotificationsEnabledInfo(notificationsEnabled) { 9 var notificationsEnabledInfo = 10 document.getElementById('notificationsEnabledInfo'); 11 jstProcess( 12 new JsEvalContext({ 'notificationsEnabled': notificationsEnabled }), 13 notificationsEnabledInfo); 14 } 15 16 function updateNotificationInfo(notification) { 17 var notificationInfo = document.getElementById('notificationInfo'); 18 jstProcess( 19 new JsEvalContext({ 'notificationInfo': 20 JSON.stringify(notification, null, 2) 21 }), 22 notificationInfo); 23 } 24 25 function onLoad() { 26 chrome.sync.getNotificationState(updateNotificationsEnabledInfo); 27 chrome.sync.getNotificationInfo(updateNotificationInfo); 28 chrome.sync.onSyncNotificationStateChange.addListener( 29 updateNotificationsEnabledInfo); 30 31 chrome.sync.onSyncIncomingNotification.addListener(function(changedTypes) { 32 for (var i = 0; i < changedTypes.length; ++i) { 33 var changedType = changedTypes[i]; 34 chrome.sync.notifications[changedType] = 35 chrome.sync.notifications[changedType] || 0; 36 ++chrome.sync.notifications[changedType]; 37 } 38 39 var infos = []; 40 for (var k in chrome.sync.notifications) { 41 var info = { 42 'modelType': k, 43 'notificationCount': chrome.sync.notifications[k] 44 }; 45 infos.push(info); 46 } 47 48 var notificationsInfo = 49 document.getElementById('notificationsInfo'); 50 jstProcess(new JsEvalContext({ 'notifications': infos }), 51 notificationsInfo); 52 chrome.sync.getNotificationInfo(updateNotificationInfo); 53 }); 54 } 55 56 document.addEventListener("DOMContentLoaded", onLoad, false); 57 })(); 58 </script> 59 60 <style> 61 table#notificationsInfo tr:nth-child(odd) { 62 background: #eff3ff; 63 } 64 </style> 65 66 <p id='notificationsEnabledInfo'> 67 Enabled: <span jscontent='notificationsEnabled'></span> 68 </p> 69 <p id='notificationInfo'> 70 <span jscontent='notificationInfo'></span> 71 </p> 72 <table id='notificationsInfo'> 73 <tr jsselect='notifications'> 74 <td jscontent='modelType'/> 75 <td jscontent='notificationCount'/> 76 </tr> 77 </table> 78