Made the embed widget javascript work by overloading the dismissRelatedLookupPopup...
[philo.git] / philo / static / philo / js / EmbedWidget.js
1 ;(function ($) {
2         var widget = window.embedWidget;
3         
4         widget = {
5                 options: {},
6                 optgroups: {},
7                 init: function () {
8                         var EmbedFields = widget.EmbedFields = $('.embedding'),
9                                 EmbedWidgets = widget.EmbedWidgets,
10                                 EmbedBars = widget.EmbedBars,
11                                 EmbedButtons = widget.EmbedButtons,
12                                 EmbedSelects = widget.EmbedSelects;
13
14                         EmbedFields.wrap($('<div class="embed-widget" />'));
15                         EmbedWidgets = $('.embed-widget');
16                         EmbedWidgets.prepend($('<div class="embed-toolbar" />'));
17                         EmbedBars = $('.embed-toolbar');
18                         EmbedBars.append('<select class="embed-select"></select><button class="embed-button">Embed</button>');
19                         EmbedButtons = $('.embed-button');
20                         EmbedSelects = $('.embed-select');
21                         
22                         widget.parseContentTypes();
23                         EmbedSelects.each(widget.populateSelect);
24                         
25                         EmbedButtons.click(widget.buttonHandler);
26                         
27                         // overload the dismissRelatedLookupPopup function
28                         oldDismissRelatedLookupPopup = window.dismissRelatedLookupPopup;
29                         window.dismissRelatedLookupPopup = function (win, chosenId) {
30                                 var name = windowname_to_id(win.name),
31                                         elem = $('#'+win.name), val;
32                                 // if the original element was an embed widget, run our script
33                                 if (elem.parent().hasClass('embed-widget')) {
34                                         contenttype = $('select',elem.parent()).val();
35                                         widget.appendEmbed(elem, contenttype, chosenId);
36                                         elem.focus();
37                                         win.close();
38                                         return;
39                                 }
40                                 // otherwise, do what you usually do
41                                 oldDismissRelatedLookupPopup.apply(this, arguments);
42                         }
43                 },
44                 parseContentTypes: function () {
45                         var string = widget.EmbedFields.eq(0).attr('data-content-types'),
46                                 data = $.parseJSON(string),
47                                 i=0,
48                                 current_app_label = '',
49                                 optgroups = {};
50                                 
51                                 // this loop relies on data being clustered by app
52                                 for(i=0; i < data.length; i++){
53                                         item = data[i]
54                                         // run this next loop every time we encounter a new app label
55                                         if (item.app_label !== current_app_label) {
56                                                 current_app_label = item.app_label;
57                                                 optgroups[current_app_label] = {}
58                                         }
59                                         optgroups[current_app_label][item.verbose_name] = [item.app_label,item.object_name].join('.');
60                                         
61                                         widget.optgroups = optgroups;
62                                 }
63                 },
64                 populateSelect: function () {
65                         var $this = $(this),
66                                 optgroups = widget.optgroups,
67                                 optgroup_els = {},
68                                 optgroup_el, group;
69                                 
70                         // append a title
71                         $this.append('<option value="">Media Types</option>');
72                         
73                         // for each group
74                         for (name in optgroups){
75                                 if(optgroups.hasOwnProperty(name)){
76                                         // assign the group to variable group, temporarily
77                                         group = optgroups[name];
78                                         // create an element for this group and assign it to optgroup_el, temporarily
79                                         optgroup_el = optgroup_els[name] = $('<optgroup label="'+name+'" />');
80                                         // append this element to the select menu
81                                         $this.append(optgroup_el);
82                                         // for each item in the group
83                                         for (name in group) {
84                                                 // append an option to the optgroup
85                                                 optgroup_el.append('<option value='+group[name]+'>'+name+'</option>');
86                                         }
87                                 }
88                         }
89                 },
90                 buttonHandler: function (e) {
91                         var $this = $(this),
92                                 select = $this.prev('select'),
93                                 embed_widget = $this.closest('.embed-widget'),
94                                 textarea = embed_widget.children('.embedding').eq(0),
95                                 val, app_label, object_name,
96                                 href,
97                                 win;
98                         
99                         // prevent the button from submitting the form
100                         e.preventDefault();
101                         
102                         // handle the case that they haven't chosen a type to embed
103                         if (select.val()==='') {
104                                 alert('Please select a media type to embed.');
105                                 textarea.focus();
106                                 return;
107                         }
108                         
109                         // split the val into app and object
110                         val = select.val();
111                         app_label = val.split('.')[0];
112                         object_name = val.split('.')[1];
113                         
114                         // generate the url for the popup
115                         // TODO: Find a better way to get the admin URL if possible. This will break if the URL patterns for the admin ever change.
116                         href=['../../../', app_label,  '/', object_name, '/?pop=1'].join('');
117                         
118                         // open a new window
119                         win = window.open(href, id_to_windowname(textarea.attr('id')), 'height=500,width=980,resizable=yes,scrollbars=yes');
120                 },
121                 appendEmbed: function (textarea, embed_type, embed_id) {
122                         var $textarea = $(textarea),
123                                 textarea = $textarea[0], // make sure we're *not* working with a jQuery object
124                                 current_selection = [textarea.selectionStart, textarea.selectionEnd],
125                                 current_text = $textarea.val(),
126                                 embed_string = ['{% embed', embed_type, embed_id, '%}'].join(' '),
127                                 new_text = current_text.substring(0, current_selection[0]) + embed_string + current_text.substring(current_selection[1]),
128                                 new_cursor_pos = current_selection[0]+embed_string.length;
129                         $textarea.val(new_text);
130                         textarea.setSelectionRange(new_cursor_pos, new_cursor_pos);
131                 }
132         }
133         
134         $(widget.init);
135 }(django.jQuery));