-
Notifications
You must be signed in to change notification settings - Fork 70
/
index.html
210 lines (194 loc) · 10.2 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
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
function json_success(response){
// Update copy
console.log(response);
$("span.date").html(response['last_update']);
var data = response['data'];
// Populate table
var populate = function(data){
var tbl_body = "";
$.each(data, function(i, v) {
var line = '<a class="btn btn-' + v['css_class'] +
'" href="https://pypi.org/project/' +
v['name'] + '" title="' + v['title'] + '">' +
v['name'] + ' ' + v['icon'] + '</a>';
tbl_body += line;
})
return tbl_body;
}
$(".list-upto-120").html(populate(data.slice(0, 120)));
$(".list-upto-240").html(populate(data.slice(120, 240)));
$(".list-upto-360").html(populate(data.slice(240, 360)));
handle_css();
};
function handle_css(){
var ids = [".list-upto-120", ".list-upto-240", ".list-upto-360"]
$.each(ids, function(idx, id) {
var $items = $(id),
$visible = $items.find(":visible"),
$first = $visible.first(),
$last = $visible.last();
$items.find(".btn-last-child").removeClass("btn-last-child");
$items.find(".btn-first-child").removeClass("btn-first-child");
$first.addClass("btn-first-child");
$last.addClass("btn-last-child");
});
};
function show_hide_py3(){
var $this = $(this),
$items = $(".btn-success"),
currentState = $this.data("state") || "Show",
nextState = currentState == "Show" ? "Hide" : "Show",
buttonText = currentState + " Python 3 Ready";
if (currentState === "Show")
$items.hide();
else
$items.show();
$this.data("state", nextState);
$this.text(buttonText);
handle_css();
};
$(document).ready(function() {
$.getJSON('results.json', json_success);
$("#show-hide-py3").click(show_hide_py3);
});
});
</script>
<link href="https://netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css" rel="stylesheet" />
<style>
body{margin-top:15px;}
a.btn, h1{text-align: center;}
a.btn-last-child, canvas, body{margin-bottom:15px;}
a.btn {border-bottom-width: 0; border-radius: 0; width: 100%}
a.btn-first-child{border-top-left-radius: 5px; border-top-right-radius: 5px;}
a.btn-last-child{border-bottom-width: 1px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;}
pre {text-align: left;}
footer{text-align: center;}
.center-block {max-height: 450px}
</style>
<title>Python 3 Readiness - Python 3 support table for most popular Python packages</title>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-sm-12 col-md-12">
<h1>Python 3 Readiness</h1>
<p class="text-center text-info">Python 3 support graph for the 360 most popular Python packages!</p>
<object data="wheel.svg" type="image/svg+xml" class="center-block"></object>
<h2>What is this about?</h2>
<p>This site shows Python 3 support for the 360 most downloaded packages on <a href="https://pypi.org/">PyPI</a>:</p>
<ol>
<li><span class="text-success">Green</span> packages support Python 3 (or have a drop-in replacement package which supports Python 3);</li>
<li><span class="text-muted">White</span> packages don't support Python 3 yet.</li>
</ol>
<h2>Package 'x' is white. What can I do?</h2>
<p>There can be many reasons why a package still does not support Python 3.</p>
<ul>
<li>
<p>
If you are package maintainer, it's time to start porting (if you haven't already).
<strong>Here is an in-depth guide <a href="http://python3porting.com/">Porting to Python 3</a></strong>
and the <a href="https://docs.python.org/3/howto/pyporting.html">official porting HOWTO</a>.
If you are not able to give the time needed, please seek for help from the community
by announcing your need for help on blogs, IRC, mailing lists, etc.
</p>
</li>
<li>
<p>
If you are user of the package, send a friendly note to the package maintainer.
Or fork it, and send a pull request to help move the project towards Python 3 support.
</p>
</li>
</ul>
<h2>How do you identify Python 3 support?</h2>
<p>
This site utilizes a little tool, <a href="https://github.com/brettcannon/caniusepython3">caniusepython3</a>, created by Brett Cannon.
Throw your requirements.txt file at it and it will tell you which packages support Python 3, and list out which don't.
If you want to know how the site works, see <a href="https://github.com/chhantyal/py3readiness">README</a>.
</p>
</div>
</div>
<div class="row">
<div class="col-sm-4 col-md-4">
<a id="show-hide-py3" href="javascript:void(0)" class="btn btn-default btn-first-child btn-last-child">Hide Python 3 Ready</a>
</div>
</div>
<div class="row">
<div class="col-sm-4 col-md-4">
<div class="panel panel-info">
<div class="panel-heading">
<h3 class="panel-title text-center"><span class="glyphicon glyphicon-list"></span> Top 120</h3>
</div>
</div>
<div class="list-upto-120">py3readiness.org requires javascript to be enabled to display the list of packages.</div>
</div>
<div class="col-sm-4 col-md-4">
<div class="panel panel-info">
<div class="panel-heading">
<h3 class="panel-title text-center"><span class="glyphicon glyphicon-list"></span> Top 120 - 240</h3>
</div>
</div>
<div class="list-upto-240"></div>
</div>
<div class="col-sm-4 col-md-4">
<div class="panel panel-info">
<div class="panel-heading">
<h3 class="panel-title text-center"><span class="glyphicon glyphicon-list"></span> Top 240 - 360</h3>
</div>
</div>
<div class="list-upto-360"></div>
</div>
</div>
<h2>Thanks</h2>
<p>
This is derivative work from <a href="http://pythonwheels.com/">Python Wheels</a>,
a site that tracks progress in new Python package distribution standard called <a href="https://pypi.org/project/wheel/">Wheels</a>.
All the credits goes to <a href="http://meshy.co.uk/">meshy</a>.
</p>
<!-- fork me -->
<a href="https://github.com/chhantyal/py3readiness">
<img style="position: absolute; top: 0; right: 0; border: 0;"
src="https://github-camo.global.ssl.fastly.net/365986a132ccd6a44c23a9169022c0b5c890c387/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f7265645f6161303030302e706e67"
alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_red_aa0000.png"
/>
</a>
<footer>
<!-- AddThis Button BEGIN -->
<div class="row">
<div class="col-md-6 col-md-offset-4">
<div class="addthis_toolbox addthis_default_style">
<a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
<a class="addthis_button_tweet"></a>
<a class="addthis_button_google_plusone" g:plusone:size="medium"></a>
<a class="addthis_button_linkedin_counter"></a>
</div>
</div>
</div>
<script type="text/javascript">var addthis_config = {"data_track_addressbar":true};</script>
<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-50e3db385da4dd15"></script>
<!-- AddThis Button END -->
<p>
Maintained by <a href="http://twitter.com/chhantyal">chhantyal</a>;
updates on <a href="https://twitter.com/py3readiness">Twitter</a>;
source code on <a href="https://github.com/chhantyal/py3readiness">GitHub</a>.
</p>
<p>Last updated on <span class="date"></span></p>
</footer>
</div>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-48631938-1', 'py3readiness.org');
ga('send', 'pageview');
</script>
</body>
</html>