The Intel CPU / Power / Connection Indicator Widget

This widget incorporates the CPU, Power and Connection Web APIs into a widget that provides a simple user experience indicator. Thumbs up predicts a good experience, thumbs down predicts a poor experience.

Contents

Embedding the widget in your page

Here is the HTML & JavaScript for the widget up and running. The widget will display a UI with images for CPU, Power and Connection status and also provide a thumbs up / thumbs down image that represents an experience prediction.
The widget will update itself every 5 second.

    <div id="cpci_div"></div>
    <script type="text/javascript" 
      src="http://software.intel.com/sites/whatif/webapis/intelwebapis.js"></script>
    <script type="text/javascript" 
      src="/sites/whatif/webapis/widget/cpc/IntelCPCIWidget.js"></script>
    <script type="text/javascript">
    (function() {
      //basic mode
      var theIntelCpciInst = new IntelCPCIWidget('cpci_div');
    })();
    </script>

This HTML & JavaScript changes how often the widget is updated

    <div id="cpci_div"></div>
    <script type="text/javascript" 
      src="http://software.intel.com/sites/whatif/webapis/intelwebapis.js"></script>
    <script type="text/javascript" 
      src="/sites/whatif/webapis/widget/cpc/IntelCPCIWidget.js"></script>
    <script type="text/javascript">
    (function() {
      //modified update interval - updates every 1 second instead of default 5
      var theIntelCpciInst = new IntelCPCIWidget('cpci_div',{'updateInt':1});
    })();
    </script>

This HTML & JavaScript passes in another user defined element ID (div) to receive debug messages. Handy when first incorporating the widget into a page.

    <div id="cpci_div"></div>
    <div id="cpci_debug_div"></div>
    <script type="text/javascript" 
      src="http://software.intel.com/sites/whatif/webapis/intelwebapis.js"></script>
    <script type="text/javascript" 
      src="/sites/whatif/webapis/widget/cpc/IntelCPCIWidget.js"></script>
    <script type="text/javascript">
    (function() {
      //pass a debug element id for debug messages
      var theIntelCpciInst = new IntelCPCIWidget('cpci_div',{'updateInt':1,'debugElId':'cpci_debug_div'});
    })();
    </script>

This HTML & JavaScript shows how to disable the widget UI and have updates sent to your JavaScript function so that you can implement your own completely custom UI. You should replace the code in the myUpdateCB function with your code.

    <div id="cpci_div"></div>
    <div id="cpci_debug_div"></div>
    <script type="text/javascript" 
      src="http://software.intel.com/sites/whatif/webapis/intelwebapis.js"></script>
    <script type="text/javascript" 
      src="/sites/whatif/webapis/widget/cpc/IntelCPCIWidget.js"></script>
    <script type="text/javascript">
    (function() {
      //disable the default widget UI and add a update callback for a custom ui
      var theIntelCpciInst = new IntelCPCIWidget('cpci_div',{'updateInt':1,
        'debugElId':'cpci_debug_div','uiEnable': false,'updateCB':myUpdateCB});
      
      function myUpdateCB(currInfo) {
        //do something with currInfo.cpu, currInfo.power, currInfo.connection
        var customUiEl = document.getElementById("cpci_div");
        customUiEl.innerHTML = "Custom UI:<br/>";
        var cpuLoad = Math.round((IntelWebAPIs.cpu.load * 100) * 100)/100;
        var connState = currInfo.connection.connected;
        var drawEl = document.createElement("pre");
        drawEl.innerHTML = "CPU Name: " + currInfo.cpu.name + "\r\n";
        drawEl.innerHTML += "CPU Load: " + cpuLoad + " %\r\n";
        drawEl.innerHTML += "Network Connected: " + connState + "\r\n";
        
        if(connState){
          var conninfo = currInfo.connection.getConnectionInfo();
          var connInfoHtml = "Connection Info:" + "\r\n";
          if(conninfo.lan.connected){
            connInfoHtml += "  lan.connected=" + 
              conninfo['lan']['connected'] + "\r\n";
            connInfoHtml += "  lan.signalStrength=" +
              conninfo['lan']['signalStrength'] + "\r\n";
            connInfoHtml += "  lan.linkSpeed=" +
              ((conninfo['lan']['linkSpeed']*100)/1000/1000) + " Mbps" + "\r\n";
          }
          if(conninfo.wifi.connected){
            connInfoHtml += "  wifi.connected=" +
              conninfo['wifi']['connected'] + "\r\n";
            connInfoHtml += "  wifi.signalStrength=" +
              conninfo['wifi']['signalStrength'] + "\r\n";
            connInfoHtml += "  wifi.linkSpeed=" +
              ((conninfo['wifi']['linkSpeed']*100)/1000/1000) + " Mbps" + "\r\n";
          }
          drawEl.innerHTML += connInfoHtml  + "\r\n";
        }
        
        if(currInfo.power.usingExternalPowerSource) {
          drawEl.innerHTML += "Device power: External / wall power" + "\r\n";; 
        }
        else {
          drawEl.innerHTML += "Device power: Battery" + "\r\n";
          drawEl.innerHTML += "Device battery level: " + currInfo.power.powerLevel + " %" + "\r\n";
          drawEl.innerHTML += "Device battery time : " + 
            Math.round((currInfo.power.timeRemaining / 60)) + " minutes" + "\r\n";
        }
        customUiEl.appendChild(drawEl);
      }
      
    })();
    </script>

Browser and Device Compatibility

The table below lists some compatability notes for browser and operating system combinations. This widget is currently beta quality.

If you are interested in seeing these APIs available on other device types and operating systems please let us know by leaving comments.

BrowserOperating SystemNotes
Firefox 3.5.x, 3.6.x Windows (XP, Vista, Win 7) Seems to be working well.
Chrome 4.0.x.y Windows (XP, Vista, Win 7) Seems to be working well.
Safari 4.0.x Windows (XP, Vista, Win 7) Seems to be working well.
Opera v 10.x Windows (XP, Vista, Win 7) Not currently working. It's on the debug todo list.
Internet Explorer 8.x Windows (XP, Vista, Win 7) Not supported yet. Its on the todo list though.
Firefox, Chrome, Safari Linux, MacOS Not supported yet. Linux and Mac OS porting is underway :)



See it working in this page!
Теги:
Пожалуйста, обратитесь к странице Уведомление об оптимизации для более подробной информации относительно производительности и оптимизации в программных продуктах компании Intel.