Skip to content

Commit d8e0b60

Browse files
author
Neil Campbell
committed
Merging upsteam master into fork master
2 parents 77a84b8 + 448aa4d commit d8e0b60

File tree

5 files changed

+228
-40
lines changed

5 files changed

+228
-40
lines changed

README.md

Lines changed: 64 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,9 +8,13 @@ __Examples:__
88

99
- [Hemeon.com](http://hemeon.com/) by [Marc Hemeon](https://twitter.com/hemeon)
1010
- [Manik Rathee is a mobile photographer](http://www.manikrathee.com/is/a/mobile-photographer/) by [Manik Rathee](http://twitter.com/manikrathee)
11+
- [VinThomas.com](http://vinthomas.com/) by [Vin Thomas](https://twitter.com/vinthomas)
1112
- [The Kozik Cocoon](http://www.kozikcocoon.com/) by [Danny Palmer](http://twitter.com/dannyprose)
1213

13-
_Used Instafeed.js on a project recently? Tweet them to [@stevenschobert](http://twitter.com/stevenschobert)._
14+
15+
__Buy me a coffee:__
16+
17+
If you enjoy using Instafeed.js and want to say thanks, you can leave me a small tip using [Gittip](https://www.gittip.com/stevenschobert).
1418

1519
## Installation
1620
Setting up Instafeed is pretty straight-forward. Just download the script and include it in your HTML:
@@ -66,6 +70,8 @@ The only thing you'll need to get going is a valid __client id__ from Instagram'
6670
- `random` - Random order.
6771
- `links` (bool) - Wrap the images with a link to the photo on Instagram.
6872
- `limit` (number) - Maximum number of Images to add. __Max of 60__.
73+
- `useHttp` (bool) - By default, image urls are protocol-relative. Set to `true`
74+
to use the standard `http://`.
6975
- `resolution` (string) - Size of the images to get. Available options are:
7076
- `thumbnail` (default) - 150x150
7177
- `low_resolution` - 306x306
@@ -78,6 +84,24 @@ The only thing you'll need to get going is a valid __client id__ from Instagram'
7884
- `success` (function) - A callback function called when Instagram returns valid data. (argument -> json object)
7985
- `error` (function) - A callback function called when there is an error fetching images. (argument -> string message)
8086
- `mock` (bool) - Set to true fetch data without inserting images into DOM. Use with __success__ callback.
87+
- `filter` (function) - A function used to exclude images from your results. The function will be
88+
given the image data as an argument, and expects the function to return a boolean. See the example
89+
below for more information.
90+
91+
__Example Filter (get username + tagged):__
92+
93+
```js
94+
var feed = new Instafeed({
95+
get: 'user',
96+
userId: USER_ID,
97+
filter: function(image) {
98+
return image.tags.indexOf('TAG_NAME') >= 0;
99+
}
100+
});
101+
feed.run();
102+
```
103+
104+
To see a full list of properties that `image` has, see [issue #21](https://github.com/stevenschobert/instafeed.js/issues/21).
81105

82106
## Templating
83107

@@ -108,6 +132,37 @@ Notice the `{{link}}` and `{{image}}`? The templating option provides several ta
108132
- `{{location}}` - Name of the location associated with the image. Defaults to empty string if there isn't one.
109133
- `{{model}}` - Full JSON object of the image. If you want to get a property of the image that isn't listed above you access it using dot-notation. (ex: `{{model.filter}}` would get the filter used.)
110134

135+
## Pagination
136+
137+
As of __v1.3__, Instafeed.js has a `.next()` method you can call to load more images from Instagram.
138+
Under the hood, this uses the _pagination_ data from the API. Additionall, there is a helper
139+
`.hasNext()` method that you can use to check if pagination data is available.
140+
141+
Together these options can be used to create a "Load More" button:
142+
143+
```js
144+
// grab out load more button
145+
var loadButton = document.getElementById('load-more'),
146+
147+
feed = new Instafeed({
148+
// every time we load more, run this function
149+
after: function() {
150+
// disable button if no more results to load
151+
if (!this.hasNext()) {
152+
loadButton.setAttribute('disabled', 'disabled');
153+
}
154+
},
155+
});
156+
157+
// bind the load more button
158+
loadButton.addEventListener('click', function() {
159+
feed.next();
160+
});
161+
162+
// run our feed!
163+
feed.run();
164+
```
165+
111166
## Security Considerations
112167

113168
With Instafeed, it is possible to get images from a specific user id:
@@ -145,6 +200,14 @@ This will install all the necessary test tools for testing. There is also a Make
145200

146201
## Change Log
147202

203+
__1.3.0__
204+
205+
- Image URLs are now protocol-relative by default. Use the new `useHttp` option to disable.
206+
- Added the ability to filter out images using the `filter` option.
207+
- Added pagination support using `.next()` and `.hasNext()` methods.
208+
- Removed the default `limit` of 15 images. The option is still supported, but by default no limit
209+
is sent to the API.
210+
148211
__1.2.1__
149212

150213
- Fixed IE8 error "Object doesn't support this action".

instafeed.js

Lines changed: 65 additions & 17 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)