CardMotion

功能：

• 在翻转与切换到下一张卡片时，展示真实、流畅的动画
• 轻易地与你的任何模板集成
• 支持所有 Anki 客户端，包括 Anki Desktop、AnkiMobile、AnkiDroid、AnkiWeb
• 按照你的喜好进行充分定制，例如动画速度曲线、外观、翻转时播放声音等等

AnkiMobile	AnkiDroid

安装

手动新建或集成到现有的模板（推荐）

• 新建模板: 创建对应字段后，将以下三部分代码粘贴入 Anki 模板编辑器
• 集成：可自定义卡片正面和背面的展示区域代码已高亮展示，你可以将自己模板的内容粘贴到此处

WARNING

请勿在 Back Template 中使用 Anki 的 FrontSide 字段，这会与本插件冲突

Front Template

<div class="ae-anim-container" data-doc="https://anki.ikkz.fun/">
  <div class="ae-anim-card">
    <div class="ae-card-face">
      {{Front}}
    </div>
  </div>
</div>

<script>
(function(T){typeof define=="function"&&define.amd?define(T):T()})((function(){"use strict";var pt;const T=n=>(t,e)=>{const s=()=>{customElements.get(n)||customElements.define(n,t)};e?e.addInitializer(s):s()};function ut(){const n=window.console;n.patched||(window.console=new Proxy(n,{get(t,e,s){return Reflect.has(t,e)?Reflect.get(t,e,s):Reflect.get(t,"log",s)}}),window.console.patched=!0)}const H=globalThis,D=H.ShadowRoot&&(H.ShadyCSS===void 0||H.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,K=Symbol(),Z=new WeakMap;let $t=class{constructor(t,e,s){if(this._$cssResult$=!0,s!==K)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e}get styleSheet(){let t=this.o;const e=this.t;if(D&&t===void 0){const s=e!==void 0&&e.length===1;s&&(t=Z.get(e)),t===void 0&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),s&&Z.set(e,t))}return t}toString(){return this.cssText}};const ft=n=>new $t(typeof n=="string"?n:n+"",void 0,K),_t=(n,t)=>{if(D)n.adoptedStyleSheets=t.map((e=>e instanceof CSSStyleSheet?e:e.styleSheet));else for(const e of t){const s=document.createElement("style"),i=H.litNonce;i!==void 0&&s.setAttribute("nonce",i),s.textContent=e.cssText,n.appendChild(s)}},G=D?n=>n:n=>n instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return ft(e)})(n):n;const{is:mt,defineProperty:At,getOwnPropertyDescriptor:vt,getOwnPropertyNames:yt,getOwnPropertySymbols:gt,getPrototypeOf:Et}=Object,f=globalThis,Q=f.trustedTypes,bt=Q?Q.emptyScript:"",j=f.reactiveElementPolyfillSupport,w=(n,t)=>n,R={toAttribute(n,t){switch(t){case Boolean:n=n?bt:null;break;case Object:case Array:n=n==null?n:JSON.stringify(n)}return n},fromAttribute(n,t){let e=n;switch(t){case Boolean:e=n!==null;break;case Number:e=n===null?null:Number(n);break;case Object:case Array:try{e=JSON.parse(n)}catch{e=null}}return e}},z=(n,t)=>!mt(n,t),X={attribute:!0,type:String,converter:R,reflect:!1,useDefault:!1,hasChanged:z};Symbol.metadata??(Symbol.metadata=Symbol("metadata")),f.litPropertyMetadata??(f.litPropertyMetadata=new WeakMap);class E extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??(this.l=[])).push(t)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,e=X){if(e.state&&(e.attribute=!1),this._$Ei(),this.prototype.hasOwnProperty(t)&&((e=Object.create(e)).wrapped=!0),this.elementProperties.set(t,e),!e.noAccessor){const s=Symbol(),i=this.getPropertyDescriptor(t,s,e);i!==void 0&&At(this.prototype,t,i)}}static getPropertyDescriptor(t,e,s){const{get:i,set:o}=vt(this.prototype,t)??{get(){return this[e]},set(r){this[e]=r}};return{get:i,set(r){const c=i==null?void 0:i.call(this);o==null||o.call(this,r),this.requestUpdate(t,c,s)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)??X}static _$Ei(){if(this.hasOwnProperty(w("elementProperties")))return;const t=Et(this);t.finalize(),t.l!==void 0&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties)}static finalize(){if(this.hasOwnProperty(w("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(w("properties"))){const e=this.properties,s=[...yt(e),...gt(e)];for(const i of s)this.createProperty(i,e[i])}const t=this[Symbol.metadata];if(t!==null){const e=litPropertyMetadata.get(t);if(e!==void 0)for(const[s,i]of e)this.elementProperties.set(s,i)}this._$Eh=new Map;for(const[e,s]of this.elementProperties){const i=this._$Eu(e,s);i!==void 0&&this._$Eh.set(i,e)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(t){const e=[];if(Array.isArray(t)){const s=new Set(t.flat(1/0).reverse());for(const i of s)e.unshift(G(i))}else t!==void 0&&e.push(G(t));return e}static _$Eu(t,e){const s=e.attribute;return s===!1?void 0:typeof s=="string"?s:typeof t=="string"?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){var t;this._$ES=new Promise((e=>this.enableUpdating=e)),this._$AL=new Map,this._$E_(),this.requestUpdate(),(t=this.constructor.l)==null||t.forEach((e=>e(this)))}addController(t){var e;(this._$EO??(this._$EO=new Set)).add(t),this.renderRoot!==void 0&&this.isConnected&&((e=t.hostConnected)==null||e.call(t))}removeController(t){var e;(e=this._$EO)==null||e.delete(t)}_$E_(){const t=new Map,e=this.constructor.elementProperties;for(const s of e.keys())this.hasOwnProperty(s)&&(t.set(s,this[s]),delete this[s]);t.size>0&&(this._$Ep=t)}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return _t(t,this.constructor.elementStyles),t}connectedCallback(){var t;this.renderRoot??(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),(t=this._$EO)==null||t.forEach((e=>{var s;return(s=e.hostConnected)==null?void 0:s.call(e)}))}enableUpdating(t){}disconnectedCallback(){var t;(t=this._$EO)==null||t.forEach((e=>{var s;return(s=e.hostDisconnected)==null?void 0:s.call(e)}))}attributeChangedCallback(t,e,s){this._$AK(t,s)}_$ET(t,e){var o;const s=this.constructor.elementProperties.get(t),i=this.constructor._$Eu(t,s);if(i!==void 0&&s.reflect===!0){const r=(((o=s.converter)==null?void 0:o.toAttribute)!==void 0?s.converter:R).toAttribute(e,s.type);this._$Em=t,r==null?this.removeAttribute(i):this.setAttribute(i,r),this._$Em=null}}_$AK(t,e){var o,r;const s=this.constructor,i=s._$Eh.get(t);if(i!==void 0&&this._$Em!==i){const c=s.getPropertyOptions(i),a=typeof c.converter=="function"?{fromAttribute:c.converter}:((o=c.converter)==null?void 0:o.fromAttribute)!==void 0?c.converter:R;this._$Em=i;const l=a.fromAttribute(e,c.type);this[i]=l??((r=this._$Ej)==null?void 0:r.get(i))??l,this._$Em=null}}requestUpdate(t,e,s){var i;if(t!==void 0){const o=this.constructor,r=this[t];if(s??(s=o.getPropertyOptions(t)),!((s.hasChanged??z)(r,e)||s.useDefault&&s.reflect&&r===((i=this._$Ej)==null?void 0:i.get(t))&&!this.hasAttribute(o._$Eu(t,s))))return;this.C(t,e,s)}this.isUpdatePending===!1&&(this._$ES=this._$EP())}C(t,e,{useDefault:s,reflect:i,wrapped:o},r){s&&!(this._$Ej??(this._$Ej=new Map)).has(t)&&(this._$Ej.set(t,r??e??this[t]),o!==!0||r!==void 0)||(this._$AL.has(t)||(this.hasUpdated||s||(e=void 0),this._$AL.set(t,e)),i===!0&&this._$Em!==t&&(this._$Eq??(this._$Eq=new Set)).add(t))}async _$EP(){this.isUpdatePending=!0;try{await this._$ES}catch(e){Promise.reject(e)}const t=this.scheduleUpdate();return t!=null&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){var s;if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??(this.renderRoot=this.createRenderRoot()),this._$Ep){for(const[o,r]of this._$Ep)this[o]=r;this._$Ep=void 0}const i=this.constructor.elementProperties;if(i.size>0)for(const[o,r]of i){const{wrapped:c}=r,a=this[o];c!==!0||this._$AL.has(o)||a===void 0||this.C(o,void 0,r,a)}}let t=!1;const e=this._$AL;try{t=this.shouldUpdate(e),t?(this.willUpdate(e),(s=this._$EO)==null||s.forEach((i=>{var o;return(o=i.hostUpdate)==null?void 0:o.call(i)})),this.update(e)):this._$EM()}catch(i){throw t=!1,this._$EM(),i}t&&this._$AE(e)}willUpdate(t){}_$AE(t){var e;(e=this._$EO)==null||e.forEach((s=>{var i;return(i=s.hostUpdated)==null?void 0:i.call(s)})),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$EM(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return!0}update(t){this._$Eq&&(this._$Eq=this._$Eq.forEach((e=>this._$ET(e,this[e])))),this._$EM()}updated(t){}firstUpdated(t){}}E.elementStyles=[],E.shadowRootOptions={mode:"open"},E[w("elementProperties")]=new Map,E[w("finalized")]=new Map,j==null||j({ReactiveElement:E}),(f.reactiveElementVersions??(f.reactiveElementVersions=[])).push("2.1.1");const C=globalThis,N=C.trustedTypes,Y=N?N.createPolicy("lit-html",{createHTML:n=>n}):void 0,tt="$lit$",_=`lit$${Math.random().toFixed(9).slice(2)}$`,et="?"+_,St=`<${et}>`,A=document,P=()=>A.createComment(""),x=n=>n===null||typeof n!="object"&&typeof n!="function",B=Array.isArray,wt=n=>B(n)||typeof(n==null?void 0:n[Symbol.iterator])=="function",q=`[ 	
\f\r]`,O=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,st=/-->/g,it=/>/g,v=RegExp(`>|${q}(?:([^\\s"'>=/]+)(${q}*=${q}*(?:[^ 	
\f\r"'\`<>=]|("|')|))|$)`,"g"),nt=/'/g,rt=/"/g,ot=/^(?:script|style|textarea|title)$/i,b=Symbol.for("lit-noChange"),d=Symbol.for("lit-nothing"),at=new WeakMap,y=A.createTreeWalker(A,129);function ct(n,t){if(!B(n)||!n.hasOwnProperty("raw"))throw Error("invalid template strings array");return Y!==void 0?Y.createHTML(t):t}const Ct=(n,t)=>{const e=n.length-1,s=[];let i,o=t===2?"<svg>":t===3?"<math>":"",r=O;for(let c=0;c<e;c++){const a=n[c];let l,u,h=-1,$=0;for(;$<a.length&&(r.lastIndex=$,u=r.exec(a),u!==null);)$=r.lastIndex,r===O?u[1]==="!--"?r=st:u[1]!==void 0?r=it:u[2]!==void 0?(ot.test(u[2])&&(i=RegExp("</"+u[2],"g")),r=v):u[3]!==void 0&&(r=v):r===v?u[0]===">"?(r=i??O,h=-1):u[1]===void 0?h=-2:(h=r.lastIndex-u[2].length,l=u[1],r=u[3]===void 0?v:u[3]==='"'?rt:nt):r===rt||r===nt?r=v:r===st||r===it?r=O:(r=v,i=void 0);const m=r===v&&n[c+1].startsWith("/>")?" ":"";o+=r===O?a+St:h>=0?(s.push(l),a.slice(0,h)+tt+a.slice(h)+_+m):a+_+(h===-2?c:m)}return[ct(n,o+(n[e]||"<?>")+(t===2?"</svg>":t===3?"</math>":"")),s]};class k{constructor({strings:t,_$litType$:e},s){let i;this.parts=[];let o=0,r=0;const c=t.length-1,a=this.parts,[l,u]=Ct(t,e);if(this.el=k.createElement(l,s),y.currentNode=this.el.content,e===2||e===3){const h=this.el.content.firstChild;h.replaceWith(...h.childNodes)}for(;(i=y.nextNode())!==null&&a.length<c;){if(i.nodeType===1){if(i.hasAttributes())for(const h of i.getAttributeNames())if(h.endsWith(tt)){const $=u[r++],m=i.getAttribute(h).split(_),I=/([.?@])?(.*)/.exec($);a.push({type:1,index:o,name:I[2],strings:m,ctor:I[1]==="."?xt:I[1]==="?"?Ot:I[1]==="@"?kt:L}),i.removeAttribute(h)}else h.startsWith(_)&&(a.push({type:6,index:o}),i.removeAttribute(h));if(ot.test(i.tagName)){const h=i.textContent.split(_),$=h.length-1;if($>0){i.textContent=N?N.emptyScript:"";for(let m=0;m<$;m++)i.append(h[m],P()),y.nextNode(),a.push({type:2,index:++o});i.append(h[$],P())}}}else if(i.nodeType===8)if(i.data===et)a.push({type:2,index:o});else{let h=-1;for(;(h=i.data.indexOf(_,h+1))!==-1;)a.push({type:7,index:o}),h+=_.length-1}o++}}static createElement(t,e){const s=A.createElement("template");return s.innerHTML=t,s}}function S(n,t,e=n,s){var r,c;if(t===b)return t;let i=s!==void 0?(r=e._$Co)==null?void 0:r[s]:e._$Cl;const o=x(t)?void 0:t._$litDirective$;return(i==null?void 0:i.constructor)!==o&&((c=i==null?void 0:i._$AO)==null||c.call(i,!1),o===void 0?i=void 0:(i=new o(n),i._$AT(n,e,s)),s!==void 0?(e._$Co??(e._$Co=[]))[s]=i:e._$Cl=i),i!==void 0&&(t=S(n,i._$AS(n,t.values),i,s)),t}class Pt{constructor(t,e){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=e}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:e},parts:s}=this._$AD,i=((t==null?void 0:t.creationScope)??A).importNode(e,!0);y.currentNode=i;let o=y.nextNode(),r=0,c=0,a=s[0];for(;a!==void 0;){if(r===a.index){let l;a.type===2?l=new M(o,o.nextSibling,this,t):a.type===1?l=new a.ctor(o,a.name,a.strings,this,t):a.type===6&&(l=new Mt(o,this,t)),this._$AV.push(l),a=s[++c]}r!==(a==null?void 0:a.index)&&(o=y.nextNode(),r++)}return y.currentNode=A,i}p(t){let e=0;for(const s of this._$AV)s!==void 0&&(s.strings!==void 0?(s._$AI(t,s,e),e+=s.strings.length-2):s._$AI(t[e])),e++}}class M{get _$AU(){var t;return((t=this._$AM)==null?void 0:t._$AU)??this._$Cv}constructor(t,e,s,i){this.type=2,this._$AH=d,this._$AN=void 0,this._$AA=t,this._$AB=e,this._$AM=s,this.options=i,this._$Cv=(i==null?void 0:i.isConnected)??!0}get parentNode(){let t=this._$AA.parentNode;const e=this._$AM;return e!==void 0&&(t==null?void 0:t.nodeType)===11&&(t=e.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,e=this){t=S(this,t,e),x(t)?t===d||t==null||t===""?(this._$AH!==d&&this._$AR(),this._$AH=d):t!==this._$AH&&t!==b&&this._(t):t._$litType$!==void 0?this.$(t):t.nodeType!==void 0?this.T(t):wt(t)?this.k(t):this._(t)}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t))}_(t){this._$AH!==d&&x(this._$AH)?this._$AA.nextSibling.data=t:this.T(A.createTextNode(t)),this._$AH=t}$(t){var o;const{values:e,_$litType$:s}=t,i=typeof s=="number"?this._$AC(t):(s.el===void 0&&(s.el=k.createElement(ct(s.h,s.h[0]),this.options)),s);if(((o=this._$AH)==null?void 0:o._$AD)===i)this._$AH.p(e);else{const r=new Pt(i,this),c=r.u(this.options);r.p(e),this.T(c),this._$AH=r}}_$AC(t){let e=at.get(t.strings);return e===void 0&&at.set(t.strings,e=new k(t)),e}k(t){B(this._$AH)||(this._$AH=[],this._$AR());const e=this._$AH;let s,i=0;for(const o of t)i===e.length?e.push(s=new M(this.O(P()),this.O(P()),this,this.options)):s=e[i],s._$AI(o),i++;i<e.length&&(this._$AR(s&&s._$AB.nextSibling,i),e.length=i)}_$AR(t=this._$AA.nextSibling,e){var s;for((s=this._$AP)==null?void 0:s.call(this,!1,!0,e);t!==this._$AB;){const i=t.nextSibling;t.remove(),t=i}}setConnected(t){var e;this._$AM===void 0&&(this._$Cv=t,(e=this._$AP)==null||e.call(this,t))}}class L{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,e,s,i,o){this.type=1,this._$AH=d,this._$AN=void 0,this.element=t,this.name=e,this._$AM=i,this.options=o,s.length>2||s[0]!==""||s[1]!==""?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=d}_$AI(t,e=this,s,i){const o=this.strings;let r=!1;if(o===void 0)t=S(this,t,e,0),r=!x(t)||t!==this._$AH&&t!==b,r&&(this._$AH=t);else{const c=t;let a,l;for(t=o[0],a=0;a<o.length-1;a++)l=S(this,c[s+a],e,a),l===b&&(l=this._$AH[a]),r||(r=!x(l)||l!==this._$AH[a]),l===d?t=d:t!==d&&(t+=(l??"")+o[a+1]),this._$AH[a]=l}r&&!i&&this.j(t)}j(t){t===d?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"")}}class xt extends L{constructor(){super(...arguments),this.type=3}j(t){this.element[this.name]=t===d?void 0:t}}class Ot extends L{constructor(){super(...arguments),this.type=4}j(t){this.element.toggleAttribute(this.name,!!t&&t!==d)}}class kt extends L{constructor(t,e,s,i,o){super(t,e,s,i,o),this.type=5}_$AI(t,e=this){if((t=S(this,t,e,0)??d)===b)return;const s=this._$AH,i=t===d&&s!==d||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,o=t!==d&&(s===d||i);i&&this.element.removeEventListener(this.name,this,s),o&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){var e;typeof this._$AH=="function"?this._$AH.call(((e=this.options)==null?void 0:e.host)??this.element,t):this._$AH.handleEvent(t)}}class Mt{constructor(t,e,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=e,this.options=s}get _$AU(){return this._$AM._$AU}_$AI(t){S(this,t)}}const W=C.litHtmlPolyfillSupport;W==null||W(k,M),(C.litHtmlVersions??(C.litHtmlVersions=[])).push("3.3.1");const Ut=(n,t,e)=>{const s=(e==null?void 0:e.renderBefore)??t;let i=s._$litPart$;if(i===void 0){const o=(e==null?void 0:e.renderBefore)??null;s._$litPart$=i=new M(t.insertBefore(P(),o),o,void 0,e??{})}return i._$AI(n),i};const g=globalThis;class U extends E{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){var e;const t=super.createRenderRoot();return(e=this.renderOptions).renderBefore??(e.renderBefore=t.firstChild),t}update(t){const e=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=Ut(e,this.renderRoot,this.renderOptions)}connectedCallback(){var t;super.connectedCallback(),(t=this._$Do)==null||t.setConnected(!0)}disconnectedCallback(){var t;super.disconnectedCallback(),(t=this._$Do)==null||t.setConnected(!1)}render(){return b}}U._$litElement$=!0,U.finalized=!0,(pt=g.litElementHydrateSupport)==null||pt.call(g,{LitElement:U});const V=g.litElementPolyfillSupport;V==null||V({LitElement:U}),(g.litElementVersions??(g.litElementVersions=[])).push("4.2.1");const Tt={attribute:!0,type:String,converter:R,reflect:!1,hasChanged:z},Ht=(n=Tt,t,e)=>{const{kind:s,metadata:i}=e;let o=globalThis.litPropertyMetadata.get(i);if(o===void 0&&globalThis.litPropertyMetadata.set(i,o=new Map),s==="setter"&&((n=Object.create(n)).wrapped=!0),o.set(e.name,n),s==="accessor"){const{name:r}=e;return{set(c){const a=t.get.call(this);t.set.call(this,c),this.requestUpdate(r,a,n)},init(c){return c!==void 0&&this.C(r,void 0,n,c),c}}}if(s==="setter"){const{name:r}=e;return function(c){const a=this[r];t.call(this,c),this.requestUpdate(r,a,n)}}throw Error("Unsupported decorator location: "+s)};function Rt(n){return(t,e)=>typeof e=="object"?Ht(n,t,e):((s,i,o)=>{const r=i.hasOwnProperty(o);return i.constructor.createProperty(o,s),r?Object.getOwnPropertyDescriptor(i,o):void 0})(n,t,e)}var Nt=Object.defineProperty,Lt=Object.getOwnPropertyDescriptor,ht=(n,t,e,s)=>{for(var i=s>1?void 0:s?Lt(t,e):t,o=n.length-1,r;o>=0;o--)(r=n[o])&&(i=(s?r(t,e,i):r(i))||i);return s&&i&&Nt(t,e,i),i};let F=class extends U{disconnectedCallback(){var n;super.disconnectedCallback(),(n=this.callback)==null||n.call(this)}};ht([Rt()],F.prototype,"callback",2),F=ht([T("ae-removed-callback")],F);const It={backIndicatorId:"anki-eco-back-indicator"};function Dt(n,t,e,s){return fetch("https://pla.ikkz.fun/api/event",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({domain:n,name:e,url:`ae://localhost${t}`,props:s})}).catch(()=>{})}function jt(n,t,e){return Dt("anki-eco-ext",n,t,e)}function zt(n){return jt(n,"pageview")}ut();const lt="ankiEcoExtCMSavedDom";function Bt(){return sessionStorage.getItem(lt)}function dt(n){sessionStorage.setItem(lt,n)}window.ankiEcoExtCMClearId&&(clearTimeout(window.ankiEcoExtCMClearId),window.ankiEcoExtCMClearId=void 0);const J=document.getElementById("qa");function qt(n){const t=()=>dt(n.innerHTML);setTimeout(t,0);const e=new MutationObserver(()=>{J.contains(n)&&t()});e.observe(J,{childList:!0,subtree:!0,characterData:!0,attributes:!0});const s=document.createElement("ae-removed-callback");s.callback=()=>{e.disconnect(),window.ankiEcoExtCMClearId=setTimeout(()=>{dt("")},200)},J.appendChild(s)}const p={container:"ae-anim-container",card:"ae-anim-card",face:"ae-card-face",front:"ae-front",back:"ae-back",prev:"ae-prev",hasPrev:"ae-has-prev",animEnded:"ae-anim-ended"};function Wt(){var o;const n=!!document.getElementById(It.backIndicatorId),t=document.querySelector("."+p.container),e=document.querySelector("."+p.card),s=document.querySelector("."+p.face);if(!t||!e||!s)return;const i=Bt();if(qt(s),t.classList.add(n?p.back:p.front),e.classList.add(n?p.back:p.front),s.classList.add(n?p.back:p.front),i){const r=document.createElement("div");if(r.innerHTML=i,r.classList.add(p.face),n)r.classList.add(p.front),e.prepend(r),(o=window.ankiEcoExtCMHooks)==null||o.onFlipCard();else{r.classList.add(p.back);const c=document.createElement("div");c.appendChild(r),c.classList.add(p.card,p.prev),t.classList.add(p.hasPrev),t.prepend(c)}}setTimeout(()=>{requestAnimationFrame(()=>t.classList.add(p.animEnded))},100),n||zt("/card-motion")}Wt()}));
</script>

Back Template

<div id="anki-eco-back-indicator"></div>
<div class="ae-anim-container" data-doc="https://anki.ikkz.fun/">
  <div class="ae-anim-card">
    <div class="ae-card-face">
      {{Back}}
      <hr id="answer" />
      {{Front}}
    </div>
  </div>
</div>

<script>
(function(T){typeof define=="function"&&define.amd?define(T):T()})((function(){"use strict";var pt;const T=n=>(t,e)=>{const s=()=>{customElements.get(n)||customElements.define(n,t)};e?e.addInitializer(s):s()};function ut(){const n=window.console;n.patched||(window.console=new Proxy(n,{get(t,e,s){return Reflect.has(t,e)?Reflect.get(t,e,s):Reflect.get(t,"log",s)}}),window.console.patched=!0)}const H=globalThis,D=H.ShadowRoot&&(H.ShadyCSS===void 0||H.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,K=Symbol(),Z=new WeakMap;let $t=class{constructor(t,e,s){if(this._$cssResult$=!0,s!==K)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e}get styleSheet(){let t=this.o;const e=this.t;if(D&&t===void 0){const s=e!==void 0&&e.length===1;s&&(t=Z.get(e)),t===void 0&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),s&&Z.set(e,t))}return t}toString(){return this.cssText}};const ft=n=>new $t(typeof n=="string"?n:n+"",void 0,K),_t=(n,t)=>{if(D)n.adoptedStyleSheets=t.map((e=>e instanceof CSSStyleSheet?e:e.styleSheet));else for(const e of t){const s=document.createElement("style"),i=H.litNonce;i!==void 0&&s.setAttribute("nonce",i),s.textContent=e.cssText,n.appendChild(s)}},G=D?n=>n:n=>n instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return ft(e)})(n):n;const{is:mt,defineProperty:At,getOwnPropertyDescriptor:vt,getOwnPropertyNames:yt,getOwnPropertySymbols:gt,getPrototypeOf:Et}=Object,f=globalThis,Q=f.trustedTypes,bt=Q?Q.emptyScript:"",j=f.reactiveElementPolyfillSupport,w=(n,t)=>n,R={toAttribute(n,t){switch(t){case Boolean:n=n?bt:null;break;case Object:case Array:n=n==null?n:JSON.stringify(n)}return n},fromAttribute(n,t){let e=n;switch(t){case Boolean:e=n!==null;break;case Number:e=n===null?null:Number(n);break;case Object:case Array:try{e=JSON.parse(n)}catch{e=null}}return e}},z=(n,t)=>!mt(n,t),X={attribute:!0,type:String,converter:R,reflect:!1,useDefault:!1,hasChanged:z};Symbol.metadata??(Symbol.metadata=Symbol("metadata")),f.litPropertyMetadata??(f.litPropertyMetadata=new WeakMap);class E extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??(this.l=[])).push(t)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,e=X){if(e.state&&(e.attribute=!1),this._$Ei(),this.prototype.hasOwnProperty(t)&&((e=Object.create(e)).wrapped=!0),this.elementProperties.set(t,e),!e.noAccessor){const s=Symbol(),i=this.getPropertyDescriptor(t,s,e);i!==void 0&&At(this.prototype,t,i)}}static getPropertyDescriptor(t,e,s){const{get:i,set:o}=vt(this.prototype,t)??{get(){return this[e]},set(r){this[e]=r}};return{get:i,set(r){const c=i==null?void 0:i.call(this);o==null||o.call(this,r),this.requestUpdate(t,c,s)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)??X}static _$Ei(){if(this.hasOwnProperty(w("elementProperties")))return;const t=Et(this);t.finalize(),t.l!==void 0&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties)}static finalize(){if(this.hasOwnProperty(w("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(w("properties"))){const e=this.properties,s=[...yt(e),...gt(e)];for(const i of s)this.createProperty(i,e[i])}const t=this[Symbol.metadata];if(t!==null){const e=litPropertyMetadata.get(t);if(e!==void 0)for(const[s,i]of e)this.elementProperties.set(s,i)}this._$Eh=new Map;for(const[e,s]of this.elementProperties){const i=this._$Eu(e,s);i!==void 0&&this._$Eh.set(i,e)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(t){const e=[];if(Array.isArray(t)){const s=new Set(t.flat(1/0).reverse());for(const i of s)e.unshift(G(i))}else t!==void 0&&e.push(G(t));return e}static _$Eu(t,e){const s=e.attribute;return s===!1?void 0:typeof s=="string"?s:typeof t=="string"?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){var t;this._$ES=new Promise((e=>this.enableUpdating=e)),this._$AL=new Map,this._$E_(),this.requestUpdate(),(t=this.constructor.l)==null||t.forEach((e=>e(this)))}addController(t){var e;(this._$EO??(this._$EO=new Set)).add(t),this.renderRoot!==void 0&&this.isConnected&&((e=t.hostConnected)==null||e.call(t))}removeController(t){var e;(e=this._$EO)==null||e.delete(t)}_$E_(){const t=new Map,e=this.constructor.elementProperties;for(const s of e.keys())this.hasOwnProperty(s)&&(t.set(s,this[s]),delete this[s]);t.size>0&&(this._$Ep=t)}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return _t(t,this.constructor.elementStyles),t}connectedCallback(){var t;this.renderRoot??(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),(t=this._$EO)==null||t.forEach((e=>{var s;return(s=e.hostConnected)==null?void 0:s.call(e)}))}enableUpdating(t){}disconnectedCallback(){var t;(t=this._$EO)==null||t.forEach((e=>{var s;return(s=e.hostDisconnected)==null?void 0:s.call(e)}))}attributeChangedCallback(t,e,s){this._$AK(t,s)}_$ET(t,e){var o;const s=this.constructor.elementProperties.get(t),i=this.constructor._$Eu(t,s);if(i!==void 0&&s.reflect===!0){const r=(((o=s.converter)==null?void 0:o.toAttribute)!==void 0?s.converter:R).toAttribute(e,s.type);this._$Em=t,r==null?this.removeAttribute(i):this.setAttribute(i,r),this._$Em=null}}_$AK(t,e){var o,r;const s=this.constructor,i=s._$Eh.get(t);if(i!==void 0&&this._$Em!==i){const c=s.getPropertyOptions(i),a=typeof c.converter=="function"?{fromAttribute:c.converter}:((o=c.converter)==null?void 0:o.fromAttribute)!==void 0?c.converter:R;this._$Em=i;const l=a.fromAttribute(e,c.type);this[i]=l??((r=this._$Ej)==null?void 0:r.get(i))??l,this._$Em=null}}requestUpdate(t,e,s){var i;if(t!==void 0){const o=this.constructor,r=this[t];if(s??(s=o.getPropertyOptions(t)),!((s.hasChanged??z)(r,e)||s.useDefault&&s.reflect&&r===((i=this._$Ej)==null?void 0:i.get(t))&&!this.hasAttribute(o._$Eu(t,s))))return;this.C(t,e,s)}this.isUpdatePending===!1&&(this._$ES=this._$EP())}C(t,e,{useDefault:s,reflect:i,wrapped:o},r){s&&!(this._$Ej??(this._$Ej=new Map)).has(t)&&(this._$Ej.set(t,r??e??this[t]),o!==!0||r!==void 0)||(this._$AL.has(t)||(this.hasUpdated||s||(e=void 0),this._$AL.set(t,e)),i===!0&&this._$Em!==t&&(this._$Eq??(this._$Eq=new Set)).add(t))}async _$EP(){this.isUpdatePending=!0;try{await this._$ES}catch(e){Promise.reject(e)}const t=this.scheduleUpdate();return t!=null&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){var s;if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??(this.renderRoot=this.createRenderRoot()),this._$Ep){for(const[o,r]of this._$Ep)this[o]=r;this._$Ep=void 0}const i=this.constructor.elementProperties;if(i.size>0)for(const[o,r]of i){const{wrapped:c}=r,a=this[o];c!==!0||this._$AL.has(o)||a===void 0||this.C(o,void 0,r,a)}}let t=!1;const e=this._$AL;try{t=this.shouldUpdate(e),t?(this.willUpdate(e),(s=this._$EO)==null||s.forEach((i=>{var o;return(o=i.hostUpdate)==null?void 0:o.call(i)})),this.update(e)):this._$EM()}catch(i){throw t=!1,this._$EM(),i}t&&this._$AE(e)}willUpdate(t){}_$AE(t){var e;(e=this._$EO)==null||e.forEach((s=>{var i;return(i=s.hostUpdated)==null?void 0:i.call(s)})),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$EM(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return!0}update(t){this._$Eq&&(this._$Eq=this._$Eq.forEach((e=>this._$ET(e,this[e])))),this._$EM()}updated(t){}firstUpdated(t){}}E.elementStyles=[],E.shadowRootOptions={mode:"open"},E[w("elementProperties")]=new Map,E[w("finalized")]=new Map,j==null||j({ReactiveElement:E}),(f.reactiveElementVersions??(f.reactiveElementVersions=[])).push("2.1.1");const C=globalThis,N=C.trustedTypes,Y=N?N.createPolicy("lit-html",{createHTML:n=>n}):void 0,tt="$lit$",_=`lit$${Math.random().toFixed(9).slice(2)}$`,et="?"+_,St=`<${et}>`,A=document,P=()=>A.createComment(""),x=n=>n===null||typeof n!="object"&&typeof n!="function",B=Array.isArray,wt=n=>B(n)||typeof(n==null?void 0:n[Symbol.iterator])=="function",q=`[ 	
\f\r]`,O=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,st=/-->/g,it=/>/g,v=RegExp(`>|${q}(?:([^\\s"'>=/]+)(${q}*=${q}*(?:[^ 	
\f\r"'\`<>=]|("|')|))|$)`,"g"),nt=/'/g,rt=/"/g,ot=/^(?:script|style|textarea|title)$/i,b=Symbol.for("lit-noChange"),d=Symbol.for("lit-nothing"),at=new WeakMap,y=A.createTreeWalker(A,129);function ct(n,t){if(!B(n)||!n.hasOwnProperty("raw"))throw Error("invalid template strings array");return Y!==void 0?Y.createHTML(t):t}const Ct=(n,t)=>{const e=n.length-1,s=[];let i,o=t===2?"<svg>":t===3?"<math>":"",r=O;for(let c=0;c<e;c++){const a=n[c];let l,u,h=-1,$=0;for(;$<a.length&&(r.lastIndex=$,u=r.exec(a),u!==null);)$=r.lastIndex,r===O?u[1]==="!--"?r=st:u[1]!==void 0?r=it:u[2]!==void 0?(ot.test(u[2])&&(i=RegExp("</"+u[2],"g")),r=v):u[3]!==void 0&&(r=v):r===v?u[0]===">"?(r=i??O,h=-1):u[1]===void 0?h=-2:(h=r.lastIndex-u[2].length,l=u[1],r=u[3]===void 0?v:u[3]==='"'?rt:nt):r===rt||r===nt?r=v:r===st||r===it?r=O:(r=v,i=void 0);const m=r===v&&n[c+1].startsWith("/>")?" ":"";o+=r===O?a+St:h>=0?(s.push(l),a.slice(0,h)+tt+a.slice(h)+_+m):a+_+(h===-2?c:m)}return[ct(n,o+(n[e]||"<?>")+(t===2?"</svg>":t===3?"</math>":"")),s]};class k{constructor({strings:t,_$litType$:e},s){let i;this.parts=[];let o=0,r=0;const c=t.length-1,a=this.parts,[l,u]=Ct(t,e);if(this.el=k.createElement(l,s),y.currentNode=this.el.content,e===2||e===3){const h=this.el.content.firstChild;h.replaceWith(...h.childNodes)}for(;(i=y.nextNode())!==null&&a.length<c;){if(i.nodeType===1){if(i.hasAttributes())for(const h of i.getAttributeNames())if(h.endsWith(tt)){const $=u[r++],m=i.getAttribute(h).split(_),I=/([.?@])?(.*)/.exec($);a.push({type:1,index:o,name:I[2],strings:m,ctor:I[1]==="."?xt:I[1]==="?"?Ot:I[1]==="@"?kt:L}),i.removeAttribute(h)}else h.startsWith(_)&&(a.push({type:6,index:o}),i.removeAttribute(h));if(ot.test(i.tagName)){const h=i.textContent.split(_),$=h.length-1;if($>0){i.textContent=N?N.emptyScript:"";for(let m=0;m<$;m++)i.append(h[m],P()),y.nextNode(),a.push({type:2,index:++o});i.append(h[$],P())}}}else if(i.nodeType===8)if(i.data===et)a.push({type:2,index:o});else{let h=-1;for(;(h=i.data.indexOf(_,h+1))!==-1;)a.push({type:7,index:o}),h+=_.length-1}o++}}static createElement(t,e){const s=A.createElement("template");return s.innerHTML=t,s}}function S(n,t,e=n,s){var r,c;if(t===b)return t;let i=s!==void 0?(r=e._$Co)==null?void 0:r[s]:e._$Cl;const o=x(t)?void 0:t._$litDirective$;return(i==null?void 0:i.constructor)!==o&&((c=i==null?void 0:i._$AO)==null||c.call(i,!1),o===void 0?i=void 0:(i=new o(n),i._$AT(n,e,s)),s!==void 0?(e._$Co??(e._$Co=[]))[s]=i:e._$Cl=i),i!==void 0&&(t=S(n,i._$AS(n,t.values),i,s)),t}class Pt{constructor(t,e){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=e}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:e},parts:s}=this._$AD,i=((t==null?void 0:t.creationScope)??A).importNode(e,!0);y.currentNode=i;let o=y.nextNode(),r=0,c=0,a=s[0];for(;a!==void 0;){if(r===a.index){let l;a.type===2?l=new M(o,o.nextSibling,this,t):a.type===1?l=new a.ctor(o,a.name,a.strings,this,t):a.type===6&&(l=new Mt(o,this,t)),this._$AV.push(l),a=s[++c]}r!==(a==null?void 0:a.index)&&(o=y.nextNode(),r++)}return y.currentNode=A,i}p(t){let e=0;for(const s of this._$AV)s!==void 0&&(s.strings!==void 0?(s._$AI(t,s,e),e+=s.strings.length-2):s._$AI(t[e])),e++}}class M{get _$AU(){var t;return((t=this._$AM)==null?void 0:t._$AU)??this._$Cv}constructor(t,e,s,i){this.type=2,this._$AH=d,this._$AN=void 0,this._$AA=t,this._$AB=e,this._$AM=s,this.options=i,this._$Cv=(i==null?void 0:i.isConnected)??!0}get parentNode(){let t=this._$AA.parentNode;const e=this._$AM;return e!==void 0&&(t==null?void 0:t.nodeType)===11&&(t=e.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,e=this){t=S(this,t,e),x(t)?t===d||t==null||t===""?(this._$AH!==d&&this._$AR(),this._$AH=d):t!==this._$AH&&t!==b&&this._(t):t._$litType$!==void 0?this.$(t):t.nodeType!==void 0?this.T(t):wt(t)?this.k(t):this._(t)}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t))}_(t){this._$AH!==d&&x(this._$AH)?this._$AA.nextSibling.data=t:this.T(A.createTextNode(t)),this._$AH=t}$(t){var o;const{values:e,_$litType$:s}=t,i=typeof s=="number"?this._$AC(t):(s.el===void 0&&(s.el=k.createElement(ct(s.h,s.h[0]),this.options)),s);if(((o=this._$AH)==null?void 0:o._$AD)===i)this._$AH.p(e);else{const r=new Pt(i,this),c=r.u(this.options);r.p(e),this.T(c),this._$AH=r}}_$AC(t){let e=at.get(t.strings);return e===void 0&&at.set(t.strings,e=new k(t)),e}k(t){B(this._$AH)||(this._$AH=[],this._$AR());const e=this._$AH;let s,i=0;for(const o of t)i===e.length?e.push(s=new M(this.O(P()),this.O(P()),this,this.options)):s=e[i],s._$AI(o),i++;i<e.length&&(this._$AR(s&&s._$AB.nextSibling,i),e.length=i)}_$AR(t=this._$AA.nextSibling,e){var s;for((s=this._$AP)==null?void 0:s.call(this,!1,!0,e);t!==this._$AB;){const i=t.nextSibling;t.remove(),t=i}}setConnected(t){var e;this._$AM===void 0&&(this._$Cv=t,(e=this._$AP)==null||e.call(this,t))}}class L{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,e,s,i,o){this.type=1,this._$AH=d,this._$AN=void 0,this.element=t,this.name=e,this._$AM=i,this.options=o,s.length>2||s[0]!==""||s[1]!==""?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=d}_$AI(t,e=this,s,i){const o=this.strings;let r=!1;if(o===void 0)t=S(this,t,e,0),r=!x(t)||t!==this._$AH&&t!==b,r&&(this._$AH=t);else{const c=t;let a,l;for(t=o[0],a=0;a<o.length-1;a++)l=S(this,c[s+a],e,a),l===b&&(l=this._$AH[a]),r||(r=!x(l)||l!==this._$AH[a]),l===d?t=d:t!==d&&(t+=(l??"")+o[a+1]),this._$AH[a]=l}r&&!i&&this.j(t)}j(t){t===d?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"")}}class xt extends L{constructor(){super(...arguments),this.type=3}j(t){this.element[this.name]=t===d?void 0:t}}class Ot extends L{constructor(){super(...arguments),this.type=4}j(t){this.element.toggleAttribute(this.name,!!t&&t!==d)}}class kt extends L{constructor(t,e,s,i,o){super(t,e,s,i,o),this.type=5}_$AI(t,e=this){if((t=S(this,t,e,0)??d)===b)return;const s=this._$AH,i=t===d&&s!==d||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,o=t!==d&&(s===d||i);i&&this.element.removeEventListener(this.name,this,s),o&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){var e;typeof this._$AH=="function"?this._$AH.call(((e=this.options)==null?void 0:e.host)??this.element,t):this._$AH.handleEvent(t)}}class Mt{constructor(t,e,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=e,this.options=s}get _$AU(){return this._$AM._$AU}_$AI(t){S(this,t)}}const W=C.litHtmlPolyfillSupport;W==null||W(k,M),(C.litHtmlVersions??(C.litHtmlVersions=[])).push("3.3.1");const Ut=(n,t,e)=>{const s=(e==null?void 0:e.renderBefore)??t;let i=s._$litPart$;if(i===void 0){const o=(e==null?void 0:e.renderBefore)??null;s._$litPart$=i=new M(t.insertBefore(P(),o),o,void 0,e??{})}return i._$AI(n),i};const g=globalThis;class U extends E{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){var e;const t=super.createRenderRoot();return(e=this.renderOptions).renderBefore??(e.renderBefore=t.firstChild),t}update(t){const e=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=Ut(e,this.renderRoot,this.renderOptions)}connectedCallback(){var t;super.connectedCallback(),(t=this._$Do)==null||t.setConnected(!0)}disconnectedCallback(){var t;super.disconnectedCallback(),(t=this._$Do)==null||t.setConnected(!1)}render(){return b}}U._$litElement$=!0,U.finalized=!0,(pt=g.litElementHydrateSupport)==null||pt.call(g,{LitElement:U});const V=g.litElementPolyfillSupport;V==null||V({LitElement:U}),(g.litElementVersions??(g.litElementVersions=[])).push("4.2.1");const Tt={attribute:!0,type:String,converter:R,reflect:!1,hasChanged:z},Ht=(n=Tt,t,e)=>{const{kind:s,metadata:i}=e;let o=globalThis.litPropertyMetadata.get(i);if(o===void 0&&globalThis.litPropertyMetadata.set(i,o=new Map),s==="setter"&&((n=Object.create(n)).wrapped=!0),o.set(e.name,n),s==="accessor"){const{name:r}=e;return{set(c){const a=t.get.call(this);t.set.call(this,c),this.requestUpdate(r,a,n)},init(c){return c!==void 0&&this.C(r,void 0,n,c),c}}}if(s==="setter"){const{name:r}=e;return function(c){const a=this[r];t.call(this,c),this.requestUpdate(r,a,n)}}throw Error("Unsupported decorator location: "+s)};function Rt(n){return(t,e)=>typeof e=="object"?Ht(n,t,e):((s,i,o)=>{const r=i.hasOwnProperty(o);return i.constructor.createProperty(o,s),r?Object.getOwnPropertyDescriptor(i,o):void 0})(n,t,e)}var Nt=Object.defineProperty,Lt=Object.getOwnPropertyDescriptor,ht=(n,t,e,s)=>{for(var i=s>1?void 0:s?Lt(t,e):t,o=n.length-1,r;o>=0;o--)(r=n[o])&&(i=(s?r(t,e,i):r(i))||i);return s&&i&&Nt(t,e,i),i};let F=class extends U{disconnectedCallback(){var n;super.disconnectedCallback(),(n=this.callback)==null||n.call(this)}};ht([Rt()],F.prototype,"callback",2),F=ht([T("ae-removed-callback")],F);const It={backIndicatorId:"anki-eco-back-indicator"};function Dt(n,t,e,s){return fetch("https://pla.ikkz.fun/api/event",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({domain:n,name:e,url:`ae://localhost${t}`,props:s})}).catch(()=>{})}function jt(n,t,e){return Dt("anki-eco-ext",n,t,e)}function zt(n){return jt(n,"pageview")}ut();const lt="ankiEcoExtCMSavedDom";function Bt(){return sessionStorage.getItem(lt)}function dt(n){sessionStorage.setItem(lt,n)}window.ankiEcoExtCMClearId&&(clearTimeout(window.ankiEcoExtCMClearId),window.ankiEcoExtCMClearId=void 0);const J=document.getElementById("qa");function qt(n){const t=()=>dt(n.innerHTML);setTimeout(t,0);const e=new MutationObserver(()=>{J.contains(n)&&t()});e.observe(J,{childList:!0,subtree:!0,characterData:!0,attributes:!0});const s=document.createElement("ae-removed-callback");s.callback=()=>{e.disconnect(),window.ankiEcoExtCMClearId=setTimeout(()=>{dt("")},200)},J.appendChild(s)}const p={container:"ae-anim-container",card:"ae-anim-card",face:"ae-card-face",front:"ae-front",back:"ae-back",prev:"ae-prev",hasPrev:"ae-has-prev",animEnded:"ae-anim-ended"};function Wt(){var o;const n=!!document.getElementById(It.backIndicatorId),t=document.querySelector("."+p.container),e=document.querySelector("."+p.card),s=document.querySelector("."+p.face);if(!t||!e||!s)return;const i=Bt();if(qt(s),t.classList.add(n?p.back:p.front),e.classList.add(n?p.back:p.front),s.classList.add(n?p.back:p.front),i){const r=document.createElement("div");if(r.innerHTML=i,r.classList.add(p.face),n)r.classList.add(p.front),e.prepend(r),(o=window.ankiEcoExtCMHooks)==null||o.onFlipCard();else{r.classList.add(p.back);const c=document.createElement("div");c.appendChild(r),c.classList.add(p.card,p.prev),t.classList.add(p.hasPrev),t.prepend(c)}}setTimeout(()=>{requestAnimationFrame(()=>t.classList.add(p.animEnded))},100),n||zt("/card-motion")}Wt()}));
</script>

Styling

:root {
  --ae-card-height: 600px;
  --ae-card-width: 80vw;
  --ae-card-border-radius: 8px;
}

@media (prefers-color-scheme: dark) {
  :root {
    --ae-front-bg: #1e1e1e;
    --ae-back-bg: #2c2c2c;
    --ae-card-border: 1px solid #2c2c2c;
  }
}

.ae-anim-container {
  height: var(--ae-card-height);
  margin: 24px;
  perspective: 1000px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.ae-anim-card {
  width: var(--ae-card-width);
  height: var(--ae-card-height);
  max-width: 65ch;
  position: absolute;
  inset: 0;
  margin: 0 auto;

  transform-style: preserve-3d;
  transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2), 0 5px 10px rgba(0, 0, 0, 0.1);
  border-radius: var(--ae-card-border-radius);
}

.ae-card-face {
  padding: 16px;
  position: absolute;
  inset: 0;
  overflow: hidden;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  border-radius: var(--ae-card-border-radius);
  border: var(--ae-card-border, 1px solid #e0e0e0);
}

.ae-card-face.ae-front {
  transform: rotateY(0);
  background: var(--ae-front-bg, #ffffff);
}

.ae-card-face.ae-back {
  transform: rotateY(180deg);
  background: var(--ae-back-bg, #f7f7f7);
}

.ae-prev .ae-card-face.ae-back {
  transform: rotateY(0);
}

/* front has prev */
.ae-has-prev .ae-anim-card.ae-prev {
  transform: translate(0);
}

.ae-has-prev .ae-anim-card.ae-front {
  transform: translateY(calc(-100px - var(--ae-card-height)));
}

.ae-anim-ended.ae-has-prev .ae-anim-card.ae-prev {
  transform: translateX(calc(0px - 100vw));
}
.ae-anim-ended.ae-has-prev .ae-anim-card.ae-front {
  transform: translate(0);
}

/* back */
.ae-anim-card {
  transform: rotateY(0);
}

.ae-anim-ended.ae-back .ae-anim-card {
  transform: rotateY(-180deg);
}

通过下载 Deck 安装

你也可以从 AnkiWeb 直接下载，但这里的文件基本不会是最新的。如果你希望获取最新的代码，请直接使用第一种安装方式

自定义

样式

在 Styling 顶部已预定义了一些 CSS 变量，如果满足需求请优先修改此处的值

:root {
  --ae-card-height: 600px; /* 卡片高度 */
  --ae-card-width: 80vw; /* 卡片宽度 */
  --ae-card-border-radius: 8px; /* 卡片圆角大小 */
  --ae-front-bg: #1e1e1e; /*卡片前面背景*/
  --ae-back-bg: #2c2c2c; /*卡片背面背景*/
  --ae-card-border: 1px solid #2c2c2c; /*卡片边框颜色*/
}

当然你也可以修改其他高级样式，例如阴影样式、动画速度与曲线等等，可以结合 LLM 进行修改 CSS

卡片翻转回调

通过设置以下全局变量，在卡片卡片翻转时进行一些操作，例如播放声音

window.ankiEcoExtCMHooks = {
  onFlipCard: () => {
    console.log('play sound or sth');
  },
};

反馈

如果你有任何问题或建议，请在 GitHub 上提交

如果你觉得有用，欢迎 star 🌟：GitHub