annotate media/js/forums.js @ 285:8fd4984d5c3b

This is a first rough commit for #95, adding the ability to embed YouTube videos in forum posts. Some more polish and testing needs to happen at this point. I wanted to get all these changes off my hard drive and into the repository.
author Brian Neal <bgneal@gmail.com>
date Thu, 14 Oct 2010 02:39:35 +0000
parents 13330e1836f3
children 72fd300685d5
rev   line source
bgneal@89 1 $(document).ready(function() {
bgneal@89 2 var postText = $('#id_body');
bgneal@89 3 var postButton = $('#forums-reply-post');
bgneal@89 4 postButton.click(function () {
bgneal@89 5 var text = $.trim(postText.val());
bgneal@89 6 if (text.length == 0) {
bgneal@126 7 alert('Please enter some text.');
bgneal@89 8 return false;
bgneal@89 9 }
bgneal@89 10 $(this).attr('disabled', 'disabled').val('Posting reply...');
bgneal@285 11
bgneal@285 12 var attachments = new Array()
bgneal@285 13 $('#attachment div input').each(function(index) {
bgneal@285 14 attachments[index] = $(this).val();
bgneal@285 15 });
bgneal@285 16
bgneal@89 17 $.ajax({
bgneal@89 18 url: '/forums/quick-reply/',
bgneal@89 19 type: 'POST',
bgneal@89 20 data: {
bgneal@285 21 body : postText.val(),
bgneal@285 22 topic_id : $('#id_topic_id').val(),
bgneal@285 23 attachment : attachments
bgneal@89 24 },
bgneal@285 25 traditional: true,
bgneal@89 26 dataType: 'html',
bgneal@89 27 success: function (data, textStatus) {
bgneal@89 28 postText.val('');
bgneal@89 29 $('#forum-topic tr:last').after(data);
bgneal@89 30 var lastTr = $('#forum-topic tr:last');
bgneal@89 31 lastTr.hide();
bgneal@89 32 lastTr.fadeIn(3000);
bgneal@89 33 postButton.removeAttr('disabled').val('Submit Reply');
bgneal@285 34 initAttachments();
bgneal@89 35 },
bgneal@89 36 error: function (xhr, textStatus, ex) {
bgneal@108 37 alert('Oops, an error occurred. ' + xhr.statusText + ' - ' +
bgneal@108 38 xhr.responseText);
bgneal@89 39 postButton.removeAttr('disabled').val('Submit Reply');
bgneal@285 40 initAttachments();
bgneal@89 41 }
bgneal@89 42 });
bgneal@89 43 return false;
bgneal@89 44 });
bgneal@98 45 $('a.post-flag').click(function () {
bgneal@98 46 var id = this.id;
bgneal@107 47 if (id.match(/fp-(\d+)/)) {
bgneal@98 48 id = RegExp.$1;
bgneal@98 49 if (confirm('Only flag a post if you feel it is spam, abuse, violates site rules, ' +
bgneal@98 50 'or is not appropriate. ' +
bgneal@98 51 'A moderator will be notified and will review the post. ' +
bgneal@98 52 'Are you sure you want to flag this post?')) {
bgneal@99 53 $.ajax({
bgneal@99 54 url: '/forums/flag-post/',
bgneal@99 55 type: 'POST',
bgneal@99 56 data: {id: id},
bgneal@99 57 dataType: 'text',
bgneal@99 58 success: function (response, textStatus) {
bgneal@99 59 alert(response);
bgneal@99 60 },
bgneal@99 61 error: function (xhr, textStatus, ex) {
bgneal@99 62 alert('Oops, an error occurred: ' + xhr.statusText + ' - ' + xhr.responseText);
bgneal@99 63 }
bgneal@99 64 });
bgneal@98 65 }
bgneal@98 66 }
bgneal@98 67 return false;
bgneal@98 68 });
bgneal@107 69 $('a.post-delete').click(function () {
bgneal@107 70 var id = this.id;
bgneal@107 71 if (id.match(/dp-(\d+)/)) {
bgneal@107 72 id = RegExp.$1;
bgneal@107 73 if (confirm('Are you sure you want to delete this post?')) {
bgneal@107 74 $.ajax({
bgneal@107 75 url: '/forums/delete-post/',
bgneal@107 76 type: 'POST',
bgneal@107 77 data: {id: id},
bgneal@107 78 dataType: 'text',
bgneal@107 79 success: function (response, textStatus) {
bgneal@107 80 alert(response);
bgneal@107 81 $('#post-' + id).fadeOut(3000);
bgneal@107 82 },
bgneal@107 83 error: function (xhr, textStatus, ex) {
bgneal@107 84 alert('Oops, an error occurred: ' + xhr.statusText + ' - ' + xhr.responseText);
bgneal@107 85 }
bgneal@107 86 });
bgneal@107 87 }
bgneal@107 88 }
bgneal@107 89 return false;
bgneal@107 90 });
bgneal@109 91 $('#forum-mod-del-topic').click(function () {
bgneal@109 92 return confirm('Are you sure you want to delete this topic?\n' +
bgneal@109 93 'WARNING: all posts will be lost.');
bgneal@109 94 });
bgneal@285 95
bgneal@285 96 var vid = 0;
bgneal@285 97 var vidDiv = $('#attachment');
bgneal@285 98
bgneal@285 99 function clearAttachments()
bgneal@285 100 {
bgneal@285 101 $('#attachment div').remove();
bgneal@285 102 $('#attach-another').remove();
bgneal@285 103 }
bgneal@285 104
bgneal@285 105 function initAttachments()
bgneal@285 106 {
bgneal@285 107 clearAttachments();
bgneal@285 108
bgneal@285 109 var post_input = $('#attachment input');
bgneal@285 110 if (post_input.length == 1)
bgneal@285 111 {
bgneal@285 112 post_id = post_input.val();
bgneal@285 113 post_input.replaceWith('<img src="/media/icons/ajax_busy.gif" alt="Busy" />');
bgneal@285 114 $.ajax({
bgneal@285 115 url: '/forums/fetch_attachments/',
bgneal@285 116 type: 'GET',
bgneal@285 117 data: {
bgneal@285 118 pid : post_id
bgneal@285 119 },
bgneal@285 120 dataType: 'json',
bgneal@285 121 success: function (data, textStatus) {
bgneal@285 122 $('#attachment img').remove();
bgneal@285 123 $.each(data, function(index, value) {
bgneal@285 124 var html = '<div id="video-' + index + '">' + value.html +
bgneal@285 125 '<span class="link">' +
bgneal@285 126 '<img src="/media/icons/television_delete.png" alt="Remove" /> ' +
bgneal@285 127 '<a href="#">Remove</a></span>' +
bgneal@285 128 '<input type="hidden" name="attachment" value="' + value.id + '" />';
bgneal@285 129 '</div>';
bgneal@285 130 vidDiv.append(html);
bgneal@285 131 $('#video-' + index + ' a').click(function() {
bgneal@285 132 $('#video-' + index).remove();
bgneal@285 133 relabelAttachLink();
bgneal@285 134 return false;
bgneal@285 135 });
bgneal@285 136 });
bgneal@285 137 vid = data.length;
bgneal@285 138 $('#video-' + (vid-1)).after('<a id="attach-another" href="#">Attach another video</a>');
bgneal@285 139 $('#attach-another').click(function() {
bgneal@285 140 addVideo();
bgneal@285 141 relabelAttachLink();
bgneal@285 142 return false;
bgneal@285 143 });
bgneal@285 144 },
bgneal@285 145 error: function (xhr, textStatus, ex) {
bgneal@285 146 alert('Oops, an error occurred. ' + xhr.statusText + ' - ' +
bgneal@285 147 xhr.responseText);
bgneal@285 148 }
bgneal@285 149 });
bgneal@285 150 }
bgneal@285 151 else
bgneal@285 152 {
bgneal@285 153 vid = 0;
bgneal@285 154 var s = '<div id="init-add">' +
bgneal@285 155 '<img src="/media/icons/television_add.png" alt="Add" /> ' +
bgneal@285 156 '<a href="#">Attach Video</a></div>';
bgneal@285 157 vidDiv.prepend(s);
bgneal@285 158 $('#attachment a').click(function () {
bgneal@285 159 $('#init-add').remove();
bgneal@285 160 addVideo();
bgneal@285 161 return false;
bgneal@285 162 });
bgneal@285 163 }
bgneal@285 164 }
bgneal@285 165
bgneal@285 166 function relabelAttachLink()
bgneal@285 167 {
bgneal@285 168 var another = $('#attach-another');
bgneal@285 169 var n = $('#attachment div').length;
bgneal@285 170 if (n == 0)
bgneal@285 171 {
bgneal@285 172 another.html("Attach a video");
bgneal@285 173 }
bgneal@285 174 else
bgneal@285 175 {
bgneal@285 176 another.html("Attach another video");
bgneal@285 177 }
bgneal@285 178 }
bgneal@285 179
bgneal@285 180 function addVideo()
bgneal@285 181 {
bgneal@285 182 var id = "video-" + vid;
bgneal@285 183
bgneal@285 184 var fakeForm = '<div id="' + id + '">' +
bgneal@285 185 '<img src="/media/icons/television_add.png" alt="Attach" class="r" /> ' +
bgneal@285 186 '<input type="text" size="45" class="r" /> <button type="button" class="r">Attach</button> ' +
bgneal@285 187 '<a href="#" class="r">Remove</a><br /></div>';
bgneal@285 188
bgneal@285 189 var n = $('#attachment div').length;
bgneal@285 190
bgneal@285 191 var another = $('#attach-another');
bgneal@285 192 if (n == 0)
bgneal@285 193 {
bgneal@285 194 if (another.length > 0)
bgneal@285 195 {
bgneal@285 196 another.before(fakeForm);
bgneal@285 197 }
bgneal@285 198 else
bgneal@285 199 {
bgneal@285 200 vidDiv.append(fakeForm);
bgneal@285 201 }
bgneal@285 202 }
bgneal@285 203 else
bgneal@285 204 {
bgneal@285 205 $('#attachment div:last').after(fakeForm);
bgneal@285 206 }
bgneal@285 207
bgneal@285 208 $('#' + id + ' a').click(function() {
bgneal@285 209 $('#' + id).remove();
bgneal@285 210 relabelAttachLink();
bgneal@285 211 return false;
bgneal@285 212 });
bgneal@285 213
bgneal@285 214 var vidText = $('#' + id + ' input');
bgneal@285 215
bgneal@285 216 $('#' + id + ' button').click(function() {
bgneal@285 217 $.ajax({
bgneal@285 218 url: '/oembed/fetch/',
bgneal@285 219 type: 'POST',
bgneal@285 220 data: {
bgneal@285 221 q : vidText.val()
bgneal@285 222 },
bgneal@285 223 dataType: 'json',
bgneal@285 224 success: function (data, textStatus) {
bgneal@285 225 $('#' + id + " .r").remove();
bgneal@285 226 var myDiv = $('#' + id);
bgneal@285 227 var html = '<span class="link">' +
bgneal@285 228 '<img src="/media/icons/television_delete.png" alt="Remove" /> ' +
bgneal@285 229 '<a href="#">Remove</a></span>' +
bgneal@285 230 '<input type="hidden" name="attachment" value="' + data.id + '" />';
bgneal@285 231 myDiv.prepend(html);
bgneal@285 232 myDiv.prepend(data.embed);
bgneal@285 233 $('#' + id + ' a').click(function() {
bgneal@285 234 myDiv.remove();
bgneal@285 235 relabelAttachLink();
bgneal@285 236 return false;
bgneal@285 237 });
bgneal@285 238 },
bgneal@285 239 error: function (xhr, textStatus, ex) {
bgneal@285 240 alert('Oops, an error occurred. ' + xhr.statusText + ' - ' +
bgneal@285 241 xhr.responseText);
bgneal@285 242 }
bgneal@285 243 });
bgneal@285 244 });
bgneal@285 245
bgneal@285 246 if (vid == 0)
bgneal@285 247 {
bgneal@285 248 $('#video-0').after('<a id="attach-another" href="#">Attach another video</a>');
bgneal@285 249 $('#attach-another').click(function() {
bgneal@285 250 addVideo();
bgneal@285 251 relabelAttachLink();
bgneal@285 252 return false;
bgneal@285 253 });
bgneal@285 254 }
bgneal@285 255 ++vid;
bgneal@285 256 }
bgneal@285 257
bgneal@285 258 initAttachments();
bgneal@89 259 });