X-Git-Url: https://git.mxchange.org/?a=blobdiff_plain;f=plugins%2FLinkPreview%2Flinkpreview.js;h=132c4c8d77f272617ed37ff235a220c24494a209;hb=974d0c48f6234a99b0d28f6c54033434cace877c;hp=0c0eb734eca120d59ffc766ff125472821fd7c84;hpb=407663fb402f0384cced2b63a2f901d19ab71d19;p=quix0rs-gnu-social.git

diff --git a/plugins/LinkPreview/linkpreview.js b/plugins/LinkPreview/linkpreview.js
index 0c0eb734ec..132c4c8d77 100644
--- a/plugins/LinkPreview/linkpreview.js
+++ b/plugins/LinkPreview/linkpreview.js
@@ -3,6 +3,9 @@
  */
 
 (function() {
+    /**
+     * Quickie wrapper around ooembed JSON lookup
+     */
     var oEmbed = {
         api: 'http://oohembed.com/oohembed',
         width: 100,
@@ -57,138 +60,211 @@
                 maxheight: oEmbed.height,
                 token: $('#token').val()
             };
-            $.get(oEmbed.api, params, function(data, xhr) {
-                callback(data);
-            }, 'json');
+            $.ajax({
+                url: oEmbed.api,
+                data: params,
+                dataType: 'json',
+                success: function(data, xhr) {
+                    callback(data);
+                },
+                error: function(xhr, textStatus, errorThrown) {
+                    callback(null);
+                }
+            });
         }
     };
 
-    var LinkPreview = {
-        links: [],
+    SN.Init.LinkPreview = function(params) {
+        if (params.api) oEmbed.api = params.api;
+        if (params.width) oEmbed.width = params.width;
+        if (params.height) oEmbed.height = params.height;
+    }
 
-        /**
-         * Find URL links from the source text that may be interesting.
-         *
-         * @param {String} text
-         * @return {Array} list of URLs
-         */
-        findLinks: function (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;
-        },
+    // Piggyback on the counter update...
+    var origCounter = SN.U.Counter;
+    SN.U.Counter = function(form) {
+        var preview = form.data('LinkPreview');
+        if (preview) {
+            preview.previewLinks(form.find('.notice_data-text:first').val());
+        }
+        return origCounter(form);
+    }
 
-        /**
-         * Start looking up info for a link preview...
-         * May start async data loads.
-         *
-         * @param {String} id
-         * @param {String} url
-         */
-        prepLinkPreview: function(id, url)
-        {
-            oEmbed.lookup(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;
+    // Customize notice form init...
+    var origSetup = SN.Init.NoticeFormSetup;
+    SN.Init.NoticeFormSetup = function(form) {
+        origSetup(form);
+
+        form
+            .bind('reset', function() {
+                LinkPreview.clear();
+            });
+
+        var LinkPreview = {
+            links: [],
+            state: [],
+            refresh: [],
+
+            /**
+             * Find URL links from the source text that may be interesting.
+             *
+             * @param {String} text
+             * @return {Array} list of URLs
+             */
+            findLinks: function (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;
+            },
+
+            ensureArea: function() {
+                if (form.find('.link-preview').length < 1) {
+                    form.append('<div class="notice-status link-preview thumbnails"></div>');
+                }
+            },
+
+            /**
+             * Start looking up info for a link preview...
+             * May start async data loads.
+             *
+             * @param {number} col: column number to insert preview into
+             */
+            prepLinkPreview: function(col)
+            {
+                var id = 'link-preview-' + col;
+                var url = LinkPreview.links[col];
+                LinkPreview.refresh[col] = false;
+                LinkPreview.markLoading(col);
+
+                oEmbed.lookup(url, function(data) {
+                    var thumb = null;
+                    var width = 100;
+                    if (data && 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;
+                    } else if (data && 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 = $('<span class="inline-attachment"><a><img/></a></span>');
-                    link.find('a')
-                            .attr('href', url)
-                            .attr('target', '_blank')
-                            .last()
-                        .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
-         */
-        previewLinks: function(text)
-        {
-            var old = LinkPreview.links;
-            var links = LinkPreview.findLinks(text);
-
-            // Check for existing common elements...
-            for (var i = 0; i < old.length && i < links.length; i++) {
-                if (links[i] != old[i]) {
-                    // Change an existing entry!
-                    var id = 'link-preview-' + i;
-                    $('#' + id).html('');
-                    LinkPreview.prepLinkPreview(id, links[i]);
+                    if (thumb) {
+                        LinkPreview.ensureArea();
+                        var link = $('<span class="inline-attachment"><a><img/></a></span>');
+                        link.find('a')
+                                .attr('href', url)
+                                .attr('target', '_blank')
+                                .last()
+                            .find('img')
+                                .attr('src', thumb)
+                                .attr('width', width)
+                                .attr('title', data.title || data.url || url);
+                        form.find('.' + id)
+                            .empty()
+                            .append(link);
+                    } else {
+                        // No thumbnail available or error retriving it.
+                        LinkPreview.clearLink(col);
+                    }
+
+                    if (LinkPreview.refresh[col]) {
+                        // Darn user has typed more characters.
+                        // Go fetch another link!
+                        LinkPreview.prepLinkPreview(col);
+                    } else {
+                        LinkPreview.markDone(col);
+                    }
+                });
+            },
+
+            /**
+             * Update the live preview section with links found in the given text.
+             * May start async data loads.
+             *
+             * @param {String} text: free-form input text
+             */
+            previewLinks: function(text)
+            {
+                var i;
+                var old = LinkPreview.links;
+                var links = LinkPreview.findLinks(text);
+                LinkPreview.links = links;
+
+                // Check for existing common elements...
+                for (i = 0; i < old.length && i < links.length; i++) {
+                    if (links[i] != old[i]) {
+                        if (LinkPreview.state[i] == "loading") {
+                            // Slate this column for a refresh when this one's done.
+                            LinkPreview.refresh[i] = true;
+                        } else {
+                            // Change an existing entry!
+                            LinkPreview.prepLinkPreview(i);
+                        }
+                    }
                 }
-            }
-            if (links.length > old.length) {
-                // Adding new entries, whee!
-                for (var i = old.length; i < links.length; i++) {
-                    var id = 'link-preview-' + i;
-                    $('#link-preview').append('<span id="' + id + '"></span>');
-                    LinkPreview.prepLinkPreview(id, links[i]);
+                if (links.length > old.length) {
+                    // Adding new entries, whee!
+                    for (i = old.length; i < links.length; i++) {
+                        LinkPreview.addPreviewArea(i);
+                        LinkPreview.prepLinkPreview(i);
+                    }
+                } else if (old.length > links.length) {
+                    // Remove preview entries for links that have been removed.
+                    for (i = links.length; i < old.length; i++) {
+                        LinkPreview.clearLink(i);
+                    }
                 }
-            } else if (old.length > links.length) {
-                // Remove preview entries for links that have been removed.
-                for (var i = links.length; i < old.length; i++) {
-                    var id = 'link-preview-' + i;
-                    $('#' + id).remove();
+                if (links.length == 0) {
+                    LinkPreview.clear();
                 }
-            }
+            },
 
-            LinkPreview.links = links;
-        },
+            addPreviewArea: function(col) {
+                LinkPreview.ensureArea();
+                var id = 'link-preview-' + col;
+                if (form.find('.' + id).length < 1) {
+                    form.find('.link-preview').append('<span class="' + id + '"></span>');
+                }
+            },
 
-        /**
-         * Clear out any link preview data.
-         */
-        clear: function() {
-            LinkPreview.links = [];
-            $('#link-preview').empty();
-        }
-    };
+            clearLink: function(col) {
+                var id = 'link-preview-' + col;
+                form.find('.' + id).html('');
+            },
 
-    SN.Init.LinkPreview = function(params) {
-        if (params.api) oEmbed.api = params.api;
-        if (params.width) oEmbed.width = params.width;
-        if (params.height) oEmbed.height = params.height;
+            markLoading: function(col) {
+                LinkPreview.state[col] = "loading";
+                var id = 'link-preview-' + col;
+                form.find('.' + id).attr('style', 'opacity: 0.5');
+            },
 
-        $('#form_notice')
-            .append('<div id="link-preview" class="thumbnails"></div>')
-            .bind('reset', function() {
-                LinkPreview.clear();
-            });
+            markDone: function(col) {
+                LinkPreview.state[col] = "done";
+                var id = 'link-preview-' + col;
+                form.find('.' + id).removeAttr('style');
+            },
 
-        // Piggyback on the counter update...
-        var origCounter = SN.U.Counter;
-        SN.U.Counter = function(form) {
-            LinkPreview.previewLinks($('#notice_data-text').val());
-            return origCounter(form);
-        }
+            /**
+             * Clear out any link preview data.
+             */
+            clear: function() {
+                LinkPreview.links = [];
+                form.find('.link-preview').remove();
+            }
+        };
+        form.data('LinkPreview', LinkPreview);
     }
 })();