Skip to content

Commit 7faeac3

Browse files
ewdlopewdlop
committed
javascript + javascript libraries pratice
1 parent 49ccb7f commit 7faeac3

10 files changed

+1353
-0
lines changed

Diff for: ‎.gitignore

+299
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,299 @@
1+
# Byte-compiled / optimized / DLL files
2+
__pycache__/
3+
*.py[cod]
4+
*$py.class
5+
6+
# C extensions
7+
*.so
8+
9+
# Distribution / packaging
10+
.Python
11+
build/
12+
develop-eggs/
13+
dist/
14+
downloads/
15+
eggs/
16+
.eggs/
17+
lib/
18+
lib64/
19+
parts/
20+
sdist/
21+
var/
22+
wheels/
23+
share/python-wheels/
24+
*.egg-info/
25+
.installed.cfg
26+
*.egg
27+
MANIFEST
28+
29+
# PyInstaller
30+
# Usually these files are written by a python script from a template
31+
# before PyInstaller builds the exe, so as to inject date/other infos into it.
32+
*.manifest
33+
*.spec
34+
35+
# Installer logs
36+
pip-log.txt
37+
pip-delete-this-directory.txt
38+
39+
# Unit test / coverage reports
40+
htmlcov/
41+
.tox/
42+
.nox/
43+
.coverage
44+
.coverage.*
45+
.cache
46+
nosetests.xml
47+
coverage.xml
48+
*.cover
49+
*.py,cover
50+
.hypothesis/
51+
.pytest_cache/
52+
cover/
53+
54+
# Translations
55+
*.mo
56+
*.pot
57+
58+
# Django stuff:
59+
*.log
60+
local_settings.py
61+
db.sqlite3
62+
db.sqlite3-journal
63+
64+
# Flask stuff:
65+
instance/
66+
.webassets-cache
67+
68+
# Scrapy stuff:
69+
.scrapy
70+
71+
# Sphinx documentation
72+
docs/_build/
73+
74+
# PyBuilder
75+
.pybuilder/
76+
target/
77+
78+
# Jupyter Notebook
79+
.ipynb_checkpoints
80+
81+
# IPython
82+
profile_default/
83+
ipython_config.py
84+
85+
# pyenv
86+
# For a library or package, you might want to ignore these files since the code is
87+
# intended to run in multiple environments; otherwise, check them in:
88+
# .python-version
89+
90+
# pipenv
91+
# According to pypa/pipenv#598, it is recommended to include Pipfile.lock in version control.
92+
# However, in case of collaboration, if having platform-specific dependencies or dependencies
93+
# having no cross-platform support, pipenv may install dependencies that don't work, or not
94+
# install all needed dependencies.
95+
#Pipfile.lock
96+
97+
# UV
98+
# Similar to Pipfile.lock, it is generally recommended to include uv.lock in version control.
99+
# This is especially recommended for binary packages to ensure reproducibility, and is more
100+
# commonly ignored for libraries.
101+
#uv.lock
102+
103+
# poetry
104+
# Similar to Pipfile.lock, it is generally recommended to include poetry.lock in version control.
105+
# This is especially recommended for binary packages to ensure reproducibility, and is more
106+
# commonly ignored for libraries.
107+
# https://python-poetry.org/docs/basic-usage/#commit-your-poetrylock-file-to-version-control
108+
#poetry.lock
109+
110+
# pdm
111+
# Similar to Pipfile.lock, it is generally recommended to include pdm.lock in version control.
112+
#pdm.lock
113+
# pdm stores project-wide configurations in .pdm.toml, but it is recommended to not include it
114+
# in version control.
115+
# https://pdm.fming.dev/latest/usage/project/#working-with-version-control
116+
.pdm.toml
117+
.pdm-python
118+
.pdm-build/
119+
120+
# PEP 582; used by e.g. github.com/David-OConnor/pyflow and github.com/pdm-project/pdm
121+
__pypackages__/
122+
123+
# Celery stuff
124+
celerybeat-schedule
125+
celerybeat.pid
126+
127+
# SageMath parsed files
128+
*.sage.py
129+
130+
# Environments
131+
.env
132+
.venv
133+
env/
134+
venv/
135+
ENV/
136+
env.bak/
137+
venv.bak/
138+
139+
# Spyder project settings
140+
.spyderproject
141+
.spyproject
142+
143+
# Rope project settings
144+
.ropeproject
145+
146+
# mkdocs documentation
147+
/site
148+
149+
# mypy
150+
.mypy_cache/
151+
.dmypy.json
152+
dmypy.json
153+
154+
# Pyre type checker
155+
.pyre/
156+
157+
# pytype static type analyzer
158+
.pytype/
159+
160+
# Cython debug symbols
161+
cython_debug/
162+
163+
# PyCharm
164+
# JetBrains specific template is maintained in a separate JetBrains.gitignore that can
165+
# be found at https://github.com/github/gitignore/blob/main/Global/JetBrains.gitignore
166+
# and can be added to the global gitignore or merged into this file. For a more nuclear
167+
# option (not recommended) you can uncomment the following to ignore the entire idea folder.
168+
#.idea/
169+
170+
# Logs
171+
logs
172+
*.log
173+
npm-debug.log*
174+
yarn-debug.log*
175+
yarn-error.log*
176+
lerna-debug.log*
177+
.pnpm-debug.log*
178+
179+
# Diagnostic reports (https://nodejs.org/api/report.html)
180+
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
181+
182+
# Runtime data
183+
pids
184+
*.pid
185+
*.seed
186+
*.pid.lock
187+
188+
# Directory for instrumented libs generated by jscoverage/JSCover
189+
lib-cov
190+
191+
# Coverage directory used by tools like istanbul
192+
coverage
193+
*.lcov
194+
195+
# nyc test coverage
196+
.nyc_output
197+
198+
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
199+
.grunt
200+
201+
# Bower dependency directory (https://bower.io/)
202+
bower_components
203+
204+
# node-waf configuration
205+
.lock-wscript
206+
207+
# Compiled binary addons (https://nodejs.org/api/addons.html)
208+
build/Release
209+
210+
# Dependency directories
211+
node_modules/
212+
jspm_packages/
213+
214+
# Snowpack dependency directory (https://snowpack.dev/)
215+
web_modules/
216+
217+
# TypeScript cache
218+
*.tsbuildinfo
219+
220+
# Optional npm cache directory
221+
.npm
222+
223+
# Optional eslint cache
224+
.eslintcache
225+
226+
# Optional stylelint cache
227+
.stylelintcache
228+
229+
# Microbundle cache
230+
.rpt2_cache/
231+
.rts2_cache_cjs/
232+
.rts2_cache_es/
233+
.rts2_cache_umd/
234+
235+
# Optional REPL history
236+
.node_repl_history
237+
238+
# Output of 'npm pack'
239+
*.tgz
240+
241+
# Yarn Integrity file
242+
.yarn-integrity
243+
244+
# dotenv environment variable files
245+
.env
246+
.env.development.local
247+
.env.test.local
248+
.env.production.local
249+
.env.local
250+
251+
# parcel-bundler cache (https://parceljs.org/)
252+
.cache
253+
.parcel-cache
254+
255+
# Next.js build output
256+
.next
257+
out
258+
259+
# Nuxt.js build / generate output
260+
.nuxt
261+
dist
262+
263+
# Gatsby files
264+
.cache/
265+
# Comment in the public line in if your project uses Gatsby and not Next.js
266+
# https://nextjs.org/blog/next-9-1#public-directory-support
267+
# public
268+
269+
# vuepress build output
270+
.vuepress/dist
271+
272+
# vuepress v2.x temp and cache directory
273+
.temp
274+
.cache
275+
276+
# Docusaurus cache and generated files
277+
.docusaurus
278+
279+
# Serverless directories
280+
.serverless/
281+
282+
# FuseBox cache
283+
.fusebox/
284+
285+
# DynamoDB Local files
286+
.dynamodb/
287+
288+
# TernJS port file
289+
.tern-port
290+
291+
# Stores VSCode versions used for testing VSCode extensions
292+
.vscode-test
293+
294+
# yarn v2
295+
.yarn/cache
296+
.yarn/unplugged
297+
.yarn/build-state.yml
298+
.yarn/install-state.gz
299+
.pnp.*

Diff for: ‎fall-back-browser.js

+91
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
// moduleLoader.js
2+
async function loadModule(name, config) {
3+
console.log(`Loading ${name}...`);
4+
5+
// Browser environment loading
6+
try {
7+
// Check if module is already loaded
8+
if (window[config.globalVar]) {
9+
console.log(`${name} already loaded`);
10+
return window[config.globalVar];
11+
}
12+
13+
// Load script
14+
const script = document.createElement('script');
15+
script.src = config.cdnUrl;
16+
17+
return new Promise((resolve, reject) => {
18+
script.onload = () => {
19+
console.log(`${name} loaded successfully`);
20+
resolve(window[config.globalVar]);
21+
};
22+
script.onerror = () => reject(new Error(`Failed to load ${name} from CDN`));
23+
document.head.appendChild(script);
24+
});
25+
} catch (err) {
26+
throw new Error(`Failed to load ${name}: ${err.message}`);
27+
}
28+
}
29+
30+
const moduleConfigs = {
31+
'd3': {
32+
cdnUrl: 'https://cdn.jsdelivr.net/npm/d3@7.9.0/dist/d3.min.js',
33+
globalVar: 'd3'
34+
},
35+
'plotly': {
36+
cdnUrl: 'https://cdn.plot.ly/plotly-2.14.0.min.js',
37+
globalVar: 'Plotly'
38+
},
39+
'jquery': {
40+
cdnUrl: 'https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.min.js',
41+
globalVar: 'jQuery'
42+
}
43+
};
44+
45+
async function initializePlotly() {
46+
try {
47+
// Load all dependencies concurrently
48+
const [d3, plotly, jquery] = await Promise.all([
49+
loadModule('d3', moduleConfigs.d3),
50+
loadModule('plotly', moduleConfigs.plotly),
51+
loadModule('jquery', moduleConfigs.jquery)
52+
]);
53+
54+
// Assign jQuery global
55+
window.jQuery = window.$ = jquery;
56+
57+
// Your plotting code
58+
const trace1 = {
59+
x: [1, 2, 3, 4],
60+
y: [10, 15, 13, 17],
61+
mode: 'markers',
62+
type: 'scatter'
63+
};
64+
65+
const trace2 = {
66+
x: [2, 3, 4, 5],
67+
y: [16, 5, 11, 9],
68+
mode: 'lines',
69+
type: 'scatter'
70+
};
71+
72+
const trace3 = {
73+
x: [1, 2, 3, 4],
74+
y: [12, 9, 15, 12],
75+
mode: 'lines+markers',
76+
type: 'scatter'
77+
};
78+
79+
const data = [trace1, trace2, trace3];
80+
81+
// Create the plot
82+
await plotly.newPlot('target', data);
83+
console.log('Plot created successfully');
84+
85+
} catch (error) {
86+
console.error('Failed to initialize:', error);
87+
}
88+
}
89+
90+
// Start the initialization
91+
initializePlotly();

0 commit comments

Comments
 (0)