/
index.html
196 lines (190 loc) · 7.64 KB
/
index.html
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
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link href="node_modules/materialize-css/dist/css/materialize.min.css"
media="screen" rel="stylesheet" title="no title">
<link href="assets/style.css" media="screen" rel="stylesheet" title=
"no title">
<script onload="window.$ = window.jQuery = module.exports;" src=
"node_modules/jquery/dist/jquery.min.js">
</script>
<script charset="utf-8" onload="window.Hammer = module.exports;" src=
"node_modules/materialize-css/js/hammer.min.js">
</script>
<script charset="utf-8" src=
"node_modules/materialize-css/dist/js/materialize.min.js">
</script>
<link href="node_modules/font-awesome/css/font-awesome.min.css" media=
"screen" rel="stylesheet" title="no title">
<script charset="utf-8" src="assets/index.js">
</script>
<script charset="utf-8" src="node_modules/moment/moment.js">
</script>
<title>Clipboard Manager</title>
</head>
<body>
<div class="navbar-fixed">
<nav>
<div class="nav-wrapper light-blue lighten-2">
<a id="hamburger" class="button-collapse show-on-large" data-activates="slide-out"
href="#"><i class="mdi-navigation-menu"></i></a> <a class=
"brand-logo center">Clipboard Manager</a>
</div>
</nav>
</div>
<div class="row cardcontainer">
<div class="col">
<div class="card grey darken-1 hoverable">
<div class="card-content white-text">
<span class="card-title">Read me!</span>
<p>Use <span class="copycurrshortcut"></span> to save your current clipboard as
formatted text. Hide and show the app using <span class="hidecurrshortcut"></span>. This stuff can be changed in the settings menu.</p>
<p>Pictures will be saved as images in /doc.db/images.</p>
<p>Click the text to save it to your clipboard.</p>
</div>
<div class="card-action">
<a class="hider grey-text text-lighten-3" href="#">Close and don't show this again</a>
</div>
</div>
</div>
</div>
<ul class="side-nav" id="slide-out">
<li>
<a onclick="init(); return false;"><i class="fa fa-home"></i>
Home</a>
</li>
<li>
<a onclick="settings(); return false;"><i class="fa fa-cog"></i>
Settings</a>
</li>
<li>
<a onclick="quitapp(); return false;"><i class="fa fa-sign-out"></i> Quit</a>
</li>
</ul>
<div class="row" id="searchbar">
<br>
<form class="col s12">
<div class="row">
<div class="input-field col s12">
<i class="fa fa-search prefix"></i> <input class="validate"
id="search" type="text"> <label for="search">Search</label>
</div><a class="waves-effect waves-light red btn" id=
"clearform"><i class="fa fa-minus-circle left"></i>Clear</a>
</div>
</form>
</div>
<div id="container"></div>
<div class="container row" id="settings">
<h4 class="header row">Time format</h4>
<p>Clipboard Manager stores time as Unix time in a database and formats
it using Moment.js. You can create your own string. Please check the
<a onclick=
"shell.openExternal('http://momentjs.com/docs/#/displaying/format/');">documentation.</a></p>
<div class="row">
<a class="waves-effect waves-light btn col s6" id="advTime">I read
the documentation, let me write a string!</a>
<div class="input-field col s6">
<input class="validate" id="time" placeholder="HH:MM:ss" type=
"text" value="HH:MM:ss">
</div>
</div>
<br>
<h4 class="header row">Change hotkeys</h4>
<h5 class="header row">Copy shortcut</h5>
<p>Any combination can be used, pretty much. Except the system wide
copy shortcut. Electron's behavior is to make the shortcut exclusive
for itself. If you choose CTRL - C, for example, your system's copy
shortcut will not work. Be careful not to overwrite system/other applications' shortcuts. Your current shortcut is: <span class="copycurrshortcut"></span>.</p>
<div class="row">
<div class="input-field col s2">
<input disabled value="Cmd or Ctrl" id="disabled" type="text" class="validate">
<label for="disabled">First key</label>
</div>
<div class="input-field col s3">
<select id="csecondkey">
<option value="1">DISABLED</option>
<option value="2">SHIFT</option>
<option value="3">ALT</option>
</select>
</div>
<div class="input-field col s3">
<input id="cletter" placeholder="e.g. X" type="text" class="center-align validate" maxlength="1">
<label for="disable">One letter or symbol</label>
</div>
</div>
<br>
<h5 class="header row">Hide/show app shortcut</h5>
<p>Change show/hide app keyboard shortcut here. Your current shortcut is: <span class="hidecurrshortcut"></span> </p>
<div class="row">
<div class="input-field col s2">
<select id="changehidehotkey">
<option value="1">F1</option>
<option value="2">F2</option>
<option value="3">F3</option>
<option value="4">F4</option>
<option value="5">F5</option>
<option value="6">F6</option>
<option value="7">F7</option>
<option value="8">F8</option>
<option value="9">F9</option>
<option value="10">F10</option>
<option value="11">F11</option>
<option value="12">F12</option>
</select>
</div>
</div>
<br>
<div>
<h4 class="header row">Notifications</h4>
<p>Turn notifications on or off.</p>
<div class="switch">
<label>
Off
<input type="checkbox" id="notiftoggle">
<span class="lever"></span>
On
</label>
</div>
</div>
<div>
<h4 class="header row">Destroy database</h4>
<p>Delete database and all images. This action is not reversible.</p>
<a class="waves-effect red waves-light btn col s2" id="deletedatabase">Destroy database</a>
</div>
</div>
<div class="modal bottom-sheet" id="editContent">
<div class="modal-content">
<h4>Edit Paste Contents</h4>
<textarea class="materialize-textarea" id="modalContent" rows="15">
</textarea>
</div>
<div class="modal-footer">
<a class=
" modal-action modal-close waves-effect waves-green btn-flat teal white-text"
href="#!" id="editDone">Done</a> <a class=
" modal-action modal-close waves-effect waves-green btn-flat" href=
"#!">Cancel</a>
</div>
</div>
<div class="modal" id="qrcode">
<div class="modal-content">
<h4>QR Code</h4><img alt="#" class="" id="qrimg" src="#"></div>
<div class="modal-footer">
<a class=
" modal-action modal-close waves-effect waves-green btn-flat" href=
"#!">Done</a>
</div>
</div>
<div id="deleteconfirm" class="modal">
<div class="modal-content">
<h4>Destroy database</h4>
<p>This action is irreversible. All database data will be lost. Are you sure that you want to delete the database?</p>
</div>
<div class="modal-footer">
<a href="#!" class="modal-action modal-close waves-effect waves-green btn-flat">Cancel</a>
<a href="#!" class="red white-text modal-action modal-close waves-effect waves-green btn-flat" id="confirmdelete">I am sure</a>
</div>
</div>
</body>
</html>