on-codemerge
Version:
A WYSIWYG editor for on-codemerge is a user-friendly interface that allows users to edit and view their code in real time, exactly as it will appear in the final product
16 lines (15 loc) • 4.74 kB
JavaScript
/*! on-codemerge v1.3.1 @author Pavel Kuzmin @license MIT @homepage https://s00d.github.io/on-codemerge/ @repository git+https://github.com/s00d/on-codemerge.git Copyright (c) 2026 Pavel Kuzmin - Built on 2026-07-02T13:39:17.947Z */
"use strict";var f=Object.defineProperty;var g=(o,t,e)=>t in o?f(o,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):o[t]=e;var p=(o,t,e)=>g(o,typeof t!="symbol"?t+"":t,e);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("../../../core/ui/PopupManager.cjs"),T=require("./TimerForm.cjs");class w{constructor(t,e){p(this,"popup");p(this,"editor");p(this,"manager");p(this,"onSelect",null);this.editor=e,this.manager=t,this.popup=this.createMainPopup()}createMainPopup(){return new l.PopupManager(this.editor,{title:this.editor.t("Timer"),className:"timer-menu",closeOnClickOutside:!0,buttons:[{label:this.editor.t("Import"),variant:"secondary",onClick:()=>this.showImportDialog()},{label:this.editor.t("New Timer"),variant:"primary",onClick:()=>this.showNewTimerForm()}],items:[{type:"custom",id:"timers-content",content:()=>this.createTimersList()}]})}createTimersList(){const t=document.createElement("div");t.className="timers-list";const e=this.manager.getTimers();if(e.length===0){const i=document.createElement("div");i.className="empty-state",i.innerHTML=`
<p>${this.editor.t("No timers found")}</p>
<p>${this.editor.t("Create your first timer to get started")}</p>
`,t.appendChild(i)}else e.forEach(i=>{const s=this.createTimerItem(i);t.appendChild(s)});return t}createTimerItem(t){const e=this.manager.getTimeLeft(t),i=document.createElement("div");i.className="timer-item";const s=e.isExpired?"expired":"active",n=e.isExpired?"Истек":"Активен";return i.innerHTML=`
<div class="timer-info">
<h4 class="timer-title">${t.title}</h4>
<p class="timer-description">${t.description||""}</p>
<div class="timer-status ${s}">${n}</div>
</div>
<div class="timer-actions">
<button class="btn-edit" title="${this.editor.t("Edit")}">✏️</button>
<button class="btn-delete" title="${this.editor.t("Delete")}">🗑️</button>
</div>
`,i.addEventListener("click",r=>{r.target.classList.contains("btn-edit")?(r.stopPropagation(),this.showEditTimerForm(t)):r.target.classList.contains("btn-delete")?(r.stopPropagation(),this.handleDeleteTimer(t)):this.handleSelectTimer(t)}),i}createFormPopup(t,e,i,s){this.popup=new l.PopupManager(this.editor,{title:this.editor.t(t),className:"timer-menu",closeOnClickOutside:!0,buttons:[{label:this.editor.t("Cancel"),variant:"secondary",onClick:()=>{s?s():this.popup.hide()}},{label:this.editor.t(i),variant:"primary",onClick:()=>{this.editor.ensureEditorFocus(),e.submit()}}],items:[{type:"custom",id:"form-content",content:()=>e.getElement()}]}),this.popup.show()}showNewTimerForm(t){this.popup&&this.popup.hide();const e=new T.TimerForm(this.editor,i=>{const s=this.manager.createTimer(i);this.popup.hide(),e.destroy(),this.popup=this.createMainPopup(),this.popup.show(),t&&s&&t(s)});this.createFormPopup("New Timer",e,"Create",()=>{e.destroy(),this.popup.hide(),this.popup=this.createMainPopup(),this.popup.show()})}showEditTimerForm(t){this.popup&&this.popup.hide();const e=new T.TimerForm(this.editor,i=>{this.manager.updateTimer(t.id,i),this.popup.hide(),e.destroy(),this.popup=this.createMainPopup(),this.popup.show()},t);this.createFormPopup("Edit Timer",e,"Update",()=>{e.destroy(),this.popup=this.createMainPopup(),this.popup.show()})}handleSelectTimer(t){var e;(e=this.onSelect)==null||e.call(this,t),this.popup.hide()}handleDeleteTimer(t){confirm(this.editor.t("Are you sure you want to delete this timer?"))&&(this.manager.deleteTimer(t.id),this.popup.hide(),this.popup=this.createMainPopup(),this.popup.show())}show(t){this.onSelect=t,this.popup.show()}showImportDialog(){const t=document.createElement("input");t.type="file",t.accept=".json",t.onchange=e=>{var s;const i=(s=e.target.files)==null?void 0:s[0];if(i){const n=new FileReader;n.onload=r=>{var a,h,c,u,m;try{const d=JSON.parse((a=r.target)==null?void 0:a.result);this.manager.importTimer(d),(c=this.editor)==null||c.showSuccessNotification(((h=this.editor)==null?void 0:h.t("Timer imported successfully"))||"Timer imported successfully"),this.popup.hide(),this.popup=this.createMainPopup(),this.popup.show()}catch{(m=this.editor)==null||m.showErrorNotification(((u=this.editor)==null?void 0:u.t("Import failed"))||"Import failed")}},n.readAsText(i)}},t.click()}destroy(){this.popup&&(this.popup.hide(),typeof this.popup.destroy=="function"&&this.popup.destroy(),this.popup=null),this.editor=null,this.manager=null,this.onSelect=null}}exports.TimerMenu=w;