Jump to content
HWBOT Community Forums

Embed HWBOT Rankings on Blog or Forum

Massman
 Share

Recommended Posts

Massman Apprentice

Massman

Posted
Posted

attachment.php?attachmentid=3462&stc=1&d=1447405272attachment.php?attachmentid=3463&stc=1&d=1447405272

 

Following the request for beta testing our new embed functionality, introducing the official beta thread for the new HWBOT embed functionality.

 

Since September we are working with an external company to push the HWBOT development into a new direction. At the moment we are focusing on preparing the OC-ESPORTS website for 2016. The first feature to make it to production is the new HWBOT Embed functionality. This allows you to embed HWBOT rankings on your blog, forum, or website without any knowledge on software development. The function is available at http://hwbot.org/embed/loadembed.

 

 

A couple of Notes:

  • The integrated forum rankings v2 from 2010 still works. There are no plans to discontinue this, but we are not actively maintaining the code.
  • The Embed functions are currently only available for registered developers. We want to monitor the usage and see how it affects the performance of the website as we scale up.
  • There are currently three supported types of leaderboards:
    • Competition: embed the leaderboard of an OC-ESPORTS competition
    • Benchmark: embed the benchmark overall hall of fame
    • Team: embed the leaderboard of a benchmark, scoped to your team members

    [*]We currently support three types of embed forms

    • Javascript embed
    • JSON output
    • Vbulletin BBCODE(*)

We also support custom SQL to Embed for custom data requests. This will be available for our premium partners first as we make sure it functions correctly.

 

During the next couple of weeks we will run tests with developers who will beta test the different leaderboards. Our main focus is gathering feedback on usability, speed and server load, and feature requests. Once we have gathered all the feedback, we will plan the next development steps for the embed functionality. This is already in our backlog:

  • Stylesheet customization (color, font, etc)
  • Reddit markup
  • Country leaderboards
  • Overclockers League leaderboard

Long-term I really want to bring back the functionality to submit results from external websites (like we had 10y ago). If the embed kicks off and becomes really popular, I think this would definitely be a valuable tool for team admins to get people involved in overclocking.

 

 

How to become a registered developer?

 

Post a message below so I can add developer credentials to your HWBOT account.

 

 

How to create an Embed

 

Go to http://hwbot.org/embed/loadembed.

  1. Select your embed configuration
  2. Click 'Generate Configuration'
  3. Copy-paste the code where you want to embed

You can view previously configured embeds with Inspect. You can also delete the embeds you're no longer using.

 

 

How to use JSON and BBCODE

 

For JSON, use the following URL: http://hwbot.org/embed/rankings.json?token={configId}. For the example used above, this would be: 

https://hwbot.org/embed/rankings.json?token=59155351-f93c-4747-80a9-ab6c0701601b
 

 

For BBCODE, ask your forum admin to add the following BBCODE configuration: 

Title: HWBOT leaderboard embed

BB Code Tag Name: hwbot

Replacement: <script src='https://hwbot.org/js/embed.js'></script><div id='{param}'><script type='text/javascript'>hwbot_embed('{param}','','embedTable')</script></div>

Example: [hwbot]8a011200-d907-4d93-8ea2-acf4deeced90[/hwbot]

Description: Embed HWBOT leaderboard
 

 

Then simply use the [hwbot]{configId}[/hwbot.] for embedding the leaderboard.

 

 

Examples

 

 
 
Link to comment
Share on other sites
Taloken Newbie

Taloken

Posted
Posted (edited)

I've been thinking of something like that few weeks ago, what you've done is amazing :D

 

I will propose to Cowcotland webmasters to integrate it at least in our bbcodes ^^

 

Nice features to have would be :

- Choosing between TOP results or LAST results

- Choosing the number of results to display (top-20, top-5, last-10 etc ...). Maybe, with a cap of 20, it can lighten (not much) the network load.

- Country leaderboard ?

 

I see that most of the comp don't appears yet. It's just for the need of beta-testing, at release all comps will be available ?

Edited by Taloken
Link to comment
Share on other sites
Massman Apprentice

Massman

Posted
  • Author
Posted

 

Wow, that looks great! :celebration:

 

How did you change the color schemes?

 

I've been thinking of something like that few weeks ago, what you've done is amazing :D

 

I will propose to Cowcotland webmasters to integrate it at least in our bbcodes ^^

 

Nice features to have would be :

- Choosing between TOP results or LAST results

- Choosing the number of results to display (top-20, top-5, last-10 etc ...). Maybe, with a cap of 20, it can lighten (not much) the network load.

- Country leaderboard ?

 

I see that most of the comp don't appears yet. It's just for the need of beta-testing, at release all comps will be available ?

 

Noted down the suggestions.

 

The lack of competitions was a small bug that is already fixed on our test environment. So soon all will be available. I also noticed there were no 3D benchmarks available, which is also being addressed.

Link to comment
Share on other sites
Massman Apprentice

Massman

Posted
  • Author
Posted
how to change the width?

 

There is a way to overwrite the CSS manually.

 

<script src='http://hwbot.org:80/js/embed.js'></script>
<div id='10d346e4-bb8b-41b5-a17b-de87829dfb6e'><script type='text/javascript'>hwbot_embed('10d346e4-bb8b-41b5-a17b-de87829dfb6e','','embedTable')</script></div>

 

Ihe embed code we exposed the CSS class name: embedtable. If you want to use your own style sheet, just change the ‘embedTable’ to the CSS classname in your style sheet.

 

I haven't tested this myself, just relying on the word of the devs. Will try this week when I find time ...

Link to comment
Share on other sites
  • 9 months later...
  • 4 months later...
  • Guest unpinned this topic
  • 4 months later...
ATMINSIDE Newbie

ATMINSIDE

Posted
Posted
2 minutes ago, richba5tard said:

You might! Please check if you have a reference to https://ssl somewhere in the hwbot code snippet.

Here's what I have in my BB Code entry for the HWBot code, should it be something different now? 

<script type="text/javascript">
	
    var _hwbtarget = 'hwb_' + Math.round((Math.random() * 100000));
    document.write("<div id='"+ _hwbtarget +"'><img src='//62.182.59.107/img/loader.gif' alt='loading'/> Loading…</div>");

	// uncomment for custom css
    var _hwbcss = "//hwbot.org/css/style.external.custom.ocforums.css";
    var _hwb =  _hwb || [];
    _hwb.push(['type={param}']);
    _hwb.push(['params={option}']);
    _hwb.push([_hwbtarget]);
		
    (function() {
      var hwbex = document.createElement('script'); hwbex.type = 'text/javascript'; hwbex.async = true;
      hwbex.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://') + 'hwbot.org/js/exf2.js';
      var s = document.getElementById(_hwbtarget); s.parentNode.insertBefore(hwbex, s);
    })();
		
</script>

 

Link to comment
Share on other sites
ATMINSIDE Newbie

ATMINSIDE

Posted
Posted
43 minutes ago, richba5tard said:

Please replace: 


hwbex.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://') + 'hwbot.org/js/exf2.js';

With: 


hwbex.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'hwbot.org/js/exf2.js';
 

OK sorry for the delay, got waylaid. 
I made that change, which took the result from "loading" to a blank element in the thread.

https://www.overclockers.com/forums/showthread.php/646030-HWBOT-Rankings

Link to comment
Share on other sites
ATMINSIDE Newbie

ATMINSIDE

Posted
Posted
50 minutes ago, richba5tard said:

Sorry, not sure why but it keeps using the non https version. You can't mix https with http, the browser will prevent that.

Can you force https by changing above line to: 


wbex.src = 'https://hwbot.org/js/exf2.js';

Doesn't look like that's fixed it either. I did manage to get the loader.gif to work though, for some reason it was set to a static IP instead of hwbot.org

Here's where I'm at right now:
  

<script type="text/javascript">
	
    var _hwbtarget = 'hwb_' + Math.round((Math.random() * 100000));
    document.write("<div id='"+ _hwbtarget +"'><img src='https://hwbot.org/img/loader.gif' alt='loading'/> Loading…</div>");

	// uncomment for custom css
    var _hwbcss = "https://hwbot.org/css/style.external.custom.ocforums.css";
    var _hwb =  _hwb || [];
    _hwb.push(['type={param}']);
    _hwb.push(['params={option}']);
    _hwb.push([_hwbtarget]);
		
    (function() {
      var hwbex = document.createElement('script'); hwbex.type = 'text/javascript'; hwbex.async = true;
      wbex.src = 'https://www.hwbot.org/js/exf2.js';
      var s = document.getElementById(_hwbtarget); s.parentNode.insertBefore(hwbex, s);
    })();
		
</script>

 

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...