live-streaming


Hitbox Follower Alert


There is this site called hitbox. It's similar to twitch but as far as I can see the api is rather different! I tried to take a twitch follower alert and change the code a bit to make it work with hitbox but with no luck. I don't want to create a whole program because that would take a lot of time. I just want to make a webpage and display the latest follower on there. The hitbox api can be found here.
If you think it would be easier to do something like that but in mIRC then do it that way but I think it would be easier to do it with a webpage. I am a total n00b when it comes to programming so if you could explain to me what everything does I would appreciate it (I want to start learing to code but I don't really know where to start. At least I am quite young (14) so I have enough time to do that)
Thanks you
- Andrew
I just came across you post while searching for some information on Hitbox on Google.
And you know what!? I just made a follower alert app like 30 min ago.
Here is the code, actually it's really simple. (hitbox_followeralert.js)
var followers = 0,
lastCheck = 0,
lastFollower = "",
sound = new Audio("AlertSound.ogg"),
channel = "MaitreChocobo";
function checkForNew(){
$.getJSON("http://api.hitbox.tv/user/"+channel, function(data){
followers = data.followers;
if(followers > lastCheck && lastCheck!=0){
sound.play();
$.getJSON("http://api.hitbox.tv/followers/user/"+channel+"?offset="+(followers-1), function(gata){
$("#new-follower").html(gata.followers[0].user_name);
$("#follower-alert .text").css("font-size", "45px");
$("#follower-alert").fadeIn("slow");
setTimeout(function(){
$("#follower-alert").fadeOut("slow");
}, 10000);
})
}
lastCheck = followers;
}).fail(function(){
console.log('An error occurred!');
});
}
setInterval(checkForNew, 5000);
Since I inspired myself from the Twitch Follower Alert from NightDev I copied their whole webpage to make everything simpler. Here is the page. (Index.html)
<html>
<head>
<meta charset="utf-8">
<title>Follower Alert</title>
<style>
body {
background-color: transparent;
color: white;
}
#follower-alert {
display: none;
position: absolute;
top: 0px;
left: 0px;
width: 580px;
height: 110px;
}
#follower-alert .text {
margin-left: 170px;
padding-top: 45px;
text-align: center;
width: 385px;
line-height: 45px;
vertical-align: middle;
font-size: 45px;
font-family: Impact;
text-shadow: 2px 2px 1px #000;
white-space: nowrap;
color: #ffffff;
}
</style>
<style type="text/css"></style></head>
<body>
<div id="follower-alert" style="background-image: url(template.png);">
<div class="text" id="new-follower" style="margin-left: 15px; width: 550px;"></div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="hitbox_followeralert.js"></script>
</body>
</html>
You will only have to change the channel variable at the top to match your username.
You could also delete the sound part if you don't need it. I also made a simple background called template.png in the root folder. So I have 4 files to make this litte project : index.html, hitbox_followeralert.js, AlertSound.ogg, template.png
Then to add it to OBS I used the plugin called CLR Browser and you're good to go!
Hope this could help you and I'm not too late to answer your question.
-MaitreChocobo

Related Links

Any possibility for live-videostreaming within a-frame?
Display multiple live stream video in android using Wowza.(Group Video Calling through Wowza)
HLS live streaming subtitle?
How do I Create Livestream testbed?
What are the Data- API limits for Dailymotion API
Generate .m3u8 on the fly from .ts files
One click live stream solution
How does “Follow Chess” stream live chess games?
Streaming webcam and mic inputs through browser
live555 streaming using ByteStreamMemoryBufferSource
mpeg dash live stream example [closed]
Live streamign using Kaltura and Wowza + FMLE
Real Time screen grabbing and streaming with libav-tools
Access camera at remote location on iphone
Hitbox Follower Alert
Take input from a live source instead of from a file in live555

Categories

HOME
flask
plesk
blast
windows-8.1
ontouchlistener
foaf
hid
filesize
mongoid
jint
sentry
stored-procedures
javafx-8
phpmqtt
elastic-load-balancer
lc3
freertos
global-variables
pinterest
jqxgrid
cocos2d-android
angular2-highcharts
pe
candlestick-chart
backendless
pubxml
tracing
prompt
android-service
ruby-daemons
points
react-bootstrap-table
npoi
amazon-cloudtrail
spring-annotations
laravel-4.2
boolean-logic
bitbake
locks
d3.js-v4
premake
wampsharp
seafile-server
microsoft-certifications
db2-luw
rails-postgresql
jfxtras
des
landscape
mars-simulator
python-sounddevice
netapp
plane
coverage.py
1wire
minikube
virtual-memory
gcal
section508
nonlinear-functions
cordova-ios
gestures
pecl
emf-compare
maatwebsite-excel
yui3
ipywidgets
xcode6.4
msg
unsigned
urbit
mathnet
verisign
diawi
opencyc
nette
srv-record
auto-generate
hmisc
scala-macros
window-resize
producer
back
ecos
aho-corasick
distributed-r
senchatouch-2.4
.htpasswd
refit
miglayout
gpu-programming
facebook-game-groups
void-pointers
multiscaleimage
workflow-manager-1.x
coordinate
autosize
dropshadow
netstream
navigationcontroller
differentiation
qtextbrowser
snackjs
qt-mobility
winsxs
anonymous-types
rawcontacts
wmd-editor
iphone-sdk-3.1.3

Resources

Database Users
RDBMS discuss
Database Dev&Adm
javascript
java
csharp
php
android
javascript
java
csharp
php
python
android
jquery
ruby
ios
html
Mobile App
Mobile App
Mobile App