{"version":3,"file":"ChordSheet-B-bhCmbA.js","sources":["../../Vue/src/components/SheetMusic/Toolbar/ToolbarSelectChartType.vue","../../Vue/src/functions/chordsheetCss.ts","../../Vue/src/components/SheetMusic/MusicSheetChords.vue","../../Vue/src/components/SheetMusic/MusicSheetChordsPlaceholder.vue","../../Vue/src/pages/ChordSheet.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { SelectOption } from \"@/models/frontend-only/SelectOption\";\r\n\r\nconst props = defineProps<{\r\n  modelValue?: string;\r\n}>();\r\n\r\nconst emits = defineEmits<{\r\n  (e: \"update:modelValue\", value: string): void;\r\n}>();\r\n\r\nconst { t } = useI18n();\r\n\r\nconst value = computed({\r\n  get: () => {\r\n    return props.modelValue || \"\";\r\n  },\r\n  set: (newValue: string) => {\r\n    emits(\"update:modelValue\", newValue);\r\n  },\r\n});\r\n\r\nconst options = computed<SelectOption[]>(() => [\r\n  {\r\n    label: t(\"SV.LIT_Standard\"),\r\n    value: \"Standard\",\r\n  },\r\n  {\r\n    label: t(\"SV.LIT_Number\"),\r\n    value: \"Number\",\r\n  },\r\n  {\r\n    label: t(\"SV.LIT_DoReMiFixed\"),\r\n    value: \"DoReMiFixed\",\r\n  },\r\n  {\r\n    label: t(\"SV.LIT_DoReMiMovable\"),\r\n    value: \"DoReMiMovable\",\r\n  },\r\n]);\r\n</script>\r\n\r\n<template>\r\n  <FormSelect\r\n    v-model=\"value\"\r\n    name=\"ChartType\"\r\n    id=\"ChordSheetChartTypeSelectInput\"\r\n    :label=\"$t('SV.LIT_ChartType')\"\r\n    :options=\"options\"\r\n    class=\"mx-2 my-0 hidden xl:block\"\r\n    small\r\n  />\r\n  <ToolbarButtonDropdown\r\n    :label=\"$t('SV.LIT_ChartType')\"\r\n    icon=\"fa-kit fa-ccli-chart-type\"\r\n    class=\"xl:hidden\"\r\n  >\r\n    <ToolbarButtonDropdownHeader>{{\r\n      $t(\"SV.LIT_ChartType\")\r\n    }}</ToolbarButtonDropdownHeader>\r\n    <ToolbarButtonDropdownItem\r\n      v-for=\"o of options\"\r\n      :key=\"o.value\"\r\n      @click=\"value = o.value\"\r\n      :active=\"value === o.value\"\r\n    >\r\n      {{ o.label }}\r\n    </ToolbarButtonDropdownItem>\r\n  </ToolbarButtonDropdown>\r\n</template>\r\n\r\n<style scoped lang=\"postcss\"></style>\r\n","import { FontSetting } from \"@/models/FontSetting\";\r\n\r\nexport function getCSSForChordSheet(\r\n  fontSize: string,\r\n  fontSettings: {\r\n    headings: FontSetting;\r\n    directions: FontSetting;\r\n    chords: FontSetting;\r\n    lyrics: FontSetting;\r\n  },\r\n  darkMode: boolean,\r\n  forPDF = false,\r\n) {\r\n  const headingColor = AvailableTextColors.find(\r\n    (c) => c.name === fontSettings.headings.color,\r\n  );\r\n  const chordColor = AvailableTextColors.find(\r\n    (c) => c.name === fontSettings.chords.color,\r\n  );\r\n  const lyricsColor = AvailableTextColors.find(\r\n    (c) => c.name === fontSettings.lyrics.color,\r\n  );\r\n  const directionsColor = AvailableTextColors.find(\r\n    (c) => c.name === fontSettings.directions.color,\r\n  );\r\n\r\n  const headingHighlight = AvailableHighlightColors.find(\r\n    (c) => c.name === fontSettings.headings.highlight,\r\n  );\r\n  const chordHighlight = AvailableHighlightColors.find(\r\n    (c) => c.name === fontSettings.chords.highlight,\r\n  );\r\n  const lyricsHighlight = AvailableHighlightColors.find(\r\n    (c) => c.name === fontSettings.lyrics.highlight,\r\n  );\r\n  const directionsHighlight = AvailableHighlightColors.find(\r\n    (c) => c.name === fontSettings.directions.highlight,\r\n  );\r\n\r\n  const headingsFamily = AvailableFontFamilies.find(\r\n    (f) => f.type === fontSettings.headings.family,\r\n  )?.fontFamilyName;\r\n  const lyricsFamily = AvailableFontFamilies.find(\r\n    (f) => f.type === fontSettings.lyrics.family,\r\n  )?.fontFamilyName;\r\n  const directionsFamily = AvailableFontFamilies.find(\r\n    (f) => f.type === fontSettings.directions.family,\r\n  )?.fontFamilyName;\r\n  const chordsFamily = AvailableFontFamilies.find(\r\n    (f) => f.type === fontSettings.chords.family,\r\n  )?.fontFamilyName;\r\n\r\n  let headingColorCss = headingColor?.light;\r\n  let chordColorCss = chordColor?.light;\r\n  let lyricsColorCss = lyricsColor?.light;\r\n  let directionsColorCss = directionsColor?.light;\r\n\r\n  let headingHighlightCss = headingHighlight?.light;\r\n  let chordHighlightCss = chordHighlight?.light;\r\n  let lyricsHighlightCss = lyricsHighlight?.light;\r\n  let directionsHighlightCss = directionsHighlight?.light;\r\n\r\n  if (darkMode) {\r\n    headingColorCss = headingColor?.dark;\r\n    chordColorCss = chordColor?.dark;\r\n    lyricsColorCss = lyricsColor?.dark;\r\n    directionsColorCss = directionsColor?.dark;\r\n\r\n    headingHighlightCss = headingHighlight?.dark;\r\n    chordHighlightCss = chordHighlight?.dark;\r\n    lyricsHighlightCss = lyricsHighlight?.dark;\r\n    directionsHighlightCss = directionsHighlight?.dark;\r\n  }\r\n\r\n  let importFonts = \"\";\r\n  if (forPDF) {\r\n    const urls = [] as string[];\r\n\r\n    const headingsFont = AvailableFontFamilies.find(\r\n      (f) => f.type === fontSettings.headings.family,\r\n    );\r\n    const lyricsFont = AvailableFontFamilies.find(\r\n      (f) => f.type === fontSettings.lyrics.family,\r\n    );\r\n    const directionsFont = AvailableFontFamilies.find(\r\n      (f) => f.type === fontSettings.directions.family,\r\n    );\r\n    const chordsFont = AvailableFontFamilies.find(\r\n      (f) => f.type === fontSettings.chords.family,\r\n    );\r\n\r\n    if (headingsFont && !urls.includes(headingsFont.url)) {\r\n      urls.push(headingsFont.url);\r\n    }\r\n    if (lyricsFont && !urls.includes(lyricsFont.url)) {\r\n      urls.push(lyricsFont.url);\r\n    }\r\n    if (directionsFont && !urls.includes(directionsFont.url)) {\r\n      urls.push(directionsFont.url);\r\n    }\r\n    if (chordsFont && !urls.includes(chordsFont.url)) {\r\n      urls.push(chordsFont.url);\r\n    }\r\n\r\n    urls.forEach((url) => {\r\n      importFonts += `@import url('${url}');\\n`;\r\n    });\r\n  }\r\n\r\n  const fontSizeString = forPDF\r\n    ? `\r\n          body{\r\n            font-size: ${(parseInt(fontSize) / 16).toFixed(3)}em;\r\n          }\r\n      `\r\n    : \"\";\r\n\r\n  return `<style>\r\n      ${importFonts}\r\n      ${fontSizeString}\r\n\r\n      .cproComment{\r\n        font-size: ${(parseInt(fontSettings.headings.size) / 16).toFixed(\r\n          3,\r\n        )}em !important;\r\n        color:${headingColorCss} !important;\r\n        background-color: ${headingHighlightCss} !important;\r\n        font-family: ${headingsFamily} !important;\r\n      }\r\n      \r\n      .cproSongLine{\r\n        font-size: ${(parseInt(fontSettings.lyrics.size) / 16).toFixed(\r\n          3,\r\n        )}em !important;\r\n        color: ${lyricsColorCss} !important;\r\n        background-color: ${lyricsHighlightCss} !important;\r\n        font-family: ${lyricsFamily} !important;\r\n      }\r\n      .chord{\r\n        font-size: ${(\r\n          parseInt(fontSettings.chords.size) /\r\n          16 /\r\n          (parseInt(fontSettings.lyrics.size) / 16)\r\n        ).toFixed(3)}em !important;\r\n        color: ${chordColorCss} !important;\r\n        line-height: 1em;\r\n        background-color: ${chordHighlightCss} !important;\r\n        font-family: ${chordsFamily} !important;\r\n      }\r\n      .cproDirection{\r\n        font-size: ${(\r\n          parseInt(fontSettings.directions.size) /\r\n          16 /\r\n          (parseInt(fontSettings.lyrics.size) / 16)\r\n        ).toFixed(3)}em !important;\r\n        color: ${directionsColorCss} !important;\r\n        background-color: ${directionsHighlightCss} !important;\r\n        font-family: ${directionsFamily} !important;\r\n      }\r\n      </style>`;\r\n}\r\n","<script setup lang=\"ts\">\r\nimport { FontSetting } from \"@/models/FontSetting\";\r\nimport { LoadStatus } from \"@/models/frontend-only/LoadStatus\";\r\nconst DarkModeChordSheetCSS = `\r\n:root{\r\n color: white;\r\n}\r\na{\r\n  color: white !important;\r\n}\r\n.cproSSLogo, .song-footer img{\r\n  filter: contrast(0%) saturate(0%) invert(100%) brightness(175%);\r\n}\r\n.cproDirection,\r\n.cproSongKey,\r\n.cproSongLine .chordWrapper .chord {\r\n  color: white ;\r\n}\r\n.cproSongBody {\r\n  background-color: transparent !important;\r\n}\r\n.cproSongKeyChangeWrapper{ \r\n  color: white !important;\r\n}\r\n`;\r\n\r\nlet shadowDOM: ShadowRoot | undefined = undefined;\r\nconst dark = useDarkModeStore();\r\n\r\nconst props = defineProps<{\r\n  html?: string;\r\n  fontSize: string;\r\n  fontSettings: {\r\n    headings: FontSetting;\r\n    directions: FontSetting;\r\n    chords: FontSetting;\r\n    lyrics: FontSetting;\r\n  };\r\n}>();\r\n\r\nconst container = ref<HTMLElement>();\r\nconst contentsElement = document.createElement(\"div\");\r\nconst status = ref<LoadStatus>();\r\nlet mounted = false;\r\n//fetch css and directly inject it instead\r\n\r\nonMounted(() => mountShadowDOM());\r\n\r\nasync function mountShadowDOM() {\r\n  status.value = LoadStatus.Loading;\r\n\r\n  if (!container.value) {\r\n    return;\r\n  }\r\n  shadowDOM = container.value.attachShadow({ mode: \"open\" });\r\n  shadowDOM.appendChild(contentsElement);\r\n  await updateShadowDOM();\r\n\r\n  status.value = LoadStatus.Ready;\r\n  mounted = true;\r\n}\r\n\r\nconst beta = useBetaStore();\r\n\r\nconst html = computed(() => {\r\n  let rawHtml = props.html || \"\";\r\n\r\n  if (dark.isDarkModeEnabled) {\r\n    rawHtml = rawHtml + \"<style>\" + DarkModeChordSheetCSS + \"</style>\";\r\n  }\r\n  if (beta.features.chordFontSettings) {\r\n    rawHtml =\r\n      getCSSForChordSheet(\r\n        props.fontSize,\r\n        props.fontSettings,\r\n        dark.isDarkModeEnabled,\r\n      ) + rawHtml;\r\n  }\r\n  return rawHtml;\r\n});\r\n\r\nasync function updateShadowDOM() {\r\n  status.value = LoadStatus.Loading;\r\n  contentsElement.innerHTML = html.value;\r\n  status.value = LoadStatus.Ready;\r\n}\r\n\r\nwatch(\r\n  () => [\r\n    props.html,\r\n    dark.isDarkModeEnabled,\r\n    props.fontSettings,\r\n    beta.features.chordFontSettings,\r\n    props.fontSize,\r\n  ],\r\n  () => {\r\n    if (mounted) {\r\n      updateShadowDOM();\r\n    }\r\n  },\r\n  {\r\n    deep: true,\r\n  },\r\n);\r\n\r\nconst applyFontSize = computed(\r\n  () => (parseInt(props.fontSize) / 16).toFixed(3) + \"em\",\r\n);\r\n</script>\r\n\r\n<template>\r\n  <div id=\"ChordSheetViewerFontScaler\">\r\n    <div\r\n      id=\"ChordSheetViewerContainer\"\r\n      ref=\"container\"\r\n      class=\"sheet-music-chords\"\r\n      :style=\"{ 'font-size': applyFontSize }\"\r\n    >\r\n      <div\r\n        v-if=\"status !== LoadStatus.Ready\"\r\n        class=\"loading-spinner\"\r\n      >\r\n        <FAIcon class=\"fa-light fa-spinner-third fa-spin fa-3x\" />\r\n      </div>\r\n      <div v-if=\"status === LoadStatus.Ready\"></div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<style scoped lang=\"postcss\">\r\n.sheet-music-chords {\r\n  @apply p-5 md:p-10;\r\n}\r\n</style>\r\n<style lang=\"postcss\">\r\n.sheet-music-chords {\r\n  @apply overflow-x-auto;\r\n}\r\n#ChordSheetViewerFontScaler {\r\n  font-size: 0.4rem;\r\n  @media (min-width: 475px) {\r\n    font-size: 0.5rem !important;\r\n  }\r\n\r\n  @media (min-width: 575.98px) {\r\n    font-size: 0.6rem !important;\r\n  }\r\n  @media (min-width: 767.98px) {\r\n    font-size: 0.8rem !important;\r\n  }\r\n  @media (min-width: 875px) {\r\n    font-size: 0.9rem !important;\r\n  }\r\n  @media (min-width: 1024px) {\r\n    font-size: 0.7rem !important;\r\n  }\r\n  @media (min-width: 1199.98px) {\r\n    font-size: 0.8rem !important;\r\n  }\r\n  @media (min-width: 1399.98px) {\r\n    font-size: 1rem !important;\r\n  }\r\n}\r\n</style>\r\n","<script setup lang=\"ts\">\r\nlet shadowDOM: ShadowRoot | undefined = undefined;\r\nconst container = ref<HTMLElement>();\r\nconst contentsElement = document.createElement(\"div\");\r\n\r\nonMounted(() => mountShadowDOM());\r\n\r\nconst html = ref(`<div>\r\n\t<style type=\"text/css\">\r\n\t\t/*@font-face {\r\n    font-family: 'Source Sans Pro';\r\n    src: url('fonts/source-sans-pro-v13-latin-regular.woff2') format('woff2'), url('fonts/source-sans-pro-v13-latin-regular.woff') format('woff'), url('fonts/source-sans-pro-v13-latin-700.woff') format('woff'), url('fonts/source-sans-pro-v13-latin-700.woff2') format('woff2');\r\n}*/\r\n\t\t/*@font-face {\r\n    font-family: 'FiraSans';\r\n    src: url('fonts/FiraSans-Regular.otf') format('opentype');\r\n}*/\r\n\t\t/*@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700&display=swap');*/\r\n\r\n\t\t/* NOTE:\r\n    This file is the source for the CSS used in styling ChordPro to HTML for both Chord Sheet Editor and SongSelect.\r\n    The source comes from a file located in the AWS S3 bucket:  songselect.ccli.com/CSS.\r\n    A version number is tagged onto the end of the file name, such as:\r\n        - ChordSheet_v21.css\r\n\r\n    If you want to test with a local CSS, first make sure this file matches the latest version in the S3 bucket. If not, then update this from the S3 file.\r\n    You then need to modify the web.config ChordSheetCSS key value to the path to this file.\r\n    When you are done making changes, place this file in S3 with a new version number, and modify web.config to point to that new S3 file.\r\n    When adding a file to S3, you must set it to public before the web site can use it.\r\n*/\r\n\r\n\r\n\t\t.cproSongHeader {\r\n\t\t\tbackground-color: #ffffff;\r\n\t\t\tborder: none;\r\n\t\t\tfont-family: Verdana, Arial, Helvetica, sans-serif;\r\n\t\t\t/*font-family: 'Source Sans Pro';*/\r\n\t\t\toverflow: visible;\r\n\t\t\twidth: 100%;\r\n\t\t}\r\n\r\n\t\t.cproSSLogo {\r\n\t\t\tfloat: right;\r\n\t\t\t/*padding-right: .4em;\r\n    width: 130pt;*/\r\n\t\t\twidth: 25%;\r\n\t\t\tmax-width: 130pt;\r\n\t\t}\r\n\r\n\t\t/*.cproTitleAuthors {\r\n    width: 75%;\r\n    display: block;\r\n}*/\r\n\r\n\t\t.cproTitleLine {\r\n\t\t\tline-height: 1.2;\r\n\t\t\tdisplay: block;\r\n\t\t\twidth: 100%;\r\n\t\t\toverflow: visible;\r\n\t\t}\r\n\r\n\t\t.cproTitle {\r\n\t\t\tfont-size: 1.5em;\r\n\t\t\tfont-weight: bold;\r\n\t\t\tdisplay: inline-block;\r\n\t\t\twhite-space: normal;\r\n\t\t\twidth: 75%;\r\n\t\t}\r\n\r\n\t\t.cproSubTitle {\r\n\t\t\tfont-size: .7em;\r\n\t\t\t/*font-weight: bold;*/\r\n\t\t\tdisplay: inline-block;\r\n\t\t\twhite-space: normal;\r\n\t\t\twidth: 85%;\r\n\t\t}\r\n\r\n\t\t.cproAuthorLine {\r\n\t\t\tfont-size: .7em;\r\n\t\t\tdisplay: block;\r\n\t\t\twidth: 100%;\r\n\t\t\toverflow: visible;\r\n\t\t}\r\n\r\n\t\t.cproAuthors {\r\n\t\t\twhite-space: normal;\r\n\t\t\twidth: 73%;\r\n\t\t\tdisplay: inline-block;\r\n\t\t\t/* Add padding inside the span */\r\n\t\t\t-webkit-box-sizing: border-box;\r\n\t\t\t/* Safari/Chrome, other WebKit */\r\n\t\t\t-moz-box-sizing: border-box;\r\n\t\t\t/* Firefox, other Gecko */\r\n\t\t\tbox-sizing: border-box;\r\n\t\t\t/* Opera/IE 8+ */\r\n\t\t\tpadding-right: 15px;\r\n\t\t}\r\n\r\n\t\t.cproAuthor2Line {\r\n\t\t\tfont-size: .7em;\r\n\t\t\tdisplay: block;\r\n\t\t\t/*font-style: italic;*/\r\n\t\t}\r\n\r\n\t\t.cproKeyTempoTimeLine {\r\n\t\t\tfont-size: .8em;\r\n\t\t\tfont-weight: bold;\r\n\t\t\t/*margin-top: .4em;*/\r\n\t\t}\r\n\r\n\t\t.cproSongKeyWrapper {\r\n\t\t\twhite-space: nowrap;\r\n\t\t}\r\n\r\n\t\t.cproSongKey {\r\n\t\t\tfont-family: Verdana, Arial, Helvetica, sans-serif;\r\n\t\t\tfont-weight: bold;\r\n\t\t\tcolor: #000000;\r\n\t\t\tbackground-color: transparent;\r\n\t\t\tborder: none;\r\n\t\t}\r\n\r\n\t\t.cproSongKeyChangeWrapper {\r\n\t\t\tfont-family: Verdana, Arial, Helvetica, sans-serif;\r\n\t\t\tfont-weight: bold;\r\n\t\t\tcolor: #000000;\r\n\t\t\tbackground-color: transparent;\r\n\t\t\tborder: none;\r\n\t\t\tfloat: right;\r\n\t\t}\r\n\r\n\t\t.cproTempoTimeWrapper {\r\n\t\t\twhite-space: nowrap;\r\n\t\t}\r\n\r\n\t\t.cproSecondPageTitleLine {\r\n\t\t\tdisplay: block;\r\n\t\t\tline-height: 1.2;\r\n\t\t\toverflow: visible;\r\n\t\t\tfont-size: 1.4rem;\r\n\t\t\tfont-weight: bold;\r\n\t\t\twhite-space: normal;\r\n\t\t\tpadding-bottom: 20pt;\r\n\t\t}\r\n\r\n\t\t.cproPageNumber {\r\n\t\t\tfloat: right;\r\n\t\t\tfont-size: .6em;\r\n\t\t\tfont-weight: normal;\r\n\t\t}\r\n\r\n\t\t.cproSongBody {\r\n\t\t\tbackground-color: #ffffff;\r\n\t\t\tborder: none;\r\n\t\t\t/*font-size: 1.1em;*/\r\n\t\t\tfont-family: Verdana, Arial, Helvetica, sans-serif;\r\n\t\t\toverflow: visible;\r\n\t\t}\r\n\r\n\t\t.cproComment {\r\n\t\t\t/*font-style: italic;*/\r\n\t\t\t/*font-size: 1.2em;*/\r\n\t\t\tdisplay: inline-block;\r\n\t\t\tfont-weight: bold;\r\n\t\t\tline-height: 2;\r\n\t\t\ttext-transform: uppercase;\r\n\t\t}\r\n\r\n\t\t.cproColumn {\r\n\t\t\tfloat: left;\r\n\t\t\twidth: 50%;\r\n\t\t\tfont-size: .9em;\r\n\t\t\twhite-space: -moz-pre-wrap;\r\n\t\t\twhite-space: pre-wrap;\r\n\t\t\t-moz-box-sizing: border-box;\r\n\t\t\tbox-sizing: border-box;\r\n\t\t\tmax-width: 440px;\r\n\t\t}\r\n\r\n\t\t.cproColumn span.cproComment {\r\n\t\t\tfont-size: 1.1em;\r\n\t\t\tmargin-top: .5em;\r\n\t\t}\r\n\r\n\t\t.cproColumn.leftColumn {\r\n\t\t\tpadding-right: 10px;\r\n\t\t}\r\n\r\n\t\t.cproColumn.rightColumn {\r\n\t\t\tpadding-left: 10px;\r\n\t\t}\r\n\r\n\t\t.cproColumn .cproSongSection .cproSongLine {\r\n\t\t\tpadding-left: 0;\r\n\t\t}\r\n\r\n\t\t/* Clear floats after the columns */\r\n\t\t.cproSongBody:after {\r\n\t\t\tcontent: \"\";\r\n\t\t\tdisplay: table;\r\n\t\t\tclear: both;\r\n\t\t}\r\n\r\n\t\t/* important stops unintended page break for print */\r\n\t\tdiv#ChordSheetViewerContainer pre {\r\n\t\t\t-moz-page-break-inside: auto;\r\n\t\t\tpage-break-inside: auto;\r\n\t\t}\r\n\r\n\t\t.cproPageBreak {\r\n\t\t\tmargin: 10px 0 0 0;\r\n\t\t\tpadding: 10px 0;\r\n\t\t\tborder-top: 1px dotted #c5c5c5;\r\n\t\t}\r\n\r\n\t\t.cproSongSection {\r\n\t\t\tdisplay: block;\r\n\t\t\t-moz-page-break-inside: avoid;\r\n\t\t\tpage-break-inside: avoid;\r\n\t\t}\r\n\r\n\t\t.cproSongLine {\r\n\t\t\tpadding-left: 2em;\r\n\t\t\tdisplay: inline-block;\r\n\t\t\tline-height: 1.1em;\r\n\t\t\tpadding-top: .2em;\r\n\t\t}\r\n\r\n\t\t.lyricsOnly {\r\n\t\t\tline-height: 1;\r\n\t\t}\r\n\r\n\t\t.chordWrapper {\r\n\t\t\tdisplay: inline-block;\r\n\t\t\tposition: relative;\r\n\t\t\tvertical-align: bottom;\r\n\t\t}\r\n\r\n\t\t.cproSongLine .chordWrapper .chord {\r\n\t\t\tfont-family: Verdana, Arial, Helvetica, sans-serif;\r\n\t\t\tcolor: #000000;\r\n\t\t\tbackground-color: transparent;\r\n\t\t\tborder: none;\r\n\t\t\tposition: relative;\r\n\t\t\tfont-weight: bold;\r\n\t\t\twhite-space: nowrap;\r\n\t\t\tpadding: 0 .4em 0 0;\r\n\t\t\tfloat: left;\r\n\t\t}\r\n\r\n\t\t.chordsOnly .chordWrapper .chord {\r\n\t\t\tpadding: 0;\r\n\t\t\tfloat: none;\r\n\t\t}\r\n\r\n\t\t.chordsOnly .chordWrapper .chordLyrics {\r\n\t\t\tfloat: none;\r\n\t\t}\r\n\r\n\t\t.chordsOnly .cproDirectionWrapper .cproDirection {\r\n\t\t\tfloat: none;\r\n\t\t}\r\n\r\n\t\t.chordLyrics {\r\n\t\t\tfloat: left;\r\n\t\t\tclear: both;\r\n\t\t}\r\n\r\n\t\t.cproDirectionWrapper {\r\n\t\t\tdisplay: inline-block;\r\n\t\t\tposition: relative;\r\n\t\t\tvertical-align: bottom;\r\n\t\t}\r\n\r\n\t\t.cproDirection {\r\n\t\t\tcolor: #000000;\r\n\t\t\tbackground-color: transparent;\r\n\t\t\tborder: none;\r\n\t\t\tposition: relative;\r\n\t\t\tfont-weight: normal;\r\n\t\t\tfont-style: italic;\r\n\t\t\twhite-space: nowrap;\r\n\t\t\tpadding: 0;\r\n\t\t\tfloat: left;\r\n\t\t}\r\n\r\n\t\th1 {\r\n\t\t\tfont-size: 2em;\r\n\t\t\tfont-weight: bold;\r\n\t\t}\r\n\r\n\t\tpre {\r\n\t\t\tmargin: 0 0 0;\r\n\t\t}\r\n\r\n\r\n\t\t/* ChordPro Footer\r\n  ------------------------------ */\r\n\t\t.copyright-info {\r\n\t\t\tfont-family: Verdana, Arial, Helvetica, sans-serif;\r\n\t\t\tfont-size: .7em;\r\n\t\t\ttext-align: center;\r\n\t\t\tmargin: 0;\r\n\t\t\tmargin-bottom: 0;\r\n\t\t\tpadding: 2em 0 0 0;\r\n\t\t}\r\n\r\n\t\t.copyright-info p,\r\n\t\tul {\r\n\t\t\tmargin: 0;\r\n\t\t\tline-height: 1.3;\r\n\t\t\tpadding: 0;\r\n\t\t}\r\n\r\n\t\t.songnumber {\r\n\t\t\tfont-weight: bold;\r\n\t\t}\r\n\r\n\t\t.copyright {\r\n\t\t\tline-height: 1.3;\r\n\t\t\tlist-style-type: none;\r\n\t\t}\r\n\r\n\t\tul.copyright li {\r\n\t\t\tlist-style-type: none;\r\n\t\t\tdisplay: inline;\r\n\t\t}\r\n\r\n\t\tul.copyright li:before {\r\n\t\t\tcontent: \" | \";\r\n\t\t}\r\n\r\n\t\tul.copyright li:first-child:before {\r\n\t\t\tcontent: none;\r\n\t\t}\r\n\r\n\t\t.disclaimer {}\r\n\r\n\t\t.licenseno {}\r\n\r\n\r\n\t\t/* ChordPro Div Classes\r\n  ------------------------------ */\r\n\t\t#ChordSheetViewerContainer {\r\n\t\t\tposition: relative;\r\n\t\t\toverflow: hidden;\r\n\t\t\tpadding-bottom: 90%;\r\n\t\t\tmargin-bottom: 1.5em;\r\n\t\t\tborder: 1px solid #e6e6e6;\r\n\t\t\tpadding: 1.5rem 1rem 1rem 2rem;\r\n\t\t\tmax-width: 900px;\r\n\t\t}\r\n\r\n\t\t#ChordSheetViewerContainer iframe {\r\n\t\t\tposition: absolute;\r\n\t\t\ttop: 0;\r\n\t\t\tleft: 0;\r\n\t\t\twidth: 100%;\r\n\t\t\theight: 100%;\r\n\t\t}\r\n\r\n\t\t@media print {\r\n\t\t\t#ChordSheetViewerContainer {\r\n\t\t\t\tborder: none;\r\n\t\t\t}\r\n\r\n\t\t\ta[href]:after {\r\n\t\t\t\tcontent: none !important;\r\n\t\t\t}\r\n\r\n\t\t\ta {\r\n\t\t\t\ttext-decoration: none;\r\n\t\t\t\tpointer-events: none;\r\n\t\t\t\tcursor: default;\r\n\t\t\t\tcolor: #000000;\r\n\t\t\t}\r\n\r\n\t\t\t/* Override all font size, margin, and padding with pt units for print */\r\n\r\n\t\t\t.cproTitle {\r\n\t\t\t\tfont-size: 16pt !important;\r\n\t\t\t}\r\n\r\n\t\t\t.cproAuthorLine {\r\n\t\t\t\tfont-size: 7pt !important;\r\n\t\t\t\tmargin-top: 2pt;\r\n\t\t\t}\r\n\r\n\t\t\t.cproAuthors {\r\n\t\t\t\tpadding-right: 11.25pt !important;\r\n\t\t\t}\r\n\r\n\t\t\t.cproAuthor2Line {\r\n\t\t\t\tfont-size: 7pt !important;\r\n\t\t\t\tmargin-top: 2pt;\r\n\t\t\t}\r\n\r\n\t\t\t.cproKeyTempoTimeLine {\r\n\t\t\t\tfont-size: 9pt !important;\r\n\t\t\t\tmargin-top: 2pt;\r\n\t\t\t}\r\n\r\n\t\t\t.cproSecondPageTitleLine {\r\n\t\t\t\tfont-size: 14pt !important;\r\n\t\t\t\tpadding-bottom: 20pt;\r\n\t\t\t}\r\n\r\n\t\t\t.cproPageNumber {\r\n\t\t\t\tfont-size: 11pt !important;\r\n\t\t\t}\r\n\r\n\t\t\t.cproSongBody {\r\n\t\t\t\tfont-size: 13pt !important;\r\n\t\t\t}\r\n\r\n\t\t\t.cproColumn {\r\n\t\t\t\tfont-size: 10pt !important;\r\n\t\t\t\tletter-spacing: -1pt;\r\n\t\t\t\tmax-width: 276pt;\r\n\t\t\t}\r\n\r\n\t\t\t.cproColumn span.cproComment {\r\n\t\t\t\tfont-size: 11pt !important;\r\n\t\t\t\tmargin-top: 11pt;\r\n\t\t\t}\r\n\r\n\t\t\t.cproColumn.leftColumn {\r\n\t\t\t\tpadding-right: 11pt;\r\n\t\t\t}\r\n\r\n\t\t\t.cproColumn.rightColumn {\r\n\t\t\t\tpadding-left: 11pt;\r\n\t\t\t}\r\n\r\n\r\n\t\t\t.cproColumn .cproSongSection .cproSongLine {\r\n\t\t\t\tpadding-left: 0 !important;\r\n\t\t\t}\r\n\r\n\t\t\t.cproColumn .cproSongSection .cproSongLine code.chord {\r\n\t\t\t\tfont-size: 10pt !important;\r\n\t\t\t}\r\n\r\n\t\t\t.cproSongLine {\r\n\t\t\t\tpadding-left: 24pt !important;\r\n\t\t\t\tline-height: 13pt;\r\n\t\t\t\tpadding-top: 1pt;\r\n\t\t\t}\r\n\r\n\t\t\th1 {\r\n\t\t\t\tfont-size: 24pt !important;\r\n\t\t\t}\r\n\r\n\t\t\t.copyright-info {\r\n\t\t\t\tfont-size: 8pt !important;\r\n\t\t\t\tpadding: 18pt 0 0 0 !important;\r\n\t\t\t}\r\n\r\n\t\t\tbody {\r\n\t\t\t\tpadding: 0 0 0 0 !important;\r\n\t\t\t}\r\n\r\n\t\t\t#ChordSheetViewerContainer {\r\n\t\t\t\tpadding: 16pt 30pt 12pt 24pt !important;\r\n\t\t\t}\r\n\r\n\t\t\t.cproPageBreak {\r\n\t\t\t\tpage-break-before: always;\r\n\t\t\t\tbreak-before: page;\r\n\t\t\t\tpadding: 0;\r\n\t\t\t\tmargin: 0;\r\n\t\t\t\tborder: none;\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\t@page {\r\n\t\t\tsize: auto;\r\n\t\t\tmargin: 10mm 0 10mm 5mm;\r\n\t\t}\r\n\r\n\t\t/* Overwrite footer copyright class in songselect*/\r\n\t\t#ChordSheetViewerContainer>div>ul.copyright {\r\n\t\t\tfont-size: inherit;\r\n\t\t}\r\n\r\n\t\t#ChordSheetViewerContainer a {\r\n\t\t\tfont-size: inherit;\r\n\t\t}\r\n\r\n\t\t.placeholder,\r\n\t\t.placeholder-chord {\r\n\t\t\tdisplay: inline-block;\r\n\t\t\tmin-height: 1em;\r\n\t\t\theight: 1.25em;\r\n\t\t\tvertical-align: middle;\r\n\t\t\tbackground-color: hsl(200, 10%, 20%);\r\n\t\t\topacity: 0.3;\r\n\t\t\tmax-width: 100%;\r\n\t\t}\r\n\r\n\t\t.placeholder-chord {\r\n\t\t\twidth: 1.5em;\r\n\t\t}\r\n\t</style>\r\n\t<span class=\"cproSongHeader\">\r\n\t\t<span class=\"cproTitleLine\">\r\n\t\t\t<span class=\"cproTitle\"><span class=\"placeholder\" style=\"width:200px;\"></span>\r\n\t\t</span>\r\n\r\n\t\t<span class=\"cproAuthorLine\" style=\"margin-top: 0.5em;\">\r\n\t\t\t<span class=\"cproAuthors\"><span class=\"placeholder\" style=\"width:300px;\"></span>\r\n\t\t</span>\r\n\t\t<div class=\"cproKeyTempoTimeLine\" style=\"margin-top: 0.5em;\">\r\n\t\t\t<span class=\"cproSongKeyWrapper\"> <code class=\"cproSongKey\" data-chordname=\"E\"><span class=\"placeholder-chord\"></span></code> </span>\r\n\t\t\t<span class=\"cproTempoTimeWrapper\"> <span class=\"placeholder-chord\"></span>  <span class=\"placeholder-chord\"></span></span>\r\n\t\t</div>\r\n\t</span>\r\n\t<br>\r\n\t<div>\r\n    <div style=\"margin-bottom:0.5em;\"><span class=\"placeholder\" style=\"width:100px; font-size:1.5em;\"></span></div>\r\n    <div>\r\n      <div><span class=\"placeholder-chord\"></span> <span class=\"placeholder-chord\" style=\"margin-left:40px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:160px\"></span></div>\r\n      <div><span class=\"placeholder\" style=\"width: 340px\"></span></div>\r\n\r\n      <div><span class=\"placeholder-chord\" style=\"margin-left:75px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:40px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:160px\"></span></div>\r\n      <div><span class=\"placeholder\" style=\"width: 450px\"></span></div>\r\n\r\n      <div><span class=\"placeholder-chord\" style=\"margin-left:25px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:40px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:160px\"></span></div>\r\n      <div><span class=\"placeholder\" style=\"width: 201px\"></span></div>\r\n\r\n      <div><span class=\"placeholder-chord\"style=\"margin-left:66px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:40px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:160px\"></span></div>\r\n      <div><span class=\"placeholder\" style=\"width: 320px\"></span></div>\r\n    </div>\r\n  </div>\r\n  <div style=\"margin-top:2em;\">\r\n    <div style=\"margin-bottom:0.5em;\"><span class=\"placeholder\" style=\"width:100px; font-size:1.5em;\"></span></div>\r\n    <div>\r\n      <div><span class=\"placeholder-chord\"></span> <span class=\"placeholder-chord\" style=\"margin-left:40px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:160px\"></span></div>\r\n      <div><span class=\"placeholder\" style=\"width: 340px\"></span></div>\r\n\r\n      <div><span class=\"placeholder-chord\" style=\"margin-left:75px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:40px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:160px\"></span></div>\r\n      <div><span class=\"placeholder\" style=\"width: 450px\"></span></div>\r\n\r\n      <div><span class=\"placeholder-chord\" style=\"margin-left:25px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:40px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:160px\"></span></div>\r\n      <div><span class=\"placeholder\" style=\"width: 201px\"></span></div>\r\n\r\n      <div><span class=\"placeholder-chord\"style=\"margin-left:66px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:40px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:160px\"></span></div>\r\n      <div><span class=\"placeholder\" style=\"width: 320px\"></span></div>\r\n    </div>\r\n  </div>\r\n  <div style=\"margin-top:2em;\">\r\n    <div style=\"margin-bottom:0.5em;\"><span class=\"placeholder\" style=\"width:100px; font-size:1.5em;\"></span></div>\r\n    <div>\r\n      <div><span class=\"placeholder-chord\"></span> <span class=\"placeholder-chord\" style=\"margin-left:40px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:160px\"></span></div>\r\n      <div><span class=\"placeholder\" style=\"width: 340px\"></span></div>\r\n\r\n      <div><span class=\"placeholder-chord\" style=\"margin-left:75px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:40px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:160px\"></span></div>\r\n      <div><span class=\"placeholder\" style=\"width: 450px\"></span></div>\r\n\r\n      <div><span class=\"placeholder-chord\" style=\"margin-left:25px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:40px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:160px\"></span></div>\r\n      <div><span class=\"placeholder\" style=\"width: 201px\"></span></div>\r\n\r\n      <div><span class=\"placeholder-chord\"style=\"margin-left:66px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:40px\"></span> <span class=\"placeholder-chord\" style=\"margin-left:160px\"></span></div>\r\n      <div><span class=\"placeholder\" style=\"width: 320px\"></span></div>\r\n    </div>\r\n  </div>\r\n\r\n\t<div class=\"copyright-info\">\r\n\t\t<p class=\"songnumber\"><span class=\"placeholder\" style=\"width:100px\"></span></p>\r\n\t\t<ul class=\"copyright\">\r\n\t\t\t<li><span class=\"placeholder\" style=\"width:350px\"></span></li>\r\n\t\t</ul>\r\n\t\t<p class=\"disclaimer\"><span class=\"placeholder\" style=\"width:500px\"></span></p>\r\n\t\t<p class=\"licenseno\"><span class=\"placeholder\" style=\"width:350px\"></span></p>\r\n\t</div>\r\n</div>`);\r\n\r\nfunction mountShadowDOM() {\r\n  if (!container.value) {\r\n    return;\r\n  }\r\n  shadowDOM = container.value.attachShadow({ mode: \"open\" });\r\n  shadowDOM.appendChild(contentsElement);\r\n  updateShadowDOM();\r\n}\r\n\r\nfunction updateShadowDOM() {\r\n  contentsElement.innerHTML = html.value;\r\n}\r\n</script>\r\n\r\n<template>\r\n  <div\r\n    id=\"ChordSheetViewerContainer\"\r\n    ref=\"container\"\r\n    class=\"sheet-music-chords\"\r\n  />\r\n</template>\r\n\r\n<style scoped lang=\"postcss\">\r\n.sheet-music-chords {\r\n  @apply border rounded shadow-lg p-10;\r\n}\r\n#ChordSheetViewerContainer {\r\n  font-size: 0.95rem !important;\r\n  opacity: 0.5;\r\n}\r\n\r\n@media screen(max-md) {\r\n  #ChordSheetViewerContainer {\r\n    font-size: 0.6rem !important;\r\n  }\r\n}\r\n\r\n@media screen(max-sm) {\r\n  #ChordSheetViewerContainer {\r\n    font-size: 0.4rem !important;\r\n  }\r\n}\r\n</style>\r\n","<script setup lang=\"ts\">\r\nimport { ChordPreferences } from \"@/models/ChordPreferences\";\r\nimport { FontSetting } from \"@/models/FontSetting\";\r\nimport { LoadStatus } from \"@/models/frontend-only/LoadStatus\";\r\nimport { WatchHandle } from \"vue\";\r\n\r\nconst store = useSongStore();\r\nconst busy = useBusyStore();\r\nconst api = useApiStore();\r\nconst toast = useToastStore();\r\nconst app = useAppStore();\r\nconst pdf = usePDFStore();\r\nconst profile = useProfileStore();\r\n\r\nconst { t } = useI18n();\r\n\r\nconst defaultKey = computed(() => store.defaultKey || \"A\");\r\nconst key = ref<string>(defaultKey.value);\r\nconst chartType = useLocalStorage<string>(\r\n  AppConstants.LOCALSTORAGE_KEYS.CHORDS_CHARTTYPE,\r\n  \"Standard\",\r\n) as globalThis.Ref<string>;\r\nconst twoColMode = useLocalStorage<boolean>(\r\n  AppConstants.LOCALSTORAGE_KEYS.CHORDS_TWOCOLMODE,\r\n  false,\r\n) as globalThis.Ref<boolean>;\r\nconst htmlChords = ref(\"\");\r\nconst shareStore = useShareStore();\r\nconst songNumber = computed(() => store.data?.ccliSongNumber || \"\");\r\nconst status = ref<LoadStatus>(LoadStatus.Loading);\r\nconst fontSettings = useLocalStorage<{\r\n  headings: FontSetting;\r\n  directions: FontSetting;\r\n  chords: FontSetting;\r\n  lyrics: FontSetting;\r\n}>(AppConstants.LOCALSTORAGE_KEYS.CHORDS_FONTSETTINGS, {\r\n  headings: {\r\n    size: \"16\",\r\n    color: AvailableTextColors[0].name,\r\n    highlight: AvailableHighlightColors[0].name,\r\n    family: AvailableFontFamilies[0].type,\r\n  },\r\n  directions: {\r\n    size: \"16\",\r\n    color: AvailableTextColors[0].name,\r\n    highlight: AvailableHighlightColors[0].name,\r\n    family: AvailableFontFamilies[0].type,\r\n  },\r\n  chords: {\r\n    size: \"16\",\r\n    color: AvailableTextColors[0].name,\r\n    highlight: AvailableHighlightColors[0].name,\r\n    family: AvailableFontFamilies[0].type,\r\n  },\r\n  lyrics: {\r\n    size: \"16\",\r\n    color: AvailableTextColors[0].name,\r\n    highlight: AvailableHighlightColors[0].name,\r\n    family: AvailableFontFamilies[0].type,\r\n  },\r\n});\r\n\r\nconst fontSize = ref(\"16\");\r\n\r\nconst filename = computed(\r\n  () => sanitizeFilename(store.song?.title || \"\") + \"-chords-\" + key.value,\r\n);\r\n\r\nconst showBusy = ref({\r\n  copy: false,\r\n  print: false,\r\n  download: false,\r\n  share: false,\r\n});\r\n\r\nconst shownBusy = computed(() => ({\r\n  email: store.emailSettings.busy,\r\n  ...showBusy.value,\r\n}));\r\n\r\nfunction getPdfUrl(\r\n  activityType: \"shared\" | \"downloaded\" | \"printed\" | \"previewed\",\r\n) {\r\n  const searchParams = new URLSearchParams({\r\n    songNumber: songNumber.value,\r\n    key: key.value,\r\n    style: chartType.value,\r\n    columns: twoColMode.value ? \"2\" : \"1\",\r\n    activityType: activityType,\r\n    enableFontCustomization: enableFontSettingsFeature.value ? \"1\" : \"0\",\r\n    ...(enableFontSettingsFeature.value\r\n      ? {\r\n          css: getCSSForChordSheet(\r\n            fontSize.value,\r\n            fontSettings.value,\r\n            false,\r\n            true,\r\n          ),\r\n        }\r\n      : {}),\r\n  });\r\n  const url = `/api/GetSongChordsPdf?${searchParams.toString()}`;\r\n  return url;\r\n}\r\n\r\nconst usedMaxSongsChords = computed(\r\n  () => store.song?.products.chords.exceededMaxUniqueSongCount || false,\r\n);\r\n\r\nconst usedMaxSongsChordPro = computed(\r\n  () => store.song?.products.chordPro.exceededMaxUniqueSongCount || false,\r\n);\r\n\r\nfunction usedMaxSongs(product: string) {\r\n  if (product === \"chords\") {\r\n    return usedMaxSongsChords.value;\r\n  } else if (product === \"chordpro\") {\r\n    return usedMaxSongsChordPro.value;\r\n  }\r\n  return false;\r\n}\r\n\r\nconst init = ref(false);\r\nlet watchHandle: WatchHandle | null = null;\r\n\r\nasync function initWhenSongIsLoaded() {\r\n  await waitUntilTrue(\r\n    () =>\r\n      store.status === LoadStatus.Ready &&\r\n      store.song &&\r\n      store.defaultKey &&\r\n      profile.profile,\r\n  );\r\n  key.value = store.defaultKey;\r\n  await getSongSheet();\r\n  init.value = true;\r\n\r\n  watchHandle = watch(\r\n    () => [songNumber.value, key.value, chartType.value, twoColMode.value],\r\n    getSongSheet,\r\n  );\r\n}\r\n\r\nconst loading = computed(() => store.loading);\r\n\r\nwatch(loading, (loading) => {\r\n  if (!loading) {\r\n    reset();\r\n  }\r\n});\r\n\r\nonMounted(async () => {\r\n  await getProfileSettings();\r\n  await initWhenSongIsLoaded();\r\n});\r\n\r\nfunction reset() {\r\n  chartType.value = \"Standard\";\r\n  key.value = defaultKey.value;\r\n  twoColMode.value = false;\r\n  fontSize.value = \"16\";\r\n\r\n  fontSettings.value = {\r\n    headings: {\r\n      size: \"16\",\r\n      color: AvailableTextColors[0].name,\r\n      highlight: AvailableHighlightColors[0].name,\r\n      family: AvailableFontFamilies[0].type,\r\n    },\r\n    lyrics: {\r\n      size: \"16\",\r\n      color: AvailableTextColors[0].name,\r\n      highlight: AvailableHighlightColors[0].name,\r\n      family: AvailableFontFamilies[0].type,\r\n    },\r\n    directions: {\r\n      size: \"16\",\r\n      color: AvailableTextColors[0].name,\r\n      highlight: AvailableHighlightColors[0].name,\r\n      family: AvailableFontFamilies[0].type,\r\n    },\r\n    chords: {\r\n      size: \"16\",\r\n      color: AvailableTextColors[0].name,\r\n      highlight: AvailableHighlightColors[0].name,\r\n      family: AvailableFontFamilies[0].type,\r\n    },\r\n  };\r\n}\r\n\r\nasync function print() {\r\n  showBusy.value.print = true;\r\n  const url = getPdfUrl(\"printed\");\r\n  try {\r\n    await pdf.printPdf(url);\r\n  } catch (err) {\r\n    toast.errorToast(\"SV.LIT_PrintErrorHasOccurred\");\r\n    throw err;\r\n  }\r\n  showBusy.value.print = false;\r\n}\r\n\r\nasync function share() {\r\n  if (!store.song) {\r\n    return;\r\n  }\r\n  showBusy.value.share = true;\r\n\r\n  await shareStore.fetchUrlPdfAndShare(\r\n    getPdfUrl(\"shared\"),\r\n    filename.value + \".pdf\",\r\n    store.song.title,\r\n    t(\"G.LIT_ChordSheet\"),\r\n  );\r\n  showBusy.value.share = false;\r\n}\r\n\r\nasync function getSongSheet() {\r\n  if (!songNumber.value) {\r\n    return;\r\n  }\r\n\r\n  busy.showBusy();\r\n  status.value = LoadStatus.Loading;\r\n  try {\r\n    htmlChords.value = \"\";\r\n\r\n    htmlChords.value = await api.get(\"/GetSongChordsHTML\", {\r\n      songNumber: songNumber.value,\r\n      key: key.value,\r\n      style: chartType.value,\r\n      columns: twoColMode.value ? \"2\" : \"1\",\r\n      enableFontCustomization: enableFontSettingsFeature.value ? \"1\" : \"0\",\r\n    });\r\n\r\n    status.value = LoadStatus.Ready;\r\n  } catch (err) {\r\n    status.value = LoadStatus.Error;\r\n    throw err;\r\n  }\r\n  busy.hideBusy();\r\n}\r\n\r\nasync function download() {\r\n  if (!songNumber.value || !store.song) {\r\n    return;\r\n  }\r\n  showBusy.value.download = true;\r\n\r\n  await downloadUrl(getPdfUrl(\"downloaded\"), filename.value + \".pdf\");\r\n  showBusy.value.download = false;\r\n}\r\n\r\nasync function downloadChordPro() {\r\n  if (!songNumber.value || !store.song) {\r\n    return;\r\n  }\r\n  showBusy.value.download = true;\r\n\r\n  try {\r\n    const chordpro = await api.get(\"/GetSongChordPro\", {\r\n      songNumber: songNumber.value,\r\n      key: key.value,\r\n      style: chartType.value,\r\n      columns: twoColMode.value ? \"2\" : \"1\",\r\n    });\r\n\r\n    await downloadTextFile(\r\n      chordpro,\r\n      store.song.slug + \"-chordpro-\" + key.value,\r\n    );\r\n  } catch (err) {\r\n    showBusy.value.download = false;\r\n    throw err;\r\n  }\r\n  showBusy.value.download = false;\r\n}\r\n\r\nconst showPlaceholders = computed(\r\n  () =>\r\n    store.status === LoadStatus.Loading ||\r\n    store.status === LoadStatus.Error ||\r\n    status.value === LoadStatus.Loading ||\r\n    status.value === LoadStatus.Error ||\r\n    (store.status === LoadStatus.Ready &&\r\n      !store.song?.products.chords.authorized),\r\n);\r\n\r\nfunction emailSong() {\r\n  store.emailSong({\r\n    product: \"chords\",\r\n    songKey: key.value,\r\n    style: chartType.value,\r\n    columns: twoColMode.value ? \"2\" : \"1\",\r\n    noteSize: null,\r\n    octave: null,\r\n    orientation: null,\r\n    paperSize: null,\r\n    enableFontCustomization: enableFontSettingsFeature.value,\r\n    ...(enableFontSettingsFeature.value\r\n      ? {\r\n          css: getCSSForChordSheet(\r\n            fontSize.value,\r\n            fontSettings.value,\r\n            false,\r\n            true,\r\n          ),\r\n        }\r\n      : {}),\r\n  });\r\n}\r\nconst beta = useBetaStore();\r\nconst enableFontSettingsFeature = computed(\r\n  () => beta.features.chordFontSettings,\r\n);\r\n\r\nconst debouncedSavedSetting = useDebounceFn(saveSetting, 500);\r\nwatch(\r\n  () => [fontSettings, fontSize, twoColMode, chartType],\r\n  debouncedSavedSetting,\r\n  {\r\n    deep: true,\r\n  },\r\n);\r\n\r\nasync function getProfileSettings() {\r\n  await waitUntilTrue(() => !!profile.profile);\r\n\r\n  fontSettings.value = {\r\n    headings: {\r\n      size:\r\n        profile.profile?.chordPreferences.fontSettings?.headings.size || \"16\",\r\n      color:\r\n        profile.profile?.chordPreferences.fontSettings?.headings.color ||\r\n        AvailableTextColors[0].name,\r\n      highlight:\r\n        profile.profile?.chordPreferences.fontSettings?.headings.highlight ||\r\n        AvailableHighlightColors[0].name,\r\n      family:\r\n        profile.profile?.chordPreferences.fontSettings?.headings.family ||\r\n        AvailableFontFamilies[0].type,\r\n    },\r\n    directions: {\r\n      size:\r\n        profile.profile?.chordPreferences.fontSettings?.directions.size || \"16\",\r\n      color:\r\n        profile.profile?.chordPreferences.fontSettings?.directions.color ||\r\n        AvailableTextColors[0].name,\r\n      highlight:\r\n        profile.profile?.chordPreferences.fontSettings?.directions.highlight ||\r\n        AvailableHighlightColors[0].name,\r\n      family:\r\n        profile.profile?.chordPreferences.fontSettings?.directions.family ||\r\n        AvailableFontFamilies[0].type,\r\n    },\r\n    chords: {\r\n      size: profile.profile?.chordPreferences.fontSettings?.chords.size || \"16\",\r\n      color:\r\n        profile.profile?.chordPreferences.fontSettings?.chords.color ||\r\n        AvailableTextColors[0].name,\r\n      highlight:\r\n        profile.profile?.chordPreferences.fontSettings?.chords.highlight ||\r\n        AvailableHighlightColors[0].name,\r\n      family:\r\n        profile.profile?.chordPreferences.fontSettings?.chords.family ||\r\n        AvailableFontFamilies[0].type,\r\n    },\r\n    lyrics: {\r\n      size: profile.profile?.chordPreferences.fontSettings?.lyrics.size || \"16\",\r\n      color:\r\n        profile.profile?.chordPreferences.fontSettings?.lyrics.color ||\r\n        AvailableTextColors[0].name,\r\n      family:\r\n        profile.profile?.chordPreferences.fontSettings?.lyrics.family ||\r\n        AvailableFontFamilies[0].type,\r\n    },\r\n  };\r\n\r\n  fontSize.value =\r\n    profile.profile?.chordPreferences.fontSize.toString() || \"16\";\r\n  twoColMode.value = profile.profile?.chordPreferences.columns === \"2\" || false;\r\n  chartType.value = profile.profile?.chordPreferences.style || \"Standard\";\r\n}\r\n\r\nfunction saveSetting() {\r\n  if (profile.profile) {\r\n    const settings: ChordPreferences = {\r\n      fontSize: parseInt(fontSize.value),\r\n      style: chartType.value,\r\n      columns: twoColMode.value ? \"2\" : \"1\",\r\n      fontSettings: fontSettings.value,\r\n    };\r\n    api.post(\"/UpdateChordPreferences\", {\r\n      chordPreferences: JSON.stringify(settings),\r\n    });\r\n    profile.profile.chordPreferences = settings;\r\n  }\r\n}\r\n\r\nonUnmounted(() => watchHandle?.stop());\r\n</script>\r\n\r\n<template>\r\n  <PageWrapper no-body>\r\n    <FullScreenWrapper\r\n      :class=\"{ 'placeholder-glow': status == LoadStatus.Loading }\"\r\n    >\r\n      <template #header>\r\n        <SongDetailsAlertContentError\r\n          v-if=\"status === LoadStatus.Error\"\r\n          @btnclick=\"getSongSheet\"\r\n        />\r\n        <SongDetailsAlertNotAuthenticated\r\n          v-else-if=\"\r\n            !store.placeholderNotLoaded &&\r\n            store.data?.products.chords.noAuthReason ===\r\n              NoAuthReason.NotAuthenticated\r\n          \"\r\n        />\r\n        <SongDetailsAlertUpgradeSubscription\r\n          v-else-if=\"\r\n            !store.placeholderNotLoaded &&\r\n            store.data?.products.chords.noAuthReason ===\r\n              NoAuthReason.RequiresSubscriptionUpgrade\r\n          \"\r\n        />\r\n      </template>\r\n\r\n      <MusicSheetChordsPlaceholder v-if=\"showPlaceholders\" />\r\n      <MusicSheetChords\r\n        v-else\r\n        :html=\"htmlChords\"\r\n        :font-settings=\"fontSettings\"\r\n        :font-size=\"fontSize\"\r\n      />\r\n\r\n      <template #action-bar-controls>\r\n        <div\r\n          class=\"ga-info\"\r\n          :data-songnumber=\"store.song?.ccliSongNumber\"\r\n          :data-song-selectedkey=\"key\"\r\n          :data-content-type=\"'ChordSheet'\"\r\n          :data-chordstyle=\"chartType\"\r\n          :data-layoutstyle=\"twoColMode ? 'TwoColumn' : 'SingleColumn'\"\r\n        >\r\n          <ToolbarActionBarControls\r\n            enable-email\r\n            enable-share\r\n            :enable-print=\"!isFirefox()\"\r\n            dropdown-download\r\n            product=\"chords\"\r\n            :show-busy=\"shownBusy\"\r\n            :max-song-usage-check=\"usedMaxSongs\"\r\n            :ids=\"{\r\n              copy: 'chordSheetCopyButton',\r\n              download: 'chordSheetDownloadDropdown',\r\n              downloadChordPro: 'chordSheetDownloadChordProButton',\r\n              downloadPDF: 'chordSheetDownloadButton',\r\n              email: 'chordSheetEmailButton',\r\n              fullscreen: 'chordSheetFullscreenButton',\r\n              print: 'chordSheetPrintButton',\r\n              share: 'chordSheetShareButton',\r\n            }\"\r\n            @print=\"print\"\r\n            @download=\"download\"\r\n            @download-chord-pro=\"downloadChordPro\"\r\n            @share=\"share\"\r\n            @email=\"emailSong\"\r\n          />\r\n        </div>\r\n      </template>\r\n      <template #toolbar>\r\n        <ToolbarSelectChordsTransposeKey\r\n          id=\"ChordSheetTransposeKeySelectInput\"\r\n          v-model=\"key\"\r\n          :default-key=\"defaultKey\"\r\n        />\r\n\r\n        <ToolbarSelectChartType v-model=\"chartType\" />\r\n        <ToolbarColumns v-model=\"twoColMode\" />\r\n        <template v-if=\"enableFontSettingsFeature\">\r\n          <ToolbarFontSize\r\n            v-model=\"fontSize\"\r\n            chord-sheet\r\n            :title=\"$t('SV.LIT_Scale')\"\r\n          />\r\n\r\n          <ToolbarFontSettings\r\n            v-model=\"fontSettings\"\r\n            enable-chords\r\n          />\r\n\r\n          <ToolbarReset @reset=\"reset\" />\r\n        </template>\r\n      </template>\r\n    </FullScreenWrapper>\r\n  </PageWrapper>\r\n</template>\r\n\r\n<style scoped lang=\"postcss\"></style>\r\n"],"names":["props","__props","emits","__emit","t","useI18n","value","computed","newValue","options","getCSSForChordSheet","fontSize","fontSettings","darkMode","forPDF","headingColor","AvailableTextColors","c","chordColor","lyricsColor","directionsColor","headingHighlight","AvailableHighlightColors","chordHighlight","lyricsHighlight","directionsHighlight","headingsFamily","_a","AvailableFontFamilies","f","lyricsFamily","_b","directionsFamily","_c","chordsFamily","_d","headingColorCss","chordColorCss","lyricsColorCss","directionsColorCss","headingHighlightCss","chordHighlightCss","lyricsHighlightCss","directionsHighlightCss","importFonts","urls","headingsFont","lyricsFont","directionsFont","chordsFont","url","fontSizeString","DarkModeChordSheetCSS","shadowDOM","dark","useDarkModeStore","container","ref","contentsElement","status","mounted","onMounted","mountShadowDOM","LoadStatus","updateShadowDOM","beta","useBetaStore","html","rawHtml","watch","applyFontSize","store","useSongStore","busy","useBusyStore","api","useApiStore","toast","useToastStore","useAppStore","pdf","usePDFStore","profile","useProfileStore","defaultKey","key","chartType","useLocalStorage","AppConstants","twoColMode","htmlChords","shareStore","useShareStore","songNumber","filename","sanitizeFilename","showBusy","shownBusy","getPdfUrl","activityType","searchParams","enableFontSettingsFeature","usedMaxSongsChords","usedMaxSongsChordPro","usedMaxSongs","product","init","watchHandle","initWhenSongIsLoaded","waitUntilTrue","getSongSheet","loading","reset","getProfileSettings","print","err","share","download","downloadUrl","downloadChordPro","chordpro","downloadTextFile","showPlaceholders","emailSong","debouncedSavedSetting","useDebounceFn","saveSetting","_f","_e","_h","_g","_j","_i","_l","_k","_n","_m","_p","_o","_r","_q","_t","_s","_v","_u","_x","_w","_z","_y","_B","_A","_D","_C","_E","_F","_G","settings","onUnmounted"],"mappings":"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"}