c9df8baad449f8c7458172d07396db87e3cc1dd6
[motion-next.git] /
1 <md-dialog class="plugin-dialog" aria-label="New Plugin">
2   <form name="pluginForm" class="md-inline-form" novalidate>
3     <md-toolbar class="md-accent md-hue-2">
4       <div
5         class="md-toolbar-tools"
6         layout="row"
7         layout-align="space-between center"
8       >
9         <span class="title">{{ vm.title | translate }}</span>
10         <md-button class="md-icon-button" ng-click="vm.closeDialog()">
11           <md-icon
12             md-font-icon="icon-close"
13             aria-label="Close dialog"
14           ></md-icon>
15         </md-button>
16       </div>
17     </md-toolbar>
18
19     <md-dialog-content ms-scroll>
20       <div class="error-list">
21         <div
22           ng-repeat="error in vm.errors"
23           class="error"
24           layout="row"
25           layout-align="space-between center"
26         >
27           <div>
28             <span class="message">{{error.message}}</span>
29             <span class="type">({{error.type}})</span>
30           </div>
31           <md-button class="md-icon-button">
32             <md-icon
33               md-font-icon="icon-alert-box"
34               aria-label="alert error"
35               class="s16"
36             ></md-icon>
37           </md-button>
38         </div>
39       </div>
40       <md-input-container class="md-block">
41         <label translate="MARKETPLACE.NAME">Name</label>
42         <input
43           type="text"
44           name="name"
45           ng-model="vm.plugin.name"
46           ng-required="true"
47           autofocus
48         />
49
50         <div
51           ng-messages="pluginForm['name'].$error"
52           ng-show="pluginForm['name'].$touched"
53           role="alert"
54         >
55           <div ng-message="required">
56             <span translate="MARKETPLACE.ERRORS.NAME_REQUIRED"
57               >Name field is required</span
58             >
59           </div>
60         </div>
61       </md-input-container>
62       <md-input-container class="md-block">
63         <label translate="MARKETPLACE.TYPE">Type</label>
64         <input
65           type="text"
66           name="type"
67           ng-model="vm.plugin.type"
68           ng-disabled="!vm.newPlugin"
69         />
70
71         <div
72           ng-messages="pluginForm['type'].$error"
73           ng-show="pluginForm['type'].$touched"
74           role="alert"
75         >
76           <div ng-message="required">
77             <span translate="MARKETPLACE.ERRORS.TYPE_REQUIRED"
78               >Type field is required</span
79             >
80           </div>
81         </div>
82       </md-input-container>
83       <md-input-container class="md-block">
84         <md-switch
85           ng-model="vm.plugin.active"
86           aria-label="Active"
87           ng-disabled="!vm.newPlugin"
88           ><span translate="MARKETPLACE.ACTIVE">Active</span></md-switch
89         >
90       </md-input-container>
91       <md-input-container class="md-block">
92         <label translate="MARKETPLACE.DESCRIPTION">Description</label>
93         <input
94           type="text"
95           name="description"
96           ng-model="vm.plugin.description"
97         />
98
99         <div
100           ng-messages="pluginForm['description'].$error"
101           ng-show="pluginForm['description'].$touched"
102           role="alert"
103         >
104           <div ng-message="required">
105             <span translate="MARKETPLACE.ERRORS.DESCRIPTION_REQUIRED"
106               >Description field is required</span
107             >
108           </div>
109         </div>
110       </md-input-container>
111       <md-input-container class="md-block">
112         <label translate="MARKETPLACE.ICON">Icon</label>
113         <input
114           type="text"
115           name="icon"
116           ng-model="vm.plugin.icon"
117           ng-required="true"
118         />
119
120         <div
121           ng-messages="pluginForm['icon'].$error"
122           ng-show="pluginForm['icon'].$touched"
123           role="alert"
124         >
125           <div ng-message="required">
126             <span translate="MARKETPLACE.ERRORS.ICON_REQUIRED"
127               >Icon field is required</span
128             >
129           </div>
130         </div>
131       </md-input-container>
132       <md-input-container class="md-block">
133         <label translate="MARKETPLACE.SIDEBAR">Sidebar</label>
134         <md-select name="sidebar" ng-model="vm.plugin.sidebar" required>
135           <md-option ng-value="'always'">Always</md-option>
136           <md-option ng-value="'adminOnly'">Admin Only</md-option>
137           <md-option ng-value="'agentOnly'">Agent Only</md-option>
138           <md-option ng-value="'never'">Never</md-option>
139         </md-select>
140         <div
141           ng-messages="pluginForm['sidebar'].$error"
142           ng-show="pluginForm['sidebar'].$touched"
143           role="alert"
144         >
145           <div ng-message="required">
146             <span translate="MARKETPLACE.ERRORS.SIDEBAR_REQUIRED"
147               >Sidebar field is required</span
148             >
149           </div>
150         </div>
151       </md-input-container>
152       <md-input-container
153         ng-if="vm.plugin.sidebar === 'always' || vm.plugin.sidebar === 'adminOnly'"
154         class="md-block"
155       >
156         <label translate="MARKETPLACE.ADMINURL">AdminUrl</label>
157         <input type="text" name="adminUrl" ng-model="vm.plugin.adminUrl" />
158
159         <div
160           ng-messages="pluginForm['adminUrl'].$error"
161           ng-show="pluginForm['adminUrl'].$touched"
162           role="alert"
163         >
164           <div ng-message="required">
165             <span translate="MARKETPLACE.ERRORS.ADMINURL_REQUIRED"
166               >AdminUrl field is required</span
167             >
168           </div>
169         </div>
170       </md-input-container>
171       <md-input-container
172         ng-if="vm.plugin.sidebar === 'always' || vm.plugin.sidebar === 'agentOnly'"
173         class="md-block"
174       >
175         <label translate="MARKETPLACE.AGENTURL">AgentUrl</label>
176         <input type="text" name="agentUrl" ng-model="vm.plugin.agentUrl" />
177
178         <div
179           ng-messages="pluginForm['agentUrl'].$error"
180           ng-show="pluginForm['agentUrl'].$touched"
181           role="alert"
182         >
183           <div ng-message="required">
184             <span translate="MARKETPLACE.ERRORS.AGENTURL_REQUIRED"
185               >AgentUrl field is required</span
186             >
187           </div>
188         </div>
189       </md-input-container>
190       <md-input-container ng-if="vm.plugin.type === 'script'" class="md-block">
191         <label translate="MARKETPLACE.SCRIPTNAME">ScriptName</label>
192         <input
193           type="text"
194           name="scriptName"
195           ng-model="vm.plugin.scriptName"
196           ng-disabled="!vm.newPlugin"
197         />
198
199         <div
200           ng-messages="pluginForm['scriptName'].$error"
201           ng-show="pluginForm['scriptName'].$touched"
202           role="alert"
203         >
204           <div ng-message="required">
205             <span translate="MARKETPLACE.ERRORS.SCRIPTNAME_REQUIRED"
206               >ScriptName field is required</span
207             >
208           </div>
209         </div>
210       </md-input-container>
211       <md-input-container ng-if="vm.plugin.type === 'script'" class="md-block">
212         <label translate="MARKETPLACE.SCRIPTPATH">ScriptPath</label>
213         <input
214           type="text"
215           name="scriptPath"
216           ng-model="vm.plugin.scriptPath"
217           ng-required="true"
218         />
219
220         <div
221           ng-messages="pluginForm['scriptPath'].$error"
222           ng-show="pluginForm['scriptPath'].$touched"
223           role="alert"
224         >
225           <div ng-message="required">
226             <span translate="MARKETPLACE.ERRORS.SCRIPTPATH_REQUIRED"
227               >ScriptPath field is required</span
228             >
229           </div>
230         </div>
231       </md-input-container>
232       <md-input-container class="md-block">
233         <label translate="MARKETPLACE.VERSION">Version</label>
234         <input
235           type="text"
236           name="version"
237           ng-model="vm.plugin.version"
238           ng-disabled="!vm.newPlugin"
239         />
240
241         <div
242           ng-messages="pluginForm['version'].$error"
243           ng-show="pluginForm['version'].$touched"
244           role="alert"
245         >
246           <div ng-message="required">
247             <span translate="MARKETPLACE.ERRORS.VERSION_REQUIRED"
248               >Version field is required</span
249             >
250           </div>
251         </div>
252       </md-input-container>
253
254       <div class="error-list">
255         <div
256           ng-repeat="error in vm.errors"
257           class="error"
258           layout="row"
259           layout-align="space-between center"
260         >
261           <div>
262             <span class="message">{{error.message}}</span>
263             <span class="type">({{error.type}})</span>
264           </div>
265           <md-button class="md-icon-button">
266             <md-icon
267               md-font-icon="icon-alert-box"
268               aria-label="alert error"
269               class="s16"
270             ></md-icon>
271           </md-button>
272         </div>
273       </div>
274     </md-dialog-content>
275
276     <md-dialog-actions
277       layout="row"
278       layout-align="space-between center"
279       ng-if="!vm.crudPermissions.readOnly"
280     >
281       <div layout="row" layout-align="start center">
282         <md-button
283           type="submit"
284           ng-if="vm.crudPermissions.canEdit && !vm.newPlugin"
285           ng-click="vm.savePlugin()"
286           class="send-button md-accent md-raised"
287           ng-disabled="pluginForm.$invalid || pluginForm.$pristine"
288           aria-label="SAVE"
289           translate="MARKETPLACE.SAVE"
290           translate-attr-aria-label="MARKETPLACE.SAVE"
291         >
292           SAVE
293         </md-button>
294
295         <md-button
296           type="submit"
297           ng-if="vm.crudPermissions.canEdit && vm.newPlugin"
298           ng-click="vm.addNewPlugin()"
299           class="send-button md-accent md-raised"
300           ng-disabled="pluginForm.$invalid"
301           aria-label="ADD"
302           translate="MARKETPLACE.ADD_PLUGIN"
303           translate-attr-aria-label="MARKETPLACE.ADD_PLUGIN"
304         >
305           ADD PLUGIN
306         </md-button>
307       </div>
308       <div layout="row">
309         <md-button
310           class="md-icon-button"
311           ng-if="vm.crudPermissions.canDelete && !vm.newPlugin"
312           ng-click="vm.deletePlugin($event)"
313           aria-label="DELETE"
314           translate
315           translate-attr-aria-label="MARKETPLACE.DELETE"
316         >
317           <md-icon md-font-icon="icon-delete"></md-icon>
318           <md-tooltip
319             ><span translate="MARKETPLACE.DELETE">DELETE</span></md-tooltip
320           >
321         </md-button>
322       </div>
323     </md-dialog-actions>
324   </form>
325 </md-dialog>