Re: Some Javascript Adventures

[Carsten Dominik <carsten.dominik@gmail.com>]

That is pretty cool, thanks.

- Carsten

On May 12, 2009, at 5:51 PM, Sebastian Rose wrote:

>
>
> 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