week9

let mySound;

let fft;

let playButton;

let volumeSlider;

let progressBar;

let isPlaying = false;

let elapsedTimeText;

let durationTimeText;

​

function preload() {

mySound = loadSound('vivaldi.mp3'); // Müzik dosyası

}

​

function setup() {

createCanvas(windowWidth, windowHeight, WEBGL); // Tam ekran canvas, WEBGL 3D

fft = new p5.FFT();

​

// Çalma/Duraklatma butonu

playButton = createButton('▶'); // İlk başta "Play" simgesi

playButton.position(width / 2 - 25, height - 80); // Canvas ortasında alt kısım

playButton.size(50, 50); // oynatma tuş boyutu

playButton.mousePressed(toggleMusic);

playButton.style('background-color', '#000'); // Siyah arkaplan

playButton.style('color', '#FFF'); 

playButton.style('border', 'none'); 

playButton.style('border-radius', '26px'); // Daire şekli

playButton.style('cursor', 'pointer');

​

// Ses kaydırıcısı (Dikey konumlandırma)

volumeSlider = createSlider(0, 1, 0.5, 0.01);

volumeSlider.position(0, 560); // Sol üstte

volumeSlider.style('transform', 'rotate(-90deg)'); // Dikey

volumeSlider.style('width', '130px'); // Slider uzunluğu

volumeSlider.style('background', '#FFF'); // Beyaz renk

volumeSlider.style('appearance', 'none');

volumeSlider.style('border-radius', '20px');

​

  // İlerleme çubuğu

progressBar = createSlider(0, 1, 0, 0.01);

progressBar.addClass ("slider")

progressBar.position(width / 2 - 150, height - 40); // Canvas ortasında altta durmalı

progressBar.style('width', '320px');

progressBar.style('background', '#FF0000'); 

progressBar.input(updateMusicPosition); // şarkının süresini algılama

​

// Süre metinleri

elapsedTimeText = createDiv('0:00');

elapsedTimeText.position(width / 2 - 170, height - 60);

elapsedTimeText.style('color', '#FFF');

elapsedTimeText.style('font-family', 'Monospace');

​

durationTimeText = createDiv('0:00');

durationTimeText.position(width / 2 + 130, height - 60);

durationTimeText.style('color', '#FFF');

durationTimeText.style('font-family', 'Monospace');

}

​

function draw() {

background(0); // Siyah arkaplan

createCanvas(500,500); 

​

let spectrum = fft.analyze();

​

// 3D görselleştirme (Plane)

push();

rotateX(PI / 3);

translate(-width / 2, -height / 2, 0);

​

let cols = 50; // Sütun sayısı

let rows = 50; // Satır sayısı

let spacing = 15; // Hücreler arasındaki mesafe

​

for (let x = 0; x < cols; x++) {

  beginShape(TRIANGLE_STRIP); // Plane'i üçgen şeritler halinde oluştur

  for (let y = 0; y < rows; y++) {

    let index = floor(map(y, 0, rows, 0, spectrum.length));

    let zHeight = map(spectrum[index], 0, 255, -100, 300); // Frekans tepkisi

​

    // Frekanslara göre renk geçişleri

    let r = map(spectrum[index], 0, 255, 50, 255);

    let g = map(x, 0, cols, 50, 200);

    let b = map(y, 0, rows, 50, 255);

​

    fill(r, g, b);

    stroke(0);

​

    let xpos = x * spacing;

    let ypos = y * spacing;

​

    vertex(xpos, ypos, zHeight); // Hücre köşeleri

    vertex(xpos, ypos + spacing, map(spectrum[index + 10] || 0, 0, 255, -100, 300)); // Bir sonraki hücre köşesi

  }

  endShape();

}

pop();

​

// Ses seviyesi kontrolü

mySound.setVolume(volumeSlider.value());

​

// Şarkı ilerlemesini güncelle

let progress = mySound.currentTime() / mySound.duration();

progressBar.value(progress); // İlerleme çubuğunu güncelle

​

// Zaman metinlerini güncelle

updateTimeText();

}

​

// Müzik çalma/duraklatma fonksiyonu

function toggleMusic() {

if (!isPlaying) {

  mySound.loop(); // Müzik çalmaya başlar

  playButton.html('⏸'); // Pause simgesine geçiş

} else {

  mySound.pause(); // Müzik durur

  playButton.html('▶'); // Play simgesine geçiş

}

isPlaying = !isPlaying;

}

​

// İlerleme çubuğu değeri değiştiğinde müzik pozisyonunu güncelleyen fonksiyon

function updateMusicPosition() {

if (mySound.isLoaded()) {

  let duration = mySound.duration();

  let newPosition = progressBar.value() * duration; // Yeni pozisyonu hesapla

  mySound.jump(newPosition); // Şarkının pozisyonunu güncelle

}

}

​

// Zaman metinlerini güncelleyen fonksiyon

function updateTimeText() {

let currentTime = mySound.currentTime(); // Geçen zaman

let duration = mySound.duration(); // Toplam süre

​

// Geçen zaman

let elapsedMinutes = floor(currentTime / 60);

let elapsedSeconds = floor(currentTime % 60);

elapsedTimeText.html(nf(elapsedMinutes, 2) + ':' + nf(elapsedSeconds, 2));

​

// Kalan zaman

let remainingTime = duration - currentTime;

let remainingMinutes = floor(remainingTime / 60);

let remainingSeconds = floor(remainingTime % 60);

durationTimeText.html('-' + nf(remainingMinutes, 2) + ':' + nf(remainingSeconds, 2));

}

​

​

​

​

​

​

​

​

​