iframe-bookmarklet-xapi/loader.js at master · mpkliewer/iframe-bookmarklet-xapi · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
var your_bookmarklet = (function() {

		// some things we need in here
		var host = 'https://cdn.rawgit.com/mpkliewer/iframe-bookmarklet-xapi/v1.0-alpha/',
				iframe_url = host + 'xapi-bookmarklet.html',
				$ = false,
				doc = document,
				head = doc.getElementsByTagName('head')[0],
				body = doc.getElementsByTagName('body')[0],
				messageListeners = [],
				iframe;

		// general utils
		var Utils = {

				// load a javascript file
				loadJs: function(src) {
						var js = doc.createElement('script');
						js.type = 'text/javascript';
						js.src = src;
						js.async = true;
						head.appendChild(js);
				},

				addMessageListener: function(message, callback) {
						messageListeners[message] = callback;
				},

				// if jquery does not exist, load it
				// and callback when jquery is loaded
				loadJquery: function(cb) {
						// always load jquery because they might have
						// a prototyped version on page
						Utils.loadJs(host + 'js/jquery-2.1.3.min.js');
						// start checking every 100ms to see
						// if the jQuery object exists yet
						(function poll() {
								setTimeout(function() {
										// jquery exists, callback
										if(window.jQuery) {
												$ = window.jQuery;
												cb();
										// jquery doesn't exist,
										// keep trying
										} else {
												poll();
										}
								}, 100);
						})();
				}

		}

		var Bookmarklet = {

				hide: function() {
						iframe.fadeOut('fast');
				},

				show: function(dimensions) {
						if(dimensions) {
								iframe.css(dimensions);
						}
						if(!iframe.is(':visible')) {
								iframe.fadeIn('fast');
						}
				},

				// this is accessed by itself
				// when it wants to create a new one
				reset: init

		}

		window.addEventListener('message', function(e) {
				var data = e.data;
				// the window is trying to execute
				// some arbitrary custom event
				if(!!data.event) {
						messageListeners[data.event](data.args);
				}
		}, false);

		// listen for calls from iframe
		Utils.addMessageListener('unload-bookmarklet', function() {
				Bookmarklet.hide();
		});

		Utils.addMessageListener('resize-iframe', function(dimensions) {
				Bookmarklet.show(dimensions);
		});

		// creates a way to proxy
		// POST methods to the website directly
		var Channel = function(path) {

				if(iframe) {
						iframe.remove();
						iframe = false;
				}

				iframe = createIframe(path);

				var c = this,
						cw = iframe[0].contentWindow;

				// provide a way for bookmarklet
				// to trigger custom events in iframe
				this.trigger = function(event, args) {
						cw.postMessage({
								event: event,
								args: args
						}, '*');
				}

				// generate the iframe to proxy
				function createIframe(url) {
						var i = $('<iframe />')
								.attr('src', url)
								.appendTo(body);
						return i;
				}

				return this;

		}

		function init() {

				// load jquery
				Utils.loadJquery(function() {

						// when jquery is loaded,
						// create bookmarklet channel
						new Channel(iframe_url);

				});

				return this;

		};

		init();

		return Bookmarklet;

})();