BrewPoll is "A Place for Sharing Beer Brewing Articles, Tips and News - Where Every Vote Counts!" It's a submission site for brewing articles sponsored by BeerSmith. Their RSS feed has a steady trickle of posts and it's a good way to reach homebrewers. While it's not appropriate to submit every question to BrewPoll our wiki articles are great candidates.

Submitting an article is easy enough, but the power comes from having their badge on your article where you can vote it up on BrewPoll (different from BrewAdvice voting). The method involves adding an iFrame to the page which requests the badge. Since we (rightfully) can't do this through the editor we need an ingenious method to get their content in our posts.

BrewPoll on the Midnight Hour Homebrew-blog

I added it to my blogspot blog after a little tinkering, but they allow javascript. Been pondering the problem of getting the badge over here, but came up blank. Put on your HTML & javascript hat and think with me.

How can we get BrewPoll's badges on our articles?

BrewPoll Screenshot

share

migrated from homebrew.stackexchange.com Dec 2 '10 at 19:31

This question came from our site for dedicated home brewers and serious enthusiasts.

    
What would be really cool is a hook into the BrewAdvice vote click that also upvotes the article on BrewPoll. Less confusion for users & more votes for us. Requires that the user also be logged into BrewPoll.... –  Dean Brundage Feb 26 '10 at 14:49
    
Where do you get the badge code? –  hookedonwinter Feb 26 '10 at 18:25

4 Answers 4

Here's some working javascript without the dependency on jquery. It replaces all occurrences of {brewpoll} in the question only with the BrewPoll iFrame. It is a global, case-insensitive search. Just put {brewpoll} in your question where you want to see the box. Don't forget to submit the article there.

<script type="text/javascript">
   window.onload = function ()
   {  // Use window.onload so the question is all there
      var my_url = document.URL.replace(/\/?[0-9]*#.*/, ""); // Chop off links to answers
      var brewpoll = '<iframe ' +
                        'frameborder="0" ' +
                        'height="71" ' +
                        'name="brewadvice_plug" ' +
                        'scrolling="no" ' +
                        'src="http://www.brewpoll.com/evb/url.php?url=' + my_url + '" ' +
                        'width="54" ' +
                     '></iframe>';
      var regexp = /{brewpoll}/gi;
      var question = document.getElementById("question");  // Only apply to the question
      question.innerHTML = question.innerHTML.replace( regexp, brewpoll );  // innerHTML is bad, mmmkay?
   }
</script>
share
    
Tested in FF 3.6, Chrome, Safari. All for Mac. –  Dean Brundage Feb 27 '10 at 1:10
    
Going to implement this today. Thanks Dean! –  hookedonwinter Mar 1 '10 at 16:36
    
Implemented! And it works great. Thanks for your help Dean! –  hookedonwinter Mar 1 '10 at 17:07
    
Just kidding. It replaces html after js is bound, so it essentially unbinds the voting functionality, etc. I found a solution, posting in a sec. –  hookedonwinter Mar 1 '10 at 18:02
    
Possibly because it tramples on window.onload, or replaces all of #question. –  Dean Brundage Mar 1 '10 at 18:36

We could have some sort of flag that then loads the iFrame. For example, you would write something like [BrewPoll-IDGoesHere], and we could use some js regex to replace that with the iframe on load.


Edit. Here is my javascript (jquery) solution. For you techies.

I think the tag will be something like ~~brewpoll=[TITLE]~~

So that's doublde tilde (~) brewpoll = page title double tilde

Example: ~~brewpolll=Brew_Advice_-_Knowledge_Sharing_Experiment~~

In the example above, make sure you spell brewpoll with two L's, not three. I had to do that otherwise it would turn that into a voting link.

We can use a different tag than the double tilde, just let me know your suggestions.

Here is the code. I realize jquery is not required here.

<script type="text/javascript" src="jquery.1.4.2.min.js"></script>
<script type="text/javascript">
    function regit(){

        var pattern = /~~brewpoll=([\w]{1,})~~/i
        var new_page = $( 'body' ).html()
        var iframe1 = "<iframe src='http://www.brewpoll.com/evb/url.php?url="
        var iframe2 = "' height='71' width='54' scrolling='no' frameborder='0'></iframe>"

        while( pattern.test( new_page ) )
            new_page = new_page.replace( pattern, iframe1 + "$1" + iframe2)

        $( 'body' ).html( new_page )

    } // regit

    $( document ).ready(
        function(){
            regit()
        } // function
    ) // ready

</script>

This does throw a sweet error in Safari, which I may or may not care about:

Unsafe JavaScript attempt to access frame with URL http://pjhoberman.com/dev/js_regex.html from frame with URL http://www.brewpoll.com/evb/url.php?url=Brewing_News_2009_reader_survey. Domains, protocols and ports must match.
share
    
I need to write a hop press post, and then I will work on this. –  hookedonwinter Feb 26 '10 at 16:31
    
I didn't know we could include our own JS –  Dean Brundage Feb 26 '10 at 17:28
    
You can't. But I can edit the js for the site, and have it pick up the flag. –  hookedonwinter Feb 26 '10 at 18:01
    
That's what I meant by "we".... It's a community after all. ;-) –  Dean Brundage Feb 26 '10 at 18:35
    
ya ya ya. Technically, "I" can't either. But the admin account I have access to can. :) –  hookedonwinter Feb 26 '10 at 19:44

This is the live answer. It works. It uses jQuery, but we're already including it for other stuff, so that's fine. It finds the question, and then in that, finds the content itself.

Here is the code:

<script type="text/javascript" src="jquery.1.4.2.min.js"></script>
<script type="text/javascript">
   window.onload = function ()
   {  // Use window.onload so the question is all there
      var my_url = document.URL.replace(/\/?[0-9]*#.*/, ""); // Chop off links to answers
      var brewpoll = '<iframe ' +
         'frameborder="0" ' +
         'height="71" ' +
         'name="brewadvice_plug" ' +
         'scrolling="no" ' +
         'src="http://www.brewpoll.com/evb/url.php?url=' + my_url + '" ' +
         'width="54" ' +
         '></iframe>';
      var regexp = /{brewpoll}/gi;

  $( '#question .post-text' )
        .html( 
           $( '#question .post-text' ).html().replace( regexp, brewpoll ) 
         )

   }
 </script>
share
    
I would change window.onload = function to jQuery's $(document).ready(function() { <code> } ); –  Dean Brundage Mar 1 '10 at 18:34
    
I can do that. Any reason? –  hookedonwinter Mar 1 '10 at 19:59
    
1. It's not a W3C standard (might not be supported in all browsers). 2. There could be more than one window.onload - only the last one would work. –  Dean Brundage Mar 2 '10 at 3:32
    
Cool, I'll do that today. –  hookedonwinter Mar 2 '10 at 15:07

How about adding it to all questions? I noticed that the .votecell td is the same width as the iframe, so it should fit right under the vote/favorite div. There would be no need to add {brewpoll} to your post. Would this confuse people too much?

I noticed that if you change the post's title after submitting it to Brew Poll it loses your submission. That's because Brew Advice's URLs change with the title. This new code chops off everything after the post number, resulting in a URL that still gets to the question, but eliminates parts that change. http://brewadvice.com/questions/864

Depends on jQuery.

<script type="text/javascript">
   $(document).ready(function() {
      var my_url = escape( document.URL.replace( /(\/questions\/[0-9]+).*/i, "$1" ) );
      var brewpoll = '<iframe ' +
                        'frameborder="0" ' +
                        'height="71" ' +
                        'name="brewadvice_plug" ' +
                        'scrolling="no" ' +
                        'src="http://www.brewpoll.com/evb/url.php?url=' + my_url + '" ' +
                        'width="54" ' +
                        '></iframe>';
   $("#question .votecell:first").append(brewpoll);
   } );
</script>

Test it out, let me know.

share
    
I don't know that every question should be on brew poll. They might not want us flooding their site with the simple Q&A. What do you think? Testing the new code now. –  hookedonwinter Mar 2 '10 at 15:48
    
I don't know that every question should be on brew poll. They might not want us flooding their site with the simple Q&A. What do you think? –  hookedonwinter Mar 2 '10 at 15:48
    
Putting the badge up doesn't automatically submit the question. A registered BrewPoll user must do that. –  Dean Brundage Mar 2 '10 at 15:54

You must log in to answer this question.