dispy theme hide editor if without focus

diff --git a/view/theme/dispy/jot-header.tpl b/view/theme/dispy/jot-header.tpl
index 5d4babb9d4396cea3ac72840cdb8fded048db363..5401f92ddb982410817a07a89289b5811128b24e 100644 (file)
--- a/view/theme/dispy/jot-header.tpl
+++ b/view/theme/dispy/jot-header.tpl
@@ -2,78 +2,103 @@
 <script language="javascript" type="text/javascript" src="$baseurl/library/tinymce/jscripts/tiny_mce/tiny_mce_src.js"></script>
 <script language="javascript" type="text/javascript">
 
-var editor;
+var editor=false;
 var textlen = 0;
 
-tinyMCE.init({
-       theme : "advanced",
-       mode : "specific_textareas",
-       editor_selector: /(profile-jot-text|prvmail-text)/,
-       plugins : "bbcode,paste,fullscreen,autoresize",
-       theme_advanced_buttons1 : "bold,italic,underline,undo,redo,link,unlink,image,forecolor,formatselect,code,fullscreen",
-       theme_advanced_buttons2 : "",
-       theme_advanced_buttons3 : "",
-       theme_advanced_toolbar_location : "top",
-       theme_advanced_toolbar_align : "center",
-       theme_advanced_blockformats : "blockquote,code",
-       //theme_advanced_resizing : true,
-       //theme_advanced_statusbar_location : "bottom",
-       paste_text_sticky : true,
-       entity_encoding : "raw",
-       add_unload_trigger : false,
-       remove_linebreaks : false,
-       force_p_newlines : false,
-       force_br_newlines : true,
-       forced_root_block : '',
-       convert_urls: false,
-       content_css: "$baseurl/view/custom_tinymce.css",
-       theme_advanced_path : false,
-       setup : function(ed) {
-            //Character count
-               ed.onKeyUp.add(function(ed, e) {
-                       var txt = tinyMCE.activeEditor.getContent();
-                       textlen = txt.length;
-                       if(textlen != 0 && $('#jot-perms-icon').is('.unlock')) {
-                               $('#profile-jot-desc').html(ispublic);
-                       }
-                       else {
-                               $('#profile-jot-desc').html('&nbsp;');
-                       }
-
-                       if(textlen <= 140) {
-                               $('#character-counter').removeClass('red');
-                               $('#character-counter').removeClass('orange');
-                               $('#character-counter').addClass('grey');
-                       }
-                       if((textlen > 140) && (textlen <= 420)) {
-                               $('#character-counter').removeClass('grey');
-                               $('#character-counter').removeClass('red');
-                               $('#character-counter').addClass('orange');
-                       }
-                       if(textlen > 420) {
-                               $('#character-counter').removeClass('grey');
-                               $('#character-counter').removeClass('orange');
-                               $('#character-counter').addClass('red');
-                       }
-                       $('#character-counter').text(textlen);
-       });
-
-               ed.onInit.add(function(ed) {
-                       ed.pasteAsPlainText = true;
-               });
-
-       }
-});
-
+function initEditor(cb) {
+    if (editor==false) {
+        $("#profile-jot-text-loading").show();
+        tinyMCE.init({
+                theme : "advanced",
+                mode : "specific_textareas",
+                editor_selector: /(profile-jot-text|prvmail-text)/,
+                plugins : "bbcode,paste,fullscreen,autoresize",
+                theme_advanced_buttons1 : "bold,italic,underline,undo,redo,link,unlink,image,forecolor,formatselect,code,fullscreen",
+                theme_advanced_buttons2 : "",
+                theme_advanced_buttons3 : "",
+                theme_advanced_toolbar_location : "top",
+                theme_advanced_toolbar_align : "center",
+                theme_advanced_blockformats : "blockquote,code",
+                //theme_advanced_resizing : true,
+                //theme_advanced_statusbar_location : "bottom",
+                paste_text_sticky : true,
+                entity_encoding : "raw",
+                add_unload_trigger : false,
+                remove_linebreaks : false,
+                force_p_newlines : false,
+                force_br_newlines : true,
+                forced_root_block : '',
+                convert_urls: false,
+                content_css: "$baseurl/view/custom_tinymce.css",
+                theme_advanced_path : false,
+                setup : function(ed) {
+                     //Character count
+                        ed.onKeyUp.add(function(ed, e) {
+                                var txt = tinyMCE.activeEditor.getContent();
+                                textlen = txt.length;
+                                if(textlen != 0 && $('#jot-perms-icon').is('.unlock')) {
+                                        $('#profile-jot-desc').html(ispublic);
+                                }
+                                else {
+                                        $('#profile-jot-desc').html('&nbsp;');
+                                }
+
+                                if(textlen <= 140) {
+                                        $('#character-counter').removeClass('red');
+                                        $('#character-counter').removeClass('orange');
+                                        $('#character-counter').addClass('grey');
+                                }
+                                if((textlen > 140) && (textlen <= 420)) {
+                                        $('#character-counter').removeClass('grey');
+                                        $('#character-counter').removeClass('red');
+                                        $('#character-counter').addClass('orange');
+                                }
+                                if(textlen > 420) {
+                                        $('#character-counter').removeClass('grey');
+                                        $('#character-counter').removeClass('orange');
+                                        $('#character-counter').addClass('red');
+                                }
+                                $('#character-counter').text(textlen);
+                        });
+                        ed.onInit.add(function(ed) {
+                                ed.pasteAsPlainText = true;
+                                $("#profile-jot-text-loading").hide();
+                                $("#profile-jot-submit-wrapper").show();
+                                $("#profile-upload-wrapper").show();
+                                $("#profile-attach-wrapper").show();
+                                $("#profile-link-wrapper").show();
+                                $("#profile-youtube-wrapper").show();
+                                $("#profile-video-wrapper").show();
+                                $("#profile-audio-wrapper").show();
+                                $("#profile-location-wrapper").show();
+                                $("#profile-nolocation-wrapper").show();
+                                $("#profile-title-wrapper").show();
+                                $("#profile-jot-plugin-wrapper").show();
+                                $("#character-counter").show();
+                                if (typeof cb!="undefined") cb();
+                        });
+                }
+        });
+        editor = true;
+        // setup acl popup
+        $("a#jot-perms-icon").fancybox({
+            'transitionIn' : 'none',
+            'transitionOut' : 'none'
+        }); 
+    } else {
+        if (typeof cb!="undefined") cb();
+    }
+} // initEditor
 </script>
 <script type="text/javascript" src="include/ajaxupload.js" ></script>
 <script>
     var ispublic = '$ispublic';
        $(document).ready(function() {
-                $("#profile-jot-acl-wrapper").hide();
-                $("a#jot-perms-icon").fancybox({
-                    'transitionIn' : 'none',
-                    'transitionOut' : 'none'
+                /* enable tinymce on focus */
+                $("#profile-jot-text").focus(function(){
+                    if (editor) return;
+                    $(this).val("");
+                    initEditor();
                 }); 
                var uploader = new window.AjaxUpload(
                        'wall-image-upload',
@@ -184,9 +209,11 @@ tinyMCE.init({
        function jotShare(id) {
                $('#like-rotator-' + id).show();
                $.get('share/' + id, function(data) {
-                       tinyMCE.execCommand('mceInsertRawHTML',false,data);
-                       $('#like-rotator-' + id).hide();
-                       $(window).scrollTop(0);
+                    initEditor(function(){
+                        tinyMCE.execCommand('mceInsertRawHTML',false,data);
+                        $('#like-rotator-' + id).hide();
+                        $(window).scrollTop(0);
+                    })
                });
        }
 

diff --git a/view/theme/dispy/jot.tpl b/view/theme/dispy/jot.tpl
index b357bd38bb81b6a0d83c1a0b4ec1d05055a08afb..d5e81a925ddd2ff5dbae72d4f9bdc8683143835d 100644 (file)
--- a/view/theme/dispy/jot.tpl
+++ b/view/theme/dispy/jot.tpl
@@ -2,7 +2,7 @@
 <div id="profile-jot-wrapper" > 
        <div id="profile-jot-banner-wrapper">
                <div id="profile-jot-desc" >&nbsp;</div>
-               <div id="character-counter" class="grey">0</div>
+               <div id="character-counter" class="grey" style="display: none;">0</div>
                <div id="profile-rotator-wrapper" style="display: $visitor;" >
                        <img id="profile-rotator" src="images/rotator.gif" alt="$wait" title="$wait" style="display:none;"  />
                </div>          
@@ -17,47 +17,48 @@
                <input type="hidden" name="title" id="jot-title" value="" />
                <input type="hidden" name="post_id" value="$post_id" />
 
-               <textarea rows="5" style="width:100%" class="profile-jot-text" id="profile-jot-text" name="body" >$content</textarea>
+                <img id="profile-jot-text-loading" src="images/rotator.gif" alt="$wait" title="$wait" style="display: none;" />
+                <textarea rows="5" cols="64" class="profile-jot-text" id="profile-jot-text" name="body" >{{ if $content }}$content{{ else }}$share{{ endif }}</textarea>
+                {{ if $content }}<script>initEditor();</script>{{ endif }}
 
 
-<div id="profile-jot-submit-wrapper" >
+<div id="profile-jot-submit-wrapper" style="display:none">
        <div id="profile-jot-perms" class="profile-jot-perms" style="display: $visitor;" >
             <a href="#profile-jot-acl-wrapper" id="jot-perms-icon" class="icon $lockstate"  title="$permset" ></a>$bang</div>
        <input type="submit" id="profile-jot-submit" name="submit" value="$share" />
 </div>
 
-       <div id="profile-upload-wrapper" class="jot-tool" style="display: $visitor;" >
+       <div id="profile-upload-wrapper" class="jot-tool" style="display: none;" >
                <div id="wall-image-upload-div" ><a onclick="return false;" id="wall-image-upload" class="icon border camera" title="$upload"></a></div>
        </div>
-       <div id="profile-attach-wrapper" class="jot-tool" style="display: $visitor;" >
+       <div id="profile-attach-wrapper" class="jot-tool" style="display: none;" >
                <div id="wall-file-upload-div" ><a href="#" onclick="return false;" id="wall-file-upload" class="icon border attach" title="$attach"></a></div>
        </div>  
-       <div id="profile-link-wrapper" class="jot-tool" style="display: $visitor;" ondragenter="linkdropper(event);" ondragover="linkdropper(event);" ondrop="linkdrop(event);" >
+       <div id="profile-link-wrapper" class="jot-tool" style="display: none;" ondragenter="linkdropper(event);" ondragover="linkdropper(event);" ondrop="linkdrop(event);" >
                <a id="profile-link" class="icon border  link" title="$weblink" ondragenter="return linkdropper(event);" ondragover="return linkdropper(event);" ondrop="linkdrop(event);" onclick="jotGetLink(); return false;"></a>
        </div> 
-       <div id="profile-youtube-wrapper" class="jot-tool" style="display: $visitor;" >
+       <div id="profile-youtube-wrapper" class="jot-tool" style="display: none;" >
                <a id="profile-youtube" class="icon border  youtube" title="$youtube" onclick="jotGetVideo(); return false;"></a>
        </div> 
-       <div id="profile-video-wrapper" class="jot-tool" style="display: $visitor;" >
+       <div id="profile-video-wrapper" class="jot-tool" style="display: none;" >
                <a id="profile-video" class="icon border  video" title="$video" onclick="jotVideoURL(); return false;"></a>
        </div> 
-       <div id="profile-audio-wrapper" class="jot-tool" style="display: $visitor;" >
+       <div id="profile-audio-wrapper" class="jot-tool" style="display: none;" >
                <a id="profile-audio" class="icon border  audio" title="$audio" onclick="jotAudioURL(); return false;"></a>
        </div> 
-       <div id="profile-location-wrapper" class="jot-tool" style="display: $visitor;" >
+       <div id="profile-location-wrapper" class="jot-tool" style="display: none;" >
                <a id="profile-location" class="icon border  globe" title="$setloc" onclick="jotGetLocation(); return false;"></a>
        </div> 
        <div id="profile-nolocation-wrapper" class="jot-tool" style="display: none;" >
                <a id="profile-nolocation" class="icon border  noglobe" title="$noloc" onclick="jotClearLocation(); return false;"></a>
        </div> 
-       <div id="profile-title-wrapper" class="jot-tool" style="display: $visitor;" >
+       <div id="profile-title-wrapper" class="jot-tool" style="display: none;" >
                <a id="profile-title" class="icon border  article" title="$title" onclick="jotTitle(); return false;"></a>
        </div> 
 
-       <div id="profile-jot-plugin-wrapper">
+       <div id="profile-jot-plugin-wrapper" style="display: none;">
        $jotplugins
        </div>
-
        <div id="profile-jot-tools-end"></div>
        
         <div style="display: none;">

diff --git a/view/theme/dispy/style.css b/view/theme/dispy/style.css
index 8526b35a652003093d232405198d1d1257deb7a5..e9d11d601f81c4f326cdb0280c718d3bdb09089d 100644 (file)
--- a/view/theme/dispy/style.css
+++ b/view/theme/dispy/style.css
@@ -1112,6 +1112,11 @@ div[id$="wrapper"] br { clear: left; }
  .cc-license { margin-top: 100px; font-size: 0.7em; }                                  
 footer { display: block; margin: 50px 20%; clear: both; }
                                   
+#profile-jot-text {
+    height: 20px;
+    color:#cccccc;
+    border: 1px solid #cccccc;
+}
 /** acl **/
 #photo-edit-perms-select,
 #photos-upload-permissions-wrapper,