UNPKG

five-bells-visualization

Version:
152 lines (120 loc) 4.27 kB
<!-- Copyright (c) 2014 The Polymer Project Authors. All rights reserved. This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt Code distributed by Google as part of the polymer project is also subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt --> <link rel="import" href="../polymer/polymer.html"> <!-- Supports sharing a JSONP-based JavaScript library. <core-shared-lib on-core-shared-lib-load="{{load}}" url="https://apis.google.com/js/plusone.js?onload=%%callback%%"> Multiple components can request a library using a `core-shared-lib` component and only one copy of that library will loaded from the network. Currently, the library must support JSONP to work as a shared-lib. Some libraries require a specific global function be defined. If this is the case, specify the `callbackName` property. Where possible, you should use an HTML Import to load library dependencies. Rather than using this element, create an import (`<link rel="import" href="lib.html">`) that wraps loading the .js file: lib.html: <script src="lib.js"></script> @group Polymer Core Elements @element core-shared-lib --> <polymer-element name="core-shared-lib" attributes="url notifyEvent callbackName"> <script> (function() { Polymer({ notifyEvent: 'core-shared-lib-load', ready: function() { if (!this.url && this.defaultUrl) { this.url = this.defaultUrl; } }, urlChanged: function() { require(this.url, this, this.callbackName); }, provide: function() { this.async('notify'); }, notify: function() { this.fire(this.notifyEvent, arguments); } }); var apiMap = {}; function require(url, notifiee, callbackName) { // make hashable string form url var name = nameFromUrl(url); // lookup existing loader instance var loader = apiMap[name]; // create a loader as needed if (!loader) { loader = apiMap[name] = new Loader(name, url, callbackName); } loader.requestNotify(notifiee); } function nameFromUrl(url) { return url.replace(/[\:\/\%\?\&\.\=\-\,]/g, '_') + '_api'; } var Loader = function(name, url, callbackName) { this.instances = []; this.callbackName = callbackName; if (this.callbackName) { window[this.callbackName] = this.success.bind(this); } else { if (url.indexOf(this.callbackMacro) >= 0) { this.callbackName = name + '_loaded'; window[this.callbackName] = this.success.bind(this); url = url.replace(this.callbackMacro, this.callbackName); } else { // TODO(sjmiles): we should probably fallback to listening to script.load throw 'core-shared-api: a %%callback%% parameter is required in the API url'; } } // this.addScript(url); }; Loader.prototype = { callbackMacro: '%%callback%%', loaded: false, addScript: function(src) { var script = document.createElement('script'); script.src = src; script.onerror = this.error.bind(this); var s = document.querySelector('script'); s.parentNode.insertBefore(script, s); this.script = script; }, removeScript: function() { if (this.script.parentNode) { this.script.parentNode.removeChild(this.script); } this.script = null; }, error: function() { this.cleanup(); }, success: function() { this.loaded = true; this.cleanup(); this.result = Array.prototype.slice.call(arguments); this.instances.forEach(this.provide, this); this.instances = null; }, cleanup: function() { delete window[this.callbackName]; }, provide: function(instance) { instance.notify(instance, this.result); }, requestNotify: function(instance) { if (this.loaded) { this.provide(instance); } else { this.instances.push(instance); } } }; })(); </script> </polymer-element>