comparison forums/static/js/forums.js @ 1166:130ac1e98cf4

More V3 forums tweaking. Adding attachments is working now. Adding a post via ajax is working. Still need to display attachments on posts.
author Brian Neal <bgneal@gmail.com>
date Sun, 20 Aug 2017 15:55:54 -0500
parents 92101013d5ac
children
comparison
equal deleted inserted replaced
1165:3d17714c9a26 1166:130ac1e98cf4
19 }, 19 },
20 traditional: true, 20 traditional: true,
21 dataType: 'html', 21 dataType: 'html',
22 success: function (data, textStatus) { 22 success: function (data, textStatus) {
23 postText.val(''); 23 postText.val('');
24 var lastTr = $('#forum-topic tr:last'); 24 var lastPost = $('#forum-topic-post-container > div:last-child');
25 var newClass = lastTr.hasClass('odd') ? 'even' : 'odd'; 25 var firstCard = lastPost.find('div > div').first();
26 lastTr.after(data); 26 var newCardClass = firstCard.hasClass('sg101-card1') ? 'sg101-card2' : 'sg101-card1';
27 lastTr = $('#forum-topic tr:last'); 27 var newDividerClass = newCardClass == 'sg101-card1' ? 'sg101-card-divider1' : 'sg101-card-divider2';
28 lastTr.addClass(newClass); 28 lastPost.after(data);
29 lastTr.hide(); 29
30 lastTr.fadeIn(3000); 30 lastPost = $('#forum-topic-post-container > div:last-child');
31 var firstCard = lastPost.find('> div > div').first();
32 firstCard.addClass(newCardClass);
33 var firstDivider = firstCard.find('> div').first();
34 firstDivider.addClass(newDividerClass);
35 var lastCard = lastPost.find('> div:last-child > div').first();
36 lastCard.addClass(newCardClass);
37 var lastDivider = lastCard.find('> div').first();
38 lastDivider.addClass(newDividerClass);
39
40 lastPost.hide();
41 lastPost.fadeIn(3000);
31 postButton.removeAttr('disabled').val('Submit Reply'); 42 postButton.removeAttr('disabled').val('Submit Reply');
32 initAttachments(); 43 initAttachments();
33 }, 44 },
34 error: function (xhr, textStatus, ex) { 45 error: function (xhr, textStatus, ex) {
35 alert('Oops, an error occurred. ' + xhr.statusText + ' - ' + 46 alert('Oops, an error occurred. ' + xhr.statusText + ' - ' +
177 } 188 }
178 else 189 else
179 { 190 {
180 vid = 0; 191 vid = 0;
181 var s = '<div id="init-add">' + 192 var s = '<div id="init-add">' +
182 '<img src="/static/icons/television_add.png" alt="Add" /> ' + 193 '<button class="button">' +
183 '<a href="#">Attach Video</a></div>'; 194 '<i class="fi-video"></i> Attach Video' +
195 '</button>' +
196 '</div>';
184 vidDiv.prepend(s); 197 vidDiv.prepend(s);
185 $('#attachment a').click(function () { 198 $('#attachment button').click(function () {
186 $('#init-add').remove(); 199 $('#init-add').remove();
187 addVideo(); 200 addVideo();
188 return false; 201 return false;
189 }); 202 });
190 } 203 }
206 219
207 function addVideo() 220 function addVideo()
208 { 221 {
209 var id = "video-" + vid; 222 var id = "video-" + vid;
210 223
211 var fakeForm = '<div id="' + id + '">' + 224 var fakeForm =
212 '<img src="/static/icons/television_add.png" alt="Attach" class="r" /> ' + 225 '<div id="' + id + '" class="row">' +
213 '<input type="text" size="45" class="r" /> <button type="button" class="r">Attach</button> ' + 226 '<div class="columns r">' +
214 '<a href="#" class="r">Remove</a><br /></div>'; 227 '<div class="input-group">' +
228 '<span class="input-group-label"><i class="fi-video"></i></span>' +
229 '<input class="input-group-field" type="text">' +
230 '<div class="input-group-button">' +
231 '<button type="button" class="button r">Attach</button>' +
232 '</div>' +
233 '</div>' +
234 '</div>' +
235 '<div class="small-2 columns r">' +
236 '<a href="#">Remove</a>' +
237 '</div>' +
238 '</div>';
215 239
216 var n = $('#attachment div').length; 240 var n = $('#attachment div').length;
217 241
218 var another = $('#attach-another'); 242 var another = $('#attach-another');
219 if (n == 0) 243 if (n == 0)
227 vidDiv.append(fakeForm); 251 vidDiv.append(fakeForm);
228 } 252 }
229 } 253 }
230 else 254 else
231 { 255 {
232 $('#attachment div:last').after(fakeForm); 256 $('#attachment div.row:last').after(fakeForm);
233 } 257 }
234 258
235 $('#' + id + ' a').click(function() { 259 $('#' + id + ' a').click(function() {
236 $('#' + id).remove(); 260 $('#' + id).remove();
237 relabelAttachLink(); 261 relabelAttachLink();
251 }, 275 },
252 dataType: 'json', 276 dataType: 'json',
253 success: function (data, textStatus) { 277 success: function (data, textStatus) {
254 $('#' + id + " .r").remove(); 278 $('#' + id + " .r").remove();
255 var myDiv = $('#' + id); 279 var myDiv = $('#' + id);
256 var html = '<span class="link">' + 280 var html =
257 '<img src="/static/icons/television_delete.png" alt="Remove" /> ' + 281 '<div class="columns">' +
258 '<a href="#">Remove</a></span>' + 282 data.embed +
259 '<input type="hidden" name="attachment" value="' + data.id + '" />'; 283 '<p><a href="#"><i class="fi-x"></i> Remove ' +
284 '<i class="fi-arrow-up"></i></a></p>' +
285 '</div>';
260 myDiv.prepend(html); 286 myDiv.prepend(html);
261 myDiv.prepend(data.embed);
262 $('#' + id + ' a').click(function() { 287 $('#' + id + ' a').click(function() {
263 myDiv.remove(); 288 myDiv.remove();
264 relabelAttachLink(); 289 relabelAttachLink();
265 return false; 290 return false;
266 }); 291 });