fu: Close-up of Fu, bringing a scoop of water to her mouth (Default)
fu ([personal profile] fu) wrote in [site community profile] changelog2011-08-23 01:16 pm

[dw-free] Polls - change your vote AJAX

[commit: http://hg.dwscoalition.org/dw-free/rev/4847054977aa]

http://bugs.dwscoalition.org/show_bug.cgi?id=3272

Change your vote (when you've answered), and viewing poll results (when you
haven't answered) now don't create a new page load.

Patch by [personal profile] yvi.

Files modified:
  • cgi-bin/LJ/Poll.pm
  • htdocs/js/jquery.poll.js
  • htdocs/js/livejournal.js
  • htdocs/tools/endpoints/pollvote.bml
--------------------------------------------------------------------------------
diff -r e6599bddb752 -r 4847054977aa cgi-bin/LJ/Poll.pm
--- a/cgi-bin/LJ/Poll.pm	Tue Aug 23 19:13:00 2011 +0800
+++ b/cgi-bin/LJ/Poll.pm	Tue Aug 23 21:16:39 2011 +0800
@@ -928,13 +928,14 @@
     $ret .= LJ::Lang::ml('poll.participants', { 'total' => $self->num_participants });
     if ( $mode eq 'enter' && $self->can_view( $remote ) ) {
         $ret .= "<br />\n";
-        $ret .= "[ <a href='$LJ::SITEROOT/poll/?id=$pollid&amp;mode=results'>" . LJ::Lang::ml( 'poll.seeresults' ) . "</a> ]  ";
+        $ret .= "[ <a href='$LJ::SITEROOT/poll/?id=$pollid&amp;mode=results' class='LJ_PollDisplayLink' 
+            id='LJ_PollDisplayLink_${pollid}' lj_pollid='$pollid' >" . LJ::Lang::ml( 'poll.seeresults' ) . "</a> ]  ";
         $ret .= "&nbsp&nbsp;[ <a href='$LJ::SITEROOT/poll/?id=$pollid&amp;mode=clear' 
             class='LJ_PollClearLink' id='LJ_PollClearLink_${pollid}' lj_pollid='$pollid'>  " . BML::ml('poll.clear') ."</a> ]";
     } elsif ( $mode eq 'results' ) {
         $ret .= "<br />\n";
         # change vote link
-        $ret .= "[ <a href='$LJ::SITEROOT/poll/?id=$pollid&amp;mode=enter'>" . LJ::Lang::ml( 'poll.changevote' ) . "</a> ]" if $self->can_vote( $remote ) && !$self->is_closed;
+        $ret .= "[ <a href='$LJ::SITEROOT/poll/?id=$pollid&amp;mode=enter' class='LJ_PollChangeLink' id='LJ_PollChangeLink_${pollid}' lj_pollid='$pollid' >" . LJ::Lang::ml( 'poll.changevote' ) . "</a> ]" if $self->can_vote( $remote ) && !$self->is_closed;
     } else {
         $ret .= "<br />\n";
     }
diff -r e6599bddb752 -r 4847054977aa htdocs/js/jquery.poll.js
--- a/htdocs/js/jquery.poll.js	Tue Aug 23 19:13:00 2011 +0800
+++ b/htdocs/js/jquery.poll.js	Tue Aug 23 21:16:39 2011 +0800
@@ -83,7 +83,31 @@
                     self._trigger( "complete" );
                 }
             });
-        });
+        }).end()
+        .filter("a.LJ_PollChangeLink").click(function(e){
+            e.stopPropagation();
+            e.preventDefault();
+
+            var $clicked = $(this);
+            $clicked.ajaxtip({namespace: "pollchange"})
+            .ajaxtip("load", {
+                    endpoint: "pollvote",
+                    context: self,
+                    data: { action: "change",
+                            pollid: $clicked.attr('lj_pollid')},
+                    success: function( data, status, jqxhr ) {
+                        if ( data.error ) {
+                            $clicked.ajaxtip( "error", data.error )
+                        } else {
+                            $clicked.ajaxtip( "cancel" );
+                            this.element.html(data.results_html)
+                                .trigger( "updatedcontent.poll" );
+                        }
+                        self._trigger( "complete" );
+                    }
+                    });
+        }).end()
+
     },
     _initForm: function() {
         var self = this;
@@ -94,28 +118,28 @@
             e.preventDefault();
             e.stopPropagation();
 
+            var dataarray = new Array();
+            dataarray = $poll.serializeArray();
+            dataarray.push({'name': 'action', 'value': "vote"});
             var $submit = $(this);
             $submit.ajaxtip({namespace: "pollsubmit"})
                 .ajaxtip("load", {
                     endpoint: "pollvote",
                     context: self,
-                    data: $poll.serialize(),
+                    data: dataarray,
                     success: function( data, status, jqxhr ) {
                         if ( data.error ) {
                             $submit.ajaxtip( "error", data.error )
                         } else {
                             $submit.ajaxtip( "cancel" );
-                            var resultsEle = $(data.results_html);
-                            self.element.empty().append(resultsEle);
-
-                            resultsEle.trigger( "updatedcontent.poll" );
+                            this.element.html(data.results_html)
+                                .trigger( "updatedcontent.poll" );
                         }
                         self._trigger( "complete" );
                     }
                 });
-        });
-
-        $poll.find(".LJ_PollClearLink").click(function(e){
+        }).end()
+        .find("a.LJ_PollClearLink").click(function(e){
             e.stopPropagation();
             e.preventDefault();
 
@@ -127,7 +151,32 @@
                 // don't touch hidden and submit
             });
             $poll.find("select").each(function() { this.selectedIndex = 0 });
-        });
+        }).end()
+        .find("a.LJ_PollDisplayLink").click(function(e){
+            e.stopPropagation();
+            e.preventDefault();
+
+            var $clicked = $(this);
+            $clicked.ajaxtip({namespace: "polldisplay"})
+            .ajaxtip("load", {
+                    endpoint: "pollvote",
+                    context: self,
+                    data: { action: "display",
+                            pollid: $clicked.attr('lj_pollid')},
+                    success: function( data, status, jqxhr ) {
+                        if ( data.error ) {
+                            $clicked.ajaxtip( "error", data.error )
+                        } else {
+                            $clicked.ajaxtip( "cancel" );
+                            this.element.html(data.results_html)
+                                .trigger( "updatedcontent.poll" );
+                        }
+                        self._trigger( "complete" );
+                    }
+            });
+    });
+
+
     }
 });
 
diff -r e6599bddb752 -r 4847054977aa htdocs/js/livejournal.js
--- a/htdocs/js/livejournal.js	Tue Aug 23 19:13:00 2011 +0800
+++ b/htdocs/js/livejournal.js	Tue Aug 23 21:16:39 2011 +0800
@@ -215,9 +215,23 @@
     Array.prototype.forEach.call(pollButtons, function (pollButton) {
         DOM.addEventListener(pollButton, "click", LiveJournal.pollButtonClicked.bindEventListener(pollButton));
     });
-    
+
+    var pollChange = DOM.getElementsByTagAndClassName(ele, 'a', "LJ_PollChangeLink") || [];
+
+    // attaches a click handler to all poll change answers buttons
+    Array.prototype.forEach.call(pollChange, function (pollChange) {
+        DOM.addEventListener(pollChange, "click", LiveJournal.pollChangeClicked.bindEventListener(pollChange));
+    });
+
+    var pollDisplay = DOM.getElementsByTagAndClassName(ele, 'a', "LJ_PollDisplayLink") || [];
+
+    // attaches a click handler to all poll display answers buttons
+    Array.prototype.forEach.call(pollDisplay, function (pollDisplay) {
+        DOM.addEventListener(pollDisplay, "click", LiveJournal.pollDisplayClicked.bindEventListener(pollDisplay));
+    });
+
     var pollForms = DOM.getElementsByTagAndClassName(ele, 'form', "LJ_PollForm") || []; 
-    
+
     // attach submit handlers to each poll form
     Array.prototype.forEach.call(pollForms, function (pollForm) {
         DOM.addEventListener(pollForm, "submit", LiveJournal.pollFormSubmitted.bindEventListener(pollForm));
@@ -246,9 +260,9 @@
     var opts = {
         "url"    : LiveJournal.getAjaxUrl("pollvote"),
         "method" : "POST",
-        "data"   : HTTPReq.formEncoded(formObject),
-        "onData" : LiveJournal.pollVoteSubmitted,
-        "onError": LiveJournal.pollVoteSubmitted
+        "data"   : "action=vote&" + HTTPReq.formEncoded(formObject),
+        "onData" : LiveJournal.pollUpdateContainer,
+        "onError": LiveJournal.pollUpdateContainer
     };
 
     HTTPReq.getJSON(opts);
@@ -256,23 +270,57 @@
     return false;
 };
 
-LiveJournal.pollVoteSubmitted = function (results) {
+LiveJournal.pollChangeClicked = function (e) {
+    Event.stop(e);
+
+    var opts = {
+        "url"    : LiveJournal.getAjaxUrl("pollvote"),
+        "method" : "POST",
+        "data"   : "action=change&pollid=" + this.getAttribute("lj_pollid"),
+        "onData" : LiveJournal.pollUpdateContainer,
+        "onError": LiveJournal.pollUpdateContainer
+    };
+
+    HTTPReq.getJSON(opts);
+
+    return false;
+};
+
+LiveJournal.pollDisplayClicked = function (e) {
+    Event.stop(e);
+
+    var opts = {
+        "url"    : LiveJournal.getAjaxUrl("pollvote"),
+        "method" : "POST",
+        "data"   : "action=display&pollid=" + this.getAttribute("lj_pollid"),
+        "onData" : LiveJournal.pollUpdateContainer,
+        "onError": LiveJournal.pollUpdateContainer
+    };
+
+    HTTPReq.getJSON(opts);
+
+    return false;
+};
+
+LiveJournal.pollUpdateContainer = function (results) {
     if (! results) return false;
 
     if (PollPages.hourglass) {
         PollPages.hourglass.hide();
         PollPages.hourglass = null;
     }
-    
+
     if (results.error) return LiveJournal.ajaxError(results.error);
-    
+
     resultsDiv = document.getElementById("poll-"+results.pollid+"-container");
 
     resultsDiv.innerHTML = results.results_html;
-    
+
     LiveJournal.initPolls();
 };
 
+
+
 LiveJournal.getFormObject = function (form) {
 
     var inputs = form.getElementsByTagName("input");
diff -r e6599bddb752 -r 4847054977aa htdocs/tools/endpoints/pollvote.bml
--- a/htdocs/tools/endpoints/pollvote.bml	Tue Aug 23 19:13:00 2011 +0800
+++ b/htdocs/tools/endpoints/pollvote.bml	Tue Aug 23 21:16:39 2011 +0800
@@ -58,27 +58,47 @@
     unless ($entry->visible_to($remote)) {
         return $err->("You don't have the permissions to view this poll");
     }
+   
+    my $action = $POST{action};
+
+    if ( $action eq "vote" ) {
+        unless (LJ::did_post()) {
+            return $err->("Post is required");
+        }
+
+        unless (LJ::check_form_auth()) {
+            return $err->("Form is invalid");
+        }
     
-    unless (LJ::did_post()) {
-        return $err->("Post is required");
+        my $error;
+        LJ::Poll->process_submission(\%POST, \$error);
+        if ($error) {
+            return $err->($error);
+        }
+
+        $ret->{results_html} = $poll->render(mode => "results");
+
+        $ret = {
+            %$ret,
+            pollid  => $pollid
+        };
+
+    } elsif ( $action eq "change" ) {
+        $ret->{results_html} = $poll->render(mode => "enter");
+
+        $ret = {
+            %$ret,
+            pollid  => $pollid
+        };
+
+    } elsif ( $action eq "display" ) {
+        $ret->{results_html} = $poll->render(mode => "results");
+
+        $ret = {
+            %$ret,
+            pollid  => $pollid
+        };
     }
-
-    unless (LJ::check_form_auth()) {
-        return $err->("Form is invalid");
-    }
-    
-    my $error;
-    LJ::Poll->process_submission(\%POST, \$error);
-    if ($error) {
-        return $err->($error);
-    }
-
-    $ret->{results_html} = $poll->render(mode => "results");
-
-    $ret = {
-        %$ret,
-        pollid  => $pollid
-    };
     
     sleep(1.5) if $LJ::IS_DEV_SERVER;
 
--------------------------------------------------------------------------------

Post a comment in response:

This account has disabled anonymous posting.
If you don't have an account you can create one now.
No Subject Icon Selected
More info about formatting

If you are unable to use this captcha for any reason, please contact us by email at support@dreamwidth.org