forked from ryanj/Eventbrite.jquery.js
-
Notifications
You must be signed in to change notification settings - Fork 14
/
example.html
98 lines (87 loc) · 3.6 KB
/
example.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="shortcut icon" href="http://evbdn.eventbrite.com/s3-production/35362ce/django/images/icons/favicon.ico" />
<link rel='stylesheet' href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.6.1.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js"></script>
<script type="text/javascript" src="Eventbrite.jquery.js"></script>
<title>Eventbrite.jquery.js Test Examples</title>
</head>
<body>
<h1>Eventbrite.jquery.js Test Examples</h1>
<p><a id="menu" href="#">menu</a></p>
<p id='target'> </p>
<a href="http://developer.eventbrite.com/news/branding/"><img src="http://evbdn.eventbrite.com/s3-s3/static/images/django/logos/eb_powered.png"/></a>
<div style="display:none;" id="dialog-form" title="API Credentials">
<p class="validateTips">Please enter your Eventbrite API authentication keys:</p>
<form>
<label for="api_key"><a href="http://www.eventbrite.com/api/key/">api_key</a> (REQUIRED)</label>
<input type="text" name="api_key" id="api_key" class="text ui-widget-content ui-corner-all" />
<br/>
<label for="user_key"><a href="http://www.eventbrite.com/userkeyapi">user_key</a> (OPTIONAL)</label>
<input type="text" name="user_key" id="user_key" value="" class="text ui-widget-content ui-corner-all" />
</form>
</div>
</body>
<script type="text/javascript">
$('document').ready(function(){
//Eventbrite users can request an API key on the following page:
// http://www.eventbrite.com/api/key/ (required)
//Each user can find their user_key on this page:
// http://www.eventbrite.com/userkeyapi (only needed to update/access private data)
////
//// WARNING: A user_key provides priveledged access to all of a user's private data. Keep it secret. Keep it safe.
//// Eventbrite does not recommend storing user_keys in client side source code. localStorage might be safer
$('#menu').bind('click', function(){ $( "#dialog-form" ).dialog("open"); });
$( "#dialog-form" ).dialog({
'autoOpen': true,
'height': 350,
'width': 400,
'modal': true,
'buttons': {
'Authenticate': function() {
// Eventbrite Client interaction example
Eventbrite({'app_key':$('#api_key').val(), 'user_key':$('#user_key').val()}, function(eb_client){
// parameters to pass to the API
var params = {'city': "San Francisco" };
// make a client request, provide a callback that will handle the response data
eb_client.event_search( params, function(response){
console.log(response);
// Use jQuery to display the response data to the user
$('#target').html( eb_client.utils.eventList( response, eb_client.utils.eventListRow ));
});
});
// Close the dialog after we collect the required authentication tokens
$( this ).dialog( "close" );
},
'Cancel': function() { $( this ).dialog( "close" ); }
}
});
});
</script>
<style type="text/css">
.eb_event_list_item{
padding-top: 20px;
padding-bottom: 20px;
}
.eb_event_list_title{
display:block;
padding-left: 20px;
width: 400px;
overflow: hidden;
font-size: larger;
}
.eb_event_list_date{
position: absolute;
left: 30px;
}
.eb_event_list_time{
position: absolute;
left: 155px;
}
.eb_event_list_location{
position: absolute;
left: 230px;
}
</style>