Skip to content

Commit 72b46e3

Browse files
Ashutoshx7Ashutoshx7
authored
Merge branch 'master' into perf/optimize-canvas-rendering
2 parents 917e339 + 275db03 commit 72b46e3

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

53 files changed

+5776
-611
lines changed

‎.DS_Store‎

-6 KB
Binary file not shown.

‎.gitignore‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
11
node_modules/
22
*~
3-
coverage/
3+
coverage/
4+
.DS_Store
5+
**/.DS_Store

‎Docs/guide-es/index.html‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,10 @@
1111
<a href="../guide/index.html">English</a> |
1212
<a href="../guide-es/index.html">Español</a> |
1313
<a href="../guide-ja/index.html">日本語</a> |
14-
<a href="../guide-zhCN/index.html">中文</a>
14+
<a href="../guide-zhCN/index.html">中文</a> |
15+
<a href="../guide-pt/index.html">Português</a>
16+
</div>
17+
1518
</p>
1619
<h1 id="gu-a-de-programaci-n-con-bloques-de-m-sica">Guía de Programación con Bloques de Música</h1>
1720
<p>Bloques de Música es un entorno de programación para lqs niños

‎Docs/guide-ja/index.html‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,8 @@
1616
<a href="../guide/index.html">English</a> |
1717
<a href="../guide-es/index.html">Español</a> |
1818
<a href="../guide-ja/index.html">日本語</a> |
19-
<a href="../guide-zhCN/index.html">中文</a>
19+
<a href="../guide-zhCN/index.html">中文</a> |
20+
<a href="../guide-pt/index.html">Português</a>
2021
</p>
2122
<h1 id="-">ミュージック・ブロックスのプログラミング案内</h1>
2223
<p>ミュージック・ブロックスは子供のための音楽とコードが合体されているプログラミング環境。子供さん達はこのツールで音楽、数学、またコードの基本な色々が楽しく発見することができます。ミュージック・ブロックスはタートルブロックから作られて、ピッチとリズムのツールもあります。</p>

‎Docs/guide-pt/index.html‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -21,14 +21,17 @@
2121
}
2222
</style>
2323
</head>
24-
<body>
24+
<body>
25+
2526
<div class="container">
2627
<div id="content">
2728
<h1 id="guide-to-programming-with-music-blocks">Guia de Programação com Music Blocks</h1>
2829
<p>
29-
Music Blocks é um ambiente de programação para crianças interessadas em música e gráficos.
30-
Ele expande o Turtle Blocks adicionando uma coleção de recursos relacionados a altura e
31-
ritmo.
30+
<a href="../guide/index.html">English</a> |
31+
<a href="../guide-es/index.html">Español</a> |
32+
<a href="../guide-ja/index.html">日本語</a> |
33+
<a href="../guide-zhCN/index.html">中文</a> |
34+
<a href="../guide-pt/index.html">Português</a>
3235
</p>
3336
<p>
3437
O
@@ -122,6 +125,7 @@ <h2 id="table-of-contents"><a name="TOC">ÍNDICE</a></h2>
122125
<li><a href="#36-adding-graphics">Gráficos</a></li>
123126
<li><a href="#37-interactions">Interações</a></li>
124127
<li><a href="#38-ensemble">Conjunto</a></li>
128+
125129
</ol>
126130
</li>
127131
<li>

‎Docs/guide-zhCN/index.html‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,10 +13,11 @@
1313
<div class="container">
1414
<div id="content">
1515
<p>
16-
<a href="../guide/index.html">English</a> |
16+
<a href="../guide/index.html">English</a> |
1717
<a href="../guide-es/index.html">Español</a> |
1818
<a href="../guide-ja/index.html">日本語</a> |
19-
<a href="../guide-zhCN/index.html">中文</a>
19+
<a href="../guide-zhCN/index.html">中文</a> |
20+
<a href="../guide-pt/index.html">Português</a>
2021
</p>
2122
<h1 id="-">《音乐拼块》程序设计说明</h1>
2223
<p>《音乐拼块》是一个培养青少年对音乐和图像的兴趣的程序环境。

‎Docs/guide/index.html‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,8 @@
2828
<a href="../guide/index.html">English</a> |
2929
<a href="../guide-es/index.html">Español</a> |
3030
<a href="../guide-ja/index.html">日本語</a> |
31-
<a href="../guide-zhCN/index.html">中文</a>
31+
<a href="../guide-zhCN/index.html">中文</a> |
32+
<a href="../guide-pt/index.html">Português</a>
3233
</p>
3334
<h1 id="guide-to-programming-with-music-blocks">Guide to Programming with Music Blocks</h1>
3435
<p>

‎Docs/troubleshooting.md‎

Lines changed: 98 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,98 @@
1+
# Developer Troubleshooting
2+
3+
This document contains developer-focused troubleshooting guidance for building,
4+
running, and contributing to Music Blocks. End users should refer to the main
5+
README and user documentation.
6+
7+
## Browser Shows Blank Page or Blocks Not Displaying
8+
9+
Problem:
10+
The application loads but shows a blank screen or blocks do not appear.
11+
12+
Solution:
13+
1. Open the browser Developer Tools.
14+
- Chrome / Edge: F12 or Ctrl + Shift + J
15+
- Firefox: Ctrl + Shift + K
16+
2. Check the Console tab for JavaScript errors.
17+
3. Fix the reported errors and reload the page.
18+
4. Try running the app in Chrome or Firefox if the issue persists.
19+
20+
## npm install Fails with Permission Errors
21+
22+
Problem:
23+
Dependency installation fails due to permission issues or corrupted files.
24+
25+
Solution:
26+
Run the following commands from the project root:
27+
28+
rm -rf node_modules package-lock.json
29+
npm install
30+
31+
On Windows, use PowerShell or Git Bash.
32+
33+
## npm run lint Fails with Formatting Errors
34+
35+
Problem:
36+
Linting errors block the build due to formatting issues.
37+
38+
Solution:
39+
Run Prettier first, then re-run lint:
40+
41+
npx prettier --write .
42+
npm run lint
43+
44+
## Docker Container Won’t Start
45+
46+
Problem:
47+
Docker build fails or the container does not start correctly.
48+
49+
Solution:
50+
Clean Docker state and rebuild:
51+
52+
docker system prune
53+
docker-compose up --build
54+
55+
## Port Already in Use (EADDRINUSE)
56+
57+
Problem:
58+
The development server fails to start because port 3000 is already in use.
59+
60+
Solution:
61+
Start the server on a different port:
62+
63+
npm start -- --port=3001
64+
65+
Then open http://localhost:3001 in your browser.
66+
67+
## No Sound / Audio Not Working
68+
69+
Problem:
70+
The application runs but produces no sound.
71+
72+
Solution:
73+
1. Ensure system volume is not muted.
74+
2. Check browser audio permissions.
75+
3. Click once anywhere on the page to enable audio playback.
76+
4. Use a supported browser (Chrome or Firefox recommended).
77+
78+
## Module Not Found Errors
79+
80+
Problem:
81+
Errors such as "Cannot find module" appear during runtime or build.
82+
83+
Solution:
84+
Reinstall dependencies:
85+
86+
rm -rf node_modules package-lock.json
87+
npm install
88+
89+
## Still Having Issues?
90+
91+
If problems persist:
92+
1. Search existing GitHub issues:
93+
https://github.com/sugarlabs/musicblocks/issues
94+
2. Review developer documentation.
95+
3. Open a new issue with:
96+
- Error logs
97+
- Steps to reproduce
98+
- Browser and OS details

‎README.md‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,9 +30,9 @@ is audio-visual; it produces graphics, artwork and music. Here are a
3030
couple of screenshots to give you an idea of how the application looks
3131
like:
3232

33-
![alt tag](./screenshots/Screenshot-1.png)
33+
![Music Blocks workspace showing block-based music programming](./screenshots/Screenshot-1.png)
3434

35-
![alt tag](./screenshots/Screenshot-2.png)
35+
![Music Blocks rhythm and melody blocks interface](./screenshots/Screenshot-2.png)
3636

3737
Visit the Music Blocks website for a hands on experience:
3838
[https://musicblocks.sugarlabs.org](https://musicblocks.sugarlabs.org).

‎css/play-only-mode.css‎

Lines changed: 70 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -1,73 +1,73 @@
11
.play-only #palette {
2-
display: none !important;
3-
visibility: hidden !important;
4-
height: 0 !important;
5-
width: 0 !important;
6-
pointer-events: none !important;
2+
display: none !important;
3+
visibility: hidden !important;
4+
height: 0 !important;
5+
width: 0 !important;
6+
pointer-events: none !important;
77
overflow: hidden !important;
8-
}
8+
}
99

1010
.play-only #Grid {
11-
display: none !important;
12-
visibility: hidden !important;
13-
height: 0 !important;
14-
width: 0 !important;
15-
pointer-events: none !important;
16-
overflow: hidden !important;
11+
display: none !important;
12+
visibility: hidden !important;
13+
height: 0 !important;
14+
width: 0 !important;
15+
pointer-events: none !important;
16+
overflow: hidden !important;
1717
}
1818

1919
.play-only #Clear {
20-
display: none !important;
21-
visibility: hidden !important;
22-
height: 0 !important;
23-
width: 0 !important;
24-
pointer-events: none !important;
25-
overflow: hidden !important;
20+
display: none !important;
21+
visibility: hidden !important;
22+
height: 0 !important;
23+
width: 0 !important;
24+
pointer-events: none !important;
25+
overflow: hidden !important;
2626
}
2727

2828
.play-only #Collapse {
29-
display: none !important;
30-
visibility: hidden !important;
31-
height: 0 !important;
32-
width: 0 !important;
33-
pointer-events: none !important;
29+
display: none !important;
30+
visibility: hidden !important;
31+
height: 0 !important;
32+
width: 0 !important;
33+
pointer-events: none !important;
3434
overflow: hidden !important;
3535
}
3636

3737
.play-only [id="Show/hide blocks"] {
38-
display: none !important;
39-
visibility: hidden !important;
40-
height: 0 !important;
41-
width: 0 !important;
42-
pointer-events: none !important;
38+
display: none !important;
39+
visibility: hidden !important;
40+
height: 0 !important;
41+
width: 0 !important;
42+
pointer-events: none !important;
4343
overflow: hidden !important;
4444
}
4545

4646
.play-only [id="Expand/collapse blocks"] {
47-
display: none !important;
48-
visibility: hidden !important;
49-
height: 0 !important;
50-
width: 0 !important;
51-
pointer-events: none !important;
52-
overflow: hidden !important;
47+
display: none !important;
48+
visibility: hidden !important;
49+
height: 0 !important;
50+
width: 0 !important;
51+
pointer-events: none !important;
52+
overflow: hidden !important;
5353
}
5454

55-
.play-only [id="Decrease block size"]{
56-
display: none !important;
57-
visibility: hidden !important;
58-
height: 0 !important;
59-
width: 0 !important;
60-
pointer-events: none !important;
61-
overflow: hidden !important;
55+
.play-only [id="Decrease block size"] {
56+
display: none !important;
57+
visibility: hidden !important;
58+
height: 0 !important;
59+
width: 0 !important;
60+
pointer-events: none !important;
61+
overflow: hidden !important;
6262
}
6363

6464
.play-only [id="Increase block size"] {
65-
display: none !important;
66-
visibility: hidden !important;
67-
height: 0 !important;
68-
width: 0 !important;
69-
pointer-events: none !important;
70-
overflow: hidden !important;
65+
display: none !important;
66+
visibility: hidden !important;
67+
height: 0 !important;
68+
width: 0 !important;
69+
pointer-events: none !important;
70+
overflow: hidden !important;
7171
}
7272

7373
.play-only #buttoncontainerBOTTOM {
@@ -88,40 +88,41 @@
8888
justify-content: center !important;
8989
align-items: center !important;
9090
position: fixed !important;
91-
right: 15px !important;
92-
bottom: 15px !important;
91+
right: 15px !important;
92+
bottom: 15px !important;
9393
width: auto !important;
9494
height: auto !important;
95-
z-index: 10000 !important;
96-
background-color: rgba(255, 255, 255, 0.9) !important;
95+
z-index: 10000 !important;
96+
background-color: rgba(255, 255, 255, 0.9) !important;
9797
padding: 5px !important;
9898
border-radius: 5px !important;
9999
}
100100

101101
@media only screen and (max-width: 400px) {
102102
.play-only ul.main.right {
103-
margin-top: 0px !important;
104-
position: relative !important;
105-
display: flex !important;
106-
flex-wrap: wrap !important;
107-
justify-content: center !important;
108-
align-items: center !important;
109-
gap: 10px !important;
103+
margin-top: 0px !important;
104+
position: relative !important;
105+
display: flex !important;
106+
flex-wrap: wrap !important;
107+
justify-content: center !important;
108+
align-items: center !important;
109+
gap: 10px !important;
110110
}
111-
111+
112112
.play-only nav {
113-
min-height: 50px !important;
114-
display: flex !important;
115-
align-items: center !important;
116-
justify-content: center !important;
113+
min-height: 50px !important;
114+
display: flex !important;
115+
align-items: center !important;
116+
justify-content: center !important;
117117
}
118-
}
118+
}
119+
120+
@media (max-width: 768px),
121+
(max-height: 600px) {
119122

120-
@media (max-width: 768px), (max-height: 600px) {
121-
/* Enable the auxiliary button */
123+
/* Hide the full auxiliary button */
122124
.play-only #toggleAuxBtn {
123-
pointer-events: auto !important;
124-
opacity: 1 !important;
125+
display: none !important;
125126
}
126127

127128
/* Hide the full auxiliary toolbar */
@@ -144,5 +145,4 @@
144145
.play-only #Home\ \[HOME\] {
145146
display: flex !important;
146147
position: fixed !important;
147-
}
148-
148+
}

0 commit comments

Comments
 (0)