forked from OpenUserJS/OpenUserJS.org
-
Notifications
You must be signed in to change notification settings - Fork 1
Expand file tree
/
Copy pathnewScriptPage.html
More file actions
334 lines (330 loc) · 21 KB
/
newScriptPage.html
File metadata and controls
334 lines (330 loc) · 21 KB
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
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
<!DOCTYPE html>
<html>
<head>
<title>{{title}}</title>
{{> includes/head.html }}
<style>
.script-metadata-definitions .list-group-item-heading code,
.panel code {
white-space: pre-line;
word-break: break-all;
}
</style>
</head>
<body>
{{> includes/header.html }}
<div class="container-fluid">
<div class="row">
<div class="col-xs-12">
<div class="col-md-3">
<h2><a id="new-script"></a><i class="fa fa-plus-square"></i> New Script<a href="#new-script" class="anchor"><i class="fa fa-link"></i></a></h2>
<div class="list-group">
<a href="/about/Userscript-Beginners-HOWTO" class="list-group-item">
<h4 class="list-group-item-heading"><i class="fa fa-fw fa-book"></i> UserScript Beginners HOWTO</h4>
<p class="list-group-item-text">
Are you new to {{#newJSLibrary}}library {{/newJSLibrary}}{{^newJSLibrary}}user {{/newJSLibrary}} scripting and thought you would just dive right in without reading anything? Well if you change your mind check out some of our documentation by clicking here. Special thanks go out to all of our collaborators for all their dedication and effort.
</p>
</a>
<a href="{{{newScriptEditorPageUrl}}}" class="list-group-item">
<h4 class="list-group-item-heading"><i class="octicon octicon-fw octicon-pencil"></i> Write Script Online</h4>
<p class="list-group-item-text">
Click here to write a script using the Ace editor <em>(used by GitHub)</em>.
</p>
</a>
<div class="list-group-item">
<h4 class="list-group-item-heading"><i class="fa fa-fw fa-upload"></i> Upload Script</h4>
<p class="list-group-item-text">
<form action="{{{uploadNewScriptPageUrl}}}" method="post" enctype="multipart/form-data" class="form-horizontal">
<input type="hidden" name="uploadScript" value="true">
<div class="form-group">
<div class="input-group">
<span class="input-group-btn">
<span class="btn btn-primary btn-file">
Browse...
<input type="file" accept="{{#newUserJS}}.user{{/newUserJS}}.js" name="script" required="required" />
</span>
</span>
<input type="text" readonly="readonly" class="form-control" />
<span class="input-group-btn">
<button class="btn btn-success" type="submit">Submit</button>
</span>
</div>
<noscript>
<div role="alert" class="alert alert-warning small">
<i class="fa fa-exclamation-triangle"></i> <strong>JavaScript DISABLED</strong>: No file selection feedback will be given.
</div>
</noscript>
</div>
</form>
</p>
</div>
<div class="list-group-item">
<h4 class="list-group-item-heading"><i class="octicon octicon-fw octicon-repo-forked"></i> Fork An Existing Script</h4>
<p class="list-group-item-text">
While logged in view a script's source and click "Submit Code as Fork".
</p>
</div>
<a href="{{{authedUser.userGitHubRepoListPageUrl}}}" class="list-group-item">
<h4 class="list-group-item-heading"><i class="octicon octicon-fw octicon-repo-clone"></i> Import Script from GitHub</h4>
<p class="list-group-item-text">
Click here to import a script<em>(s)</em> from a GitHub repository. If Sync Script has already been set up for the selected repository then it should automatically be linked for any scripts imported.
</p>
</a>
<div role="alert" class="alert alert-info">
<i class="fa fa-fw fa-info-circle"></i> <strong>LIMITS</strong>: The current transfer size limit is set at <span class="label label-default">{{maximumUploadScriptSize}} bytes</span> per script.
</div>
</div>
</div>
<div class="col-md-6">
<h2><a id="script-metadata"></a><i class="octicon octicon-key"></i> Script Metadata<a href="#script-metadata" class="anchor"><i class="fa fa-link"></i></a></h2>
<div class="panel panel-default">
<div class="panel-body">
<p>You may read about most UserScript metadata block keys on the <a href="https://wiki.greasespot.net/Metadata_Block">Greasespot wiki</a> and at the <a href="https://sourceforge.net/p/greasemonkey/wiki/Metadata_Block/">Greasemonkey on SourceForge classic wiki</a>. Some samples to click and read <noscript>, with JavaScript enabled,</noscript> are listed below with their respective metadata block names.</p>
</div>
</div>
{{#newJSLibrary}}
<h3><a id="userscript-block"></a>UserScript Block<a href="#userscript-block" class="anchor"><i class="fa fa-link"></i></a></h3>
<div class="panel-group" id="accordion-userscript-block">
<div class="panel panel-default">
<div class="panel-heading">
<h5 class="panel-title">
<a id="user-block-exclude" rel="bookmark"></a>
<a data-toggle="collapse" data-parent="#accordion-userscript-exclude" href="#collapse-exclude"><code>@exclude *</code></a>
</h5>
</div>
<div id="collapse-exclude" class="panel-collapse collapse in">
<div class="panel-body">
<p><strong>This is required.</strong></p>
</div>
</div>
</div>
</div>
{{/newJSLibrary}}
<h3><a id="userscript{{#newJSLibrary}}-and-userlibrary{{/newJSLibrary}}-block"></a>UserScript{{#newJSLibrary}} and UserLibrary{{/newJSLibrary}} Block<a href="#userscript{{#newJSLibrary}}-and-userlibrary{{/newJSLibrary}}-block" class="anchor"><i class="fa fa-link"></i></a></h3>
<div class="panel-group" id="accordion-user{{#newUserJS}}script{{/newUserJS}}-block">
<div class="panel panel-default">
<div class="panel-heading">
<h5 class="panel-title">
<a id="user-block-name" rel="bookmark"></a>
<a data-toggle="collapse" data-parent="#accordion-user{{#newUserJS}}script{{/newUserJS}}-block" href="#collapse-name"><code>@name My Script</code></a>
</h5>
</div>
<div id="collapse-name" class="panel-collapse collapse in">
<div class="panel-body">
<p><strong>Default non-localized is required.</strong></p>
<p>Last value is used.</p>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h5 class="panel-title">
<a id="user-block-description" rel="bookmark"></a>
<a data-toggle="collapse" data-parent="#accordion-user{{#newUserJS}}script{{/newUserJS}}-block" href="#collapse-description"><code>@description This script even does the laundry!</code></a>
</h5>
</div>
<div id="collapse-description" class="panel-collapse collapse">
<div class="panel-body">
<p>Specially formatted on the script page.</p>
<p>Last value shown.</p>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h5 class="panel-title">
<a id="user-block-copyright" rel="bookmark"></a>
<a data-toggle="collapse" data-parent="#accordion-user{{#newUserJS}}script{{/newUserJS}}-block" href="#collapse-copyright"><code>@copyright Year, Author (Author Website)</code></a>
</h5>
</div>
<div id="collapse-copyright" class="panel-collapse collapse">
<div class="panel-body">
<p>Specially formatted on the script page.</p>
<p>All values shown in reverse order. Last key is primary.</p>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h5 class="panel-title">
<a id="user-block-license" rel="bookmark"></a>
<a data-toggle="collapse" data-parent="#accordion-user{{#newUserJS}}script{{/newUserJS}}-block" href="#collapse-license"><code>@license License Type; License Homepage</code></a>
</h5>
</div>
<div id="collapse-license" class="panel-collapse collapse">
<div class="panel-body">
<p>Specially formatted on the script page. All values shown in reverse order. If absent <a href="https://spdx.org/licenses/MIT.html"><code>MIT</code></a> <a href="https://opensource.org/licenses/MIT">License <em>(Expat)</em></a> is implied. See <a href="/about/Terms-of-Service#licensing">licensing terms</a> for specifics.</p>
<p><strong><code>License Type</code> component is required</strong> using at least one <a href="https://opensource.org/licenses/category">OSI approved</a> <a href="https://spdx.org/licenses/">SPDX short identifier</a> and must be the primary, last, <code>@license</code> key. Single short ids are accepted only per license key. e.g. No conjunctions like <code>AND</code> or <code>OR</code>. These are handled by multiple <code>@license</code> keys.</p>
<p><strong><code>; License Homepage</code> component is currently optional</strong></p>
<p>A url of http or https.</p>
<p>Single Licensed Example <em>(No specific document license web reference)</em>:
<pre class="small"><code>// ==UserScript==</code><br /><code>// ...</code><br />{{#newJSLibrary}}<code>// ==UserLibrary==</code><br />{{/newJSLibrary}}<code>// @license MIT</code><br /><code>// ...</code><br /><code>// ==/UserScript==</code>{{#newJSLibrary}}<br /><code>// ==/UserLibrary==</code><br />{{/newJSLibrary}}</pre>
</p>
<p>Dual Licensed Example <em>(Specific document license web references)</em>:
<pre class="small"><code>// ==UserScript==</code><br /><code>// ...</code><br />{{#newJSLibrary}}<code>// ==UserLibrary==</code><br />{{/newJSLibrary}}<code>// @license CC-BY-NC-SA-4.0; https://creativecommons.org/licenses/by-nc-sa/4.0/legalcode</code><br /><code>// @license GPL-3.0-or-later; http://www.gnu.org/licenses/gpl-3.0.txt</code><br /><code>// ...</code><br /><code>// ==/UserScript==</code>{{#newJSLibrary}}<br /><code>// ==/UserLibrary==</code><br />{{/newJSLibrary}}</pre>
</p>
<p>When in doubt it may be a wise choice to go with the site default of <code>MIT</code> or some other popular license such as <code>GPL-3.0-or-later</code>. If you don't understand a less popular license then please don't use it when authoring or consult your legal counsel. Licensing is both protective and permissive for all parties. Figure out what balance you need and make your decision.</p>
<p>All values shown in reverse order. Last key is primary.</p>
</div>
</div>
</div>
{{#newUserJS}}
<div class="panel panel-default">
<div class="panel-heading">
<h5 class="panel-title">
<a id="user-block-icon" rel="bookmark"></a>
<a data-toggle="collapse" data-parent="#accordion-userscript-block" href="#collapse-icon"><code>@icon url</code></a>
</h5>
</div>
<div id="collapse-icon" class="panel-collapse collapse">
<div class="panel-body">
<p>A url of http, https, or an image <a href="https://www.wikipedia.org/wiki/Data_URI_scheme">data uri</a>.</p>
<p>Resolution should be near 48px by 48px.</p>
<p>Used in the script list page at 16px and on the script page at ~45px.</p>
<p>Last value is shown.</p>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h5 class="panel-title">
<a id="user-block-homepageurl" rel="bookmark"></a>
<a data-toggle="collapse" data-parent="#accordion-userscript-block" href="#collapse-homepageurl"><code>@homepageURL url</code></a>
</h5>
</div>
<div id="collapse-homepageurl" class="panel-collapse collapse">
<div class="panel-body">
<p>A url of http or https. Specially formatted on the script page.</p>
<p>All values shown in reverse order.</p>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h5 class="panel-title">
<a id="user-block-supporturl" rel="bookmark"></a>
<a data-toggle="collapse" data-parent="#accordion-userscript-block" href="#collapse-supporturl"><code>@supportURL url</code></a>
</h5>
</div>
<div id="collapse-supporturl" class="panel-collapse collapse">
<div class="panel-body">
<p>A url of http, https or mailto protocol. Specially formatted on the script page.</p>
<p>Last value shown.</p>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h5 class="panel-title">
<a id="user-block-contributionurl" rel="bookmark"></a>
<a data-toggle="collapse" data-parent="#accordion-userscript-block" href="#collapse-contributionurl"><code>@contributionURL url</code></a>
</h5>
</div>
<div id="collapse-contributionurl" class="panel-collapse collapse">
<div class="panel-body">
<p>A url of https protocol only. Used for monetary requests for contributions. <code>@contributionAmount</code> is currently unsupported. Specially formatted on the script issues list and script issue page.</p>
<p>Last value shown.</p>
</div>
</div>
</div>
{{/newUserJS}}
<div class="panel panel-default">
<div class="panel-heading">
<h5 class="panel-title">
<a id="user-block-version" rel="bookmark"></a>
<a data-toggle="collapse" data-parent="#accordion-user{{#newUserJS}}script{{/newUserJS}}-block" href="#collapse-version"><code>@version 1.0.0</code></a>
</h5>
</div>
<div id="collapse-version" class="panel-collapse collapse">
<div class="panel-body">
<p>Enables the ability to use automatic script updates in most .user.js engines.</p>
<p>Usually major dot minor dot build <em>(or Patch)</em>. May utilize the <a href="https://developer.mozilla.org/docs/Mozilla/Toolkit_version_format">Toolkit version format</a>.</p>
<p>Last value shown.</p>
</div>
</div>
</div>
{{#newUserJS}}
<div class="panel panel-default">
<div class="panel-heading">
<h5 class="panel-title">
<a id="user-block-updateurl" rel="bookmark"></a>
<a data-toggle="collapse" data-parent="#accordion-userscript-block" href="#collapse-updateurl"><code>@updateURL https://openuserjs.org/meta/{{#authedUser}}{{authedUser.name}}{{/authedUser}}{{^authedUser}}username{{/authedUser}}/My_Script.meta.js</code></a>
</h5>
</div>
<div id="collapse-updateurl" class="panel-collapse collapse">
<div class="panel-body">
<p><strong>Required in lockdown mode.</strong> See <a href="/about/Frequently-Asked-Questions#q-does-openuserjs-org-have-meta-">this FAQ item</a> for more.</p>
<p>Last value is used.</p>
</div>
</div>
</div>
{{/newUserJS}}
</div>
<h3><a id="openuserjs-block"></a>OpenUserJS Block<a href="#openuserjs-block" class="anchor"><i class="fa fa-link"></i></a></h3>
<div class="panel-group" id="accordion-openuserjs-block">
<div class="panel panel-default">
<div class="panel-heading">
<h5 class="panel-title">
<a id="openuserjs-block-author" rel="bookmark"></a>
<a data-toggle="collapse" data-parent="#accordion-openuserjs-block" href="#collapse-openuserjs-author"><code>@author {{#authedUser}}{{authedUser.name}}{{/authedUser}}{{^authedUser}}username{{/authedUser}}</code></a>
</h5>
</div>
<div id="collapse-openuserjs-author" class="panel-collapse collapse in">
<div class="panel-body">
<p>The OpenUserJS Author username of the script.</p>
<p><strong>Required to enable <a href="#collaboration">Collaboration</a></strong>.</p>
<p>Last value shown.</p>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h5 class="panel-title">
<a id="openuserjs-block-collaborator" rel="bookmark"></a>
<a data-toggle="collapse" data-parent="#accordion-openuserjs-block" href="#collapse-openuserjs-collaboration"><code>@collaborator username</code></a>
</h5>
</div>
<div id="collapse-openuserjs-collaboration" class="panel-collapse collapse">
<div class="panel-body">
<p>The OpenUserJS Author username to collaborate with.</p>
<p>Required to activate <a href="#collaboration">Collaboration</a>. <strong>Please ensure the usernames exist for your scripts security.</strong></p>
<p>May be defined multiple times.</p>
<p>All values shown in reverse order.</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-3">
<h2><a id="sync-script"></a><i class="fa fa-refresh"></i> Sync Script<a href="#sync-script" class="anchor"><i class="fa fa-link"></i></a></h2>
<div class="panel panel-default">
<div class="panel-body">
<h3><i class="octicon octicon-mark-github"></i> GitHub</h3>
<p>You may add a webhook to one or more of your GitHub repositories to automatically keep it up to date on OpenUserJS.org.</p>
<h4>Instructions</h4>
<p>Optionally you may upload the script to the site first. You may also use <a href="{{{authedUser.userGitHubRepoListPageUrl}}}">Import from Github</a> to speed things up as a shortcut.</p>
<ol>
<li>On your target GitHub repo, click Settings > Webhooks > Add Webhook.</li>
<li>In the Payload URL input, paste<br /><code>https://openuserjs.org/github/hook</code></li>
<li>Change the Content Type dropdown to<br /><code>application/x-www-form-urlencoded</code></li>
<li>Click <code>Add Webhook</code>.</li>
</ol>
<p>After adding the webhook, push a change to GitHub to make sure it's working.</p>
</div>
</div>
<h3><a id="collaboration"></a>Collaboration<a href="#collaboration" class="anchor"><i class="fa fa-link"></i></a></h3>
<div class="panel panel-default">
<div class="panel-body">
<p>To allow other users to upload modified versions of your script to your account from this site create an OpenUserJS metadata block and add the necessary keys... one for you yourself and for every existing user you wish to give write access as demonstrated here:<pre class="small"><code>// ==OpenUserJS==</code><br /><code>// @author {{#authedUser}}{{authedUser.name}}{{/authedUser}}{{^authedUser}}username{{/authedUser}}</code><br /><code>// @collaborator username</code><br /><code>// ==/OpenUserJS==</code></pre> Only the real author of the script may modify these metadata keys.</p>
<p>Collaborators on this site may not use GitHub integration to update the script. Add them as collaborators to the GitHub repository instead.</p>
<p>If the webhook is enabled on the GitHub repository it will clobber any changes here on this site.</p>
</div>
</div>
</div>
</div>
</div>
</div>
{{> includes/footer.html }}
{{> includes/scripts/browseFeedback.html }}
</body>
</html>