zenterflow.github.io/script.js at main · ZenterFlow/zenterflow.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
// ================================
// Clipboard Utility Function
// ================================
function copyTextToClipboard(text, btn, successText = "Copied!", resetText = "Copy", timeout = 1200) {
  navigator.clipboard.writeText(text).then(() => {
    btn.textContent = successText;
    setTimeout(() => (btn.textContent = resetText), timeout);
  }).catch(err => console.error("Clipboard error:", err));
}

// ================================
// 1. Copy Code Buttons (Delegation)
// ================================
document.addEventListener("click", function (e) {
  if (e.target.classList.contains("copy-btn")) {
    const targetId = e.target.getAttribute("data-target");
    const codeElement = document.getElementById(targetId);
    if (codeElement) {
      const code = codeElement.innerText;
      copyTextToClipboard(code, e.target, "Copied!", "Copy", 1500);
    }
  }
});

// ================================
// 2. Copy Single URL (Reusable)
// ================================
function copyUrl(url, event) {
  copyTextToClipboard(url, event.target, "✅", "CC", 800);
}

// ================================
// 3. Copy All Asset URLs
// ================================
function copyAssets(event) {
  const urls = Array.from(document.querySelectorAll("#stack-assets a"))
    .map((a) => a.href)
    .join("\n");
  copyTextToClipboard(urls, event.target, "✅ Copied!", "CC Copy URLs");
}

// ================================
// 4. Copy All Tool URLs
// ================================
document.addEventListener("DOMContentLoaded", () => {
  const copyAllToolsBtn = document.getElementById("copyAllTools");
  if (copyAllToolsBtn) {
    copyAllToolsBtn.addEventListener("click", (event) => {
      const urls = [
        "https://git-scm.com/",
        "https://nixos.org/",
        "https://docker.com/",
        "https://developer.hashicorp.com/terraform/",
        "https://kubernetes.io/",
        "https://argo-cd.readthedocs.io/en/stable/",
        "https://dspy.ai/",
        "https://www.openpolicyagent.org/",
      ].join("\n");
      copyTextToClipboard(urls, event.target, "✅ Copied!", "CC All");
    });
  }
});

// ================================
// 5. Syntax Highlighting
// ================================
document.addEventListener("DOMContentLoaded", () => {
  if (typeof hljs !== "undefined") {
    hljs.highlightAll();
  } else {
    console.warn("Highlight.js is not loaded.");
  }
});

  let contextMenu;
  let selectedElement;

  document.addEventListener('contextmenu', function(event) {
    event.preventDefault();
    selectedElement = event.target;
    contextMenu = document.getElementById('customContextMenu');
    contextMenu.style.display = 'block';
    contextMenu.style.left = event.pageX + 'px';
    contextMenu.style.top = event.pageY + 'px';
  });

  document.addEventListener('click', function() {
    contextMenu.style.display = 'none';
  });

  function copyText() {
    if (selectedElement.tagName === 'P' || selectedElement.tagName === 'PRE') {
      navigator.clipboard.writeText(selectedElement.textContent);
    }
  }

  function openLinkNewTab() {
    if (selectedElement.tagName === 'A') {
      window.open(selectedElement.href, '_blank');
    }
  }

  function downloadAsset() {
    if (selectedElement.tagName === 'A' && selectedElement.download) {
      selectedElement.click();
    }
  }

  function copyURL() {
    if (selectedElement.tagName === 'A') {
      navigator.clipboard.writeText(selectedElement.href);
    }
  }

  function viewImage() {
    if (selectedElement.tagName === 'IMG') {
      window.open(selectedElement.src, '_blank');
    }
  }