MCPcopy Create free account
hub / github.com/danja/dogalog / createOverlay

Method createOverlay

src/tutorial/tutorialOverlay.js:21–93  ·  view source on GitHub ↗

* Create overlay DOM structure

()

Source from the content-addressed store, hash-verified

19 * Create overlay DOM structure
20 */
21 createOverlay() {
22 // Overlay container
23 this.element = document.createElement('div');
24 this.element.className = 'tutorial-overlay';
25 this.element.style.display = 'none';
26
27 // Content card
28 const card = document.createElement('div');
29 card.className = 'tutorial-card';
30
31 // Header
32 const header = document.createElement('div');
33 header.className = 'tutorial-header';
34
35 this.titleElement = document.createElement('h3');
36 this.titleElement.className = 'tutorial-title';
37 header.appendChild(this.titleElement);
38
39 this.progressElement = document.createElement('div');
40 this.progressElement.className = 'tutorial-progress';
41 header.appendChild(this.progressElement);
42
43 const closeBtn = document.createElement('button');
44 closeBtn.className = 'tutorial-close btn';
45 closeBtn.textContent = '×';
46 closeBtn.setAttribute('aria-label', 'Close tutorial');
47 closeBtn.onclick = () => this.hide();
48 header.appendChild(closeBtn);
49
50 card.appendChild(header);
51
52 // Content
53 this.contentElement = document.createElement('div');
54 this.contentElement.className = 'tutorial-content';
55 card.appendChild(this.contentElement);
56
57 // Action prompt
58 this.actionElement = document.createElement('div');
59 this.actionElement.className = 'tutorial-action';
60 card.appendChild(this.actionElement);
61
62 // Navigation
63 const nav = document.createElement('div');
64 nav.className = 'tutorial-nav';
65
66 this.prevBtn = document.createElement('button');
67 this.prevBtn.className = 'btn';
68 this.prevBtn.textContent = 'Previous';
69 this.prevBtn.onclick = () => this.manager.previous();
70 nav.appendChild(this.prevBtn);
71
72 this.tryBtn = document.createElement('button');
73 this.tryBtn.className = 'btn primary';
74 this.tryBtn.textContent = 'Try This Code';
75 this.tryBtn.onclick = () => this.loadStepCode();
76 nav.appendChild(this.tryBtn);
77
78 this.nextBtn = document.createElement('button');

Callers 1

constructorMethod · 0.95

Calls 5

hideMethod · 0.95
loadStepCodeMethod · 0.95
handleNextMethod · 0.95
previousMethod · 0.80
createElementMethod · 0.45

Tested by

no test coverage detected