forked from parasj/imgur
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
159 lines (134 loc) · 6.05 KB
/
index.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
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
<!DOCTYPE html><!--HTML5 doctype-->
<html>
<head>
<title>imgur viewer</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<script src="jqm/jq.js"></script>
<script>
$.globalVarContainer = { imgur_json_stream: "" };
$.getJSON("http://serve.parasjain.com/imgur/getcache.php?jsoncallback=?", function(data){
$.globalVarContainer.imgur_json_stream = data;
for (var key in data) {
//alert(0);
//alert(key + ': ' + data[key]['thumbnail']);
$('#ulcontain').append('<li id="' + key + '"><a href="#" onclick="javascript: create_page(\'' + key + '\');"><img height="115px" src="' + data[key]['thumbnail'] +'" /><h3>' + data[key]['title'] +'</h3></a></li>');
//$("#" + key + "").hide();
$('#ulcontain').listview('refresh');
//$("#" + key + "").show();
}
});
$(document).ready(function() {
//check if hash exists and that it is not for the home screen
if (window.location.hash != '' && window.location.hash != '#page_0') {
//set whatever content you want to put into the new page
var content_string = 'Some ' + window.location.hash + ' text...<br><br><a href="#page_0">go to home screen</a>';
//append the new page onto the end of the body
$('#page_body').append('<div data-role="page" id="' + window.location.hash.replace('#','') + '"><div data-role="content">' + content_string + '</div></div>');
//add a link on the home screen to navaigate to the new page (just so nav isn't broken if user goes from new page to home screen)
$('#page_0 div[data-role="content"]').append('<br><br><a href="#' + window.location.hash.replace('#','') + '">go to ' + window.location.hash.replace('#','') + ' page</a>');
}
// Build list
});
</script>
<link rel="stylesheet" href="jqm/jqm.css" />
<script src="jqm/jqm.js"></script>
<script>
/* $(document).bind("mobileinit", function(){
$.mobile.touchOverflowEnabled = true;
}); */
function create_page(page_id) {
//set whatever content you want to put into the new page
var string = '<div data-iscroll="scroller"><center><h2>' + $.globalVarContainer.imgur_json_stream[page_id]['title'] + '</h2><img src="' + $.globalVarContainer.imgur_json_stream[page_id]['orig_image'] +'" style="width:95%;margin-left: auto; margin-right: auto;"></center></div>';
//append the new page onto the end of the body
$('#page_body').append('<div data-role="page" id="' + page_id + '" data-add-back-btn="true" data-iscroll="enable"><div data-role="header"><h1>imgur Viewer</h1></div><div data-role="content">' + string + '</div></div>');
//initialize the new page
$.mobile.initializePage();
//navigate to the new page
$.mobile.changePage("#" + page_id, "pop", false, true);
//add a link on the home screen to navaigate to the new page (just so nav isn't broken if user goes from new page to home screen)
$('#page_0 div[data-role="content"]').append('<br><br><a href="#' + page_id + '">go to ' + page_id + ' page</a>');
//refresh the home screen so new link is given proper css
$('#page_0 div[data-role="content"]').page();
}
</script>
<style type="text/css">
/* Prevent copy paste for all elements except text fields */
* { -webkit-user-select:none; -webkit-tap-highlight-color:rgba(255, 255, 255, 0); }
input, textarea { -webkit-user-select:text; }
.scrollable {
overflow:scroll;
}
</style>
<script type="text/javascript" charset="utf-8" src="http://localhost:58888/_appMobi/appmobi.js"></script>
<script type="text/javascript" charset="utf-8" src="http://localhost:58888/_appMobi/xhr.js"></script>
<script type="text/javascript">
/* This function runs once the page is loaded, but appMobi is not yet active */
var init = function(){
AppMobi.device.setRotateOrientation("portrait");
AppMobi.device.setAutoRotate(false);
};
window.addEventListener("load",init,false);
/* This code prevents users from dragging the page */
/* var preventDefaultScroll = function(event) {
event.preventDefault();
window.scroll(0,0);
return false;
}; */
document.addEventListener('touchmove', preventDefaultScroll, false);
/* This code is used to run as soon as appMobi activates */
var onDeviceReady=function(){
//Size the display to 768px by 1024px
//AppMobi.display.useViewport(768,1024);
//hide splash screen
AppMobi.device.hideSplashScreen();
};
document.addEventListener("appMobi.device.ready",onDeviceReady,false);
</script>
</head>
<body id="page_body">
<div data-role="page" id="viewer" data-iscroll="enable">
<div data-role="header">
<h1>imgur Viewer</h1>
</div><!-- /header -->
<div data-role="content">
<div data-iscroll="scroller">
<ul data-role="listview" id="ulcontain">
</ul>
</div>
</div><!-- /content -->
<!--div data-role="footer">
<h4>Page Footer</h4>
</div>--<!-- /footer -->
</div><!-- /page -->
<!--div id='fb-root'></div-->
<!--script src='http://connect.facebook.net/en_US/all.js'></script>
<script>
FB.init({appId: "300497353326009", status: true, cookie: true});
function postToFeed() {
// calling the API ...
var obj = {
method: 'feed',
link: 'http://parasjain.com/tummytapper',
picture: 'http://www.parasjain.com/tummytapper/tumtum.gif',
name: 'Tummy Tapper - Pet Tum Tum\'s Tummy!',
caption: 'Pet Tum Tum\'s Tummy!',
description: 'Help Tum Tum go all over the world! Pet Tum Tum\'s tummy to help him get his tummy rubbed across the world'
};
function callback(response) {
document.getElementById('msg').innerHTML = "Post ID: " + response['post_id'];
}
FB.ui(obj, callback);
}
</script>
<script>
$("#tumtum").click(function () {
postToFeed();
$(this).hide('fast');
return false;
});
</script-->
</body>
</html>