Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
tree: 0c4cde6741
Fetching contributors…

Cannot retrieve contributors at this time

310 lines (302 sloc) 10.286 kB
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script src="local.js"></script>
<script src="api_key.js"></script>
<script id="config" type="text/javascript" charset="utf-8">
var $parameters = {
urlname: "mashable",
width: 240,
_height:350,
_name: "Everywhere Basic Stats",
_description: "Shows three upcoming meetups relative to your location."
};
var $queries = {
containers: function() {
return mup_widget.api_call("/ew/containers", {urlname: $parameters.urlname, fields: "meetup_count,past_meetup_count,member_count,geo_ip"});
},
events: function() {
return mup_widget.api_call("/ew/events", {status: "upcoming", urlname: $parameters.urlname, fields: "rsvp_count"});
}
};
</script>
<link rel="stylesheet" type="text/css" href="http://static2.meetupstatic.com/style/widget.css">
<script type="text/javascript" charset="utf-8">
mup_widget.with_jquery(function($, ctx) {
// Variables
var resultCount = 0,
months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'],
numberFormat = function(nStr){
nStr += '';
x = nStr.split('.');
x1 = x[0];
x2 = x.length > 1 ? '.' + x[1] : '';
var rgx = /(\d+)(\d{3})/;
while (rgx.test(x1))
x1 = x1.replace(rgx, '$1' + ',' + '$2');
return x1 + x2;
},
addLeadingZero = function( num ) {
return (num < 10) ? ('0' + num) : num;
},
getTwoDigitYear = function( yr ) {
return yr.substring(2,4);
},
getFormattedDate = function( millis ) {
var date = new Date( millis );
return addLeadingZero( date.getDate() ) + ' ' + months[date.getMonth()] + ' ' + getTwoDigitYear( date.getFullYear().toString() );
},
getFormattedTime = function( millis ) {
var time = new Date( millis ),
hours = time.getHours(),
min = time.getMinutes(),
ampm = (hours > 11) ? 'PM' : 'AM';
min = (min < 10) ? ('0' + min) : min;
hours = (hours == 0) ? 1 : hours;
hours = (hours > 12) ? hours-12 : hours;
return hours + ':' + min + ' ' + ampm;
},
getFormattedCity = function( city, state ) {
return city + (state == undefined ? "" : ", " + state);
},
getFormattedVenue = function( venue ) {
return (venue != null) ? venue : 'Venue TBD';
},
addLink = function( content, link ) {
return '<a href="' + link + '">' + content + '</a>';
};
$(function() {$(".mup-widget-3", ctx).width($parameters.width);});
$.getJSON($queries.containers(), function(data) {
if (data.results.length == 0) {
$('.mup-widget-3', ctx).append(
'<div class="mup-widget error">\
<div class="errorMsg">Oops. No results for "' + $parameters.urlname + '"</div>\
</div>');
}
else {
var container = data.results[0];
// Push lat/lon into event api call
mylon = data.meta.geo_ip.lon;
mylat = data.meta.geo_ip.lat;
var total_meetup_count = container.meetup_count + container.past_meetup_count;
$('.mup-widget-3', ctx).append(
'<div class="mup-widget">\
<div class="mup-hd">\
<h3>' + addLink( numberFormat(total_meetup_count) + ' </span><span>' + container.name + ' Meetups', container.meetup_url ) + '</span></h3>\
<h4>' + numberFormat(container.member_count) + ' people</h4>\
</div>\
<div class="mup-bd"><ul class="mup-list"></ul></div>\
</div>');
$.getJSON($queries.events(), function(data) {
if (data.status && data.status.match(/^200/) == null) {
alert(data.status + ": " + data.details);
} else {
if( (resultCount = parseInt(data.meta.total_count)) ) {
var meetupArray = [],
R = 6371, // km
dLat = '',
dLon = '',
a = '',
c = '';
Number.prototype.toRad = function() { // convert degrees to radians
return this * Math.PI / 180;
};
$.each(data.results, function(i, ev) {
if ( i < resultCount ) {
dLat = (ev.lat-mylat).toRad(); // Javascript functions in radians
dLon = (ev.lon-mylon).toRad();
a = Math.sin(dLat/2) * Math.sin(dLat/2) +
Math.cos(mylat.toRad()) * Math.cos(ev.lat.toRad()) *
Math.sin(dLon/2) * Math.sin(dLon/2);
c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a));
ev.dist = R * c; // Distance in km
meetupArray.push(ev);
}
});
meetupArray.sort( function(a, b) {
return a.dist-b.dist;
});
for (var i=0; i < 3; i++ ) {
$('.mup-list', ctx).append(
'<li>\
<div class="mup-when">\
<span class="mup-time">' + getFormattedDate( meetupArray[i].time ) + '</span>\
<span class="mup-city">' + addLink( getFormattedCity( meetupArray[i].city, meetupArray[i].state ), meetupArray[i].meetup_url ) + '</span>\
</div>\
<div class="mup-where">\
<span class="mup-time">' + getFormattedTime( meetupArray[i].time ) + '</span>\
<span class="mup-venue">' + getFormattedVenue( meetupArray[i].venue_name ) + '</span>\
</div>\
<span class="mup-badge"><span class="mup-badge-label">PEOPLE</span><span class="' +
(i == 0 ? 'mup-rsvpcount-1' : 'mup-rsvpcount') + '">' + meetupArray[i].rsvp_count + '</span></span>\
</li>');
}
}
else {
// No meetups have been scheduled.
$('.mup-list', ctx).append('<li style="padding-left: 6px;"><div class="mup-where">No upcoming meetups.</div>' + ((container.event_create == 'anyone') ? '<div class="mup-when">' + addLink('Schedule a Meetup', 'http://www.dev.meetup.com/SteveTest/event_create/') + ' near you</div></li>' : '</li>'));
}
$('.mup-widget-3>.mup-widget', ctx).append('<div class="mup-ft"><div class="mup-logo">' + addLink ( '<img src="http://img1.meetupstatic.com/84869143793177372874/img/birddog/everywhere_widget.png" />','http://www.meetup.com/everywhere/') + '</div><div class="mup-getwdgt">' + addLink( 'ADD THIS TO YOUR SITE', 'http://www.meetup.com/meetup_api/foundry/#'+$parameters._name.toLowerCase().replace(/ /g,"-") ) + '</div>');
}
});
}
});
});
</script>
<style type="text/css" media="screen">
.mup-widget-3 .mup-widget {
background: #1A1A1A;
color: #f2f2f2;
font-family: lucida grande, arial, verdana, san-serif;
font-size: 13px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
.mup-widget-3 .mup-widget .mup-hd {
padding: 6px 6px 0;
}
.mup-widget-3 .mup-widget .mup-hd a,
.mup-widget-3 .mup-widget .mup-hd a:active,
.mup-widget-3 .mup-widget .mup-hd a:visited,
.mup-widget-3 .mup-widget .mup-hd a:hover {
color: #f2f2f2;
text-decoration: none;
}
.mup-widget-3 .mup-widget .mup-bd {
padding: 0 6px;
}
.mup-widget-3 .mup-widget .mup-ft {
-webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-bottomleft: 5px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
}
.mup-widget-3 .mup-widget a,
.mup-widget-3 .mup-widget a:active,
.mup-widget-3 .mup-widget a:visited,
.mup-widget-3 .mup-widget a:hover {
color: #2261A0;
text-decoration: none;
}
.mup-widget-3 .mup-widget h3 {
font-size: 20px;
font-weight: bold;
color: #AAA;
}
.mup-widget-3 .mup-widget h4 {
font-size: 13px;
margin-bottom: 8px;
color: #f2f2f2;
}
.mup-widget-3 .mup-widget .mup-list {
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
padding:0;
}
.mup-widget-3 .mup-widget .mup-list li {
position: relative;
padding: 12px 6px 12px 0;
border-top-color: #1A1A1A;
border-top-style: solid;
border-top-width: 1px;
background: #333;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topright: 5px;
border-top-right-radius: 5px;
overflow: hidden;
}
.mup-widget-3 .mup-widget .mup-list li:first-child {
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.mup-widget-3 .mup-widget .mup-list li:last-child {
-webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-bottomleft: 5px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
}
.mup-widget-3 .mup-widget .mup-when,
.mup-widget-3 .mup-widget .mup-where {
white-space: nowrap;
}
.mup-widget-3 .mup-widget .mup-when {
padding-bottom: 4px;
}
.mup-widget-3 .mup-widget .mup-time {
display: inline-block;
width: 60px;
font-size: 10px;
text-align: right;
}
.mup-widget-3 .mup-widget .mup-city {
padding-left: 8px;
display: inline-block;
}
.mup-widget-3 .mup-widget .mup-venue {
padding-left: 8px;
font-size: 10px;
display: inline-block;
}
.mup-widget-3 .mup-widget .mup-badge{
position: absolute;
right: 0;
top: 0;
font-size: 10px;
height: 14px;
color: #1A1A1A;
}
.mup-widget-3 .mup-widget .mup-badge .mup-badge-label {
font-size: 8px;
}
.mup-widget-3 .mup-widget .mup-rsvpcount {
background: #2261A0;
color: #1A1A1A;
padding: 2px 4px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topright: 5px;
border-top-right-radius: 5px;
}
.mup-widget-3 .mup-widget .mup-rsvpcount-1 {
background: #2261A0;
padding: 2px 4px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topright: 5px;
border-top-right-radius: 5px;
}
.mup-widget-3 .mup-widget .mup-logo {
padding: 6px;
}
.mup-widget-3 .mup-widget .mup-getwdgt {
border-top-color: #1A1A1A;
border-top-style: solid;
border-top-width: 1px;
padding: 3px;
font-size: 8px;
text-align: center;
background: #0A0A0A;
-webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-bottomleft: 5px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
}
.mup-widget-3 .mup-widget .mup-getwdgt a {
color: #f2f2f2;
}
</style>
</head>
<body class="framed-mup-widget">
<div class="mup-widget-3"></div>
</body>
</html>
Jump to Line
Something went wrong with that request. Please try again.