javascript/container/sample-metadata.html

   1 <!--
   2  * Licensed to the Apache Software Foundation (ASF) under one
   3  * or more contributor license agreements.  See the NOTICE file
   4  * distributed with this work for additional information
   5  * regarding copyright ownership.  The ASF licenses this file
   6  * to you under the Apache License, Version 2.0 (the
   7  * "License"); you may not use this file except in compliance
   8  * with the License.  You may obtain a copy of the License at
   9  *
  10  *   http://www.apache.org/licenses/LICENSE-2.0
  11  *
  12  * Unless required by applicable law or agreed to in writing,
  13  * software distributed under the License is distributed on an
  14  * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
  15  * KIND, either express or implied.  See the License for the
  16  * specific language governing permissions and limitations
  17  * under the License.
  18 -->
  19 <html>
  20 <head>
  21 <title>Metadata Demo</title>
  22 <style>
  23   .gadget {
  24     border: solid 1px #000;
  25     margin: 10px;
  26     float: left;
  27     text-align: center;
  28   }
  29   .gadget h2 {
  30     background: #ccf;
  31     border-bottom: solid 1px #000;
  32     margin: 0;
  33     padding: 5px;
  34   }
  35   .gadget iframe {
  36     margin: 5px;
  37     border: none;
  38     height: 300px;
  39     width: 300px;
  40   }
  41 </style>
  42 </head>
  43 <script src="../../js/core.js?c=1"></script>
  44 <body>
  45 <script>
  46   function makeXhr() {
  47     if (window.XMLHttpRequest) {
  48       return new XMLHttpRequest();
  49     } else if (window.ActiveXObject) {
  50       var x = new ActiveXObject("Msxml2.XMLHTTP");
  51       if (!x) {
  52         x = new ActiveXObject("Microsoft.XMLHTTP");
  53       }
  54       return x;
  55     }
  56   }
  57
  58   function renderGadgets(obj) {
  59     var gadgetList = obj.gadgets;
  60     var features = {};
  61     for (var i = 0, gadget; gadget = gadgetList[i]; ++i) {
  62       var feats = gadget.features || [];
  63       for (var j = 0, feature; feature = feats[j]; ++j) {
  64         features[feature] = true;
  65       }
  66     }
  67     var libs = [];
  68     for (var lib in features) {libs.push(lib);}
  69     libs.sort();
  70     libs = libs.join(":");
  71     for (var i = 0, gadget; gadget = gadgetList[i]; ++i) {
  72       var newGadget = document.createElement("div");
  73       if (gadget.errors && gadget.errors.length > 0) {
  74         newGadget.innerHTML = ["Unable to process gadget: ", gadget.url, ". Errors: <pre>", gadget.errors.join("\n"), "</pre>"].join("");
  75       } else {
  76         newGadget.innerHTML = ['<h2>', gadget.title, '</h2>',
  77           '<iframe src="', gadget.iframeUrl, '&libs=', libs ,'" id="remote_iframe_', gadget.moduleId, '" name="remote_iframe_', gadget.moduleId, '"></iframe>'
  78         ].join("");
  79       }
  80       newGadget.className = "gadget";
  81       document.body.appendChild(newGadget);
  82     }
  83   }
  84
  85   function processResp(xhr) {
  86     if (xhr.readyState !== 4) {return;}
  87     renderGadgets(gadgets.json.parse(xhr.responseText));
  88   }
  89
  90   var request = {
  91     context: {
  92       country: "US",
  93       language: "en",
  94       view: "default",
  95       container: "default"
  96     },
  97     gadgets: [
  98       {
  99         url: "http://www.google.com/ig/modules/hello.xml",
 100         moduleId: 1
 101       },
 102       {
 103         url: "http://www.labpixies.com/campaigns/todo/todo.xml",
 104         moduleId: 2
 105       },
 106       {
 107         url: "http://www.example.org/fake/fake/fake.xml",
 108         moduleId: 3
 109       }
 110     ]
 111   };
 112
 113   var xhr = makeXhr();
 114   xhr.open("POST", "../../metadata", true);
 115   xhr.onreadystatechange = function(xobj) {
 116     return function() {
 117       processResp(xobj);
 118     };
 119   }(xhr);
 120   var req = gadgets.json.stringify(request);
 121   xhr.send(req);
 122 </script>
 123 </body>
 124 </html>