Skip to content

Commit 063b72d

Browse files
andreburgaudandreburgaud
committed
Added base64 example
Added console example Added npm_install Added initial chrome extension examples
1 parent b1620ce commit 063b72d

File tree

25 files changed

+36568
-1
lines changed

25 files changed

+36568
-1
lines changed

‎brython/base64/embed/index.html‎

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
<!DOCTYPE html>
2+
<html>
3+
4+
<head>
5+
<script
6+
src="https://cdnjs.cloudflare.com/ajax/libs/brython/3.8.9/brython.min.js"
7+
integrity="sha256-U56d9Sn/Gtf1meSBXazW81LM1bUeyc1jFuoY3CBu6A8="
8+
crossorigin="anonymous">
9+
</script>
10+
<script
11+
src="https://cdnjs.cloudflare.com/ajax/libs/brython/3.8.9/brython_stdlib.min.js"
12+
integrity="sha256-twMHOlRBOpBkpyGFeXIBWoJqTpqf76Zp8HExOelwyRc="
13+
crossorigin="anonymous"
14+
defer>
15+
</script>
16+
<style>
17+
table { border-collapse: collapse; }
18+
table, th, td { border: 1px solid grey; }
19+
</style>
20+
</head>
21+
22+
<body onload="brython()">
23+
24+
<script type="text/python">
25+
from browser import document, prompt, html
26+
import base64
27+
28+
b64_map = {}
29+
30+
def base64_compute(evt):
31+
default = "Real Python"
32+
data = prompt("Enter a string:", default)
33+
data = data or default
34+
b64data = base64.b64encode(data.encode()).decode()
35+
b64_map[data] = b64data
36+
display_map()
37+
38+
def display_map():
39+
table = html.TABLE(style={'border': '1 solid grey'})
40+
table <= html.TR(html.TH("Text") + html.TH("Base64"))
41+
table <= (html.TR(html.TD(key) + html.TD(b64_map[key])) for key in b64_map)
42+
document["base64-res"].clear()
43+
document["base64-res"] <= table
44+
45+
document["base64-btn"].bind("click", base64_compute)
46+
</script>
47+
48+
<button id="base64-btn">Base64</button>
49+
<p/>
50+
<div id="base64-res"></div>
51+
52+
</body>
53+
</html>

‎brython/base64/form/index.html‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
<!DOCTYPE html >
2+
<html>
3+
<head>
4+
<meta charset="utf-8"/>
5+
<link
6+
rel="stylesheet"
7+
href="https://cdnjs.cloudflare.com/ajax/libs/pure/2.0.3/pure-min.min.css"
8+
integrity="sha256-jYujp4Kf07YDuUF9i1MHo4AnpXUKuHxIUXH7CrHxdKw="
9+
crossorigin="anonymous" />
10+
<script
11+
src="https://cdnjs.cloudflare.com/ajax/libs/brython/3.8.9/brython.min.js"
12+
integrity="sha256-U56d9Sn/Gtf1meSBXazW81LM1bUeyc1jFuoY3CBu6A8="
13+
crossorigin="anonymous">
14+
</script>
15+
<script
16+
src="https://cdnjs.cloudflare.com/ajax/libs/brython/3.8.9/brython_stdlib.min.js"
17+
integrity="sha256-twMHOlRBOpBkpyGFeXIBWoJqTpqf76Zp8HExOelwyRc="
18+
crossorigin="anonymous"
19+
defer>
20+
</script>
21+
<script src="main.py" type="text/python" defer></script>
22+
<style>
23+
body { padding: 30px; }
24+
</style>
25+
</head>
26+
<body onload="brython()">
27+
<form class="pure-form" onsubmit="return false;">
28+
<fieldset>
29+
<legend>Base64 Calculator</legend>
30+
<input type="text" id="text-src" placeholder="Text to Encode" autocomplete="off"/>
31+
<button type="submit" id="submit" class="pure-button pure-button-primary">Ok</button>
32+
<button id="clear-btn" class="pure-button">Clear</button>
33+
</fieldset>
34+
</form>
35+
<div id="b64-display"></div>
36+
</body>
37+
</html>

‎brython/base64/form/main.py‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
from browser import document, prompt, html, alert
2+
import base64
3+
4+
b64_map = {}
5+
6+
def base64_compute(evt):
7+
value = document["text-src"].value
8+
if not value:
9+
alert("You need to enter a value")
10+
return
11+
if value in b64_map:
12+
alert(f"The base64 value of '{value}' already exists: '{b64_map[value]}'")
13+
return
14+
b64data = base64.b64encode(value.encode()).decode()
15+
b64_map[value] = b64data
16+
display_map()
17+
18+
def clear_map(evt):
19+
b64_map.clear()
20+
document["b64-display"].clear()
21+
22+
def display_map():
23+
table = html.TABLE(Class="pure-table")
24+
table <= html.THEAD(html.TR(html.TH("Text") + html.TH("Base64")))
25+
table <= (html.TR(html.TD(key) + html.TD(b64_map[key])) for key in b64_map)
26+
base64_display = document["b64-display"]
27+
base64_display.clear()
28+
base64_display <= table
29+
document["text-src"].value = ""
30+
31+
document["submit"].bind("click", base64_compute)
32+
document["clear-btn"].bind("click", clear_map)

‎brython/base64/sep/index.html‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<script
5+
src="https://cdnjs.cloudflare.com/ajax/libs/brython/3.8.9/brython.min.js"
6+
integrity="sha256-U56d9Sn/Gtf1meSBXazW81LM1bUeyc1jFuoY3CBu6A8="
7+
crossorigin="anonymous">
8+
</script>
9+
<script
10+
src="https://cdnjs.cloudflare.com/ajax/libs/brython/3.8.9/brython_stdlib.min.js"
11+
integrity="sha256-twMHOlRBOpBkpyGFeXIBWoJqTpqf76Zp8HExOelwyRc="
12+
crossorigin="anonymous"
13+
defer>
14+
</script>
15+
<script src="main.py" type="text/python" defer></script>
16+
<style>
17+
table { border-collapse: collapse; }
18+
table, th, td { border: 1px solid grey; }
19+
</style>
20+
</head>
21+
<body onload="brython(1)">
22+
<button id="b64-btn">Base64</button>
23+
<p/>
24+
<div id="b64-display"></div>
25+
</body>
26+
</html>

‎brython/base64/sep/main.py‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
from browser import document, prompt, html
2+
import base64
3+
4+
b64_map = {}
5+
6+
def base64_compute(evt):
7+
default = "Real Python"
8+
data = prompt("Enter a string:", default)
9+
data = data or default
10+
b64data = base64.b64encode(data.encode()).decode()
11+
b64_map[data] = b64data
12+
display_map()
13+
14+
def display_map():
15+
table = html.TABLE(style={'border': '1 solid grey'})
16+
table <= html.TR(html.TH("Text") + html.TH("Base64"))
17+
table <= (html.TR(html.TD(key) + html.TD(b64_map[key])) for key in b64_map)
18+
base64_display = document["b64-display"]
19+
base64_display.clear()
20+
base64_display <= table
21+
22+
document["b64-btn"].bind("click", base64_compute)

‎brython/base64/storage/index.html‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
<!DOCTYPE html >
2+
<html>
3+
<head>
4+
<meta charset="utf-8"/>
5+
<link
6+
rel="stylesheet"
7+
href="https://cdnjs.cloudflare.com/ajax/libs/pure/2.0.3/pure-min.min.css"
8+
integrity="sha256-jYujp4Kf07YDuUF9i1MHo4AnpXUKuHxIUXH7CrHxdKw="
9+
crossorigin="anonymous" />
10+
<script
11+
src="https://cdnjs.cloudflare.com/ajax/libs/brython/3.8.9/brython.min.js"
12+
integrity="sha256-U56d9Sn/Gtf1meSBXazW81LM1bUeyc1jFuoY3CBu6A8="
13+
crossorigin="anonymous">
14+
</script>
15+
<script
16+
src="https://cdnjs.cloudflare.com/ajax/libs/brython/3.8.9/brython_stdlib.min.js"
17+
integrity="sha256-twMHOlRBOpBkpyGFeXIBWoJqTpqf76Zp8HExOelwyRc="
18+
crossorigin="anonymous"
19+
defer>
20+
</script>
21+
<script src="main.py" type="text/python" defer></script>
22+
<style>
23+
body { padding: 30px; }
24+
</style>
25+
</head>
26+
<body onload="brython()">
27+
<form class="pure-form" onsubmit="return false;">
28+
<fieldset>
29+
<legend>Base64 Calculator</legend>
30+
<input type="text" id="text-src" placeholder="Text to Encode" autocomplete="off"/>
31+
<button type="submit" id="submit" class="pure-button pure-button-primary">Ok</button>
32+
<button id="clear-btn" class="pure-button">Clear</button>
33+
</fieldset>
34+
</form>
35+
<div id="b64-display"></div>
36+
</body>
37+
</html>

‎brython/base64/storage/main.py‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
from browser import document, prompt, html, alert
2+
from browser.local_storage import storage
3+
import json, base64
4+
5+
def load_data():
6+
data = storage.get('b64data')
7+
if data:
8+
b64_map = json.loads(data)
9+
else:
10+
storage['b64data'] = json.dumps({})
11+
b64_map = {}
12+
return b64_map
13+
14+
def base64_compute(evt):
15+
value = document["text-src"].value
16+
if not value:
17+
alert("You need to enter a value")
18+
return
19+
if value in b64_map:
20+
alert(f"The base64 value of '{value}' already exists: '{b64_map[value]}'")
21+
return
22+
b64data = base64.b64encode(value.encode()).decode()
23+
b64_map[value] = b64data
24+
storage['b64data'] = json.dumps(b64_map)
25+
display_map()
26+
27+
def clear_map(evt):
28+
b64_map.clear()
29+
storage['b64data'] = json.dumps({})
30+
document["b64-display"].clear()
31+
32+
def display_map():
33+
if not b64_map:
34+
return
35+
table = html.TABLE(Class="pure-table")
36+
table <= html.THEAD(html.TR(html.TH("Text") + html.TH("Base64")))
37+
table <= (html.TR(html.TD(key) + html.TD(b64_map[key])) for key in b64_map)
38+
base64_display = document["b64-display"]
39+
base64_display.clear()
40+
base64_display <= table
41+
document["text-src"].value = ""
42+
43+
b64_map = load_data()
44+
display_map()
45+
document["submit"].bind("click", base64_compute)
46+
document["clear-btn"].bind("click", clear_map)
47+
48+

‎brython/chrome_extensions/hello_js/manifest.json‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"name": "JS Hello World",
3+
"version": "1.0",
4+
"description": "Hello World Chrome Extension in JavaScript",
5+
"manifest_version": 2,
6+
"browser_action": {
7+
"default_popup": "popup.html"
8+
},
9+
"permissions": ["declarativeContent", "storage", "activeTab"]
10+
}

‎brython/chrome_extensions/hello_js/popup.html‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<script src="popup.js" defer></script>
5+
</head>
6+
<body>
7+
<button id="hello-btn">Hello JS</button>
8+
<div id="hello"></div>
9+
</body>
10+
</html>

‎brython/chrome_extensions/hello_js/popup.js‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
'use strict';
2+
3+
let helloButton = document.getElementById("hello-btn");
4+
5+
helloButton.onclick = function (element) {
6+
const defaultName = "Real JavaScript";
7+
let msg = "";
8+
let name = prompt("Enter your name:", defaultName);
9+
if (!name) {
10+
name = defaultName;
11+
}
12+
document.getElementById("hello").innerHTML = `Hello, ${name}!`;
13+
};

0 commit comments

Comments
 (0)