davidbauer / instacurate Goto Github PK

I want to add three follow buttons, for me, @dergraf and @backflip in the supportbox. However, the button doesn't display the username, although I copied the exact code from here: https://twitter.com/about/resources/buttons#follow

Any ideas what's wrong here? (currently, only one button is implemented)

should be handled differently, as twitter rate is per hour and user ("try again later"), embed.ly is per month and key ("tell david to open his purse").

using the search api

the whole thing above the link teaser grid could need some css love, including the newly added supportbox on top right position.

• It fires an error when the site is loaded, before a username has been typed in.
• It fires an error when a username is confirmed via enter rather than click on the button (url changes to ...?username=username instead of ...#username)

current limit is at 50'000 urls per month but we're about to hit that before the end of jan. suggestions and "read right now" lead to a lot of urls being called multiple times.

You can't watch videos right there because they are cut off.

Mobile design has some issues.

• fully responsive doesn't seem like the ideal solution
• input field gets too small compared to button
• single column too thin for mobile devices

currently, it's instacurate.com/#%23nameofthehashtag

the tricky thing about this is that instacurate.com/##nameofthehashtag cannot be shared over Twitter since it splits the url and turns the latter part into a hashtag.

Wouldn't it be much more readable if the stories were easier to distinguish?

http://twitter.github.com/bootstrap/javascript.html#typeahead

tbd: what data should the function check input against?

search for any username, then open supportbox

result: url changed to /twitter-times/#
expected result: url doesn't change (remains /twitter-times/#username)

not sure what's happening here. it's neither chronological not reverse-chronological.

Tweets in tooltips should look like tweets. We use the formatting provided by Twitter (https://dev.twitter.com/docs/embedded-tweets), but somehow, it isn't applied correctly.

Could be that blockquote styles from Twitter Bootstrap that we use interfere here.

• should be visible as you load the page, not only after giving an input yourself
• shouldn't be real-realtime, but display the lastest n entries.

embed.ly variable type will provide the info needed for this.

use fields author_name and author_url from embedly API

Currently, only Instapaper is supported.

At least Pocket and Readability should be added. But not as a button cluster, since most users only use one of those services. Users should be able to define their read-later service and this info be saved in the user profile. According to what has been saved in the profile, the respective button is displayed.

http://getpocket.com/developer/docs/getstarted/adding
http://www.readability.com/developers/tools

requested by:
https://twitter.com/boichot/status/290831656833658880
https://twitter.com/anildash/status/302069586721902592

What is that supposed to mean (printed in the console when executing the script (not always, but in most cases).

Uncaught TypeError: Cannot read property 'length' of null jquery.min.js:2

In the screenshot, you see bit.ly and econ.st shortlinks. The links work, but embed.ly doesn't fetch the element data correctly.

Doesn't work correctly right now, all values are returned as undefined (from line 117 in script.js).

replace current text "see tweet" by date. created_at needs to be trimmed so that only date in format dd/mm is displayed, see http://stackoverflow.com/questions/1056728/formatting-a-date-in-javascript

now that we have a second input option (sign in with twitter), the header becomes too big on mobile. if you use the search input field, results are loaded below the visible part of the screen.

Header needs to be rethought for mobile. Related to #17.

two options here:
a) When links are extracted from tweets, store fav and retweet count to allow for sorting according to popularity.
b) use a third-party API (tbd) to check for the links popularity

a) will propably be simpler, b) definitely more concise (overall popularity rather than popularity of the one tweet that shared the link)

In order to add more functionality without cluttering the interface (lists, user settings, saved searches,...), I think it's best to implement a sliding navigation to the left

After data has been loaded, we keep checking in the background if new links are available and display them in a similar way that Twitter says "x new tweets" in its timeline.

The process would be:

• Once a request has been executed
• Check every x seconds if there are new links available
• If so, display a message to the user: "n new links" at the top of the list and "(n)" in the browser tab
• When user clicks the message, new teasers are added

Since you have prefetched e.g. 100 Tweets through the Twitter API but only display the first 10 links found, you still have plenty of data to extract the links from and fire up request against the embed.ly API. However, after several page scrolls you'll reach the end of the 100 Tweets and you'll have to fetch older tweets. This works by extracting the tweet-id of the oldest tweet and pass that as the max_id parameter to your next Twitter API request (the oldest Tweet will be included in the result set).

to reproduce, enter any hashtag search, eg. http://instacurate.com/#%23ddj. scroll down to load more links.

actual result: "Warning! This user hasn't tweeted anything yet."
expected result: more links are loaded

a) input field becomes too small (relative to button)
b) width is larger than screen size

Something still doesn't seem quite right. Link extraction fails.

The function seems to break at an earlier point than before since console.log("The link-url is: " + link + " and the tweet text is " + text); is not printed out.

I'm wondering: Shouldn't we use the expanded_url value from the url entity (see https://dev.twitter.com/docs/tweet-entities)?

the search API only returns 100 tweets per call. for some hashtags, that only returns a few links.

Wrapping your script into a self-invoking anonymous function prevents variables from "leaking" into the global scope (see http://benalman.com/news/2010/11/immediately-invoked-function-expression/ etc.):

;(function(window, document, $, undefined) {
    "use strict"; // another best practice

    // your code
    …
})(window, document, jQuery);

Currently, if description.length > 140, it is cropped to 140 characters. However, this delivers some ugly results when a word is cut off. How to prevent that?

Right now, we're using four columns each with classes column span3.

I've experimented a bit with different column sizes, like 4/4/4 or 3/4/5 or 4/3/5. This has the advantage that the whole design looks more dynamic and can solve the problem that some rich media (tweets, video) elements can be displayed in full (see issue #55).

Of course, this makes only sense if we can assign elements to columns based on their width (videos to larger columns, links with small images to the thinnest column).

What do you think? (both from a design perspective and from feasibility)

So that users can display the latest links they've shared on their own website.

Delivered images too small?

Should only list successful searches.