Ask Your Question
0

Question about Jupyter

asked 2020-05-01 15:33:58 +0100

Cyrille gravatar image

I am nearly novice in Sagemath and I would like to ameliorate the display of the cells. For this I would like to install Hide_code but I am on windows 10 and the procedure to follow are written for Linux. My second question is why Jupyter comes on windows ten without view?

edit retag flag offensive close merge delete

Comments

off-topic: in general sage is not "windows friendly", if you can I will recommend to use some linux distribution. I have dual boot with win10 and kubuntu and almost all the time Im in kubuntu. Indeed I have a lot more of useful tools in kubuntu, at least for what I generally do in a computer.

Masacroso gravatar imageMasacroso ( 2020-05-01 17:52:23 +0100 )edit

I have not enough room and to jump from one system to the other is boring.

Cyrille gravatar imageCyrille ( 2020-05-02 00:01:04 +0100 )edit

Installing hide_codeis explained here https://ask.sagemath.org/question/502... why doesn't it work for windows?

Sébastien gravatar imageSébastien ( 2020-05-02 12:02:50 +0100 )edit

About "the procedure to follow": can you include a link?

About "comes without view"; can you explain what you mean?

slelievre gravatar imageslelievre ( 2020-05-02 17:13:36 +0100 )edit

Sorry I am stupid . I finally have understud that to install an additionnal package it was necessary to use sage shell. From notebook I was unable to do it.

Cyrille gravatar imageCyrille ( 2020-05-02 23:07:33 +0100 )edit

1 Answer

Sort by » oldest newest most voted
1

answered 2020-05-02 21:07:59 +0100

dsejas gravatar image

updated 2020-05-06 23:58:51 +0100

Hello, @Cyrille! I have a quite complicated solution that should work on Windows or any OS. I cannot take credit for it; I just adapted a solution from this site (retrieved on May 2nd, 2020), which in turn comes from this other page (retrieved on May 2nd, 2020). Since I don't know Javascript, it was a really painful process to understand this code and how to use it. Unfortunately, I wasn't able to improve the code (I just adapted it), so maybe you need a more clever person than me.

However, here is what I've got. Write the following Python script in a file, which, for the sake of the discussion, I will call "invisible_cells.py":

from IPython.core.display import display, HTML

def toggle_cell():
    tag = HTML("""
        <script>
        code_show=true; 
        function toggle_cell() {
            if (code_show){
                $('div.cell.code_cell.rendered.selected div.input').hide();
            } else {
                $('div.cell.code_cell.rendered.selected div.input').show();
            }
            code_show = !code_show;
        } 
        $( document ).ready(toggle_cell);
        </script>

        <a href="javascript:toggle_cell()">Toggle this cell</a>""")
    display(tag)

def hide_cell():
    tag = HTML("""
        <script>
        function hide_cell() {
            $('div.cell.code_cell.rendered.selected div.input').hide();
        }
    $(document).ready(hide_cell);
        </script>

        <a href="javascript:hide_cell()">Hide permanently</a>""")
    display(tag)

This script defined two functions: toggle_cell() will allow you to hide/unhide the contents of a cell, while hide_cell will make it permanently invisible.

You can use these functions as follows. Write the following in a cell:

import invisible_cells as ic
ic.hide_cell()

When you execute that cell, it will show you a link "Hide permanently"; when pressed, it will hide the cell and the link. From that point on, you should use the ic.hide_cell() command at the beginning of every cell you want to hide.

Since permanently hiding a cell is dangerous, I also included the ic.toggle_cell() command. If you use it at the beginning of a cell, when executed, it will show you a link "Toggle this cell", which will hide the cell, but also will show it again, just in case you need to make modifications.

This is the downside of the code: You must press the links in order to hide the cells. If you share this notebook with somebody, or even if you close and then re-open the notebook, the cells will be visible until you press the links to hide them. This is because the Javascript code uses the selected div command, which requires the cell to be activated, which in turn requires the link to be pressed. However, if you find somebody who can program Javascript, you can ask them to change the code so that the code recognizes the cell from which is executed, and automatically hides it.

I hope this helps! I am so sorry i didn't find a better solution.

edit flag offensive delete link more

Comments

Dsejas You have no reason to be sorry. Your help is particularly valuable.

Cyrille gravatar imageCyrille ( 2020-05-02 23:07:24 +0100 )edit

Dsejas I have tried your nice code and ic.hide_cell() works perfectly. But the usage of ic.toggle_cell() is unclear. For instance if I code

ic.toggle_cell()
1+2

I can see the blue Toggle this cell. But when I clic on it nothing special is done. I think I have not well understud the way to use it. Secondly, I wonder if a hide cell could be executed. For instance suppose I make an @interact cell but I do not want the code to be seen --- it's a support for a teaching not for programming. I think also that perhaps it will be nice to replace 'Hide permanently' and by Toggle this cell by small icones, to remove the temptation to see what appen when clicked. In all cases thinks to always answer to my questions. I think SageMAth is an fitted to teach.

Cyrille gravatar imageCyrille ( 2020-05-06 05:57:48 +0100 )edit

Hello, @Cyrille! Oops, I did a mistake! The code should be completely functional now. The Toggle this cell button should hide and unhide the contents of the cell.

You can replace the "Toggle this cell" and "Hide permanently" texts with icons. Suppose you have a couple of icons in a folder called "images", and the icons you want to use are called "toggle.png" and "hide.png". You should replace

<a href="javascript:toggle_cell()">Toggle this cell</a>

with

<a href="javascript:toggle_cell()"><img src="images/toggle.png"></a>

and also replace

<a href="javascript:hide_cell()">Hide permanently</a>

with

<a href="javascript:hide_cell()"><img src="images/hide.png"></a>

You will need to distribute the "images" folder with your Jupyter notebook.

dsejas gravatar imagedsejas ( 2020-05-07 00:02:05 +0100 )edit

Instead of using icons, I would use something much more discrete, like

<a href="javascript:hide_cell()">.</a>

This way, instead of "Hide permanenlty", you will see a tiny dot---so tiny that only you will know it's there. If you click on it, the cell will hide.

dsejas gravatar imagedsejas ( 2020-05-07 00:03:59 +0100 )edit

By the way, @Cyrille, there is a much better way to hide the code of an @interact cell: you can use HTML web pages instead of using Jupyter notebooks. Basically, you embed the Sage code inside the HTML code, and you get a website interactive demos. You can find a couple of examples here. I can send you a template that allows you to include Sage code, so that it's invisible, but the interactive controls are visible. I think this will be a very useful solution for you!

Disclaimer: Boht, in Jupyter notebooks and in HTML webpages, a student motivated to find the Sage code will be able to do it eventually. They just have to open the document in a text editor. SageMath is designed for Open Science.

dsejas gravatar imagedsejas ( 2020-05-07 00:32:03 +0100 )edit

Your Answer

Please start posting anonymously - your entry will be published after you log in or create a new account.

Add Answer

Question Tools

1 follower

Stats

Asked: 2020-05-01 15:33:58 +0100

Seen: 999 times

Last updated: May 06 '20