add url shortening service (our own, disabled, bit.ly, enabled)

2010-09-14 14:18:46 -07:00 · 2010-09-14 14:18:46 -07:00 · b8a1da7ca1
--- a/examples/shorten/index.html
+++ b/examples/shorten/index.html
@ -0,0 +1,132 @@
+<!-- ***** BEGIN LICENSE BLOCK *****
+- Version: MPL 1.1
+-
+- The contents of this file are subject to the Mozilla Public License Version
+- 1.1 (the "License"); you may not use this file except in compliance with
+- the License. You may obtain a copy of the License at
+- http://www.mozilla.org/MPL/
+-
+- Software distributed under the License is distributed on an "AS IS" basis,
+- WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
+- for the specific language governing rights and limitations under the
+- License.
+-
+- The Original Code is Raindrop.
+-
+- The Initial Developer of the Original Code is
+- Mozilla Messaging, Inc..
+- Portions created by the Initial Developer are Copyright (C) 2009
+- the Initial Developer. All Rights Reserved.
+-
+- Contributor(s):
+- -->
+
+<!-- A hacky sample to attempt a send and handle auth failure automatically
+     then attempt a resend
+-->
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Shorten a link</title>
+    <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
+
+    <script src="../../scripts/requireplugins-jquery-1.4.2.js" charset="utf-8"></script>
+    <script>require(["index.js"]);</script>
+    <style>
+         .hidden {
+             display: none;
+         }
+
+         .invisible {
+             visibility: hidden;
+         }
+         
+#messageForm label {
+            width: 32px;
+            height: 32px;
+            display: block;
+            float: left;
+            filter:alpha(opacity=30);
+            -moz-opacity:0.3;
+            -khtml-opacity: 0.3;
+            opacity: 0.3;
+}
+#messageForm label.r_on {
+            filter:alpha(opacity=100);
+            -moz-opacity:1.0;
+            -khtml-opacity: 1.0;
+            opacity: 1.0;
+}
+#messageForm label input { position: absolute; left: -9999px; }         
+    </style>
+
+<script>
+    function setupLabel() {
+        if ($('.label_check input').length) {
+            $('.label_check').each(function(){ 
+                $(this).removeClass('c_on');
+            });
+            $('.label_check input:checked').each(function(){ 
+                $(this).parent('label').addClass('c_on');
+            });                
+        };
+        if ($('.label_radio input').length) {
+            $('.label_radio').each(function(){ 
+                $(this).removeClass('r_on');
+            });
+            $('.label_radio input:checked').each(function(){ 
+                $(this).parent('label').addClass('r_on');
+            });
+        };
+    };
+    $(document).ready(function(){
+        $('body').addClass('has-js');
+        $('.label_check, .label_radio').click(function(){
+            setupLabel();
+        });
+        setupLabel(); 
+    });
+</script>
+
+</head>
+<body class="settings">
+
+    <div class="row">
+        <div class="c4 logo">
+        </div>
+    </div>
+
+    <!-- shorten form -->
+    <div class="shorten">
+      <p>Enter a link</p>
+        <form name="messageForm" id="messageForm" action="#">
+            <div class="row">
+                <div class="c1">
+                    <div style="clear:both;"/>
+                    URL: <input name="url">
+
+                    <input type="hidden" name="end_point_success" value="/examples/shorten/#success">
+                    <input type="hidden" name="end_point_failure" value="/examples/shorten/#failure">
+                    <input type="hidden" name="end_point_auth_failure" value="/examples/shorten/#auth_failure">
+                    <button>shorten</button>
+                        
+                </div>
+                <div class="c1">
+                    <div class="usernameError error invisible">Please enter your Twitter name</div>
+               </div> 
+            </div>
+        </form>
+    </div>
+
+    <!-- send success section -->
+    <div class="section success hidden">
+        <div class="row">
+            <div class="c1">
+                <h4 class="success">Success!</h4>
+                <p id="short"></p>
+            </div>
+        </div>
+    </div>
+
+</body>
+</html>
--- a/examples/shorten/index.js
+++ b/examples/shorten/index.js
@ -0,0 +1,73 @@
+/* ***** BEGIN LICENSE BLOCK *****
+ * Version: MPL 1.1
+ *
+ * The contents of this file are subject to the Mozilla Public License Version
+ * 1.1 (the "License"); you may not use this file except in compliance with
+ * the License. You may obtain a copy of the License at
+ * http://www.mozilla.org/MPL/
+ *
+ * Software distributed under the License is distributed on an "AS IS" basis,
+ * WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
+ * for the specific language governing rights and limitations under the
+ * License.
+ *
+ * The Original Code is Raindrop.
+ *
+ * The Initial Developer of the Original Code is
+ * Mozilla Messaging, Inc..
+ * Portions created by the Initial Developer are Copyright (C) 2009
+ * the Initial Developer. All Rights Reserved.
+ *
+ * Contributor(s):
+ * */
+
+/*jslint plusplus: false */
+/*global require: false, location: true, window: false, alert: false */
+"use strict";
+
+require.def("shorten",
+        ["require", "jquery", "blade/fn", "rdapi", "placeholder", "blade/url"],
+function (require,   $,        fn,         rdapi,   placeholder,   url) {
+    function sendMessage(url) {
+        rdapi('links/shorten', {
+            type: 'POST',
+            data: {
+                url: url,
+            },
+            success: function (json) {
+                rdapi('links/sign', {
+                    type: 'POST',
+                    data: {
+                        'shorturl': json['result']['short_url'],
+                        'from': "jn.rlly@gmail.com",
+                        'to': "david.ascher@gmail.com",
+                    },
+                    success: function(json) {
+                    },
+                    error: function(json) {
+                    }
+                });
+                $(".success").removeClass("hidden")
+                var short_url = json.result['short_url'];
+                $("#short").html("<span>short URL is: <a href='" + short_url + "'>" + short_url + "</a>");
+            },
+            error: function (xhr, textStatus, err) {
+                $("#resultMsg").removeClass("hidden")
+                $("#resultReason").text("XHR Error: "+err)
+            }
+        }); 
+    }
+
+    $(function () {
+
+        $("#messageForm")
+            .submit(function (evt) {
+                //First clear old errors
+                $(".error").addClass("invisible");
+                var form = evt.target;
+                var url = form.url.value;
+                sendMessage(url);
+                return false;
+            });
+    });
+});
--- a/share/history.html
+++ b/share/history.html
@ -19,9 +19,11 @@

    <li id="history" class="template status">
        {. medium getMedium(domain)}
+        {. who getWho(username, domain)}
        <div class="icon {medium}"></div>
        <div class="message status">
-            <span class="username">@{username}</span>: <div class="body">{message}</div>
+            <span class="username">{who}</span>:
+            <div class="body">{message}</div>
            {. date friendlyDate(published)}
            <div class="topic meta">
                <div class="date earliest">{date}</div>
--- a/share/history.js
+++ b/share/history.js
@ -25,9 +25,10 @@
 /*global require: false, location: true, window: false, alert: false */
 "use strict";

-var linkify = function(text) {
+var linkify = function(text, doUrls) {
  // linkify full urls
-  text = text.replace(/http(s)?:\S+/g, '<a class="link" href="$&" target="_blank">$&</a>');
+  if (doUrls)
+      text = text.replace(/http(s)?:\S+/g, '<a class="link" href="$&" target="_blank">$&</a>');
  // linkify twitter usernames
  text = text.replace(/\@(\w+)/g, '<a class="username" type="twitter" title="twitter.com/$1" href="http://twitter.com/$1" target="_blank">@$1</a>');
  // linkify twitter hash tags
@ -44,17 +45,25 @@ function (require,   $,        fn,         rdapi,   jig) {
        if (domain == 'google.com') return 'google';
        }});

+    jig.addFn({getWho: function(username, userid, domain) {
+        if (domain == 'twitter.com') return '@' + username;
+        if (domain == 'facebook.com') return '<a class="username" type="facebook" href="http://www.facebook.com/profile.php?id=' + userid + '">'+username+"</a>";
+        if (domain == 'google.com') return 'google';
+        return "foo";
+        }});
+
    rdapi('history/get', {
        success: function (json) {
            if (json.error) {
                $('#notifications').append(jig('#error', json.error));
            } else {
-                $('#statuses').append(jig('#history', json));
+                var stuff = jig('#history', json);
+                $('#statuses').append(stuff);
                $(".body").each(function() {
-                  $(this).html(linkify($(this).text()));
+                  $(this).html(linkify($(this).text(), true));
                });
                $(".username").each(function() {
-                  $(this).html(linkify($(this).text()));
+                  $(this).html(linkify($(this).text(), false));
                });
           }
        }
--- a/share/index.js
+++ b/share/index.js
@ -312,17 +312,27 @@ function (require,   $,        fn,         rdapi,   url,         placeholder,

        //Set up the URL in all the message containers
        if (options.url) {
-            $('textarea.message').each(function (i, node) {
-                var dom = $(node);
-                //If the message containder prefers canonical URLs then use them.
-                if (dom.hasClass('canonical')) {
-                    dom.val(options.canonicalUrl || options.url);
-                } else if (dom.hasClass('nourl')) {
-                    return true;
-                } else {
-                    dom.val(options.url);
+            alert("got options.url")
+            rdapi('links/shorten', {
+                type: 'POST',
+                data: {
+                    'url': options.canonicalUrl || options.url,
+               },
+                success: function(json) {
+                    options.shortUrl = json.result.short_url;
+                    $('textarea.message').each(function (i, node) {
+                        var dom = $(node);
+                        //If the message containder doesn't want URLs then respect that.
+                        if (dom.hasClass('nourl')) {
+                            return true;
+                        } else {
+                            dom.val(options.shortUrl);
+                        }
+                        return undefined;
+                    });
+                },
+                error: function(json) {
                }
-                return undefined;
            });
            $(".meta .url").text(options.url);
            $(".meta .curl").text(options.canonicalUrl);
@ -426,6 +436,7 @@ function (require,   $,        fn,         rdapi,   url,         placeholder,
                        sendData[node.name] = node.value;
                    }
                });
+                sendData['shorturl'] = options.shortUrl;

                sendMessage();
                return false;