.. _snappremierprojetnonviderst:

==================================
Snap - partir d’un projet existant
==================================


.. only:: html

    **Links:** :download:`notebook <snap_premier_projet_non_vide.ipynb>`, :downloadlink:`html <snap_premier_projet_non_vide2html.html>`, :download:`PDF <snap_premier_projet_non_vide.pdf>`, :download:`python <snap_premier_projet_non_vide.py>`, :downloadlink:`slides <snap_premier_projet_non_vide.slides.html>`, :githublink:`GitHub|_doc/notebooks/scratch/snap_premier_projet_non_vide.ipynb|*`


Snap ou Scratch dans un notebook. On s’assure d’abord que les fichiers
javascript de *Snap* sont accessibles depuis le serveur IPython :

.. code:: ipython3

    from code_beatrix.jsscripts import copy_jstool2notebook
    %load_ext code_beatrix
    copy_jstool2notebook("snap")




.. parsed-literal::
    [('>+',
      <pyquickhelper.filehelper.file_tree_node.FileTreeNode at 0x2981ff1f518>,
      'c:\\Python36_x64\\lib\\site-packages\\notebook-5.0.0-py3.6.egg\\notebook\\static\\snap'),
     ('>+',
      <pyquickhelper.filehelper.file_tree_node.FileTreeNode at 0x2981ff51320>,
      'c:\\Python36_x64\\lib\\site-packages\\notebook-5.0.0-py3.6.egg\\notebook\\static\\snap'),
     ('>+',
      <pyquickhelper.filehelper.file_tree_node.FileTreeNode at 0x2981ff35da0>,
      'c:\\Python36_x64\\lib\\site-packages\\notebook-5.0.0-py3.6.egg\\notebook\\static\\snap'),
     ('>+',
      <pyquickhelper.filehelper.file_tree_node.FileTreeNode at 0x2981ffaca58>,
      'c:\\Python36_x64\\lib\\site-packages\\notebook-5.0.0-py3.6.egg\\notebook\\static\\snap'),
     ('>+',
      <pyquickhelper.filehelper.file_tree_node.FileTreeNode at 0x2981ffacf60>,
      'c:\\Python36_x64\\lib\\site-packages\\notebook-5.0.0-py3.6.egg\\notebook\\static\\snap'),
     ('>-',
      None,
      <pyquickhelper.filehelper.file_tree_node.FileTreeNode at 0x2982003dd68>)]



Si le résultat est une liste vide, cela signifie que cela a déjà été
fait.

.. code:: ipython3

    %snap --help


.. parsed-literal::
    usage: snap [-h] [-f FILE] [-d DIV] [-W WIDTH] [-H HEIGHT]
    insert a snap window inside a notebook
    optional arguments:
      -h, --help            show this help message and exit
      -f FILE, --file FILE  scratch or snap file to display
      -d DIV, --div DIV     id for the HTML div
      -W WIDTH, --width WIDTH
                            window width
      -H HEIGHT, --height HEIGHT
                            window height
    usage: snap [-h] [-f FILE] [-d DIV] [-W WIDTH] [-H HEIGHT]
    


.. code:: ipython3

    # pas encore parfait, il faut mieux utiliser l'autre notebook.
    from code_beatrix.jsscripts.nbsnap import RenderSnap
    RenderSnap()






.. raw:: html


                <div id="31334e4ded66469fba4ab682502692b7div" style="position:relative; width:1000px; height:600px;">
                Snap showing up soon...
                <canvas id="31334e4ded66469fba4ab682502692b7" style="width:1000px; height:600px; position:relative; " />
                </div>
                <script type="text/javascript" src="/static/snap/blocks.js"></script>
    <script type="text/javascript" src="/static/snap/byob.js"></script>
    <script type="text/javascript" src="/static/snap/cloud.js"></script>
    <script type="text/javascript" src="/static/snap/FileSaver.min.js"></script>
    <script type="text/javascript" src="/static/snap/gui.js"></script>
    <script type="text/javascript" src="/static/snap/lang-ar.js"></script>
    <script type="text/javascript" src="/static/snap/lang-bg.js"></script>
    <script type="text/javascript" src="/static/snap/lang-bn.js"></script>
    <script type="text/javascript" src="/static/snap/lang-ca.js"></script>
    <script type="text/javascript" src="/static/snap/lang-cs.js"></script>
    <script type="text/javascript" src="/static/snap/lang-de.js"></script>
    <script type="text/javascript" src="/static/snap/lang-dk.js"></script>
    <script type="text/javascript" src="/static/snap/lang-el.js"></script>
    <script type="text/javascript" src="/static/snap/lang-eo.js"></script>
    <script type="text/javascript" src="/static/snap/lang-es.js"></script>
    <script type="text/javascript" src="/static/snap/lang-et.js"></script>
    <script type="text/javascript" src="/static/snap/lang-fi.js"></script>
    <script type="text/javascript" src="/static/snap/lang-fr.js"></script>
    <script type="text/javascript" src="/static/snap/lang-gl.js"></script>
    <script type="text/javascript" src="/static/snap/lang-hr.js"></script>
    <script type="text/javascript" src="/static/snap/lang-hu.js"></script>
    <script type="text/javascript" src="/static/snap/lang-ia.js"></script>
    <script type="text/javascript" src="/static/snap/lang-id.js"></script>
    <script type="text/javascript" src="/static/snap/lang-it.js"></script>
    <script type="text/javascript" src="/static/snap/lang-ja.js"></script>
    <script type="text/javascript" src="/static/snap/lang-ja_HIRA.js"></script>
    <script type="text/javascript" src="/static/snap/lang-kn.js"></script>
    <script type="text/javascript" src="/static/snap/lang-ko.js"></script>
    <script type="text/javascript" src="/static/snap/lang-ml.js"></script>
    <script type="text/javascript" src="/static/snap/lang-nl.js"></script>
    <script type="text/javascript" src="/static/snap/lang-no.js"></script>
    <script type="text/javascript" src="/static/snap/lang-pl.js"></script>
    <script type="text/javascript" src="/static/snap/lang-pt.js"></script>
    <script type="text/javascript" src="/static/snap/lang-pt_BR.js"></script>
    <script type="text/javascript" src="/static/snap/lang-ro.js"></script>
    <script type="text/javascript" src="/static/snap/lang-ru.js"></script>
    <script type="text/javascript" src="/static/snap/lang-si.js"></script>
    <script type="text/javascript" src="/static/snap/lang-sv.js"></script>
    <script type="text/javascript" src="/static/snap/lang-ta.js"></script>
    <script type="text/javascript" src="/static/snap/lang-te.js"></script>
    <script type="text/javascript" src="/static/snap/lang-tr.js"></script>
    <script type="text/javascript" src="/static/snap/lang-zh_CN.js"></script>
    <script type="text/javascript" src="/static/snap/lang-zh_TW.js"></script>
    <script type="text/javascript" src="/static/snap/lists.js"></script>
    <script type="text/javascript" src="/static/snap/locale.js"></script>
    <script type="text/javascript" src="/static/snap/morphic.js"></script>
    <script type="text/javascript" src="/static/snap/objects.js"></script>
    <script type="text/javascript" src="/static/snap/paint.js"></script>
    <script type="text/javascript" src="/static/snap/sha512.js"></script>
    <script type="text/javascript" src="/static/snap/store.js"></script>
    <script type="text/javascript" src="/static/snap/tables.js"></script>
    <script type="text/javascript" src="/static/snap/threads.js"></script>
    <script type="text/javascript" src="/static/snap/widgets.js"></script>
    <script type="text/javascript" src="/static/snap/xml.js"></script>
    <script type="text/javascript" src="/static/snap/ypr.js"></script>
    <script>
                         var world31334e4ded66469fba4ab682502692b7;
                         function loop31334e4ded66469fba4ab682502692b7() {
                            world31334e4ded66469fba4ab682502692b7.doOneCycle();
                         }
                         function start_snap31334e4ded66469fba4ab682502692b7() {
                            var sec = document.getElementsByClassName("31334e4ded66469fba4ab682502692b7div");
                            sec.innerHTML = "loading...";
                            world31334e4ded66469fba4ab682502692b7 = new WorldMorph(document.getElementById('31334e4ded66469fba4ab682502692b7'));
                            world31334e4ded66469fba4ab682502692b7.worldCanvas.focus();
                            new IDE_Morph().openIn(world31334e4ded66469fba4ab682502692b7);
                            setInterval(loop31334e4ded66469fba4ab682502692b7, 1);
                            sec.innerHTML = "";
                         }
                         window.setTimeout(start_snap31334e4ded66469fba4ab682502692b7,500);
                         </script>




.. code:: ipython3

    %snap






.. raw:: html


                <div id="scratch_div_id_2df259285c4546e698ec2048a37c82addiv" style="position:relative; width:600px; height:1000px;">
                Snap showing up soon...
                <canvas id="scratch_div_id_2df259285c4546e698ec2048a37c82ad" style="width:600px; height:1000px; position:relative; " />
                </div>
                <script type="text/javascript" src="/static/snap/blocks.js"></script>
    <script type="text/javascript" src="/static/snap/byob.js"></script>
    <script type="text/javascript" src="/static/snap/cloud.js"></script>
    <script type="text/javascript" src="/static/snap/FileSaver.min.js"></script>
    <script type="text/javascript" src="/static/snap/gui.js"></script>
    <script type="text/javascript" src="/static/snap/lang-ar.js"></script>
    <script type="text/javascript" src="/static/snap/lang-bg.js"></script>
    <script type="text/javascript" src="/static/snap/lang-bn.js"></script>
    <script type="text/javascript" src="/static/snap/lang-ca.js"></script>
    <script type="text/javascript" src="/static/snap/lang-cs.js"></script>
    <script type="text/javascript" src="/static/snap/lang-de.js"></script>
    <script type="text/javascript" src="/static/snap/lang-dk.js"></script>
    <script type="text/javascript" src="/static/snap/lang-el.js"></script>
    <script type="text/javascript" src="/static/snap/lang-eo.js"></script>
    <script type="text/javascript" src="/static/snap/lang-es.js"></script>
    <script type="text/javascript" src="/static/snap/lang-et.js"></script>
    <script type="text/javascript" src="/static/snap/lang-fi.js"></script>
    <script type="text/javascript" src="/static/snap/lang-fr.js"></script>
    <script type="text/javascript" src="/static/snap/lang-gl.js"></script>
    <script type="text/javascript" src="/static/snap/lang-hr.js"></script>
    <script type="text/javascript" src="/static/snap/lang-hu.js"></script>
    <script type="text/javascript" src="/static/snap/lang-ia.js"></script>
    <script type="text/javascript" src="/static/snap/lang-id.js"></script>
    <script type="text/javascript" src="/static/snap/lang-it.js"></script>
    <script type="text/javascript" src="/static/snap/lang-ja.js"></script>
    <script type="text/javascript" src="/static/snap/lang-ja_HIRA.js"></script>
    <script type="text/javascript" src="/static/snap/lang-kn.js"></script>
    <script type="text/javascript" src="/static/snap/lang-ko.js"></script>
    <script type="text/javascript" src="/static/snap/lang-ml.js"></script>
    <script type="text/javascript" src="/static/snap/lang-nl.js"></script>
    <script type="text/javascript" src="/static/snap/lang-no.js"></script>
    <script type="text/javascript" src="/static/snap/lang-pl.js"></script>
    <script type="text/javascript" src="/static/snap/lang-pt.js"></script>
    <script type="text/javascript" src="/static/snap/lang-pt_BR.js"></script>
    <script type="text/javascript" src="/static/snap/lang-ro.js"></script>
    <script type="text/javascript" src="/static/snap/lang-ru.js"></script>
    <script type="text/javascript" src="/static/snap/lang-si.js"></script>
    <script type="text/javascript" src="/static/snap/lang-sv.js"></script>
    <script type="text/javascript" src="/static/snap/lang-ta.js"></script>
    <script type="text/javascript" src="/static/snap/lang-te.js"></script>
    <script type="text/javascript" src="/static/snap/lang-tr.js"></script>
    <script type="text/javascript" src="/static/snap/lang-zh_CN.js"></script>
    <script type="text/javascript" src="/static/snap/lang-zh_TW.js"></script>
    <script type="text/javascript" src="/static/snap/lists.js"></script>
    <script type="text/javascript" src="/static/snap/locale.js"></script>
    <script type="text/javascript" src="/static/snap/morphic.js"></script>
    <script type="text/javascript" src="/static/snap/objects.js"></script>
    <script type="text/javascript" src="/static/snap/paint.js"></script>
    <script type="text/javascript" src="/static/snap/sha512.js"></script>
    <script type="text/javascript" src="/static/snap/store.js"></script>
    <script type="text/javascript" src="/static/snap/tables.js"></script>
    <script type="text/javascript" src="/static/snap/threads.js"></script>
    <script type="text/javascript" src="/static/snap/widgets.js"></script>
    <script type="text/javascript" src="/static/snap/xml.js"></script>
    <script type="text/javascript" src="/static/snap/ypr.js"></script>
    <script>
                         var worldscratch_div_id_2df259285c4546e698ec2048a37c82ad;
                         function loopscratch_div_id_2df259285c4546e698ec2048a37c82ad() {
                            worldscratch_div_id_2df259285c4546e698ec2048a37c82ad.doOneCycle();
                         }
                         function start_snapscratch_div_id_2df259285c4546e698ec2048a37c82ad() {
                            var sec = document.getElementsByClassName("scratch_div_id_2df259285c4546e698ec2048a37c82addiv");
                            sec.innerHTML = "loading...";
                            worldscratch_div_id_2df259285c4546e698ec2048a37c82ad = new WorldMorph(document.getElementById('scratch_div_id_2df259285c4546e698ec2048a37c82ad'));
                            worldscratch_div_id_2df259285c4546e698ec2048a37c82ad.worldCanvas.focus();
                            new IDE_Morph().openIn(worldscratch_div_id_2df259285c4546e698ec2048a37c82ad);
                            setInterval(loopscratch_div_id_2df259285c4546e698ec2048a37c82ad, 1);
                            sec.innerHTML = "";
                         }
                         window.setTimeout(start_snapscratch_div_id_2df259285c4546e698ec2048a37c82ad,500);
                         </script>