Revision 1b866d9e snf-astakos-app/astakos/im/templates/im/astakosgroup_form_demo.html

b/snf-astakos-app/astakos/im/templates/im/astakosgroup_form_demo.html
2 2

  
3 3
{% block page.body %}
4 4
 
5
	 
5
{% block headjs %}
6
	{{ block.super }}	 
7
	<script src="{{ IM_STATIC_URL }}js/quotas.js"></script>	
8
{% endblock %}		
6 9
<form action="" method="post" class="withlabels quotas-form">{% csrf_token %}
10
	 
7 11
    <fieldset>
8
    	<legend>1. CREATE GROUP</legend>
12
    	<legend>
13
    		1. CREATE GROUP
14
			<span class="info"> 
15
		    	<em>more info</em>
16
		    	<span>Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text</span>
17
	    	</span>    		
18
    	</legend>
9 19
    	<div class="form-row">
10 20
    		<p class="clearfix">
11 21
    			<label for="id">ID</label>
......
17 27
		    	</span>
18 28
    		</p>
19 29
    	</div>
20
    	<div class="form-row with-errors ">
30
    	<div class="form-row">
21 31
    		
22 32
    		<p class="clearfix">
23 33
    			<label for="name">Name</label>
......
28 38
			    	<span>Help Text</span>
29 39
		    	</span>
30 40
    		</p>
31
    		<div class="form-error" style="left: 270.1px; top: 21.2px; width: 292px; margin-left: 224px; margin-bottom: 5px;">This field is required.<br></div>
41
    		 
32 42
    	</div>
33 43
    	<div class="form-row">
34 44
    		<p class="clearfix">
......
64 74
		    	</span>
65 75
    		</p>
66 76
    	</div>
67
    	<div class="form-row    with-checkbox">
77
    	<div class="form-row ">
68 78
		     <p class="clearfix ">
69
		        <a href="javascript:void(0)" class="checkbox-widget"></a><label for="id_moderation_enabled" class="checkbox-label">Moderation enabled</label>
79
		        <label for="id_moderation_enabled">Modaration</label>
70 80
		        <input type="checkbox" id="id_moderation_enabled" name="moderation_enabled" autocomplete="off" style="display: none;">
71 81
		        <span class="extra-img">&nbsp;</span>
72 82
	          	<span class="info"> 
......
75 85
			    </span>
76 86
		     </p>
77 87
		</div>
88
		<div class="double-checks">
89
    		<label>Max users per group</label>
90
    		<div class="form-row">
91
    			<p class="clearfix">
92
    				<label for="vm_per_user_unlimited">Unlimited</label>
93
    				<input type="checkbox" id="vm_per_user_unlimited" name="vm_per_user_unlimited" class="unlimited" checked="checked">
94
    			</p>
95
    		</div>
96
    		<div class="form-row">
97
    			<p class="clearfix">
98
    				<label for="vm_per_user_limited">Limited</label>
99
    				<input type="checkbox" id="vm_per_user_limited" name="vm_per_user_limited" class="limited">
100
       				<input type="text" id="vm_user_limited_num"/>
101
       				 
102
    			</p>
103
    		</div>
104
    		
105
    	</div> 
78 106
    </fieldset>       
79
    <fieldset>
80
    	<legend>2. CHOOSE RESOURCES</legend>
107
    <fieldset id="icons">
108
    	<legend>
109
    		2. CHOOSE RESOURCES
110
    		<span class="info"> 
111
		    	<em>more info</em>
112
		    	<span>Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text Help Text</span>
113
	    	</span>    
114
    	</legend>
115
    	{% for key in groups.items %}
116
    		{% endfor %}
117
    	
81 118
    	<ul class="clearfix">
82
    		<li><a href="#" id="vm">VM</a></li>
83
    		<li><a href="#" id="storage">STORAGE</a></li>
84
    		<li class="rel"><a href="#" id="cpu">CPU</a></li>
85
    		<li class="rel"><a href="#" id="ram">RAM</a></li>
86
    		<li class="rel"><a href="#" id="diskspace">DISKSPACE</a></li>
119
    		
120
    		<li><a href="#vm_1" id="vm_1"><img src="/static/im/images/create-resource-vm.png" alt="vm"/></a></li>
121
    		<li><a href="#storage_1" id="storage_1"><img src="/static/im/images/create-resource-storage.png" alt="storage"/></a></li>
87 122
    	</ul>
88 123
    	<p class="msg">if you choose CPU without selecting any VMs you must also select RAM and DISKSPACE</p>
89
    </fieldset>   
90
    <fieldset class="quota vm">
91
    	<a href="#" class="delete"><strong>X</strong> remove resource</a>
92
    	<legend>VM</legend>
93
    	<div class="form-row">
94
    		<p class="clearfix">
95
    			<label for="num_vms">Total VM</label>
96
    			<input type="text" name="num_vms">
97
    			<span class="extra-img">&nbsp;</span>
98
         		<span class="info"> 
99
			    	<em>more info</em>
100
			    	<span>Help Text</span>
101
		    	</span>
102
    		</p>
103
    	</div>
104
    </fieldset>
105
    <fieldset class="quota storage">
106
    	<a href="#" class="delete"><strong>X</strong> remove resource</a>
107
    	<legend>STORAGE</legend>
108
    	<div class="form-row">
109
    		<p class="clearfix">
110
    			<label for="num_vms">Total storage</label>
111
    			<input type="text" name="num_vms">
112
    			<span class="extra-img">&nbsp;</span>
113
         		<span class="info"> 
114
			    	<em>more info</em>
115
			    	<span>Help Text</span>
116
		    	</span>
117
    		</p>
118
    	</div>
119
    </fieldset>
120
    <fieldset class="quota cpu">
121
    	<a href="#" class="delete"><strong>X</strong> remove resource</a>
122
    	<legend>CPU</legend>
123
    	<div class="form-row">
124
    		<p class="clearfix">
125
    			<label for="num_vms">Total cpu</label>
126
    			<input type="text" name="num_cpu">
127
    			<span class="extra-img">&nbsp;</span>
128
         		<span class="info"> 
129
			    	<em>more info</em>
130
			    	<span>Help Text</span>
131
		    	</span>
132
    		</p>
133
    	</div>
134
    </fieldset>
135
    <fieldset class="quota ram">
136
    	<a href="#" class="delete"><strong>X</strong> remove resource</a>
137
    	<legend>RAM</legend>
138
    	<div class="form-row">
139
    		<p class="clearfix">
140
    			<label for="num_ram">Total ram</label>
141
    			<input type="text" name="num_ram">
142
    			<span class="extra-img">&nbsp;</span>
143
         		<span class="info"> 
144
			    	<em>more info</em>
145
			    	<span>Help Text</span>
146
		    	</span>
147
    		</p>
148
    	</div>
149
    </fieldset>
150
    <fieldset class="quota diskspace">
151
    	<a href="#" class="delete"><strong>X</strong> remove resource</a>
152
    	<legend>DISKSPACE</legend>
153
    	<div class="form-row">
154
    		<p class="clearfix">
155
    			<label for="num_diskspace">Total diskspace</label>
156
    			<input type="text" name="num_diskspace">
157
    			<span class="extra-img">&nbsp;</span>
158
         		<span class="info"> 
159
			    	<em>more info</em>
160
			    	<span>Help Text</span>
161
		    	</span>
162
    		</p>
163
    	</div>
164 124
    </fieldset>
125
    <div class="foo">
126
    	
127
    </div> 
128
    <div class="not-foo">
129
	    <div class="group vm_1">  
130
	    	<a href="#icons" class="delete"><strong>X</strong> remove resource</a>
131
		    <fieldset class="quota vm" style="background:none;">
132
		    	<legend>VM</legend>
133
		    	<div class="form-row">
134
		    		<p class="clearfix">
135
		    			<label for="num_vms">Total VMs</label>
136
		    			<input type="text" name="num_vms">
137
		    			<span class="extra-img">&nbsp;</span>
138
		         		<span class="info"> 
139
					    	<em>more info</em>
140
					    	<span>Help Text</span>
141
				    	</span>
142
		    		</p>
143
		    	</div>
144
		    	<div class="double-checks">
145
		    		<label>Max VMs per user</label>
146
		    		<div class="form-row">
147
		    			<p class="clearfix">
148
		    				<label for="vm_per_user_unlimited">Unlimited</label>
149
		    				<input type="checkbox" id="vm_per_user_unlimited" name="vm_per_user_unlimited" class="unlimited" checked="checked">
150
		    			</p>
151
		    		</div>
152
		    		<div class="form-row">
153
		    			<p class="clearfix">
154
		    				<label for="vm_per_user_limited">Limited</label>
155
		    				<input type="checkbox" id="vm_per_user_limited" name="vm_per_user_limited" class="limited">
156
		       				<input type="text" id="vm_user_limited_num"/>
157
		       				 
158
		    			</p>
159
		    		</div>
160
		    		
161
		    	</div> 
162
		    </fieldset>
163
		    <fieldset class="quota cpu" style="background:none;">
164
		    	 
165
		    	<legend>cpu</legend>
166
		    	<div class="form-row">
167
		    		<p class="clearfix">
168
		    			<label for="num_cpu">Total cpus</label>
169
		    			<input type="text" name="num_cpu">
170
		    			<span class="extra-img">&nbsp;</span>
171
		         		<span class="info"> 
172
					    	<em>more info</em>
173
					    	<span>Help Text</span>
174
				    	</span>
175
		    		</p>
176
		    	</div>
177
		    	<div class="double-checks">
178
		    		<label>Max cpus per user</label>
179
		    		<div class="form-row">
180
		    			<p class="clearfix">
181
		    				<label for="cpu_per_user_unlimited">Unlimited</label>
182
		    				<input type="checkbox" id="cpu_per_user_unlimited" name="cpu_per_user_unlimited" class="unlimited" checked="checked">
183
		    			</p>
184
		    		</div>
185
		    		<div class="form-row">
186
		    			<p class="clearfix">
187
		    				<label for="cpu_per_user_limited">Limited</label>
188
		    				<input type="checkbox" id="cpu_per_user_limited" name="cpu_per_user_limited" class="limited">
189
		       				<input type="text" id="cpu_user_limited_num"/>
190
		       				 
191
		    			</p>
192
		    		</div>
193
		    		
194
		    	</div> 
195
		    </fieldset>
196
		    <fieldset class="quota ram">
197
		    	 
198
		    	<legend>ram</legend>
199
		    	<div class="form-row">
200
		    		<p class="clearfix">
201
		    			<label for="num_ram">Total ram</label>
202
		    			<input type="text" name="num_ram">
203
		    			<span class="extra-img">&nbsp;</span>
204
		         		<span class="info"> 
205
					    	<em>more info</em>
206
					    	<span>Help Text</span>
207
				    	</span>
208
		    		</p>
209
		    	</div>
210
		    	<div class="double-checks">
211
		    		<label>Max ram per user</label>
212
		    		<div class="form-row">
213
		    			<p class="clearfix">
214
		    				<label for="ram_per_user_unlimited">Unlimited</label>
215
		    				<input type="checkbox" id="ram_per_user_unlimited" name="ram_per_user_unlimited" class="unlimited" checked="checked">
216
		    			</p>
217
		    		</div>
218
		    		<div class="form-row">
219
		    			<p class="clearfix">
220
		    				<label for="ram_per_user_limited">Limited</label>
221
		    				<input type="checkbox" id="ram_per_user_limited" name="ram_per_user_limited" class="limited">
222
		       				<input type="text" id="ram_user_limited_num"/>
223
		       				 
224
		    			</p>
225
		    		</div>
226
		    		
227
		    	</div> 
228
		    </fieldset>
229
		</div>    
230
		<div class="group storage_1">
231
			<a href="#icons" class="delete"><strong>X</strong> remove resource</a>	
232
		    <fieldset class="quota storage">
233
		    	<legend>STORAGE</legend>
234
		    	<div class="form-row">
235
		    		<p class="clearfix">
236
		    			<label for="num_storage">Total storage</label>
237
		    			<input type="text" name="num_storage">
238
		    			<span class="extra-img">&nbsp;</span>
239
		         		<span class="info"> 
240
					    	<em>more info</em>
241
					    	<span>Help Text</span>
242
				    	</span>
243
		    		</p>
244
		    	</div>
245
		    	<div class="double-checks">
246
		    		<label>Max Storage per user</label>
247
		    		<div class="form-row">
248
		    			<p class="clearfix">
249
		    				<label for="storage_per_user_unlimited">Unlimited</label>
250
		    				<input type="checkbox" id="storage_per_user_unlimited" name="storage_per_user_unlimited" class="unlimited" checked="checked">
251
		    			</p>
252
		    		</div>
253
		    		<div class="form-row">
254
		    			<p class="clearfix">
255
		    				<label for="storage_per_user_limited">Limited</label>
256
		    				<input type="checkbox" id="storage_per_user_limited" name="storage_per_user_limited" class="limited">
257
		       				<input type="text" id="storage_user_limited_num"/>
258
		       				 
259
		    			</p>
260
		    		</div>
261
		    		
262
		    	</div> 
263
		    </fieldset>
264
	    </div>
265
	</div>
165 266
    <div class="form-row submit">
166
	   <input type="submit" value="SUBMIT" class="submit altcol" autocomplete="off">
267
   		<input type="submit" value="SUBMIT" class="submit altcol" autocomplete="off">
167 268
	</div>     
168 269
</form>
169 270
	 
271
<script>
272
	
273
</script>	 
170 274
 
171 275
{% endblock %}

Also available in: Unified diff