examples/biojson-doc/widget.js

   1 /*
   2  * Copyright 2013 Laurent Bovet <laurent.bovet@windmaster.ch>
   3  *
   4  * Licensed under the Apache License, Version 2.0 (the "License");
   5  * you may not use this file except in compliance with the License.
   6  * You may obtain a copy of the License at
   7  *
   8  *      http://www.apache.org/licenses/LICENSE-2.0
   9  *
  10  * Unless required by applicable law or agreed to in writing, software
  11  * distributed under the License is distributed on an "AS IS" BASIS,
  12  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  13  * See the License for the specific language governing permissions and
  14  * limitations under the License.
  15  */
  16
  17 var scripts = document.getElementsByTagName('script');
  18 var script = scripts[ scripts.length - 1 ];
  19
  20 if (script.attributes["data-schema"]) {
  21     var docson;
  22     if (script.attributes["data-docson"]) {
  23         docson = script.attributes["data-docson"].value;
  24     } else {
  25         docson = script.src.replace("widget.js", "index.html");
  26     }
  27     document.write("<iframe id='" + script.attributes["data-schema"].value +
  28         "' style='padding: 0; border: 0; width:100%; background: transparent' src='" +
  29         docson + "#" +
  30         script.attributes["data-schema"].value + "'></iframe>");
  31     function receiveMessage(event) {
  32         console.log("<", event)
  33         if (event.data.id && event.data.id == "docson") {
  34           var frame = document.getElementById(event.data.url);
  35           if(event.data.action == "resized") {
  36             frame.height = event.data.height + 18;
  37           }
  38           if(event.data.action == "ready") {
  39             console.log(frame.parentNode)
  40             frame.contentWindow.postMessage({ id: "docson", font: window.getComputedStyle(frame.parentNode).fontFamily}, "*");
  41           }
  42         }
  43
  44     }
  45     window.addEventListener("message", receiveMessage, false);
  46 } else {
  47     alert("<p style='color:red'>Missing data-schema (url to schema)</p>")
  48 }