add 'shorten URL' link to .post-area-new textareas and fix misc

css/style.css

@@ -46,14 +46,17 @@ ol, ul, li
 {
     list-style: none;
 }
-a
+
-{
+a {
+    color: #E34F42;
     text-decoration: none;
 }
-a:hover
+
-{
+a:hover {
     text-decoration: underline;
+    cursor: pointer;
 }
+
 blockquote, q
 {
     quotes: none;
@@ -751,6 +754,17 @@ textarea.splited-post {
     height: 35px;
     transition: all .6s linear;
 }
+
+.post-area-new .shorten-uri {
+    font-size: 11px;
+    float: left;
+    margin: 2px 4px;
+}
+
+.postboard .post-area-new .shorten-uri, .modal-content .post-area-new .shorten-uri {
+    margin-left: 56px;
+}
+
 .post-area-remaining
 {
     font-size: 13px;

home.html

@@ -313,6 +313,10 @@
         </div>
     </div>
 
+    <div id="template-shorten-uri">
+        <a class="shorten-uri">shorten URL</a>
+    </div>
+
     <li id="post-template" class="module post" data-time="">
         <div class="post-data" data-userpost="" data-content_to_rt="" data-content_to_sigrt=""
              data-screen-name="" data-id="" data-text="" data-text-mentions="">

js/interface_common.js

@@ -7,6 +7,7 @@
 
 var twister = {
     URIs: {},  // shortened URIs are cached here after fetching
+    focus: {},  // focused elements are counted here
     html: {
         detached: $('<div>'),  // here elements go to detach themself
         blanka: $('<a target="_blank">')  // to open stuff in new tab, see routeOnClick()
@@ -802,7 +803,9 @@ function openConversationModal(peerAlias, resource) {
     });
 }
 
-function openRequestShortURIForm() {
+function openRequestShortURIForm(event) {
+    if (event) muteEvent(event);
+
     if (!defaultScreenName) {
         alertPopup({
             //txtTitle: polyglot.t(''), add some title (not 'error', please) or just KISS
@@ -820,20 +823,28 @@ function openRequestShortURIForm() {
     }
 
     var uri = prompt('enter a link, watch yourself carefully');  // FIXME
-    newShortURI(uri,
+
-        function (req, uriLong, uriShort) {
+    if (event && event.data && typeof event.data.cbFunc === 'function')
+        newShortURI(uri, event.data.cbFunc, event.data.cbReq);
+    else
+        newShortURI(uri, showURIPair);
+}
+
+function showURIPair(uriLong, uriShort) {  // FIXME req
     if (uriShort)
         alertPopup({
             txtTitle: 'URI shortener',
             txtMessage: uriLong + ' — `' + uriShort + '`'
         });
     else
+        showURIShortenerErrorRPC(uriShort);
+}
+
+function showURIShortenerErrorRPC(ret) {
     alertPopup({
         txtTitle: 'URI shortener',
-                    txtMessage: 'something went wrong. RPC error message:\n' + (uriShort && uriShort.message) ? uriShort.message : uriShort
+        txtMessage: 'something went wrong. RPC error message:\n' + (ret && ret.message ? ret.message : ret)
     });
-        }
-    );
 }
 
 function fillElemWithTxt(elem, txt, htmlFormatMsgOpt) {
@@ -2283,12 +2294,31 @@ function initInterfaceCommon() {
 
     $('.uri-shortener').on('click', openRequestShortURIForm);  // FIXME implement Uri Shortener Center with links library etc
 
-    if ($.fn.textcomplete) {
     $('.post-area-new textarea')
-            .on('focus', {req: getMentionsForAutoComplete}, setTextcompleteOnEventTarget)
+        .on('focus',
-            .on('focusout', unsetTextcompleteOnEventTarget)
+            function (event) {
-        ;
+                twister.focus.textareaPostCur = $(event.target);
+
+                // FIXME that's a hack, need to implement complete toolbar with buttons of text formatting
+                var xtrs = twister.focus.textareaPostCur.siblings('.post-area-extras');
+                if (!xtrs.find('.shorten-uri').length)
+                    xtrs.prepend(twister.tmpl.shortenUri.clone(true));
+
+                if ($.fn.textcomplete) {  // because some pages don't have that. // network.html
+                    event.data = {req: getMentionsForAutoComplete};
+                    setTextcompleteOnEventTarget(event);
                 }
+            }
+        )
+        .on('focusout',
+            function (event) {
+                twister.focus.textareaPostCur = undefined;
+                twister.focus.textareaPostPrev = $(event.target);
+                if ($.fn.textcomplete)  // because some pages don't have that. // network.html
+                    unsetTextcompleteOnEventTarget(event);
+            }
+        )
+    ;
 }
 
 function extractTemplate(selector) {
@@ -2336,6 +2366,25 @@ function importSecretKeypress(event) {  // FIXME rename
         $.MAL.disableButton(elemEnter);
 }
 
+function pasteToTextarea(ta, p) {
+    if (!ta || typeof ta.val !== 'function') return;
+
+    var s = ta.val();
+    var c = ta.caret();
+
+    if (s.length) {
+        if (c < 1)
+            ta.val(p + (s[c].match(/\s/) ? '' : ' ') + s);
+        else if (c < s.length)
+            ta.val(s.slice(0, c) + (s[c - 1].match(/\s/) ? '' : ' ') + p + (s[c].match(/\s/) ? '' : ' ') + s.slice(c));
+        else
+            ta.val(s + (s[c - 1].match(/\s/) ? '' : ' ') + p + ' ');
+    } else
+        ta.val(p + ' ');
+
+    ta.focus().caret(c + p.length + ((ta.val().length - s.length - p.length) > 1 ? 2 : 1));
+}
+
 function setTextcompleteOnEventTarget(event) {
     // cursor has not set yet and we need to wait 100ms to skip global click event
     setTimeout(setTextcompleteOnElement, 100, event.target,
@@ -2385,6 +2434,29 @@ $(document).ready(function () {
             routeOnClick(event);
         })
     ;
+    twister.tmpl.shortenUri = extractTemplate('#template-shorten-uri')
+        .on('click',
+            {cbFunc:
+                function (uriLong, uriShort, textArea) {
+                    if (uriShort)
+                        pasteToTextarea(textArea, uriShort);
+                    else
+                        showURIShortenerErrorRPC(uriShort);
+                }
+            },
+            function (event) {
+                muteEvent(event);
+
+                var formPost = $(event.target).closest('.post-area-new');
+                var textArea = formPost.find(twister.focus.textareaPostCur);
+                if (!textArea.length) textArea = formPost.find(twister.focus.textareaPostPrev);
+                if (!textArea.length) textArea = formPost.find('textarea:last');
+
+                event.data.cbReq = textArea;
+                openRequestShortURIForm(event);
+            }
+        )
+    ;
     twister.tmpl.postRtReference = extractTemplate('#template-post-rt-reference')
         .on('mouseup', {feeder: '.post-rt-reference'}, openConversationClick)
         .on('click', muteEvent)  // to prevent post expanding or collapsing

js/twister_actions.js

@@ -332,7 +332,7 @@ function newShortURI(uri, cbFunc, cbReq) {
     for (var i in twister.URIs)
         if (twister.URIs[i] === uri) {
             if (typeof cbFunc === 'function')
-                cbFunc(cbReq, uri, i);
+                cbFunc(uri, i, cbReq);
             return;
         }
 
@@ -347,12 +347,12 @@ function newShortURI(uri, cbFunc, cbReq) {
                 console.warn('RPC "newshorturl" error: empty response');
 
             if (typeof req.cbFunc === 'function')
-                req.cbFunc(req.cbReq, req.uri, ret);
+                req.cbFunc(req.uri, ret, req.cbReq);
         }, {uri: uri, cbFunc: cbFunc, cbReq: cbReq},
         function (req, ret) {
             console.warn('RPC "newshorturl" error: ' + (ret && ret.message ? ret.message : ret));
             if (typeof req.cbFunc === 'function')
-                req.cbFunc(req.cbReq, req.uri, ret);
+                req.cbFunc(req.uri, ret, req.cbReq);
         }, {uri: uri, cbFunc: cbFunc, cbReq: cbReq}
     );
 }

network.html

@@ -18,6 +18,7 @@
     <script src="js/twister_formatpost.js"></script>
     <script src="js/twister_following.js"></script>
     <script src="js/twister_newmsgs.js"></script>
+    <script src="js/twister_actions.js"></script>
     <script src="js/polyglot.min.js"></script>
     <script src="js/interface_localization.js"></script>
     <script src="js/twister_network.js"></script>
@@ -250,6 +251,10 @@
         </div>
     </div>
 
+    <div id="template-shorten-uri">
+        <a class="shorten-uri">shorten URL</a>
+    </div>
+
     <!-- template for user links in message (open profile modal) -->
     <a id="msg-user-link-template" class="open-profile-modal"></a>
     <!-- template for user links in message (open profile modal) -->

theme_calm/css/style.css

@@ -927,6 +927,17 @@ textarea.splited-post {
     height: 35px;
     transition: all .6s linear;
 }
+
+.post-area-new .shorten-uri {
+    font-size: 11px;
+    float: left;
+    margin: 2px 4px;
+}
+
+.postboard .post-area-new .shorten-uri, .modal-content .post-area-new .shorten-uri {
+    margin-left: 56px;
+}
+
 .post-area-remaining
 {
     font-size: 13px;

theme_nin/css/style.css

@@ -2077,6 +2077,12 @@ textarea.splited-post {
   transition: all 0.6s linear;
 }
 
+.post-area-new .shorten-uri {
+    font-size: 11px;
+    float: left;
+    margin: 2px 4px;
+}
+
 /* line 399, ../sass/style.sass */
 .post-area-remaining {
   padding-right: 3px;

tmobile.html

@@ -756,6 +756,10 @@
         </div>
     </div>
 
+    <div id="template-shorten-uri">
+        <a class="shorten-uri">shorten URL</a>
+    </div>
+
     <li id="post-template-post" class="module post" data-time="">
         <img class="avatar" src="img/grayed_avatar_placeholder_24.png" alt="user-photo"/>
         <div class="post-data" data-userpost="" data-content_to_rt="" data-content_to_sigrt=""