Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Made the widget very pretty

  • Loading branch information...
commit 09e711aaa36a58edf1ee68919788f6c5eac53b6e 1 parent 8ad9f00
@mxcl authored
View
BIN  Default.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN  Icon.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
8 Info.plist
@@ -15,15 +15,15 @@
<key>CFBundleVersion</key>
<string>1.0</string>
<key>CloseBoxInsetX</key>
- <integer>22</integer>
+ <integer>11</integer>
<key>CloseBoxInsetY</key>
- <integer>17</integer>
+ <integer>18</integer>
<key>Height</key>
- <integer>232</integer>
+ <integer>314</integer>
<key>MainHTML</key>
<string>index.html</string>
<key>Width</key>
- <integer>232</integer>
+ <integer>266</integer>
<key>AllowNetworkAccess</key>
<true/>
</dict>
View
10 index.html
@@ -6,11 +6,13 @@
<script src="mxcl.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
- <div id="image">
- <div id="text">
- <a id="title"></a><br>
- <span id="owner"></span>
+ <div id="polaroid">
+ <div id="clipwrapper">
+ <img id="image" src="http://plant-disease.ippc.orst.edu/plant_images/ryegrass_stripe_rust.jpg">
+ <div id="date"></div>
</div>
+ <div id="text"><a id="title">Flickr Friends</a><span id="owner"> Owner</span></div>
+
</div>
</body>
</html>
View
74 mxcl.css
@@ -1,50 +1,62 @@
body {
font-family: "Lucida Grande", sans-serif;
font-size: 10pt;
+ margin: 0;
}
a {
- color: #fff;
+ color: #000;
text-decoration: none;
}
-a:hover {
+a:link:hover {
text-decoration: underline;
}
+#polaroid {
+ -webkit-transform: rotate(-0.9deg);
+ -webkit-box-shadow: 0px 5px 20px rgba(0,0,0,0.68);
+ width: 216px;
+ background-color: white;
+ color: black;
+ padding: 12px;
+ margin: 13px;
+ padding-bottom: 9px;
+}
+
#image {
- -webkit-border-radius: 10px;
- -webkit-box-shadow: 0px 4px 7px rgba(0,0,0,0.68);
- -webkit-mask-image: none;
- -webkit-background-clip: padding;
- -webkit-background-origin: padding;
- height: 200px;
- width: 200px;
- margin: 13px; /*TODO be a little more clipped*/
- background-color: rgba(0,0,0,0.4);
- background-repeat: no-repeat;
- background-position: center;
- color: white;
- position: relative;
- border: 4px solid black;
-
-}
-
-#text{
- position: absolute;
- bottom: 0;
- left: 0;
- padding: 10px;
- width: 180px;
- background:-webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0.33)), to(rgba(0,0,0,0.50))); ;
- text-shadow: 0px 2px 7px #000;
+ height: 214px;
+ width: 214px;
+ margin:0;
+ margin-bottom: 5px;
+ border: 1px solid #aaa;
}
-#owner {
- color: #cccccc;
- font-size: 8pt;
+#text {
+ text-align: center;
}
#title {
- font-weight: bold;
+ font-size: 12pt;
+ font-family: "Handwriting - Dakota";
}
+
+#owner {
+ display: none;
+ font-family: "Courier New";
+}
+
+#clipwrapper
+{
+ position: relative;
+}
+
+#date {
+ -webkit-transform: rotate(90deg);
+ position: absolute;
+ bottom: 70px;
+ right: -72px;
+ font-size: 8pt;
+ font-family: "Courier";
+ color: #aaa;
+}
View
10 mxcl.js
@@ -19,10 +19,11 @@ function start_timers()
function got_photo(p)
{
- for (var i = 0; i < photos.length; i++)
+ for (var i = 0; i < photos.length; i++) {
// not sure how unique this is
if (p.id == photos[i].id)
return true;
+ }
return false;
}
@@ -59,10 +60,11 @@ function set_new_photo()
ii = 0;
var p = photos[ii++];
- $('image').style.backgroundImage = 'url('+image_url(p)+')';
+ $('image').src = image_url(p);
$('title').innerHTML = p.title;
$('title').href = "javascript:window.widget.openURL('http://www.flickr.com/photos/"+p.owner+'/'+p.id+"');return false;";
- $('owner').innerHTML = p.username;
+ $('owner').innerHTML = ' '+p.username.replace(' ', '&nbsp;');
+ $('date').innerText = p.datetaken;
// preload next image
img = new Image();
@@ -73,7 +75,7 @@ function fetch()
{
last_fetch = new Date().getTime();
- var url = 'http://api.flickr.com/services/rest/?method=flickr.photos.getContactsPublicPhotos&format=json&api_key=2c4f0eb3f21b15c9cbae940f22a98d57&user_id=73643601@N00&just_friends=1';
+ var url = 'http://api.flickr.com/services/rest/?method=flickr.photos.getContactsPublicPhotos&format=json&api_key=2c4f0eb3f21b15c9cbae940f22a98d57&user_id=73643601@N00&just_friends=1&extras=date_taken';
// if this is the first time, get 50 photos
if (photos.length == 0)
Please sign in to comment.
Something went wrong with that request. Please try again.