From mboxrd@z Thu Jan  1 00:00:00 1970
From: Sebastian Rose <sebastian_rose@gmx.de>
Subject: Re: Some Javascript Adventures
Date: Tue, 12 May 2009 17:51:14 +0200
Message-ID: <87eiuuxqtp.fsf@kassiopeya.MSHEIMNETZ>
References: <4A0960BE.2050005@manor-farm.org>
	<87r5yuxwhz.fsf@kassiopeya.MSHEIMNETZ>
	<F3BD871D-0C95-4C8B-A0C6-18DF547BF990@gmail.com>
Mime-Version: 1.0
Content-Type: text/plain; charset=us-ascii
Return-path: <emacs-orgmode-bounces+geo-emacs-orgmode=m.gmane.org@gnu.org>
Received: from mailman by lists.gnu.org with tmda-scanned (Exim 4.43)
	id 1M3uCg-0001u1-S0
	for emacs-orgmode@gnu.org; Tue, 12 May 2009 11:47:38 -0400
Received: from exim by lists.gnu.org with spam-scanned (Exim 4.43)
	id 1M3uCb-0001qy-SL
	for emacs-orgmode@gnu.org; Tue, 12 May 2009 11:47:38 -0400
Received: from [199.232.76.173] (port=52828 helo=monty-python.gnu.org)
	by lists.gnu.org with esmtp (Exim 4.43) id 1M3uCb-0001qt-O0
	for emacs-orgmode@gnu.org; Tue, 12 May 2009 11:47:33 -0400
Received: from mail.gmx.net ([213.165.64.20]:57829)
	by monty-python.gnu.org with smtp (Exim 4.60)
	(envelope-from <sebastian_rose@gmx.de>) id 1M3uCa-0002MK-VO
	for emacs-orgmode@gnu.org; Tue, 12 May 2009 11:47:33 -0400
In-Reply-To: <F3BD871D-0C95-4C8B-A0C6-18DF547BF990@gmail.com> (Carsten
	Dominik's message of "Tue, 12 May 2009 15:49:27 +0200")
List-Id: "General discussions about Org-mode." <emacs-orgmode.gnu.org>
List-Unsubscribe: <http://lists.gnu.org/mailman/listinfo/emacs-orgmode>,
	<mailto:emacs-orgmode-request@gnu.org?subject=unsubscribe>
List-Archive: <http://lists.gnu.org/pipermail/emacs-orgmode>
List-Post: <mailto:emacs-orgmode@gnu.org>
List-Help: <mailto:emacs-orgmode-request@gnu.org?subject=help>
List-Subscribe: <http://lists.gnu.org/mailman/listinfo/emacs-orgmode>,
	<mailto:emacs-orgmode-request@gnu.org?subject=subscribe>
Sender: emacs-orgmode-bounces+geo-emacs-orgmode=m.gmane.org@gnu.org
Errors-To: emacs-orgmode-bounces+geo-emacs-orgmode=m.gmane.org@gnu.org
To: Carsten Dominik <carsten.dominik@gmail.com>
Cc: emacs-orgmode@gnu.org



If your Sitmap looks like this normaly:


  * Folder 1
    - item 1.1
    - item 1.2
    * folder 1.1
      - file 1.1.1
    * folder 1.2
      - file 1.2.1
  * Folder 2
    - item 2.1
    - item 2.2

It collapses all, but the top folders on startup:


  * Folder 1
  * Folder 2


Each folder can be clicked, to expand and collapse from now on.


To do this with each TOC, just use another CSS selector in the jQuery
code: 



 <!--/*--><![CDATA[/*><!--*/
 $(document).ready(
  function(){
  $("#text-table-of-contents ul").eq(0).find("li").each(

 //      ^--- and here

    function(){if($(this).children().eq(0)){
      $(this).css({cursor: "pointer"});
      $(this).bind(
        "click",
        function(){
          if($(this).children().eq(0).is(":visible")) $
 (this).children().eq(0).slideUp(250);
          else $(this).children().eq(0).slideDown(250);
          return false;});}});
  $("#text-table-of-contents ul").eq(0).find("ul").hide();

 //      ^--- and here

 });


If you use correct styles, you could even create a horizontal menubar
with dropdown menus from this.



Best


   Sebastian



Carsten Dominik <carsten.dominik@gmail.com> writes:
> On May 12, 2009, at 3:48 PM, Sebastian Rose wrote:
>
>>
>> jQuery is  _the_ JS framework :-)
>> I use it all the time here...
>>
>>
>> I have this in my Sitemap:
>>
>> <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
>> <script type="text/javascript">
>> <!--/*--><![CDATA[/*><!--*/
>> var doMenu = true;
>> $(document).ready(
>>  function(){
>>  $("ul").eq(0).find("li").each(
>>    function(){if($(this).children().eq(0)){
>>      $(this).css({cursor: "pointer"});
>>      $(this).bind(
>>        "click",
>>        function(){
>>          if($(this).children().eq(0).is(":visible")) $
>> (this).children().eq(0).slideUp(250);
>>          else $(this).children().eq(0).slideDown(250);
>>          return false;});}});
>>  $("ul").eq(0).find("ul").hide();
>> });
>
> What does this code do?  Just curious....
>
> - Carsten
>
>
>>
>>
>>
>>
>> Ian Barton <lists@manor-farm.org> writes:
>>> Yesterday on my bike ride I was listening to an old FLOSS Podcast about
>>> jQuery. There are a few things that Sebastian's org-info-js doesn't do, that
>>> I
>>> would like. Unfortunately, my knowledge of javascript is almost zero.
>>>
>>> However, the jQuery library seems to have excellent documentation. More
>>> importantly using jQuery seems to mostly protect you from trying to debug
>>> your
>>> code on lots of different browsers, since the jQuery author has already done
>>> it
>>> for you.
>>>
>>> After some experiments I cam up with the following snippets which toggle the
>>> visibility of DONE tasks and also timestamps. Hope someone finds them useful!
>>>
>>> Ian.
>>>
>>> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js
>>> "
>>> type="text/javascript"></script>
>>>
>>> <script type="text/javascript" >
>>> <!--/*--><![CDATA[/*><!--*/
>>>
>>>     $(document).ready(function(){
>>>
>>>       $('#toggletimestamp').click(function() {
>>>            $('span.timestamp-wrapper').toggle();
>>>       });
>>>
>>>       $('#toggledone').click(function() {
>>>            myParent = $("span.done").parent();
>>>            myParent.toggle();
>>>       });
>>>     });
>>> /*]]>*/-->
>>> </script>
>>>
>>> You can set up a buttons to call these functions:
>>>
>>> <input type="submit"
>>> name="toggletimestamp"
>>> value="Toggle Time Stamp"
>>> id="toggletimestamp" />
>>>
>>> <input type="submit"
>>>   name="toggledone"
>>>   value="Toggle Done"
>>> id="toggledone" />
>>>
>>
>>
>> _______________________________________________
>> Emacs-orgmode mailing list
>> Remember: use `Reply All' to send replies to the list.
>> Emacs-orgmode@gnu.org
>> http://lists.gnu.org/mailman/listinfo/emacs-orgmode