diff options
Diffstat (limited to 'docroot/classes/history.class.js')
-rwxr-xr-x | docroot/classes/history.class.js | 208 |
1 files changed, 208 insertions, 0 deletions
diff --git a/docroot/classes/history.class.js b/docroot/classes/history.class.js new file mode 100755 index 0000000..12005c3 --- /dev/null +++ b/docroot/classes/history.class.js | |||
@@ -0,0 +1,208 @@ | |||
1 | /* | ||
2 | * Material Experience - History Manager Class | ||
3 | * | ||
4 | * EYEMG - Interactive Media Group | ||
5 | * Created by Mike Crute (mcrute@eyemg.com) | ||
6 | * Updated by Mike Crute (mcrute@eyemg.com) on 9/26/07 | ||
7 | */ | ||
8 | |||
9 | var HistoryManager = Class.create(); | ||
10 | Object.extend(HistoryManager.prototype, | ||
11 | { | ||
12 | /* | ||
13 | * Sets up the history storage array and initializes the last | ||
14 | * event to nothing. | ||
15 | */ | ||
16 | initialize: function() | ||
17 | { | ||
18 | this.historyStore = $H(); | ||
19 | this.lastEvent = null; | ||
20 | }, | ||
21 | |||
22 | /* | ||
23 | * Clears the window hash. Generally called when a card closes. | ||
24 | */ | ||
25 | clearHash: function() | ||
26 | { | ||
27 | window.location.hash = '#'; | ||
28 | }, | ||
29 | |||
30 | /* | ||
31 | * Register an event with the history manager. Also updates the | ||
32 | * window hash to reflect the event. This is the only way to | ||
33 | * register an event with the history manager. | ||
34 | */ | ||
35 | registerEvent: function(type, title, url) | ||
36 | { | ||
37 | window.location.hash = '#' + type + url; | ||
38 | |||
39 | // If you don't set this explicitly IE will show the hash as | ||
40 | // the document title. | ||
41 | document.title = Strings.appTitle; | ||
42 | |||
43 | this.lastEvent = '#' + type + url; | ||
44 | this.historyStore[type + url] = title; | ||
45 | |||
46 | return this; | ||
47 | }, | ||
48 | |||
49 | /* | ||
50 | * Stops polling the URL for new events. | ||
51 | */ | ||
52 | stopPolling: function() | ||
53 | { | ||
54 | this.poller.stop(); | ||
55 | |||
56 | return this; | ||
57 | }, | ||
58 | |||
59 | /* | ||
60 | * Starts polling the URL for new events and will execute the event | ||
61 | * handler if an event occurs. | ||
62 | */ | ||
63 | pollEvents: function() | ||
64 | { | ||
65 | this.poller = new PeriodicalExecuter(function() | ||
66 | { | ||
67 | // Make sure there is a valid hash and it is NOT the card | ||
68 | // that we just loaded (prevent double-carding) | ||
69 | if ( | ||
70 | this.lastEvent != window.location.hash && | ||
71 | window.location.hash != '#' && | ||
72 | window.location.hash != '' | ||
73 | ) { | ||
74 | this.lastEvent = window.location.hash; | ||
75 | this._handleEvents(); | ||
76 | } | ||
77 | }.bind(this), 0.1); | ||
78 | |||
79 | return this; | ||
80 | }, | ||
81 | |||
82 | /* | ||
83 | * Handles an event, this is called internally by the pollEvents function | ||
84 | * when a new event occurs and should never be called directly. | ||
85 | */ | ||
86 | _handleEvents: function() | ||
87 | { | ||
88 | // Breaks down the event type and parameters from the hash | ||
89 | var evtTypes = /^(card|table|preview)/; | ||
90 | var hash = window.location.hash; | ||
91 | |||
92 | // When IE does the split it only returns one array element, | ||
93 | // the parameter, so we have to do a little magic to match | ||
94 | // the action too. All other browsers seem to work correctly. | ||
95 | var fullEvt = hash.substr(1, hash.length).split(evtTypes).without(''); | ||
96 | var eventType = (fullEvt.length == 1) ? hash.substr(1, hash.length).match(evtTypes)[0] : fullEvt[0]; | ||
97 | var eventParam = (fullEvt.length == 1) ? fullEvt : fullEvt[1]; | ||
98 | |||
99 | // Hide the current card if there is one | ||
100 | if (SME.currentCard && SME.currentCard.hide) | ||
101 | { | ||
102 | SME.currentCard.hide(); | ||
103 | } | ||
104 | |||
105 | switch (eventType) | ||
106 | { | ||
107 | case 'table': | ||
108 | CardTable.showTable(eventParam); | ||
109 | return; | ||
110 | break; | ||
111 | |||
112 | case 'card': | ||
113 | theURL = SME.url.cards.evaluate({card: eventParam}); | ||
114 | break; | ||
115 | |||
116 | case 'preview': | ||
117 | theURL = SME.url.cardPreview.evaluate({card: eventParam}); | ||
118 | this.stopPolling(); | ||
119 | break; | ||
120 | |||
121 | default: | ||
122 | return; | ||
123 | break; | ||
124 | } | ||
125 | |||
126 | new Ajax.Request(theURL, | ||
127 | { | ||
128 | method: 'get', | ||
129 | |||
130 | onSuccess: function(transport) | ||
131 | { | ||
132 | var data = transport.responseText.cleanJSON().evalJSON(); | ||
133 | |||
134 | var card = new Card( | ||
135 | { | ||
136 | color: CardTable.tableColor(data.type), | ||
137 | contID: eventParam, | ||
138 | title: data.title, | ||
139 | preview: (eventType == 'preview') ? true : false | ||
140 | }); | ||
141 | |||
142 | this.registerEvent(eventType, data.title, eventParam); | ||
143 | card.show(); | ||
144 | }.bind(this) | ||
145 | }); | ||
146 | }, | ||
147 | |||
148 | |||
149 | /* | ||
150 | * Creates and populates the history dropdown based on the | ||
151 | * events stored in the history storage array. Also handles | ||
152 | * showing, hiding and positioning that menu. | ||
153 | */ | ||
154 | getDropDown: function(x, y) | ||
155 | { | ||
156 | var dropdown = $('history'); | ||
157 | |||
158 | // If no x and y then position the menu for the my history | ||
159 | // dropdown from the tools menu. | ||
160 | x = x ? x : 20; | ||
161 | y = y ? y : 26; | ||
162 | |||
163 | // Remove and re-append the menu from the DOM, this prevents | ||
164 | // IE z-index bugs. | ||
165 | document.body.appendChild(dropdown.remove()); | ||
166 | dropdown.innerHTML = ''; | ||
167 | |||
168 | // Populate the menu | ||
169 | this.historyStore.each(function(item) | ||
170 | { | ||
171 | dropdown.appendChild(Builder.node('li', {}, Builder.node('a', { href: '#' + item.key }, item.value))); | ||
172 | }); | ||
173 | |||
174 | // Initially show the menu | ||
175 | dropdown.addClassName('hovered'); | ||
176 | |||
177 | // Must explicitly set left to nothing otherwise positioning | ||
178 | // is wrong. | ||
179 | dropdown.setStyle( | ||
180 | { | ||
181 | right: x + 'px', | ||
182 | top: y + 'px', | ||
183 | left: '', | ||
184 | zIndex: 9999 | ||
185 | }); | ||
186 | |||
187 | // Hide the menu when the user... | ||
188 | $H({ | ||
189 | '#history a' : 'click', // Clicks on a link | ||
190 | 'div.table' : 'mouseover', // Mouses-off onto a table | ||
191 | 'p' : 'mouseover', // Mouses-off onto a paragraph | ||
192 | 'iframe' : 'mouseover', // Mouses-off onto an iframe | ||
193 | 'img' : 'mouseover' // Mouses-off onto an image | ||
194 | }).each(function(aitem) | ||
195 | { | ||
196 | $$(aitem.key).each(function(item) | ||
197 | { | ||
198 | item.observe(aitem.value, function() | ||
199 | { | ||
200 | if ($('history').hasClassName('hovered')) | ||
201 | { | ||
202 | $('history').removeClassName('hovered'); | ||
203 | } | ||
204 | }); | ||
205 | }); | ||
206 | }); | ||
207 | } | ||
208 | }); \ No newline at end of file | ||