openalgo-charts
Version:
From-scratch, dependency-free canvas charting engine for OpenAlgo: professional-grade interactive rendering, advanced on-chart trading, and a one-call widget tier that adds the toolbar, drawing rail, dialogs and shortcuts.
3 lines (2 loc) • 6.87 kB
JavaScript
import{isReplaying as e}from"./openalgo-charts.mjs";import{a as t,n as a,widgetText as o,o as n,A as l,B as i,saveIndicatorTemplate as c,e as s,applyIndicatorTemplate as r,C as d}from"./openalgo-charts.widget.mjs";import"./openalgo-charts.draw.mjs";function p(p,u,g){const h=p.document;t(h,m);const b=(e,t,a={})=>o(p,`schema.ui.templates.${e}`,a,t),w=a(h,"div","oac-templates");w.setAttribute("role","dialog"),w.setAttribute("aria-label",b("title","Indicator templates"));const v=a(h,"div","oac-head",o(p,"Templates")),_=a(h,"div","oac-templates__list");_.setAttribute("role","list"),_.setAttribute("aria-label",o(p,"Templates"));const x=a(h,"p","oac-templates__message");x.setAttribute("role","status"),x.setAttribute("aria-live","polite");const f=a(h,"div","oac-templates__foot"),y=n(h,{label:b("save","Save studies as template..."),icon:"save",onClick:()=>function(){if("true"===y.getAttribute("aria-disabled"))return;S?.close(),S=i(p,y,async e=>{const t=await c(p,g,e);F(o(p,"Saved the template {name}",{name:t.name})),z()})}()});y.dataset.action="save-template",f.appendChild(y),w.append(v,_,x,f),l(w);let A=null,C=!1,k=null,S=null,q=!1;const F=(e,t=!1)=>{x.textContent=e,x.classList.toggle("is-error",t),x.setAttribute("role",t?"alert":"status")},N=e=>s(p,e),j=(e,t)=>{e.setAttribute("aria-disabled",String(null!==t)),null===t?e.removeAttribute("title"):e.title=t};function D(){const t=h.activeElement,o=null!==t&&_.contains(t)?{id:t.closest("[data-template-id]")?.dataset.templateId,action:t.dataset.action}:null;_.textContent="";const l=e(p.chart),i=A?.templates??[];null===A?_.appendChild(a(h,"div","oac-empty",C?b("loadFailed","Templates could not be loaded"):b("loading","Loading templates"))):0===i.length&&_.appendChild(a(h,"div","oac-empty",b("empty","No saved templates yet")));for(const e of i){const t=a(h,"div","oac-templates__row");t.setAttribute("role","listitem"),t.dataset.templateId=e.id;const o=a(h,"span","oac-templates__name",e.name),i=e.indicators.length,c=a(h,"span","oac-templates__meta",1===i?b("one","1 study"):b("count","{count} studies",{count:i}));if(k===e.id){t.classList.add("is-confirm");const o=n(h,{label:b("keep","Keep"),onClick:()=>{k=null,D()}});o.dataset.action="keep";const l=n(h,{label:b("delete","Delete"),variant:"danger",onClick:()=>{T(e)}});l.dataset.action="confirm-delete",t.append(a(h,"span","oac-templates__name",b("confirm","Delete {name}?",{name:e.name})),o,l),_.appendChild(t);continue}const s=l?b("replay","Stop the replay to apply a template"):null,r=n(h,{label:b("replace","Replace"),onClick:()=>I(e,"replace")});r.dataset.action="replace",r.setAttribute("aria-label",b("replaceNamed","Replace the studies with {name}",{name:e.name}));const d=n(h,{label:b("append","Append"),onClick:()=>I(e,"append")});d.dataset.action="append",d.setAttribute("aria-label",b("appendNamed","Add {name} to the studies",{name:e.name})),j(r,s),j(d,s);const p=n(h,{label:b("deleteNamed","Delete {name}",{name:e.name}),icon:"trash",iconOnly:!0,onClick:()=>{k=e.id,D(),_.querySelector('[data-action="keep"]')?.focus()}});p.dataset.action="delete",t.append(o,c,r,d,p),_.appendChild(t)}if(j(y,0===(e=>e.chart.indicators().filter(e=>!d(e.policy?.())).length)(p)?b("nothing","Add a study to save a template"):null),null!==o){const e=Array.from(_.querySelectorAll("[data-template-id]")).find(e=>e.dataset.templateId===o.id)??null,t="keep"===o.action?"delete":o.action;(e?.querySelector(`[data-action="${t}"]`)??e?.querySelector("button")??_.querySelector("button")??y).focus()}}function I(t,a){if(!e(p.chart))try{const e=void 0===t.layout?t.indicators:{indicators:t.indicators,layout:t.layout},n=r(p,g,e,a,o(p,"Apply {name}",{name:t.name}));p.toast(n?b("applied","Applied {name}",{name:t.name}):b("nothingNew","{name} added nothing new",{name:t.name}),n?"success":"info"),$.close()}catch(e){F(b("applyFailed","{name} could not be applied: {error}",{name:t.name,error:N(e)}),!0)}}async function T(e){k=null;try{await g.remove("indicator-template",e.id),F(b("removed","Deleted {name}",{name:e.name})),await z()}catch(t){F(b("removeFailed","{name} could not be deleted: {error}",{name:e.name,error:N(t)}),!0),D()}}async function z(){try{const e=await g.load();(null===A||e.revision>=A.revision)&&(A=e),C=!1}catch(e){C=!0,null===A&&F(b("loadFailedWith","Templates could not be loaded: {error}",{error:N(e)}),!0)}q||D()}const L=g.subscribe(e=>{null!==A&&e.revision<=A.revision||(A=e,q||D())}),O=["replay:start","replay:stop","objects:change"].map(e=>p.chart.on(e,()=>{q||D()}));D(),z();const R=p.openOverlay(w,{anchor:u,placement:"below",initialFocus:null,onClose:()=>{q=!0,L();for(const e of O)e();S?.close()}});(_.querySelector("button")??y).focus();const $={el:w,isOpen:()=>!q,close:()=>{q||R()}};return $}const m="\n.oac-widget .oac-templates { width: 360px; max-width: calc(100% - 16px); max-height: min(420px, calc(100% - 16px)); display: flex; flex-direction: column;\n padding: 4px 6px 6px; background: var(--oac-panel); border: 1px solid var(--oac-bd); border-radius: 10px; box-shadow: var(--oac-shadow); outline: none; }\n.oac-widget .oac-templates__list { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; display: grid; gap: 1px; align-content: start; }\n.oac-widget .oac-templates__row { display: flex; align-items: center; gap: 4px; min-height: 32px; padding: 2px 2px 2px 8px; border-radius: 6px; }\n.oac-widget .oac-templates__row:hover, .oac-widget .oac-templates__row:focus-within { background: var(--oac-elev); }\n.oac-widget .oac-templates__name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n.oac-widget .oac-templates__meta { flex: none; color: var(--oac-mut); font-size: 11px; margin-right: 4px; }\n.oac-widget .oac-templates__row .oac-btn { height: 24px; padding: 0 7px; font-size: 11.5px; border-color: var(--oac-bd-soft); }\n.oac-widget .oac-templates__row .oac-btn--icon { width: 24px; padding: 0; border-color: transparent; color: var(--oac-mut); }\n.oac-widget .oac-templates__row .oac-btn--icon:hover { color: var(--oac-danger); }\n.oac-widget .oac-templates__row.is-confirm { background: var(--oac-elev); }\n.oac-widget .oac-templates__message { margin: 4px 8px 0; font-size: 11px; color: var(--oac-mut); overflow-wrap: anywhere; }\n.oac-widget .oac-templates__message:empty { display: none; }\n.oac-widget .oac-templates__message.is-error { color: var(--oac-danger); }\n.oac-widget .oac-templates__foot { display: flex; padding: 6px 2px 0; margin-top: 4px; border-top: 1px solid var(--oac-bd-soft); }\n.oac-widget.is-mobile .oac-templates__row { min-height: 44px; }\n.oac-widget.is-mobile .oac-templates__row .oac-btn { height: 36px; }\n.oac-widget.is-mobile .oac-templates__row .oac-btn--icon { width: 36px; }\n";export{p as openTemplatesMenu};
//# sourceMappingURL=openalgo-charts.widget.layouts-templates-menu-CFf0bR9J.mjs.map