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
|
/**
* (c) 2010 StatusNet, Inc.
*/
$(function() {
/**
* Find URL links from the source text that may be interesting.
*
* @param {String} text
* @return {Array} list of URLs
*/
function findLinks(text)
{
// @fixme match this to core code
var re = /(?:^| )(https?:\/\/.+?\/.+?)(?= |$)/mg;
var links = [];
var matches;
while ((matches = re.exec(text)) !== null) {
links.push(matches[1]);
}
return links;
}
/**
* Do an oEmbed lookup for the given URL.
*
* @fixme proxy through ourselves if possible?
* @fixme use the global thumbnail size settings
*
* @param {String} url
* @param {function} callback
*/
function oEmbedLookup(url, callback)
{
var api = 'http://oohembed.com/oohembed';
var params = {
url: url,
format: 'json',
maxwidth: 100,
maxheight: 75,
callback: '?'
};
$.get(api, params, function(data, xhr) {
callback(data);
}, 'jsonp');
}
/**
* Start looking up info for a link preview...
* May start async data loads.
*
* @param {String} id
* @param {String} url
*/
function prepLinkPreview(id, url)
{
oEmbedLookup(url, function(data) {
var thumb = null;
var width = 100;
if (typeof data.thumbnail_url == "string") {
thumb = data.thumbnail_url;
if (typeof data.thumbnail_width !== "undefined") {
if (data.thumbnail_width < width) {
width = data.thumbnail_width;
}
}
} else if (data.type == 'photo' && typeof data.url == "string") {
thumb = data.url;
if (typeof data.width !== "undefined") {
if (data.width < width) {
width = data.width;
}
}
}
if (thumb) {
var link = $('<a><img/></a>');
link.attr('href', url)
.attr('target', '_blank')
.find('img')
.attr('src', thumb)
.attr('width', width)
.attr('title', data.title || data.url || url);
$('#' + id).append(link);
}
});
}
/**
* Update the live preview section with links found in the given text.
* May start async data loads.
*
* @param {String} text: free-form input text
*/
function previewLinks(text)
{
var links = findLinks(text);
$('#link-preview').html('');
for (var i = 0; i < links.length; i++) {
var id = 'link-preview-' + i;
$('#link-preview').append('<span id="' + id + '"></span>');
prepLinkPreview(id, links[i]);
}
}
$('#form_notice').append('<div id="link-preview"></div>');
$('#notice_data-text').change(function() {
var text = $(this).val();
previewLinks(text);
});
});
|
