snapexcel 1.0.0 → 1.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.idea/DesktopScreenshotTool.iml +9 -0
- package/.idea/copilot.data.migration.agent.xml +6 -0
- package/.idea/misc.xml +6 -0
- package/.idea/modules.xml +8 -0
- package/.idea/vcs.xml +6 -0
- package/NPM_INSTALL_GUIDE.html +514 -0
- package/NPM_INSTALL_GUIDE.md +131 -0
- package/package.json +1 -1
- package/src/index.html +35 -0
- package/src/main.js +22 -0
- package/src/renderer.js +538 -15
- package/src/styles.css +231 -14
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
|
+
<module type="JAVA_MODULE" version="4">
|
|
3
|
+
<component name="NewModuleRootManager" inherit-compiler-output="true">
|
|
4
|
+
<exclude-output />
|
|
5
|
+
<content url="file://$MODULE_DIR$" />
|
|
6
|
+
<orderEntry type="inheritedJdk" />
|
|
7
|
+
<orderEntry type="sourceFolder" forTests="false" />
|
|
8
|
+
</component>
|
|
9
|
+
</module>
|
package/.idea/misc.xml
ADDED
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
|
+
<project version="4">
|
|
3
|
+
<component name="ProjectRootManager" version="2" languageLevel="JDK_23" default="true" project-jdk-name="23" project-jdk-type="JavaSDK">
|
|
4
|
+
<output url="file://$PROJECT_DIR$/out" />
|
|
5
|
+
</component>
|
|
6
|
+
</project>
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
|
+
<project version="4">
|
|
3
|
+
<component name="ProjectModuleManager">
|
|
4
|
+
<modules>
|
|
5
|
+
<module fileurl="file://$PROJECT_DIR$/.idea/DesktopScreenshotTool.iml" filepath="$PROJECT_DIR$/.idea/DesktopScreenshotTool.iml" />
|
|
6
|
+
</modules>
|
|
7
|
+
</component>
|
|
8
|
+
</project>
|
package/.idea/vcs.xml
ADDED
|
@@ -0,0 +1,514 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
+
<title>SnapExcel - NPM Installation Guide</title>
|
|
7
|
+
<style>
|
|
8
|
+
* {
|
|
9
|
+
margin: 0;
|
|
10
|
+
padding: 0;
|
|
11
|
+
box-sizing: border-box;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
body {
|
|
15
|
+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
|
|
16
|
+
background: linear-gradient(135deg, #f5f7fa 0%, #e4e8ec 100%);
|
|
17
|
+
color: #333;
|
|
18
|
+
line-height: 1.6;
|
|
19
|
+
min-height: 100vh;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
.container {
|
|
23
|
+
max-width: 900px;
|
|
24
|
+
margin: 0 auto;
|
|
25
|
+
padding: 40px 20px;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
.header {
|
|
29
|
+
text-align: center;
|
|
30
|
+
margin-bottom: 40px;
|
|
31
|
+
padding: 40px;
|
|
32
|
+
background: linear-gradient(135deg, #041E42 0%, #0071DC 100%);
|
|
33
|
+
border-radius: 16px;
|
|
34
|
+
color: white;
|
|
35
|
+
box-shadow: 0 10px 40px rgba(4, 30, 66, 0.3);
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
.header h1 {
|
|
39
|
+
font-size: 2.5rem;
|
|
40
|
+
margin-bottom: 10px;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
.header p {
|
|
44
|
+
font-size: 1.1rem;
|
|
45
|
+
opacity: 0.9;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.npm-badge {
|
|
49
|
+
display: inline-block;
|
|
50
|
+
margin-top: 15px;
|
|
51
|
+
padding: 8px 20px;
|
|
52
|
+
background: #cb3837;
|
|
53
|
+
border-radius: 20px;
|
|
54
|
+
font-size: 0.9rem;
|
|
55
|
+
font-weight: 600;
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
.section {
|
|
59
|
+
background: white;
|
|
60
|
+
border-radius: 16px;
|
|
61
|
+
padding: 30px;
|
|
62
|
+
margin-bottom: 25px;
|
|
63
|
+
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
.section h2 {
|
|
67
|
+
color: #041E42;
|
|
68
|
+
font-size: 1.5rem;
|
|
69
|
+
margin-bottom: 20px;
|
|
70
|
+
padding-bottom: 10px;
|
|
71
|
+
border-bottom: 3px solid #0071DC;
|
|
72
|
+
display: flex;
|
|
73
|
+
align-items: center;
|
|
74
|
+
gap: 10px;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
.section h2 .icon {
|
|
78
|
+
font-size: 1.5rem;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
.prereq-list {
|
|
82
|
+
list-style: none;
|
|
83
|
+
padding: 0;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
.prereq-list li {
|
|
87
|
+
padding: 12px 15px;
|
|
88
|
+
margin-bottom: 10px;
|
|
89
|
+
background: #f8fafc;
|
|
90
|
+
border-radius: 8px;
|
|
91
|
+
border-left: 4px solid #0071DC;
|
|
92
|
+
display: flex;
|
|
93
|
+
align-items: center;
|
|
94
|
+
gap: 10px;
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
.prereq-list li .check {
|
|
98
|
+
color: #28a745;
|
|
99
|
+
font-size: 1.2rem;
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
.step {
|
|
103
|
+
display: flex;
|
|
104
|
+
gap: 20px;
|
|
105
|
+
padding: 20px;
|
|
106
|
+
margin-bottom: 15px;
|
|
107
|
+
background: #f8fafc;
|
|
108
|
+
border-radius: 12px;
|
|
109
|
+
border-left: 4px solid #0071DC;
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
.step-number {
|
|
113
|
+
background: linear-gradient(135deg, #041E42, #0071DC);
|
|
114
|
+
color: white;
|
|
115
|
+
width: 40px;
|
|
116
|
+
height: 40px;
|
|
117
|
+
border-radius: 50%;
|
|
118
|
+
display: flex;
|
|
119
|
+
align-items: center;
|
|
120
|
+
justify-content: center;
|
|
121
|
+
font-weight: bold;
|
|
122
|
+
font-size: 1.1rem;
|
|
123
|
+
flex-shrink: 0;
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
.step-content h3 {
|
|
127
|
+
color: #041E42;
|
|
128
|
+
margin-bottom: 8px;
|
|
129
|
+
font-size: 1.1rem;
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
.step-content p {
|
|
133
|
+
color: #555;
|
|
134
|
+
margin-bottom: 10px;
|
|
135
|
+
}
|
|
136
|
+
|
|
137
|
+
.code-block {
|
|
138
|
+
background: #1e1e1e;
|
|
139
|
+
color: #d4d4d4;
|
|
140
|
+
padding: 15px 20px;
|
|
141
|
+
border-radius: 8px;
|
|
142
|
+
font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
|
|
143
|
+
font-size: 14px;
|
|
144
|
+
overflow-x: auto;
|
|
145
|
+
position: relative;
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
.code-block code {
|
|
149
|
+
color: #9cdcfe;
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
.code-block .comment {
|
|
153
|
+
color: #6a9955;
|
|
154
|
+
}
|
|
155
|
+
|
|
156
|
+
.warning-box {
|
|
157
|
+
background: #fff3cd;
|
|
158
|
+
border-left: 4px solid #ffc107;
|
|
159
|
+
padding: 15px 20px;
|
|
160
|
+
border-radius: 0 8px 8px 0;
|
|
161
|
+
margin: 15px 0;
|
|
162
|
+
}
|
|
163
|
+
|
|
164
|
+
.warning-box strong {
|
|
165
|
+
color: #856404;
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
.info-box {
|
|
169
|
+
background: #e7f3ff;
|
|
170
|
+
border-left: 4px solid #0071DC;
|
|
171
|
+
padding: 15px 20px;
|
|
172
|
+
border-radius: 0 8px 8px 0;
|
|
173
|
+
margin: 15px 0;
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
.info-box strong {
|
|
177
|
+
color: #004085;
|
|
178
|
+
}
|
|
179
|
+
|
|
180
|
+
.success-box {
|
|
181
|
+
background: #d4edda;
|
|
182
|
+
border-left: 4px solid #28a745;
|
|
183
|
+
padding: 15px 20px;
|
|
184
|
+
border-radius: 0 8px 8px 0;
|
|
185
|
+
margin: 15px 0;
|
|
186
|
+
}
|
|
187
|
+
|
|
188
|
+
.success-box strong {
|
|
189
|
+
color: #155724;
|
|
190
|
+
}
|
|
191
|
+
|
|
192
|
+
.shortcut-table {
|
|
193
|
+
width: 100%;
|
|
194
|
+
border-collapse: collapse;
|
|
195
|
+
margin-top: 15px;
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
.shortcut-table th,
|
|
199
|
+
.shortcut-table td {
|
|
200
|
+
padding: 12px 15px;
|
|
201
|
+
text-align: left;
|
|
202
|
+
border-bottom: 1px solid #e0e0e0;
|
|
203
|
+
}
|
|
204
|
+
|
|
205
|
+
.shortcut-table th {
|
|
206
|
+
background: #041E42;
|
|
207
|
+
color: white;
|
|
208
|
+
font-weight: 600;
|
|
209
|
+
}
|
|
210
|
+
|
|
211
|
+
.shortcut-table tr:hover {
|
|
212
|
+
background: #f5f5f5;
|
|
213
|
+
}
|
|
214
|
+
|
|
215
|
+
.shortcut-table kbd {
|
|
216
|
+
background: #eee;
|
|
217
|
+
padding: 4px 8px;
|
|
218
|
+
border-radius: 4px;
|
|
219
|
+
font-family: monospace;
|
|
220
|
+
font-weight: bold;
|
|
221
|
+
border: 1px solid #ccc;
|
|
222
|
+
}
|
|
223
|
+
|
|
224
|
+
.quick-install {
|
|
225
|
+
background: linear-gradient(135deg, #041E42 0%, #0071DC 100%);
|
|
226
|
+
color: white;
|
|
227
|
+
padding: 25px;
|
|
228
|
+
border-radius: 12px;
|
|
229
|
+
margin: 20px 0;
|
|
230
|
+
}
|
|
231
|
+
|
|
232
|
+
.quick-install h3 {
|
|
233
|
+
margin-bottom: 15px;
|
|
234
|
+
font-size: 1.2rem;
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
.quick-install .code-block {
|
|
238
|
+
background: rgba(0, 0, 0, 0.3);
|
|
239
|
+
}
|
|
240
|
+
|
|
241
|
+
.troubleshoot-item {
|
|
242
|
+
padding: 15px;
|
|
243
|
+
margin-bottom: 12px;
|
|
244
|
+
background: #f8fafc;
|
|
245
|
+
border-radius: 8px;
|
|
246
|
+
border-left: 4px solid #dc3545;
|
|
247
|
+
}
|
|
248
|
+
|
|
249
|
+
.troubleshoot-item h4 {
|
|
250
|
+
color: #dc3545;
|
|
251
|
+
margin-bottom: 8px;
|
|
252
|
+
font-size: 0.95rem;
|
|
253
|
+
}
|
|
254
|
+
|
|
255
|
+
.links-section {
|
|
256
|
+
display: flex;
|
|
257
|
+
gap: 15px;
|
|
258
|
+
flex-wrap: wrap;
|
|
259
|
+
margin-top: 15px;
|
|
260
|
+
}
|
|
261
|
+
|
|
262
|
+
.link-card {
|
|
263
|
+
flex: 1;
|
|
264
|
+
min-width: 200px;
|
|
265
|
+
padding: 20px;
|
|
266
|
+
background: #f8fafc;
|
|
267
|
+
border-radius: 12px;
|
|
268
|
+
text-align: center;
|
|
269
|
+
text-decoration: none;
|
|
270
|
+
color: #041E42;
|
|
271
|
+
transition: transform 0.2s, box-shadow 0.2s;
|
|
272
|
+
border: 2px solid transparent;
|
|
273
|
+
}
|
|
274
|
+
|
|
275
|
+
.link-card:hover {
|
|
276
|
+
transform: translateY(-3px);
|
|
277
|
+
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
|
|
278
|
+
border-color: #0071DC;
|
|
279
|
+
}
|
|
280
|
+
|
|
281
|
+
.link-card .icon {
|
|
282
|
+
font-size: 2rem;
|
|
283
|
+
margin-bottom: 10px;
|
|
284
|
+
}
|
|
285
|
+
|
|
286
|
+
.link-card h4 {
|
|
287
|
+
margin-bottom: 5px;
|
|
288
|
+
}
|
|
289
|
+
|
|
290
|
+
.link-card p {
|
|
291
|
+
font-size: 0.85rem;
|
|
292
|
+
color: #666;
|
|
293
|
+
}
|
|
294
|
+
|
|
295
|
+
.footer {
|
|
296
|
+
text-align: center;
|
|
297
|
+
padding: 30px;
|
|
298
|
+
color: #666;
|
|
299
|
+
font-size: 0.9rem;
|
|
300
|
+
}
|
|
301
|
+
|
|
302
|
+
@media (max-width: 768px) {
|
|
303
|
+
.header h1 { font-size: 1.8rem; }
|
|
304
|
+
.section { padding: 20px; }
|
|
305
|
+
.step { flex-direction: column; gap: 10px; }
|
|
306
|
+
}
|
|
307
|
+
</style>
|
|
308
|
+
</head>
|
|
309
|
+
<body>
|
|
310
|
+
<div class="container">
|
|
311
|
+
<div class="header">
|
|
312
|
+
<h1>📸 SnapExcel</h1>
|
|
313
|
+
<p>NPM Installation Guide</p>
|
|
314
|
+
<div class="npm-badge">npm install snapexcel</div>
|
|
315
|
+
</div>
|
|
316
|
+
|
|
317
|
+
<!-- Prerequisites -->
|
|
318
|
+
<div class="section">
|
|
319
|
+
<h2><span class="icon">⚙️</span> Prerequisites</h2>
|
|
320
|
+
<p style="margin-bottom: 15px; color: #555;">Before installing, ensure you have the following installed on your machine:</p>
|
|
321
|
+
<ul class="prereq-list">
|
|
322
|
+
<li>
|
|
323
|
+
<span class="check">✓</span>
|
|
324
|
+
<span><strong>Node.js</strong> (v16 or higher) - <a href="https://nodejs.org/" target="_blank">Download here</a></span>
|
|
325
|
+
</li>
|
|
326
|
+
<li>
|
|
327
|
+
<span class="check">✓</span>
|
|
328
|
+
<span><strong>npm</strong> (comes with Node.js)</span>
|
|
329
|
+
</li>
|
|
330
|
+
</ul>
|
|
331
|
+
<div class="info-box">
|
|
332
|
+
<strong>💡 Check Installation:</strong> Run these commands to verify:
|
|
333
|
+
<div class="code-block" style="margin-top: 10px;">
|
|
334
|
+
<code>node --version</code><br>
|
|
335
|
+
<code>npm --version</code>
|
|
336
|
+
</div>
|
|
337
|
+
</div>
|
|
338
|
+
</div>
|
|
339
|
+
|
|
340
|
+
<!-- Installation Steps -->
|
|
341
|
+
<div class="section">
|
|
342
|
+
<h2><span class="icon">🚀</span> Installation Steps</h2>
|
|
343
|
+
|
|
344
|
+
<div class="step">
|
|
345
|
+
<div class="step-number">1</div>
|
|
346
|
+
<div class="step-content">
|
|
347
|
+
<h3>Install SnapExcel from npm</h3>
|
|
348
|
+
<p>Open your terminal and run:</p>
|
|
349
|
+
<div class="code-block">
|
|
350
|
+
<code>npm install snapexcel</code>
|
|
351
|
+
</div>
|
|
352
|
+
</div>
|
|
353
|
+
</div>
|
|
354
|
+
|
|
355
|
+
<div class="step">
|
|
356
|
+
<div class="step-number">2</div>
|
|
357
|
+
<div class="step-content">
|
|
358
|
+
<h3>Navigate to the Package Folder</h3>
|
|
359
|
+
<p>Change directory to the installed package:</p>
|
|
360
|
+
<div class="code-block">
|
|
361
|
+
<code>cd node_modules/snapexcel</code>
|
|
362
|
+
</div>
|
|
363
|
+
</div>
|
|
364
|
+
</div>
|
|
365
|
+
|
|
366
|
+
<div class="step">
|
|
367
|
+
<div class="step-number">3</div>
|
|
368
|
+
<div class="step-content">
|
|
369
|
+
<h3>Install Dependencies</h3>
|
|
370
|
+
<p>Install the required Electron dependencies:</p>
|
|
371
|
+
<div class="code-block">
|
|
372
|
+
<code>npm install</code>
|
|
373
|
+
</div>
|
|
374
|
+
</div>
|
|
375
|
+
</div>
|
|
376
|
+
|
|
377
|
+
<div class="step">
|
|
378
|
+
<div class="step-number">4</div>
|
|
379
|
+
<div class="step-content">
|
|
380
|
+
<h3>Fix Any Vulnerabilities (Important!)</h3>
|
|
381
|
+
<p>If you encounter any security vulnerabilities or errors, run:</p>
|
|
382
|
+
<div class="code-block">
|
|
383
|
+
<code>npm audit fix --force</code>
|
|
384
|
+
</div>
|
|
385
|
+
<div class="warning-box">
|
|
386
|
+
<strong>⚠️ Important:</strong> This step is crucial! It automatically fixes any dependency issues that may cause errors.
|
|
387
|
+
</div>
|
|
388
|
+
</div>
|
|
389
|
+
</div>
|
|
390
|
+
|
|
391
|
+
<div class="step">
|
|
392
|
+
<div class="step-number">5</div>
|
|
393
|
+
<div class="step-content">
|
|
394
|
+
<h3>Start the Application</h3>
|
|
395
|
+
<p>Launch SnapExcel:</p>
|
|
396
|
+
<div class="code-block">
|
|
397
|
+
<code>npm start</code>
|
|
398
|
+
</div>
|
|
399
|
+
</div>
|
|
400
|
+
</div>
|
|
401
|
+
|
|
402
|
+
<div class="success-box">
|
|
403
|
+
<strong>🎉 That's it!</strong> The SnapExcel application should now launch and be ready to use.
|
|
404
|
+
</div>
|
|
405
|
+
</div>
|
|
406
|
+
|
|
407
|
+
<!-- Quick Install -->
|
|
408
|
+
<div class="section">
|
|
409
|
+
<h2><span class="icon">⚡</span> Quick Install (One Command)</h2>
|
|
410
|
+
<p style="margin-bottom: 15px; color: #555;">Copy and paste this single command to install and run everything at once:</p>
|
|
411
|
+
<div class="quick-install">
|
|
412
|
+
<h3>Complete Installation</h3>
|
|
413
|
+
<div class="code-block">
|
|
414
|
+
<code>npm install snapexcel && cd node_modules/snapexcel && npm install && npm audit fix --force && npm start</code>
|
|
415
|
+
</div>
|
|
416
|
+
</div>
|
|
417
|
+
</div>
|
|
418
|
+
|
|
419
|
+
<!-- Keyboard Shortcuts -->
|
|
420
|
+
<div class="section">
|
|
421
|
+
<h2><span class="icon">⌨️</span> Keyboard Shortcuts</h2>
|
|
422
|
+
<p style="margin-bottom: 15px; color: #555;">Use these global shortcuts to capture screenshots quickly:</p>
|
|
423
|
+
<table class="shortcut-table">
|
|
424
|
+
<thead>
|
|
425
|
+
<tr>
|
|
426
|
+
<th>Shortcut (Mac)</th>
|
|
427
|
+
<th>Shortcut (Windows)</th>
|
|
428
|
+
<th>Action</th>
|
|
429
|
+
</tr>
|
|
430
|
+
</thead>
|
|
431
|
+
<tbody>
|
|
432
|
+
<tr>
|
|
433
|
+
<td><kbd>⌘</kbd> + <kbd>⇧</kbd> + <kbd>S</kbd></td>
|
|
434
|
+
<td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>S</kbd></td>
|
|
435
|
+
<td>Fullscreen Capture</td>
|
|
436
|
+
</tr>
|
|
437
|
+
<tr>
|
|
438
|
+
<td><kbd>⌘</kbd> + <kbd>⇧</kbd> + <kbd>R</kbd></td>
|
|
439
|
+
<td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>R</kbd></td>
|
|
440
|
+
<td>Region Capture</td>
|
|
441
|
+
</tr>
|
|
442
|
+
</tbody>
|
|
443
|
+
</table>
|
|
444
|
+
</div>
|
|
445
|
+
|
|
446
|
+
<!-- Troubleshooting -->
|
|
447
|
+
<div class="section">
|
|
448
|
+
<h2><span class="icon">🔧</span> Troubleshooting</h2>
|
|
449
|
+
|
|
450
|
+
<div class="troubleshoot-item">
|
|
451
|
+
<h4>Error: Vulnerabilities found</h4>
|
|
452
|
+
<div class="code-block">
|
|
453
|
+
<code>npm audit fix --force</code>
|
|
454
|
+
</div>
|
|
455
|
+
</div>
|
|
456
|
+
|
|
457
|
+
<div class="troubleshoot-item">
|
|
458
|
+
<h4>Error: Electron not found</h4>
|
|
459
|
+
<div class="code-block">
|
|
460
|
+
<code>npm install electron --save-dev</code>
|
|
461
|
+
</div>
|
|
462
|
+
</div>
|
|
463
|
+
|
|
464
|
+
<div class="troubleshoot-item">
|
|
465
|
+
<h4>Error: Permission denied (Mac)</h4>
|
|
466
|
+
<div class="code-block">
|
|
467
|
+
<code>sudo npm install</code>
|
|
468
|
+
</div>
|
|
469
|
+
</div>
|
|
470
|
+
|
|
471
|
+
<div class="troubleshoot-item">
|
|
472
|
+
<h4>App doesn't capture screenshots (Mac)</h4>
|
|
473
|
+
<p style="margin-top: 8px; color: #555;">
|
|
474
|
+
Go to <strong>System Preferences</strong> → <strong>Security & Privacy</strong> → <strong>Privacy</strong> → <strong>Screen Recording</strong><br>
|
|
475
|
+
Enable permission for the app/terminal.
|
|
476
|
+
</p>
|
|
477
|
+
</div>
|
|
478
|
+
</div>
|
|
479
|
+
|
|
480
|
+
<!-- Links -->
|
|
481
|
+
<div class="section">
|
|
482
|
+
<h2><span class="icon">🔗</span> Useful Links</h2>
|
|
483
|
+
<div class="links-section">
|
|
484
|
+
<a href="https://www.npmjs.com/package/snapexcel" target="_blank" class="link-card">
|
|
485
|
+
<div class="icon">📦</div>
|
|
486
|
+
<h4>npm Package</h4>
|
|
487
|
+
<p>npmjs.com/package/snapexcel</p>
|
|
488
|
+
</a>
|
|
489
|
+
<a href="https://github.com/rameshpanyam/screenshot-logger" target="_blank" class="link-card">
|
|
490
|
+
<div class="icon">💻</div>
|
|
491
|
+
<h4>GitHub Repository</h4>
|
|
492
|
+
<p>View source code</p>
|
|
493
|
+
</a>
|
|
494
|
+
</div>
|
|
495
|
+
</div>
|
|
496
|
+
|
|
497
|
+
<!-- User Guide -->
|
|
498
|
+
<div class="section">
|
|
499
|
+
<h2><span class="icon">📖</span> User Guide</h2>
|
|
500
|
+
<p style="color: #555;">
|
|
501
|
+
For detailed usage instructions with annotated screenshots, open the <strong>USER_GUIDE.html</strong> file located in:
|
|
502
|
+
</p>
|
|
503
|
+
<div class="code-block" style="margin-top: 15px;">
|
|
504
|
+
<code>node_modules/snapexcel/USER_GUIDE.html</code>
|
|
505
|
+
</div>
|
|
506
|
+
</div>
|
|
507
|
+
|
|
508
|
+
<div class="footer">
|
|
509
|
+
<p>📸 <strong>Happy Screenshot Logging!</strong></p>
|
|
510
|
+
<p style="margin-top: 10px;">SnapExcel v1.0.0 | Created by Ramesh Panyam</p>
|
|
511
|
+
</div>
|
|
512
|
+
</div>
|
|
513
|
+
</body>
|
|
514
|
+
</html>
|
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
# SnapExcel - NPM Installation Guide
|
|
2
|
+
|
|
3
|
+
## 📦 Installing SnapExcel from npm
|
|
4
|
+
|
|
5
|
+
SnapExcel is available on the npm registry. Follow these steps to install and run the application.
|
|
6
|
+
|
|
7
|
+
---
|
|
8
|
+
|
|
9
|
+
## Prerequisites
|
|
10
|
+
|
|
11
|
+
Before installing, ensure you have the following installed on your machine:
|
|
12
|
+
|
|
13
|
+
- **Node.js** (v16 or higher) - [Download here](https://nodejs.org/)
|
|
14
|
+
- **npm** (comes with Node.js)
|
|
15
|
+
|
|
16
|
+
To check if you have them installed:
|
|
17
|
+
```bash
|
|
18
|
+
node --version
|
|
19
|
+
npm --version
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
---
|
|
23
|
+
|
|
24
|
+
## 🚀 Installation Steps
|
|
25
|
+
|
|
26
|
+
### Step 1: Install SnapExcel from npm
|
|
27
|
+
|
|
28
|
+
```bash
|
|
29
|
+
npm install snapexcel
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
### Step 2: Navigate to the Package Folder
|
|
33
|
+
|
|
34
|
+
```bash
|
|
35
|
+
cd node_modules/snapexcel
|
|
36
|
+
```
|
|
37
|
+
|
|
38
|
+
### Step 3: Install Dependencies
|
|
39
|
+
|
|
40
|
+
```bash
|
|
41
|
+
npm install
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
### Step 4: Fix Any Vulnerabilities (Important!)
|
|
45
|
+
|
|
46
|
+
If you encounter any security vulnerabilities or errors, run:
|
|
47
|
+
|
|
48
|
+
```bash
|
|
49
|
+
npm audit fix --force
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
This will automatically fix any dependency issues.
|
|
53
|
+
|
|
54
|
+
### Step 5: Start the Application
|
|
55
|
+
|
|
56
|
+
```bash
|
|
57
|
+
npm start
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
---
|
|
61
|
+
|
|
62
|
+
## 🎉 That's it!
|
|
63
|
+
|
|
64
|
+
The SnapExcel application should now launch and be ready to use.
|
|
65
|
+
|
|
66
|
+
---
|
|
67
|
+
|
|
68
|
+
## ⌨️ Keyboard Shortcuts
|
|
69
|
+
|
|
70
|
+
| Shortcut | Action |
|
|
71
|
+
|----------|--------|
|
|
72
|
+
| `⌘⇧S` (Mac) / `Ctrl+Shift+S` (Windows) | Fullscreen Capture |
|
|
73
|
+
| `⌘⇧R` (Mac) / `Ctrl+Shift+R` (Windows) | Region Capture |
|
|
74
|
+
|
|
75
|
+
---
|
|
76
|
+
|
|
77
|
+
## 📖 User Guide
|
|
78
|
+
|
|
79
|
+
For detailed usage instructions with screenshots, open the `USER_GUIDE.html` file located in:
|
|
80
|
+
```
|
|
81
|
+
node_modules/snapexcel/USER_GUIDE.html
|
|
82
|
+
```
|
|
83
|
+
|
|
84
|
+
---
|
|
85
|
+
|
|
86
|
+
## 🔧 Troubleshooting
|
|
87
|
+
|
|
88
|
+
### Error: Vulnerabilities found
|
|
89
|
+
```bash
|
|
90
|
+
npm audit fix --force
|
|
91
|
+
```
|
|
92
|
+
|
|
93
|
+
### Error: Electron not found
|
|
94
|
+
```bash
|
|
95
|
+
npm install electron --save-dev
|
|
96
|
+
```
|
|
97
|
+
|
|
98
|
+
### Error: Permission denied (Mac)
|
|
99
|
+
```bash
|
|
100
|
+
sudo npm install
|
|
101
|
+
```
|
|
102
|
+
|
|
103
|
+
### App doesn't capture screenshots (Mac)
|
|
104
|
+
- Go to **System Preferences** → **Security & Privacy** → **Privacy** → **Screen Recording**
|
|
105
|
+
- Enable permission for the app/terminal
|
|
106
|
+
|
|
107
|
+
---
|
|
108
|
+
|
|
109
|
+
## 📝 Quick Reference
|
|
110
|
+
|
|
111
|
+
```bash
|
|
112
|
+
# Complete installation in one go
|
|
113
|
+
npm install snapexcel && cd node_modules/snapexcel && npm install && npm audit fix --force && npm start
|
|
114
|
+
```
|
|
115
|
+
|
|
116
|
+
---
|
|
117
|
+
|
|
118
|
+
## 🔗 Links
|
|
119
|
+
|
|
120
|
+
- **npm Package:** https://www.npmjs.com/package/snapexcel
|
|
121
|
+
- **GitHub Repository:** https://github.com/rameshpanyam/screenshot-logger
|
|
122
|
+
|
|
123
|
+
---
|
|
124
|
+
|
|
125
|
+
## 📧 Support
|
|
126
|
+
|
|
127
|
+
For any questions or issues, feel free to reach out or create an issue on GitHub.
|
|
128
|
+
|
|
129
|
+
---
|
|
130
|
+
|
|
131
|
+
**Happy Screenshot Logging! 📸**
|