-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
148 lines (139 loc) · 7.84 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
<!DOCTYPE html>
<!-- Hi! Please take a look around my code. I'm still learning all this, so if
there's something you think I can optimise, please let me know. Thanks :)
-->
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="keywords" content="YouFeed, YouTube, feedly, RSS, playlist, Wordpress, Blogspot, Tumblr" />
<meta name="description" content="Subscribe to the content that matters to you. Add YouTube users or specific playlists through feedly. Find the feeds of blog posts under certain categories." />
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>YouFeed.uk</title>
<script src="js/youfeed_runnow.js"></script>
<link rel="shortcut icon" href="./favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="css/youfeed.css">
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<script src="js/processing.min.js"></script> <!-- v1.4.16 of processing.js -->
<script type="text/javascript">
function getProcessingSketchId () { return 'youfeedjs'; }
</script>
</head>
<body>
<div class="container">
<div class="header">
<ul class="nav nav-pills pull-right">
<li><a id="helpButton" href="#" data-toggle="modal" data-target="#helpModal">Help</a></li>
<li><a href="https://feedly.com/i/subscription/feed/http://youfeed.tumblr.com/rss">News</a></li>
<li><a class="contactLink">Fan mail</a></li>
</ul>
<h3 class="text-muted">
<img src="images/logo-m.png" height="36" id="yf-logo">
YouFeed<small>.uk <small> RSS is not dead yet!</small></small>
</h3>
</div>
<noscript>
<div id="javascriptAlert" class="alert alert-danger"><strong>JavaScript is essential for YouFeed to run.</strong> Please enable it in your browser settings.</div>
</noscript>
<div id="alert"></div> <!-- add class="alert alert-danger" -->
<p class="lead text-center">Subscribe to the content that matters to you.</p>
<div id="bookmarkletCallout" class="visible-md visible-lg row callout">
<div class="col-md-9">
<h4>Have you tried the YouFeed bookmarklet?</h4>
<p>Drag this to the bookmarks bar for one-click feedly conversion.</p>
</div>
<div class="col-md-3">
<p><a id="bookmarklet" class="bookmarklet" href="#">Open in feedly</a></p>
</div>
</div>
<div class="row">
<div class="col-sm-10 col-sm-offset-1">
<h3>Paste in the page URL</h3>
</div>
</div>
<div class="row">
<div class="col-sm-10 col-sm-offset-1">
<div class="input-group input-group-lg has-error">
<input id="yfinput" type="text" class="form-control">
<span class="input-group-btn">
<button id="yfbutton" type="button" class="btn btn-danger">Open in feedly</button>
</span>
</div>
<div id="animationContainer" class="hidden-xs">
<canvas id="youfeedjs" data-processing-sources="js/youfeed_animation.txt">
</canvas>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-8 col-sm-offset-1">
<p>YouFeed helps you find URLs to RSS feeds</p>
<ul>
<li><strong>YouTube</strong> channels and playlists</li>
<li><strong>Blogspot</strong> authors and posts with a specific label</li>
<li><strong>Wordpress</strong> authors, categories and tags</li>
<li><strong>Tumblr</strong> authors and tags</li>
</ul>
<p>For more info, click on help at the top of this page.</p>
</div>
</div>
<div class="footer">
<p>This website does not use cookies or server-side scripts. <a href="#" data-toggle="modal" data-target="#privacyModal">Find out more</a>.</p>
<p>If a URL you submit doesn't work as expected, or if you just want to say hi, please <a class="contactLink">get in touch</a>.</p>
<p>YouFeed is an <a href="https://github.com/danielthepope/youfeed">open source project</a> by <a href="https://twitter.com/danielthepope">@danielthepope</a> that makes it easier to subscibe to feeds using <a href="https://feedly.com">feedly</a>.</p>
</div>
<div class="modal fade" id="privacyModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="myModalLabel">Privacy</h4>
</div>
<div class="modal-body">
<p>YouFeed does not collect any data about you or your usage at all.</p>
<p>You're welcome.</p>
<p>All data processing takes place solely on your computer, and no cookies of any kind are stored or eaten.</p>
<p>However, this does mean that if anything goes wrong, I don't receive any automatic notification. Therefore, if you attempt to open a link that you think should work but doesn't, please <a class="contactLink">get in touch</a> making sure you include the broken link.</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div class="modal fade" id="helpModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="myModalLabel">Help</h4>
</div>
<div class="modal-body">
<h3>Using the bookmarklet</h3>
<p>I put an animated demo of how to use the bookmarklet on the <a href="http://youfeed.tumblr.com/post/97896970690/show-the-bookmark-bar-go-to-youfeed-and-drag-in" target="_blank">YouFeed Tumblr page</a>.</p>
<h3>Or, the copy and paste method</h3>
<p>If you're watching a video on YouTube, and you decide to subscribe to that user on feedly, first click onto the user's channel page.</p>
<p class="page-header"><a href="http://www.youtube.com/user/ScottBradleeLovesYa"><span id="img1" alt="click youtube username" title="Scott Bradlee's channel is just amazing." src="images/01-ytvid.png"></span></a></p>
<p>Then copy the URL of the channel's page</p>
<p class="page-header"><span id="img2" alt="Copy the channel's URL" src="images/02-channel.png"></span></p>
<p>Paste it into YouFeed then click the red button</p>
<p class="page-header"><span id="img3" alt="Paste into YouFeed" src="images/03-paste.png"></span></p>
<p>The channel will open up in Feedly, which you can then subscribe to by clicking Follow.</p>
<p><span id="img4" alt="Channel opens in Feedly" src="images/04-feedly.png"></span></p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="js/youfeed.js"></script>
</body>
</html>