##// END OF EJS Templates
Update JavaScript Notebook Extensions.ipynb...
Nat Dunn -
Show More
@@ -4,30 +4,30 b''
4 "cell_type": "markdown",
4 "cell_type": "markdown",
5 "metadata": {},
5 "metadata": {},
6 "source": [
6 "source": [
7 "# Embrasing web standards"
7 "# Embracing web standards"
8 ]
8 ]
9 },
9 },
10 {
10 {
11 "cell_type": "markdown",
11 "cell_type": "markdown",
12 "metadata": {},
12 "metadata": {},
13 "source": [
13 "source": [
14 "One of the main reason that allowed us to developp the current notebook web application \n",
14 "One of the main reason that allowed us to develop the current notebook web application \n",
15 "was to embrase the web technology. \n",
15 "was to embrace the web technology. \n",
16 "\n",
16 "\n",
17 "By beeing a pure web application using HTML, Javascript and CSS, the Notebook can get \n",
17 "By being a pure web application using HTML, JavaScript and CSS, the Notebook can get \n",
18 "all the web technology improvement for free. Thus, as browsers support for different \n",
18 "all the web technology improvement for free. Thus, as browsers' support for different \n",
19 "media extend, The notebook web app should be able to be compatible without modification. \n",
19 "media extend, the notebook web app should be able to be compatible without modification. \n",
20 "\n",
20 "\n",
21 "This is also true with performance of the User Interface as the speed of javascript VM increase. "
21 "This is also true with performance of the User Interface as the speed of JavaScript VM increase. "
22 ]
22 ]
23 },
23 },
24 {
24 {
25 "cell_type": "markdown",
25 "cell_type": "markdown",
26 "metadata": {},
26 "metadata": {},
27 "source": [
27 "source": [
28 "The other advantage of using only web technology is that the code of the interface is fully accessible to the end user, and modifiable live.\n",
28 "The other advantage of using only web technologies is that the code of the interface is fully accessible to the end user, and modifiable live.\n",
29 "Even if this task is not always easy, we strive to keep our code as accessible and reusable as possible.\n",
29 "Even if this task is not always easy, we strive to keep our code as accessible and reusable as possible.\n",
30 "This should allow with minimum effort to develop small extensions that customize the behavior of the web interface. "
30 "This should allow for relatively simple development of small extensions that customize the behavior of the web interface. "
31 ]
31 ]
32 },
32 },
33 {
33 {
@@ -41,10 +41,10 b''
41 "cell_type": "markdown",
41 "cell_type": "markdown",
42 "metadata": {},
42 "metadata": {},
43 "source": [
43 "source": [
44 "The first tool that is availlable to you and that you shoudl be aware of are browser \"developpers tool\". The exact naming can change across browser, and might require the installation of extensions. But basically they can allow you to inspect/modify the DOM, and interact with the javascript code that run the frontend.\n",
44 "The first tool that is available to you and that you should be aware of are browser \"developers tool\". The exact naming can change across browsers, and might require the installation of extensions. But basically they can allow you to inspect/modify the DOM, and interact with the JavaScript code that runs the frontend.\n",
45 "\n",
45 "\n",
46 " - In Chrome and safari Developper tools are in the menu [Put mmenu name in english here] \n",
46 " - In Chrome and Safari, Developer tools are in the menu "More Tools" \n",
47 " - In firefox you might need to install [Firebug](http://getfirebug.com/)\n",
47 " - In Firefox you might need to install [Firebug](http://getfirebug.com/)\n",
48 " - others ?\n",
48 " - others ?\n",
49 " \n",
49 " \n",
50 "Those will be your best friends to debug and try different approach for your extensions."
50 "Those will be your best friends to debug and try different approach for your extensions."
@@ -68,12 +68,12 b''
68 "cell_type": "markdown",
68 "cell_type": "markdown",
69 "metadata": {},
69 "metadata": {},
70 "source": [
70 "source": [
71 "Above tools can be tedious to edit long javascipt files. Hopefully we provide the `%%javascript` magic. This allows you to quickly inject javascript into the notebook. Still the javascript injected this way will not survive reloading. Hence it is a good tool for testing an refinig a script.\n",
71 "The above tools can be tedious to edit long JavaScript files. Hopefully we provide the `%%javascript` magic. This allows you to quickly inject JavaScript into the notebook. Still the JavaScript injected this way will not survive reloading. Hence it is a good tool for testing an refinig a script.\n",
72 "\n",
72 "\n",
73 "You might see here and there people modifying css and injecting js into notebook by reading file and publishing them into the notebook.\n",
73 "You might see here and there people modifying CSS and injecting JavaScript into notebook by reading file and publishing them into the notebook.\n",
74 "Not only this often break the flow of the notebook and make the re-execution of the notebook broken, but it also mean that you need to execute those cells on all the notebook every time you need to update the code.\n",
74 "Not only this often break the flow of the notebook and make the re-execution of the notebook broken, but it also mean that you need to execute those cells on all the notebook every time you need to update the code.\n",
75 "\n",
75 "\n",
76 "This can still be usefull in some cases, like the `%autosave` magic that allows to control the time between each save. But this can be replaced by a Javascript dropdown menu to select save interval."
76 "This can still be usefull in some cases, like the `%autosave` magic that allows to control the time between each save. But this can be replaced by a JavaScript dropdown menu to select save interval."
77 ]
77 ]
78 },
78 },
79 {
79 {
@@ -99,8 +99,8 b''
99 "cell_type": "markdown",
99 "cell_type": "markdown",
100 "metadata": {},
100 "metadata": {},
101 "source": [
101 "source": [
102 "To inject Javascript we provide an entry point: `custom.js` that allow teh user to execute and load other resources into the notebook.\n",
102 "To inject JavaScript we provide an entry point: `custom.js` that allow teh user to execute and load other resources into the notebook.\n",
103 "Javascript code in `custom.js` will be executed when the notebook app start and can then be used to customise almost anything in the UI and in the behavior of the notebook.\n",
103 "JavaScript code in `custom.js` will be executed when the notebook app start and can then be used to customize almost anything in the UI and in the behavior of the notebook.\n",
104 "\n",
104 "\n",
105 "`custom.js` can be found in IPython profile dir, and so you can have different UI modification on a per profile basis, as well as share your modfication with others."
105 "`custom.js` can be found in IPython profile dir, and so you can have different UI modification on a per profile basis, as well as share your modfication with others."
106 ]
106 ]
@@ -315,7 +315,7 b''
315 "cell_type": "markdown",
315 "cell_type": "markdown",
316 "metadata": {},
316 "metadata": {},
317 "source": [
317 "source": [
318 "Sadly you will have to read the js source file (but there are lots of comments) an/or build the javascript documentation using yuidoc.\n",
318 "Sadly you will have to read the js source file (but there are lots of comments) an/or build the JavaScript documentation using yuidoc.\n",
319 "If you have `node` and `yui-doc` installed:"
319 "If you have `node` and `yui-doc` installed:"
320 ]
320 ]
321 },
321 },
General Comments 0
You need to be logged in to leave comments. Login now