[IPython-dev] Unique cell render div ids

Aron Ahmadia aron at ahmadia.net
Mon Oct 29 17:19:04 EDT 2012


Cool!  Testing...

A

On Mon, Oct 29, 2012 at 9:17 PM, Brian Granger <ellisonbg at gmail.com> wrote:

> Aron,
>
> I don't think this is necessary. You should be able to get the unique
> element using:
>
> `this.element.get(0);`
>
> The `element` attribute is the jquery object for the cell and `get(0)`
> returns the actual underlying DOM element for it.
>
> Cheers,
>
> Brian
>
> On Mon, Oct 29, 2012 at 1:59 PM, Aron Ahmadia <aron at ahmadia.net> wrote:
>
>> Hi Developers,
>>
>> While fixing the code for MathJax rendering that I broke earlier this
>> week, I came across the need to address a specific element in the DOM:
>>
>> http://docs.mathjax.org/en/latest/typeset.html
>>
>> I know there has been some work attaching unique ids to cells in the code
>> in the past, but there didn't seem to be any obvious functionality
>> currently implemented in Cells for this.  You'll notice that the pull
>> request I just updated here: https://github.com/ipython/ipython/pull/2517adds the following code to textcell.js:
>>
>>  .. ...**
>>
>> @@ -39,9 +39,11 @@ var IPython = (function (IPython) {
>>
>> 39 39**
>>
>>              extraKeys: {"Tab": "indentMore","Shift-Tab" : "indentLess"},
>>
>>  40 40**
>>
>>              onKeyEvent: $.proxy(this.handle_codemirror_keyevent,this)
>>
>> 41 41**
>>
>>          });
>>
>>   42**
>>
>> +        this.cell_id = IPython.utils.uuid();
>>
>> 42 43**
>>
>>          // The tabindex=-1 makes this div focusable.
>>
>>   44**
>>
>> +        // id is a unique cell_id necessary for updating MathJax intelligently
>>
>> 43 45**
>>
>>          var render_area = $('<div/>').addClass('text_cell_render border-box-sizing').
>>
>>  44  **
>>
>> -            addClass('rendered_html').attr('tabindex','-1');
>>
>>    46**
>>
>> +            addClass('rendered_html').attr('tabindex','-1').attr('id',this.cell_id);
>>
>>  45 47**
>>
>>          cell.append(input_area).append(render_area);
>>
>> 46 48**
>>
>>          this.element = cell;
>>
>> 47 49**
>>
>>      };
>>
>>
>> What I'm doing here is first calling into IPython.utils.uuid() to
>> generate a cell_id (The one from the Cell prototype appears to be
>> broken/unused?), then adding that as an id to the
>> rendered html div.
>>
>> Then later, I can grab this id when I need to update the math:
>>
>>
>>   82**
>>
>> +    TextCell.prototype.typeset = function () {
>>
>>   83**
>>
>> +        if (window.MathJax){
>>
>>   84**
>>
>> +            var cell_math = document.getElementById(this.cell_id);
>>
>>   85**
>>
>> +            MathJax.Hub.Queue(["Typeset",MathJax.Hub,cell_math]);
>>
>>   86**
>>
>> +        }
>>
>>   87**
>>
>> +    };
>>
>>   88**
>>
>> +
>>
>>
>> This really speeds up MathJax rendering considerably, so I think it's
>> worth doing, but I feel like I'm really nosing into code I don't understand
>> well, so it would be good to hear feedback if there are opinions on this.
>>
>> A
>>
>> _______________________________________________
>> IPython-dev mailing list
>> IPython-dev at scipy.org
>> http://mail.scipy.org/mailman/listinfo/ipython-dev
>>
>>
>
>
> --
> Brian E. Granger
> Cal Poly State University, San Luis Obispo
> bgranger at calpoly.edu and ellisonbg at gmail.com
>
>
> _______________________________________________
> IPython-dev mailing list
> IPython-dev at scipy.org
> http://mail.scipy.org/mailman/listinfo/ipython-dev
>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://mail.python.org/pipermail/ipython-dev/attachments/20121029/5f3cbca8/attachment.html>


More information about the IPython-dev mailing list