完成任务16：编写 04_长期发展/环境保护.md
This commit is contained in:
root
181
skills/video-use/static/timeline-view.svg
Normal file
181
skills/video-use/static/timeline-view.svg
Normal file
@@ -0,0 +1,181 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1140 540" font-family="Inter, system-ui, sans-serif">
|
||||
<!-- Outer frame / card -->
|
||||
<rect x="0" y="0" width="1140" height="540" rx="14" fill="#1c1917"/>
|
||||
|
||||
<!-- Top bar mimicking an editor UI -->
|
||||
<rect x="20" y="20" width="1100" height="36" rx="8" fill="#292524"/>
|
||||
<circle cx="40" cy="38" r="5" fill="#57534e"/>
|
||||
<circle cx="56" cy="38" r="5" fill="#57534e"/>
|
||||
<circle cx="72" cy="38" r="5" fill="#57534e"/>
|
||||
<text x="92" y="42" font-family="JetBrains Mono, monospace" font-size="11" fill="#a8a29e">timeline_view.py — C0103.MP4 — 42.0s → 48.0s</text>
|
||||
<text x="1108" y="42" text-anchor="end" font-family="JetBrains Mono, monospace" font-size="10" font-weight="700" fill="#ff6b35">ON-DEMAND COMPOSITE PNG</text>
|
||||
|
||||
<!-- Inner canvas -->
|
||||
<g transform="translate(20,70)">
|
||||
<rect x="0" y="0" width="1100" height="460" rx="6" fill="#1a1a20"/>
|
||||
|
||||
<!-- ===== FILMSTRIP ROW ===== -->
|
||||
<rect x="8" y="8" width="100" height="119" rx="4" fill="#252530"/>
|
||||
<rect x="20" y="30" width="30" height="30" rx="15" fill="#353540"/>
|
||||
<rect x="55" y="35" width="40" height="20" rx="3" fill="#2d2d38"/>
|
||||
<rect x="25" y="80" width="60" height="8" rx="2" fill="#2d2d38"/>
|
||||
<rect x="35" y="95" width="40" height="6" rx="2" fill="#252530"/>
|
||||
|
||||
<rect x="116" y="8" width="100" height="119" rx="4" fill="#282832"/>
|
||||
<rect x="128" y="30" width="30" height="30" rx="15" fill="#383842"/>
|
||||
<rect x="163" y="35" width="40" height="20" rx="3" fill="#303038"/>
|
||||
<rect x="133" y="80" width="60" height="8" rx="2" fill="#303038"/>
|
||||
<rect x="143" y="95" width="40" height="6" rx="2" fill="#282832"/>
|
||||
|
||||
<rect x="224" y="8" width="100" height="119" rx="4" fill="#262630"/>
|
||||
<rect x="236" y="30" width="30" height="30" rx="15" fill="#363640"/>
|
||||
<rect x="271" y="35" width="40" height="20" rx="3" fill="#2e2e36"/>
|
||||
<rect x="241" y="80" width="60" height="8" rx="2" fill="#2e2e36"/>
|
||||
<rect x="251" y="95" width="40" height="6" rx="2" fill="#262630"/>
|
||||
|
||||
<rect x="332" y="8" width="100" height="119" rx="4" fill="#252530"/>
|
||||
<rect x="344" y="30" width="30" height="30" rx="15" fill="#353540"/>
|
||||
<rect x="379" y="35" width="40" height="20" rx="3" fill="#2d2d38"/>
|
||||
<rect x="349" y="80" width="60" height="8" rx="2" fill="#2d2d38"/>
|
||||
|
||||
<rect x="440" y="8" width="100" height="119" rx="4" fill="#282832"/>
|
||||
<rect x="452" y="30" width="30" height="30" rx="15" fill="#383842"/>
|
||||
<rect x="487" y="35" width="40" height="20" rx="3" fill="#303038"/>
|
||||
<rect x="457" y="80" width="60" height="8" rx="2" fill="#303038"/>
|
||||
|
||||
<rect x="548" y="8" width="100" height="119" rx="4" fill="#262630"/>
|
||||
<rect x="560" y="30" width="30" height="30" rx="15" fill="#363640"/>
|
||||
<rect x="595" y="35" width="40" height="20" rx="3" fill="#2e2e36"/>
|
||||
<rect x="565" y="80" width="60" height="8" rx="2" fill="#2e2e36"/>
|
||||
|
||||
<rect x="656" y="8" width="100" height="119" rx="4" fill="#252530"/>
|
||||
<rect x="668" y="30" width="30" height="30" rx="15" fill="#353540"/>
|
||||
<rect x="703" y="35" width="40" height="20" rx="3" fill="#2d2d38"/>
|
||||
<rect x="673" y="80" width="60" height="8" rx="2" fill="#2d2d38"/>
|
||||
|
||||
<rect x="764" y="8" width="100" height="119" rx="4" fill="#282832"/>
|
||||
<rect x="776" y="30" width="30" height="30" rx="15" fill="#383842"/>
|
||||
<rect x="811" y="35" width="40" height="20" rx="3" fill="#303038"/>
|
||||
<rect x="781" y="80" width="60" height="8" rx="2" fill="#303038"/>
|
||||
|
||||
<rect x="872" y="8" width="100" height="119" rx="4" fill="#262630"/>
|
||||
<rect x="884" y="30" width="30" height="30" rx="15" fill="#363640"/>
|
||||
<rect x="919" y="35" width="40" height="20" rx="3" fill="#2e2e36"/>
|
||||
|
||||
<rect x="980" y="8" width="112" height="119" rx="4" fill="#252530"/>
|
||||
<rect x="992" y="30" width="30" height="30" rx="15" fill="#353540"/>
|
||||
<rect x="1027" y="35" width="40" height="20" rx="3" fill="#2d2d38"/>
|
||||
|
||||
<!-- ===== SPEAKER TRACK ===== -->
|
||||
<rect x="0" y="145" width="1100" height="30" rx="0" fill="#13131a"/>
|
||||
<rect x="8" y="150" width="620" height="20" rx="4" fill="rgba(255,107,53,0.15)" stroke="rgba(255,107,53,0.3)" stroke-width="1"/>
|
||||
<text x="310" y="164" text-anchor="middle" font-family="JetBrains Mono, monospace" font-size="10" font-weight="600" fill="#ff6b35">SPEAKER 0</text>
|
||||
<rect x="680" y="150" width="410" height="20" rx="4" fill="rgba(255,107,53,0.08)" stroke="rgba(255,107,53,0.15)" stroke-width="1"/>
|
||||
<text x="885" y="164" text-anchor="middle" font-family="JetBrains Mono, monospace" font-size="10" font-weight="600" fill="rgba(255,107,53,0.5)">SPEAKER 1</text>
|
||||
|
||||
<!-- ===== WAVEFORM ===== -->
|
||||
<rect x="0" y="180" width="1100" height="190" rx="0" fill="#0f0f16"/>
|
||||
|
||||
<line x1="0" y1="275" x2="1100" y2="275" stroke="#1a1a24" stroke-width="1"/>
|
||||
|
||||
<rect x="370" y="183" width="80" height="184" fill="rgba(255,107,53,0.06)"/>
|
||||
<rect x="630" y="183" width="100" height="184" fill="rgba(255,107,53,0.06)"/>
|
||||
|
||||
<polygon points="
|
||||
8,275
|
||||
30,260 50,250 70,235 90,220 110,230 130,220 150,210 170,225 190,240 210,250
|
||||
230,260 250,265 270,268 290,270 310,268 330,265 350,258 370,272
|
||||
380,275 390,275 400,275 410,275 420,275 430,275 440,275 450,272
|
||||
470,260 490,248 510,232 530,218 540,225 550,235 560,228 570,215 580,222
|
||||
590,235 600,248 610,258 620,268 630,274
|
||||
640,275 650,275 660,275 670,275 680,275 690,275 700,275 710,275 720,275 730,274
|
||||
750,268 770,255 790,240 810,228 830,218 850,225 870,235 890,242
|
||||
910,250 930,258 950,262 970,268 990,272 1010,274 1030,275 1050,275 1080,275 1092,275
|
||||
" fill="rgba(140,180,255,0.12)"/>
|
||||
<polyline points="
|
||||
8,275
|
||||
30,260 50,250 70,235 90,220 110,230 130,220 150,210 170,225 190,240 210,250
|
||||
230,260 250,265 270,268 290,270 310,268 330,265 350,258 370,272
|
||||
380,275 390,275 400,275 410,275 420,275 430,275 440,275 450,272
|
||||
470,260 490,248 510,232 530,218 540,225 550,235 560,228 570,215 580,222
|
||||
590,235 600,248 610,258 620,268 630,274
|
||||
640,275 650,275 660,275 670,275 680,275 690,275 700,275 710,275 720,275 730,274
|
||||
750,268 770,255 790,240 810,228 830,218 850,225 870,235 890,242
|
||||
910,250 930,258 950,262 970,268 990,272 1010,274 1030,275 1050,275 1080,275 1092,275
|
||||
" fill="none" stroke="#6b9fff" stroke-width="1.5" stroke-linejoin="round"/>
|
||||
|
||||
<polygon points="
|
||||
8,275
|
||||
30,290 50,300 70,315 90,330 110,320 130,330 150,340 170,325 190,310 210,300
|
||||
230,290 250,285 270,282 290,280 310,282 330,285 350,292 370,278
|
||||
380,275 390,275 400,275 410,275 420,275 430,275 440,275 450,278
|
||||
470,290 490,302 510,318 530,332 540,325 550,315 560,322 570,335 580,328
|
||||
590,315 600,302 610,292 620,282 630,276
|
||||
640,275 650,275 660,275 670,275 680,275 690,275 700,275 710,275 720,275 730,276
|
||||
750,282 770,295 790,310 810,322 830,332 850,325 870,315 890,308
|
||||
910,300 930,292 950,288 970,282 990,278 1010,276 1030,275 1050,275 1080,275 1092,275
|
||||
" fill="rgba(140,180,255,0.06)"/>
|
||||
<polyline points="
|
||||
8,275
|
||||
30,290 50,300 70,315 90,330 110,320 130,330 150,340 170,325 190,310 210,300
|
||||
230,290 250,285 270,282 290,280 310,282 330,285 350,292 370,278
|
||||
380,275 390,275 400,275 410,275 420,275 430,275 440,275 450,278
|
||||
470,290 490,302 510,318 530,332 540,325 550,315 560,322 570,335 580,328
|
||||
590,315 600,302 610,292 620,282 630,276
|
||||
640,275 650,275 660,275 670,275 680,275 690,275 700,275 710,275 720,275 730,276
|
||||
750,282 770,295 790,310 810,322 830,332 850,325 870,315 890,308
|
||||
910,300 930,292 950,288 970,282 990,278 1010,276 1030,275 1050,275 1080,275 1092,275
|
||||
" fill="none" stroke="#6b9fff" stroke-width="1" stroke-linejoin="round" opacity="0.4"/>
|
||||
|
||||
<!-- Word labels above waveform -->
|
||||
<text x="40" y="198" font-family="JetBrains Mono, monospace" font-size="10" fill="#6b9fff" font-weight="500">Ninety</text>
|
||||
<text x="120" y="198" font-family="JetBrains Mono, monospace" font-size="10" fill="#6b9fff" font-weight="500">percent</text>
|
||||
<text x="210" y="198" font-family="JetBrains Mono, monospace" font-size="10" fill="#6b9fff" font-weight="500">of</text>
|
||||
<text x="260" y="198" font-family="JetBrains Mono, monospace" font-size="10" fill="#6b9fff" font-weight="500">what</text>
|
||||
<text x="320" y="198" font-family="JetBrains Mono, monospace" font-size="10" fill="#6b9fff" font-weight="500">...wasted.</text>
|
||||
<text x="480" y="198" font-family="JetBrains Mono, monospace" font-size="10" fill="#6b9fff" font-weight="500">We</text>
|
||||
<text x="540" y="198" font-family="JetBrains Mono, monospace" font-size="10" fill="#6b9fff" font-weight="500">fixed</text>
|
||||
<text x="600" y="198" font-family="JetBrains Mono, monospace" font-size="10" fill="#6b9fff" font-weight="500">this.</text>
|
||||
<text x="760" y="198" font-family="JetBrains Mono, monospace" font-size="10" fill="#6b9fff" font-weight="500">When</text>
|
||||
<text x="830" y="198" font-family="JetBrains Mono, monospace" font-size="10" fill="#6b9fff" font-weight="500">a</text>
|
||||
<text x="870" y="198" font-family="JetBrains Mono, monospace" font-size="10" fill="#6b9fff" font-weight="500">web</text>
|
||||
<text x="930" y="198" font-family="JetBrains Mono, monospace" font-size="10" fill="#6b9fff" font-weight="500">agent</text>
|
||||
<text x="1000" y="198" font-family="JetBrains Mono, monospace" font-size="10" fill="#6b9fff" font-weight="500">comes...</text>
|
||||
|
||||
<!-- Silence gap labels -->
|
||||
<text x="395" y="215" text-anchor="middle" font-family="JetBrains Mono, monospace" font-size="9" fill="#ff6b35" font-weight="600">620ms</text>
|
||||
<text x="395" y="227" text-anchor="middle" font-size="8" fill="rgba(255,107,53,0.6)">silence</text>
|
||||
<text x="680" y="215" text-anchor="middle" font-family="JetBrains Mono, monospace" font-size="9" fill="#ff6b35" font-weight="600">880ms</text>
|
||||
<text x="680" y="227" text-anchor="middle" font-size="8" fill="rgba(255,107,53,0.6)">silence</text>
|
||||
|
||||
<!-- Cut candidate lines -->
|
||||
<line x1="410" y1="183" x2="410" y2="367" stroke="#059669" stroke-width="2" stroke-dasharray="6 4"/>
|
||||
<line x1="680" y1="183" x2="680" y2="367" stroke="#059669" stroke-width="2" stroke-dasharray="6 4"/>
|
||||
|
||||
<!-- Audio event pill -->
|
||||
<rect x="610" y="348" width="85" height="22" rx="11" fill="rgba(255,107,53,0.2)" stroke="#ff6b35" stroke-width="1"/>
|
||||
<text x="652" y="363" text-anchor="middle" font-size="9" font-weight="700" fill="#ff6b35">(laughter)</text>
|
||||
|
||||
<!-- ===== TIME RULER ===== -->
|
||||
<rect x="0" y="375" width="1100" height="30" rx="0" fill="#13131a"/>
|
||||
<text x="8" y="394" font-family="JetBrains Mono, monospace" font-size="10" fill="#4a4a58">42.00s</text>
|
||||
<line x1="8" y1="378" x2="8" y2="385" stroke="#4a4a58" stroke-width="1"/>
|
||||
<text x="228" y="394" font-family="JetBrains Mono, monospace" font-size="10" fill="#4a4a58">43.20s</text>
|
||||
<line x1="228" y1="378" x2="228" y2="385" stroke="#4a4a58" stroke-width="1"/>
|
||||
<text x="448" y="394" font-family="JetBrains Mono, monospace" font-size="10" fill="#4a4a58">44.40s</text>
|
||||
<line x1="448" y1="378" x2="448" y2="385" stroke="#4a4a58" stroke-width="1"/>
|
||||
<text x="668" y="394" font-family="JetBrains Mono, monospace" font-size="10" fill="#4a4a58">45.60s</text>
|
||||
<line x1="668" y1="378" x2="668" y2="385" stroke="#4a4a58" stroke-width="1"/>
|
||||
<text x="888" y="394" font-family="JetBrains Mono, monospace" font-size="10" fill="#4a4a58">46.80s</text>
|
||||
<line x1="888" y1="378" x2="888" y2="385" stroke="#4a4a58" stroke-width="1"/>
|
||||
<text x="1048" y="394" font-family="JetBrains Mono, monospace" font-size="10" fill="#4a4a58">48.00s</text>
|
||||
<line x1="1048" y1="378" x2="1048" y2="385" stroke="#4a4a58" stroke-width="1"/>
|
||||
|
||||
<!-- ===== CUT CANDIDATE LABELS ===== -->
|
||||
<rect x="375" y="410" width="70" height="22" rx="4" fill="#059669"/>
|
||||
<text x="410" y="425" text-anchor="middle" font-size="9" font-weight="800" fill="white">CUT</text>
|
||||
<rect x="645" y="410" width="70" height="22" rx="4" fill="#059669"/>
|
||||
<text x="680" y="425" text-anchor="middle" font-size="9" font-weight="800" fill="white">CUT</text>
|
||||
<text x="550" y="450" text-anchor="middle" font-size="11" fill="#a8a29e">Silences ≥ 400ms = safe cut candidates. Words give boundary precision. Audio events mark beats to preserve.</text>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 12 KiB |
Reference in New Issue
Block a user