{"ast":null,"code":"export const adjustCanvasScale = (canvas, originalCanvasWidth = 1000) => {\n  const screenWidth = window.innerWidth;\n  const scale = screenWidth * 0.6 / originalCanvasWidth;\n  if (canvas) {\n    canvas.style.transform = `scale(${scale})`;\n    canvas.style.transformOrigin = \"top left\";\n  }\n};\nexport function map(value, in_min, in_max, out_min, out_max) {\n  if (value === null) {\n    value = 0;\n  }\n  return (value - in_min) * (out_max - out_min) / (in_max - in_min) + out_min;\n}\nexport function frequencyToNote(frequency, fxmin, fxmax) {\n  const A4 = 440;\n  let semitonesAboveC0 = 12 * (Math.log(frequency / A4) / Math.log(2));\n  semitonesAboveC0 += 9; // A4 is the 9th semitone starting from C0\n  semitonesAboveC0 += 12 * 4; // A4 is the A in the 4th octave\n\n  if (frequency < fxmin || frequency > fxmax) return \"\"; // If the frequency is out of range, the note is not displayed\n\n  const octave = Math.floor(semitonesAboveC0 / 12);\n  const noteIndex = Math.floor(semitonesAboveC0 % 12);\n  const notes = [\"C\", \"C#\", \"D\", \"D#\", \"E\", \"F\", \"F#\", \"G\", \"G#\", \"A\", \"A#\", \"B\"];\n  const note = notes[noteIndex];\n  return note + octave;\n}\nexport const drawBackground = (canvasRef, fxmax, fxmin, showNotes) => {\n  const canvas = canvasRef.current;\n  const margin = 10;\n  function adjustCanvasScale() {\n    // Get the width of the browser window\n    const screenWidth = window.innerWidth;\n    // Assume the original width of the canvas is 1000px\n    const originalCanvasWidth = 1000;\n    // Calculate the zoom ratio when occupying 80% of the window width\n    const scale = screenWidth * 0.6 / originalCanvasWidth;\n    // Apply scaling\n    const canvas = document.querySelector(\"canvas\");\n    if (canvas) {\n      canvas.style.transform = `scale(${scale})`;\n      canvas.style.transformOrigin = \"top left\";\n    }\n  }\n  if (canvas) {\n    const ctx = canvas.getContext(\"2d\");\n    if (ctx) {\n      var gridSpacing = 50;\n      ctx.strokeStyle = \"#e0e0e0\";\n      ctx.lineWidth = 2;\n      ctx.setLineDash([5, 5]);\n      for (var y = gridSpacing; y < canvas.height; y += gridSpacing) {\n        ctx.beginPath();\n        ctx.moveTo(0, y);\n        ctx.lineTo(canvas.width, y);\n        ctx.stroke();\n      }\n\n      // // Draw vertical line in the middle\n      // var middleX = canvas.width / 2; // Calculate the middle x coordinate\n      // ctx.beginPath();\n      // ctx.moveTo(middleX, 0); // Start at the top middle of the canvas\n      // ctx.lineTo(middleX, canvas.height); // Draw to the bottom middle of the canvas\n      // ctx.stroke(); // Render the line\n\n      // ctx.fillStyle = \"#000\";\n      // ctx.font = \"12px Arial\";\n      // for (var y = 0; y <= canvas.height; y += gridSpacing) {\n      //   // Map current y value to frequency range\n      //   var frequency = map(y, 0, canvas.height, fxmax, fxmin);\n      //   // Determines whether to display frequencies or notes based on the current state\n      //   var label = showNotes\n      //     ? frequencyToNote(frequency, fxmin, fxmax)\n      //     :(Math.round(frequency / 10) * 10).toString();\n      //   // Make sure the label is not empty\n      //   if (label) {\n      //     ctx.fillText(label, 5, y+12); \n      //   }\n      // }\n      // var y = canvas.height;\n      // var frequency = map(y, 0, canvas.height, fxmax, fxmin);\n      //   // Determines whether to display frequencies or notes based on the current state\n      //   var label = showNotes\n      //     ? frequencyToNote(frequency, fxmin, fxmax)\n      //     // : frequency.toFixed(2);\n      //     :(Math.round(frequency / 10) * 10).toString();\n      //   // Make sure the label is not empty\n      //   if (label) {\n      //     ctx.fillText(label, 5, y);\n      //   }\n      adjustCanvasScale();\n      window.addEventListener(\"resize\", adjustCanvasScale);\n    }\n  }\n};\nexport function generateNotesAndFrequencies(fxmin, fxmax, canvasHeight) {\n  const notes = [];\n  const frequencies = [];\n  const numValues = 9;\n  for (let i = 0; i < numValues; i++) {\n    const frequency = Math.round(fxmax - i * (fxmax - fxmin) / (numValues - 1));\n    const note = frequencyToNote(frequency, fxmin, fxmax);\n    var frequency_10 = Math.round(frequency / 10) * 10;\n    frequencies.push(frequency_10.toString());\n    notes.push(note);\n  }\n  return {\n    notes,\n    frequencies\n  };\n}","map":{"version":3,"names":["adjustCanvasScale","canvas","originalCanvasWidth","screenWidth","window","innerWidth","scale","style","transform","transformOrigin","map","value","in_min","in_max","out_min","out_max","frequencyToNote","frequency","fxmin","fxmax","A4","semitonesAboveC0","Math","log","octave","floor","noteIndex","notes","note","drawBackground","canvasRef","showNotes","current","margin","document","querySelector","ctx","getContext","gridSpacing","strokeStyle","lineWidth","setLineDash","y","height","beginPath","moveTo","lineTo","width","stroke","addEventListener","generateNotesAndFrequencies","canvasHeight","frequencies","numValues","i","round","frequency_10","push","toString"],"sources":["/var/www/gavt/src/function/canvasDefault.ts"],"sourcesContent":["export const adjustCanvasScale = (\n  canvas: HTMLCanvasElement,\n  originalCanvasWidth: number = 1000\n) => {\n  const screenWidth = window.innerWidth;\n  const scale = (screenWidth * 0.6) / originalCanvasWidth;\n  if (canvas) {\n    canvas.style.transform = `scale(${scale})`;\n    canvas.style.transformOrigin = \"top left\";\n  }\n};\nexport function map(\n  value: number | null,\n  in_min: number,\n  in_max: number,\n  out_min: number,\n  out_max: number\n): number {\n  if (value === null) {\n    value = 0;\n  }\n  return ((value - in_min) * (out_max - out_min)) / (in_max - in_min) + out_min;\n}\nexport function frequencyToNote(\n  frequency: number,\n  fxmin: number,\n  fxmax: number\n): string {\n  const A4 = 440;\n  let semitonesAboveC0 = 12 * (Math.log(frequency / A4) / Math.log(2));\n  semitonesAboveC0 += 9; // A4 is the 9th semitone starting from C0\n  semitonesAboveC0 += 12 * 4; // A4 is the A in the 4th octave\n\n  if (frequency < fxmin || frequency > fxmax) return \"\"; // If the frequency is out of range, the note is not displayed\n\n  const octave = Math.floor(semitonesAboveC0 / 12);\n  const noteIndex = Math.floor(semitonesAboveC0 % 12);\n  const notes = [\n    \"C\",\n    \"C#\",\n    \"D\",\n    \"D#\",\n    \"E\",\n    \"F\",\n    \"F#\",\n    \"G\",\n    \"G#\",\n    \"A\",\n    \"A#\",\n    \"B\",\n  ];\n  const note = notes[noteIndex];\n\n  return note + octave;\n}\n\nexport const drawBackground = (\n  canvasRef: React.RefObject<HTMLCanvasElement>,\n  fxmax: number,\n  fxmin: number,\n  showNotes: boolean\n) => {\n  const canvas = canvasRef.current;\n  const margin = 10;\n  function adjustCanvasScale() {\n    // Get the width of the browser window\n    const screenWidth = window.innerWidth;\n    // Assume the original width of the canvas is 1000px\n    const originalCanvasWidth = 1000;\n    // Calculate the zoom ratio when occupying 80% of the window width\n    const scale = (screenWidth * 0.6) / originalCanvasWidth;\n    // Apply scaling\n    const canvas = document.querySelector(\"canvas\");\n    if (canvas) {\n      canvas.style.transform = `scale(${scale})`;\n      canvas.style.transformOrigin = \"top left\";\n    }\n  }\n  if (canvas) {\n    const ctx = canvas.getContext(\"2d\");\n    if (ctx) {\n      var gridSpacing = 50;\n      ctx.strokeStyle = \"#e0e0e0\";\n      ctx.lineWidth = 2;  \n      ctx.setLineDash([5, 5]); \n      \n      for (var y = gridSpacing; y < canvas.height; y += gridSpacing) {\n          ctx.beginPath();\n          ctx.moveTo(0, y);\n          ctx.lineTo(canvas.width, y);\n          ctx.stroke();\n      }\n\n      // // Draw vertical line in the middle\n      // var middleX = canvas.width / 2; // Calculate the middle x coordinate\n      // ctx.beginPath();\n      // ctx.moveTo(middleX, 0); // Start at the top middle of the canvas\n      // ctx.lineTo(middleX, canvas.height); // Draw to the bottom middle of the canvas\n      // ctx.stroke(); // Render the line\n\n      // ctx.fillStyle = \"#000\";\n      // ctx.font = \"12px Arial\";\n      // for (var y = 0; y <= canvas.height; y += gridSpacing) {\n      //   // Map current y value to frequency range\n      //   var frequency = map(y, 0, canvas.height, fxmax, fxmin);\n      //   // Determines whether to display frequencies or notes based on the current state\n      //   var label = showNotes\n      //     ? frequencyToNote(frequency, fxmin, fxmax)\n      //     :(Math.round(frequency / 10) * 10).toString();\n      //   // Make sure the label is not empty\n      //   if (label) {\n      //     ctx.fillText(label, 5, y+12); \n      //   }\n      // }\n      // var y = canvas.height;\n      // var frequency = map(y, 0, canvas.height, fxmax, fxmin);\n      //   // Determines whether to display frequencies or notes based on the current state\n      //   var label = showNotes\n      //     ? frequencyToNote(frequency, fxmin, fxmax)\n      //     // : frequency.toFixed(2);\n      //     :(Math.round(frequency / 10) * 10).toString();\n      //   // Make sure the label is not empty\n      //   if (label) {\n      //     ctx.fillText(label, 5, y);\n      //   }\n      adjustCanvasScale();\n      window.addEventListener(\"resize\", adjustCanvasScale);\n    }\n  }\n};\n\n\nexport function generateNotesAndFrequencies(\n  fxmin: number,\n  fxmax: number,\n  canvasHeight: number\n): { notes: string[]; frequencies: string[] } {\n  const notes: string[] = [];\n  const frequencies: string[] = [];\n  const numValues = 9;\n\n  for (let i = 0; i < numValues; i++) {\n    const frequency = Math.round(\n      fxmax - (i * (fxmax - fxmin)) / (numValues - 1)\n    );\n    const note = frequencyToNote(frequency, fxmin, fxmax);\n    var frequency_10 = Math.round(frequency / 10) * 10;\n    frequencies.push(frequency_10.toString());\n    notes.push(note);\n  }\n\n  return { notes, frequencies };\n}"],"mappings":"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"},"metadata":{},"sourceType":"module","externalDependencies":[]}