music-score/src/view/fingering/fingering-config.ts

import { CSSProperties } from "vue";
import relationships from "./fingering-relationships";

export type ITypeFingering = {
  json: any;
  relationship: any;
  height?: number | string;
  width?: number | string;
  maxWidth?: number;
  styles?: CSSProperties;
} | null;
export type IFingering = {
  name?: IVocals;
  direction?: "vertical" | "transverse";
  width?: string;
  height?: string;
  /* 横向乐器（transverse） 在功能按钮显示的时候会缩放偏移 */
  scaleData?: {
    scale: string
    offset: string
  }
  /** 禁用替指 */
  disabledFinger?: boolean;
  /** 横竖屏 0:横屏 1: 竖屏 */
  orientation?: number;
  code?: string;
  /** 是否有替指 */
  hasTizhi?: boolean;
  /** 乐器code匹配的id */
  id?: number;
};

type ITypeContent = {
  [key: string | number]: IFingering;
};

export type IVocals =
  | "flute"
  | "clarinet"
  | "saxophone"
  | "trumpet"
  | "horn"
  | "trombone"
  | "up-bass-horn"
  | "small-drum"
  | "tuba"
  | "piccolo"
  | "piccolo1"
  | "piccolo2"
  | "hulusi-flute"
  | "hulusi-flute1"
  | "hulusi-flute2"
  | "pan-flute"
  | "pan-flute1"
  | "pan-flute2"
  | "pan-flute3"
  | "pan-flute4"
  | "ocarina"
  | "ocarina1"
  | "ocarina2"
  | "melodica"
  | "melodica1"
  | "baroque-recorder"
  | "baroque-recorder1"
  | "baroque-recorder2"
  | "whistling"
  | "whistling1"
  | "whistling2";

/** 映射声部ID */
export const mappingVoicePart = (id: number | string, soruce: "GYM" | "COLEXIU" | "ORCHESTRA" | "INSTRUMENT" | "ENSEMBLE"): number => {
  if (soruce === "GYM") {
    return Number(id);
  } else if (soruce === "COLEXIU") {
    const subject: { [_key: string | number]: number } = {
      Flute: 2,
      Clarinet: 4,
      Trombone: 14,
      Tuba: 17,
      Trumpet: 12,
      Horn: 13,
      AltoSaxophone: 6,
      TenorSaxophone: 6,
      Saxophone: 6,
      UpBassHorn: 15,
      Melodica: 137,
      HulusiFlute: 136,
      PanFlute: 135,
      Ocarina: 134,
      Recorder: 120,
      Ukulele: 130,
      Mouthorgan: 140,
      Piano: 150,
    };
    return subject[id];
  } else if (soruce === "ORCHESTRA") {
    const subject: { [_key: string | number]: number } = {
      1: 23,
      2: 2,
      3: 5,
      4: 4,
      5: 12,
      6: 14,
      7: 13,
      8: 15,
      9: 17,
    };
    return subject[id];
  } else if (soruce === "INSTRUMENT") {
    let code = id;
    if (typeof code === "string") {
      code = code.toLocaleLowerCase().replace(/ /g, "");
    }
    const subject: { [_key: string | number]: any } = {
      flute: 2,
      clarinet: 4,
      trombone: 14,
      tuba: 17,
      trumpet: 12,
      horn: 13,
      altosaxophone: 6,
      tenorsaxophone: 6,
      saxophone: 6,
      upbasshorn: 15,
      melodica: 137,
      hulusiFlute: 136,
      panflute: 135,
      recorder: 120,
      ukulele: 130,
      mouthorgan: 140,
      piano: 150,
      baroquerecorder: "baroque-recorder",
      4: "piccolo",
      3: "hulusi-flute",
      1: "pan-flute",
      2: "ocarina",
      5: "melodica",
      23: 2,
      24: 6,
      25: 4,
      26: 12,
      27: 14,
      28: 13,
      29: 15,
      30: 17,
      tenorrecorder: "piccolo",
      woodwind: "hulusi-flute",
      panpipes: "pan-flute",
      ocarina: "ocarina", // 陶笛
      whistling: "whistling", // 高音陶笛
      nai: "melodica",
      15: "baroque-recorder",
      16: "baroque-recorder",
    };
    return subject[code] || 0;
  } else if (soruce === "ENSEMBLE") {
    let code = id;
    const subject: { [_key: string | number]: any } = {
      Piccolo: "piccolo",
      Flute: 2,
      "Flute 1": 2,
      "Flute 2": 2,
      Oboe: 1,
      "Clarinet in Bb 1": 4,
      "Clarinet in Bb 2": 4,
      "Alto Clarinet in Eb": 4,
      "Bass Clarinet in Bb": 4,
      Bassoon: 1,
      "Alto Saxophone": 5,
      "Tenor Saxophone": 5,
      "Baritone Saxophone": 5,
      "Trumpet in Bb 1": 12,
      "Trumpet in Bb 2": 12,
      "Horn in F": 13,
      "Horn in F 1": 13,
      "Horn in F 2": 13,
      "Trombone 1": 14,
      "Trombone 2": 14,
      "Trombone 3": 14,
      Euphonium: 15,
      Tuba: 17,
      Chimes: 1,
      Bells: 1,
      Xylophone: 1,
      "Snare Drum": 1,
      "Bass Drum": 1,
      Triangle: 1,
      "Suspended Cymbal": 1,
      "Crash Cymbals": 1,
      "Concert Toms": 1,
      Timpani: 1,
      flute: 2,
      oboe: 4,
      clarinet: 4,
      trombone: 14,
      tuba: 17,
      trumpet: 12,
      horn: 13,
      altosaxophone: 6,
      tenorsaxophone: 6,
      saxophone: 6,
      upbasshorn: 15,
      melodica: 137,
      hulusiFlute: 136,
      panflute: 135,
      recorder: 120,
      ukulele: 130,
      mouthorgan: 140,
      piano: 150,
      4: "piccolo",
      3: "hulusi-flute",
      1: "pan-flute",
      2: "ocarina",
      5: "melodica",
      26: 12,
      tenorrecorder: "piccolo",
      woodwind: "hulusi-flute",
      panpipes: "pan-flute",
      ocarina: "ocarina",
      nai: "melodica",
      BaroqueRecorder: "baroque-recorder",
    };
    let _track;
    if (typeof code === "string") {
      for (let sKey in subject) {
        if (sKey === code) {
          _track = subject[sKey];
          break;
        }
      }
    } else {
      _track = subject.code;
    }
    return _track;
  }
  return 0;
};

/** 映射声部指法，单曲根据声部codeId，合奏曲根据分轨track  */
export const matchVoicePart = (id: number | string, type: "SINGLE" | "CONCERT"): number => {
  if (type === "SINGLE") {
    const subject: { [_key: string | number]: any } = {
      33: "pan-flute",
      34: "ocarina",
      35: "hulusi-flute",
      37: "piccolo",
      36: "melodica",
      38: "baroque-recorder",
      39: "whistling",
      1: 2,
      5: 5,
      3: 4,
      11: 12,
      13: 14,
      12: 13,
      14: 15,
      16: 17,
    };
    return subject[id];
  } else {
    let code = id;
    const subject: { [_key: string | number]: any } = {
      Piccolo: "piccolo",
      Flute: 2,
      "Flute 1": 2,
      "Flute 2": 2,
      Oboe: 1,
      "Clarinet in Bb": 4,
      "Clarinet in Bb 1": 4,
      "Clarinet in Bb 2": 4,
      "Alto Clarinet in Eb": 4,
      "Bass Clarinet in Bb": 4,
      Bassoon: 1,
      "Alto Saxophone": 5,
      "Tenor Saxophone": 5,
      "Baritone Saxophone": 5,
      "Trumpet in Bb 1": 12,
      "Trumpet in Bb 2": 12,
      "Horn in F": 13,
      "Horn in F 1": 13,
      "Horn in F 2": 13,
      "Trombone 1": 14,
      "Trombone 2": 14,
      "Trombone 3": 14,
      Euphonium: 15,
      Tuba: 17,
      Chimes: 1,
      Bells: 1,
      Xylophone: 1,
      "Snare Drum": 1,
      "Bass Drum": 1,
      Triangle: 1,
      "Suspended Cymbal": 1,
      "Crash Cymbals": 1,
      "Concert Toms": 1,
      Timpani: 1,
      flute: 2,
      oboe: 4,
      clarinet: 4,
      trombone: 14,
      tuba: 17,
      trumpet: 12,
      horn: 13,
      altosaxophone: 6,
      tenorsaxophone: 6,
      saxophone: 6,
      upbasshorn: 15,
      melodica: 137,
      hulusiFlute: 136,
      panflute: 135,
      recorder: 120,
      ukulele: 130,
      mouthorgan: 140,
      piano: 150,
      4: "piccolo",
      3: "hulusi-flute",
      1: "pan-flute",
      2: "ocarina",
      5: "melodica",
      26: 12,
      tenorrecorder: "piccolo",
      woodwind: "hulusi-flute",
      panpipes: "pan-flute",
      ocarina: "ocarina",
      whistling: "whistling",
      nai: "melodica",
      BaroqueRecorder: "baroque-recorder",
      "Drum Set": 24,
      Marimba: 26,
      Vibraphone: 27,
      "Tubular Bells": 30,
      Mallets: 32,
    };
    let _track;
    if (typeof code === "string") {
      code = code.toLocaleLowerCase().replace(/ /g, "");
      for (let sKey in subject) {
        let pitchKey = sKey;
        if (typeof sKey === "string") pitchKey = pitchKey.toLocaleLowerCase().replace(/ /g, "");
        if (pitchKey === code) {
          _track = subject[sKey];
          break;
        }
      }
    } else {
      _track = subject.code;
    }
    return _track;
  }
  return 0;
};

/** 声部的指法配置信息 */
export const subjectFingering = (subjectId: number | string): IFingering => {
  switch (subjectId) {
    case 2: // 长笛
      return {
        name: "flute",
        direction: "transverse",
        height: "1.6rem",
        scaleData: {
          scale: "0.8",
          offset: "3.64rem"
        },
        hasTizhi: true,
        id: 1,
      };
    case 4: // 单簧管
      return {
        name: "clarinet",
        direction: "vertical",
        width: "3rem",
        hasTizhi: true,
        id: 3,
      };
    case 5: // 萨克斯
    case 6: // 中音萨克斯
      return {
        name: "saxophone",
        direction: "vertical",
        width: "4.34rem",
        hasTizhi: true,
        id: 5,
      };
    case 12: // 小号
      return {
        name: "trumpet",
        direction: "transverse",
        height: "1.6rem",
        scaleData: {
          scale: "0.8",
          offset: "3.64rem"
        },
        hasTizhi: false,
        id: 11,
      };
    case 13: // 圆号
      return {
        name: "horn",
        direction: "vertical",
        width: "4.98rem",
        hasTizhi: false,
        id: 12,
      };
    case 14: // 长号
      return {
        name: "trombone",
        direction: "transverse",
        height: "1.6rem",
        scaleData: {
          scale: "0.8",
          offset: "3.64rem"
        },
        hasTizhi: false,
        id: 13,
      };
    case 15: // 上低音号
      return {
        name: "up-bass-horn",
        direction: "vertical",
        width: "4.34rem",
        hasTizhi: false,
        id: 14,
      };
    case 17: // 大号
      return {
        name: "tuba",
        direction: "vertical",
        width: "4.34rem",
        hasTizhi: false,
        id: 16,
      };
    case 120: // 短笛
      return {
        name: "piccolo",
        direction: "vertical",
        width: "3rem",
        orientation: 0,
        hasTizhi: true,
        id: 2,
      };
    case "piccolo": // 德式竖笛
      return {
        name: "piccolo",
        direction: "vertical",
        width: "3rem",
        orientation: 0,
        code: "竖笛",
        hasTizhi: true,
        id: 37,
      };
    case "hulusi-flute": // 葫芦丝
      return {
        name: "hulusi-flute",
        direction: "vertical",
        width: "3rem",
        orientation: 0,
        code: "葫芦丝",
        hasTizhi: false,
        id: 35,
      };
    case "pan-flute": // 排箫
      return {
        name: "pan-flute",
        direction: "transverse",
        height: "2rem",
        scaleData: {
          scale: "0.8",
          offset: "3.64rem"
        },
        disabledFinger: true,
        orientation: 0,
        code: "排箫",
        hasTizhi: false,
        id: 33,
      };
    case "ocarina": // 陶笛
      return {
        name: "ocarina",
        direction: "vertical",
        width: "3rem",
        disabledFinger: true,
        orientation: 0,
        code: "陶笛",
        hasTizhi: false,
        id: 34,
      };
    case "whistling": // 高音陶笛
      return {
        name: "whistling",
        direction: "vertical",
        width: "3rem",
        disabledFinger: true,
        orientation: 0,
        code: "陶笛",
        hasTizhi: false,
        id: 39,
      };
    case "melodica": // 口风琴
      return {
        name: "melodica",
        direction: "transverse",
        height: "2rem",
        scaleData: {
          scale: "0.8",
          offset: "3.64rem"
        },
        orientation: 0,
        code: "口风琴",
        hasTizhi: false,
        id: 36,
      };
    case "baroque-recorder": // 英式竖笛
      return {
        name: "baroque-recorder",
        direction: "vertical",
        width: "3rem",
        orientation: 0,
        code: "竖笛",
        hasTizhi: true,
        id: 38,
      };
    default:
      return typeof subjectId === "number" ? { id: subjectId } : {};
  }
};

export const getFingeringConfig = async (type: IVocals | undefined, source?: string): Promise<ITypeFingering> => {
  switch (type) {
    case "flute":
      const flute = await import(`./fingering-img/flute/index.json`);
      return {
        json: flute.default,
        relationship: relationships.flute,
        height: "60px",
        styles: {},
      };
    case "clarinet":
      const clarinet = await import(`./fingering-img/clarinet/index.json`);
      return {
        json: clarinet.default,
        relationship: relationships.clarinet,
        styles: {
          marginLeft: ".4rem",
          marginRight: ".7rem",
        },
      };
    case "trumpet":
      const trumpet = await import(`./fingering-img/trumpet/index.json`);
      return {
        json: trumpet.default,
        relationship: relationships.trumpet,
        // maxWidth: 150,
      };
    case "horn":
      const horn = await import(`./fingering-img/horn/index.json`);
      return {
        json: horn.default,
        relationship: relationships.horn,
        height: "212px",
        width: "252px",
      };
    case "tuba":
      const tuba = await import(`./fingering-img/tuba/index.json`);
      return {
        json: tuba.default,
        relationship: relationships.tuba,
      };
    case "piccolo":
      const piccolo = await import(`./fingering-img/piccolo/index.json`);
      return {
        json: piccolo.default,
        relationship: relationships.piccolo,
      };
    case "piccolo1":
      const piccolo1 = await import(`./fingering-img/piccolo1/index.json`);
      return {
        json: piccolo1.default,
        relationship: relationships.piccolo,
      };
    case "piccolo2":
      const piccolo2 = await import(`./fingering-img/piccolo2/index.json`);
      return {
        json: piccolo2.default,
        relationship: relationships.piccolo,
      };
    case "up-bass-horn":
      const upBassHorn = await import(`./fingering-img/up-bass-horn/index.json`);
      return {
        json: upBassHorn.default,
        relationship: relationships["up-bass-horn"],
      };
    case "trombone":
      const trombone = await import(`./fingering-img/trombone/index.json`);
      return {
        json: trombone.default,
        relationship: relationships["trombone"],
      };
    case "saxophone":
      const saxophone = await import(`./fingering-img/saxophone/index.json`);
      return {
        json: saxophone.default,
        relationship: relationships["saxophone"],
        styles: {
          marginLeft: ".2rem",
          marginRight: ".3rem",
        },
      };
    case "small-drum":
      const smallDrum = await import(`./fingering-img/small-drum/index.json`);
      return {
        json: smallDrum.default,
        relationship: relationships["up-bass-horn"],
        width: "180px",
      };
    case "hulusi-flute":
      const hulusi = source === 'musicDetail' ? await import(`./fingering-img/hulusi-flute0/index.json`) : await import(`./fingering-img/hulusi-flute/index.json`);
      return {
        json: hulusi.default,
        relationship: relationships.hulusi,
        // width: '180px',
        styles: {
          marginLeft: ".6rem",
          marginRight: ".7rem",
        },
      };
    case "hulusi-flute1":
      const hulusi1 = await import(`./fingering-img/hulusi-flute1/index.json`);
      return {
        json: hulusi1.default,
        relationship: relationships.hulusi,
        // width: '180px',
        styles: {
          marginLeft: ".6rem",
          marginRight: ".7rem",
        },
      };
    case "hulusi-flute2":
      const hulusi2 = await import(`./fingering-img/hulusi-flute2/index.json`);
      return {
        json: hulusi2.default,
        relationship: relationships.hulusi,
        // width: '180px',
        styles: {
          marginLeft: ".6rem",
          marginRight: ".7rem",
        },
      };
    case "pan-flute":
      const pan = await import(`./fingering-img/pan-flute/index.json`);
      return {
        json: pan.default,
        relationship: relationships.pan,
      };
    case "pan-flute1":
      const pan1 = await import(`./fingering-img/pan-flute1/index.json`);
      return {
        json: pan1.default,
        relationship: relationships.pan,
      };
    case "pan-flute2":
      const pan2 = await import(`./fingering-img/pan-flute2/index.json`);
      return {
        json: pan2.default,
        relationship: relationships.pan,
      };
    case "pan-flute3":
      const pan3 = await import(`./fingering-img/pan-flute3/index.json`);
      return {
        json: pan3.default,
        relationship: relationships.pan,
      };
    case "ocarina":
      const ocarina = await import(`./fingering-img/ocarina/index.json`);
      return {
        json: ocarina.default,
        relationship: relationships.ocarina,
        width: "180px",
        styles: {
          marginTop: "auto",
        },
      };
    case "ocarina1":
      const ocarina1 = await import(`./fingering-img/ocarina1/index.json`);
      return {
        json: ocarina1.default,
        relationship: relationships.ocarina,
        width: "180px",
        styles: {
          marginTop: "auto",
        },
      };
    case "ocarina2":
      const ocarina2 = await import(`./fingering-img/ocarina2/index.json`);
      return {
        json: ocarina2.default,
        relationship: relationships.ocarina,
        width: "180px",
        styles: {
          marginTop: "auto",
        },
      };
    case "whistling":
      const whistling = await import(`./fingering-img/whistling/index.json`);
      return {
        json: whistling.default,
        relationship: relationships.ocarina,
        width: "180px",
        styles: {
          marginTop: "auto",
        },
      };
    case "whistling1":
      const whistling1 = await import(`./fingering-img/whistling1/index.json`);
      return {
        json: whistling1.default,
        relationship: relationships.ocarina,
        width: "180px",
        styles: {
          marginTop: "auto",
        },
      };
    case "whistling2":
      const whistling2 = await import(`./fingering-img/whistling2/index.json`);
      return {
        json: whistling2.default,
        relationship: relationships.ocarina,
        width: "180px",
        styles: {
          marginTop: "auto",
        },
      };
    case "melodica":
      const melodica = await import(`./fingering-img/melodica/index.json`);
      return {
        json: melodica.default,
        relationship: relationships.melodica,
        height: "80px",
        styles: {
          marginTop: "auto",
        },
      };
    case "melodica1":
      const melodica1 = await import(`./fingering-img/melodica1/index.json`);
      return {
        json: melodica1.default,
        relationship: relationships.melodica,
        height: "80px",
        styles: {
          marginTop: "auto",
        },
      };
    case "baroque-recorder":
      const baroqueRecorder = await import(`./fingering-img/baroque-recorder/index.json`);
      return {
        json: baroqueRecorder.default,
        relationship: relationships.baroqueRecorder,
      };
    case "baroque-recorder1":
      const baroqueRecorder1 = await import(`./fingering-img/baroque-recorder1/index.json`);
      return {
        json: baroqueRecorder1.default,
        relationship: relationships.baroqueRecorder,
      };
    case "baroque-recorder2":
      const baroqueRecorder2 = await import(`./fingering-img/baroque-recorder2/index.json`);
      return {
        json: baroqueRecorder2.default,
        relationship: relationships.baroqueRecorder,
      };
    default:
      return null;
  }
};