Revision bde71886

b/snf-astakos-app/astakos/im/static/im/css/modules.css
55 55
.two-cols .lt                                   { float:left; width:400px;}
56 56
.two-cols-blog .rt                              { float:right; width:220px; margin-left:80px; padding-right:65px;}
57 57
.two-cols-blog .lt 	                            { overflow:hidden;}
58
.container h2									{ font-weight:700; font-size:1.308em; margin-bottom:1em; }
58
.container h2									{ font-weight:normal; font-size:1.308em; margin-bottom:1em; }
59 59
.container h3                    				{ font-weight:normal; margin-bottom:1em; }
60 60
.container h2 em 								{ color: #3582AC; font-style:normal; }
61 61
/*.content a						                { border-bottom: 1px solid #F89A1C; text-decoration:none; color:#000; }
......
336 336
.billing table.alt-style .last					{ text-align:right; }
337 337

  
338 338
.table_sorting tr th							{ cursor:pointer; }
339

  
339

  
340 340
.table_sorting tr th:hover						{ text-decoration:underline }
341 341

  
342 342
table.alt-style tr.tr1 td,
343 343
table.alt-style tr.tmore1 td					{ background:#F2F2F2 }
344 344
table.alt-style tr.tr2 td,
345 345
table.alt-style tr.tmore2 td					{ background:#fff }
346
table.alt-style tr td.info-td					{ padding:5px; }
346
table.alt-style tr td.info-td					{ padding:5px; }

347 347
table.alt-style tr td.info-td div				{ padding:15px; border:1px dashed #000 }
348 348
table.alt-style tr td a.more-info				{ display:inline-block;  width:17px; height:16px; background:url(../images/plus-minus.png) no-repeat 0 0; margin-left:10px; }
349 349
table.alt-style tr td a.more-info:hover			{ background-image:url(../images/plus-minus-hover.png); text-decoration:none;}
......
351 351

  
352 352
.projects .details a.edit						{ float:right; margin-left:20px;  }
353 353
.projects .details .data						{ overflow:hidden; }
354
.projects .editable form textarea				{ width:70%; height:50px; max-width:70%; width:270px; height:120px;}
354
.projects .editable form textarea				{ width:70%; height:50px; max-width:70%; width:270px; height:120px;}
355

  
356

  
357
/* quotas-form  */
358
.quotas-form fieldset							{ background:url(../images/dots.jpg) repeat-x scroll center bottom transparent; margin-bottom:3em; padding-bottom:3em; position:relative; }
359
.quotas-form fieldset legend					{ color:#55B577; font-size:1.308em; margin-bottom:2em; }
360
.quotas-form .with-checkbox .checkbox-widget	{ margin-top:14px; } 
361
.quotas-form .with-checkbox span.info 			{ bottom:19px; }
362
.quotas-form .form-row.submit					{ text-align:center; }
363
.quotas-form input[type="submit"]				{ margin:15px 0; background-color:#B3B3B3 }
364
.quotas-form input[type="submit"]:hover			{ background:#55B577 }
365
.quotas-form input[type="submit"]:focus			{ border-color: #B3B3B3}
366
.quotas-form input[type="submit"]:focus:hover	{ border-color: #55B577}
367
.quotas-form fieldset ul						{ padding:0; margin:0 0 1em; }
368
.quotas-form fieldset ul li						{ list-style:none outside none; float:left; padding:0 0 0 59px; margin:0; }
369
.quotas-form fieldset ul li:first-child			{ padding-left:0; }
370
.quotas-form fieldset ul li a					{ display:block; border:1px solid #222; color:#222; padding:10px 20px; }
371
.quotas-form fieldset ul li a:hover				{ text-decoration:none; border-color:#55B577; color:#55B577; }
372
.quotas-form fieldset ul li a.selected			{ background:#55B577; color:#fff; border-color:#55B577; }
373
.quotas-form p.msg								{ color:#B3B3B3; }
374
.quotas-form fieldset legend 					{ margin-bottom:1em; font-size:1.154em }
375
.quotas-form a.delete							{ position:absolute; right:0; top:0; color:#B3B3B3; }
376
.quotas-form .quota								{ display:none; }
377
.quotas-form fieldset ul li.rel+li.rel			{ background:url(../images/quota-related-bg.png) no-repeat left center; }
378

  
379
/* stats */
380
.stats ul										{ margin:0; padding:0; list-style:none outside none; }
381
.stats ul li 									{ margin:0 0 1em 0; padding:0 0 1em 0; list-style:none outside none; background:url(../images/stats-line.jpg) repeat-x left bottom}
382
.stats .bar										{ padding:20px 0; text-align:center;  float:left; width:200px;}
383
.stats .bar div									{ width:340px; height:30px; border:1px solid #000;}
384
.stats .bar span								{ text-align:right; display:block; height:100%; color:#fff;  line-height:30px; font-size:1.231em; text-indent:50px;}
385
.stats .red .bar span							{ background:#ef4f54; }
386
.stats .yellow .bar span						{ background:#f6921e; }
387
.stats .green .bar span							{ background:#55b577; }
388
.stats .img-wrap								{ float:left; width:100px; background:url(../images/statistics_icons.png) no-repeat center center; padding:30px 0; }
389
.stats .info									{ margin:0 25px ; width:320px; float:left;  }
390
.stats .info p									{ color:#999; margin:0; }
391
.stats .info h3									{ font-size:1.231em; }
392
.stats .red.vm .img-wrap						{ background-position: 15px 7px; }
393
.stats .yellow.vm .img-wrap						{ background-position: -124px 7px; }
394
.stats .green.vm .img-wrap						{ background-position: -263px 7px; }
395
.stats .red.ram .img-wrap						{ background-position: 15px -125px; }
396
.stats .yellow.ram .img-wrap					{ background-position: -124px -125px; }
397
.stats .green.ram .img-wrap						{ background-position: -263px -125px;}
398
.stats .red.disks .img-wrap						{ background-position: 15px -248px; }
399
.stats .yellow.disks .img-wrap					{ background-position: -124px -248px; }
400
.stats .green.disks .img-wrap					{ background-position: -263px -248px;}
b/snf-astakos-app/astakos/im/static/im/js/common.js
175 175
				}
176 176
			});
177 177
		}
178
		
179
		if($("#id_issue_date_demo").length > 0 ){
180
			$( "#id_issue_date_demo" ).datepicker({
181
				defaultDate: "+0", 
182
				dateFormat: "yy-mm-dd",
183
				onSelect: function( selectedDate ) {
184
					$( "#id_expiration_date_demo" ).datepicker( "option", "minDate", selectedDate );
185
				}
186
			});
187
			$( "#id_expiration_date_demo" ).datepicker({
188
				defaultDate: "+1w", 
189
				dateFormat: "yy-mm-dd",
190
				onSelect: function( selectedDate ) {
191
					$( "#id_issue_date_demo" ).datepicker( "option", "maxDate", selectedDate );
192
				}
193
			});
194
		}
178 195
	});
179 196
	
180 197
	
......
201 218
		$(this).hide();
202 219
	})
203 220
	
221
	// quota form actions
222
	
223
	$('.quotas-form ul li a').click(function(e){
224
		e.preventDefault();
225
		$(this).addClass('selected');
226
		var id = $(this).attr('id');
227
		$('.quotas-form fieldset').each(function() {
228
			if($(this).hasClass(id)) {
229
				$(this).show('slow');
230
			}
231
		}); 	
232
		
233
	});
234
	
235
	$('.quotas-form fieldset .delete').click(function(e){
236
		e.preventDefault();
237
		$(this).parents('fieldset').find('input').val('');
238
		$(this).parents('fieldset').hide('slow');
239
		fieldsetClass = $(this).parents('fieldset').attr('class').replace('quota ', '');
240
		$('.quotas-form ul li a').each(function() {
241
			if($(this).attr('id')==fieldsetClass) {
242
				$(this).removeClass('selected');
243
			}
244
		}); 
245
		 
246
		 
247
	})
248
	
249
	
250
	
204 251
});
205 252

  
206 253
$(window).resize(function() {
b/snf-astakos-app/astakos/im/templates/im/astakosgroup_form_demo.html
1
{% extends "im/account_base.html" %}
2

  
3
{% block page.body %}
4
 
5
	 
6
<form action="" method="post" class="withlabels quotas-form">{% csrf_token %}
7
    <fieldset>
8
    	<legend>1. CREATE GROUP</legend>
9
    	<div class="form-row">
10
    		<p class="clearfix">
11
    			<label for="id">ID</label>
12
    			<input type="text" name="id">
13
    			<span class="extra-img">&nbsp;</span>
14
         		<span class="info"> 
15
			    	<em>more info</em>
16
			    	<span>Help Text</span>
17
		    	</span>
18
    		</p>
19
    	</div>
20
    	<div class="form-row with-errors ">
21
    		
22
    		<p class="clearfix">
23
    			<label for="name">Name</label>
24
    			<input type="text" name="name">
25
    			<span class="extra-img">&nbsp;</span>
26
         		<span class="info"> 
27
			    	<em>more info</em>
28
			    	<span>Help Text</span>
29
		    	</span>
30
    		</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>
32
    	</div>
33
    	<div class="form-row">
34
    		<p class="clearfix">
35
    			<label for="description">Description</label>
36
    			<textarea name="description"></textarea>
37
    			<span class="extra-img">&nbsp;</span>
38
         		<span class="info"> 
39
			    	<em>more info</em>
40
			    	<span>Help Text</span>
41
		    	</span>
42
    		</p>
43
    	</div>
44
    	<div class="form-row">
45
    		<p class="clearfix">
46
    			<label for="id_issue_date_demo">Issue Date</label>
47
    			<input type="text" id="id_issue_date_demo" name="id_issue_date_demo" class="hasDatepicker">
48
    			<span class="extra-img">&nbsp;</span>
49
         		<span class="info"> 
50
			    	<em>more info</em>
51
			    	<span>Help Text</span>
52
		    	</span>
53
    		</p>
54
    	</div>
55
    	
56
    	<div class="form-row">
57
    		<p class="clearfix">
58
    			<label for="id_expiration_date_demo">Expiration Date</label>
59
    			<input type="text" name="id_expiration_date_demo" id="id_expiration_date_demo" class="hasDatepicker">
60
    			<span class="extra-img">&nbsp;</span>
61
         		<span class="info"> 
62
			    	<em>more info</em>
63
			    	<span>Help Text</span>
64
		    	</span>
65
    		</p>
66
    	</div>
67
    	<div class="form-row    with-checkbox">
68
		     <p class="clearfix ">
69
		        <a href="javascript:void(0)" class="checkbox-widget"></a><label for="id_moderation_enabled" class="checkbox-label">Moderation enabled</label>
70
		        <input type="checkbox" id="id_moderation_enabled" name="moderation_enabled" autocomplete="off" style="display: none;">
71
		        <span class="extra-img">&nbsp;</span>
72
	          	<span class="info"> 
73
				    <em>more info</em>
74
				    <span>Check if you want to approve members participation manually</span>
75
			    </span>
76
		     </p>
77
		</div>
78
    </fieldset>       
79
    <fieldset>
80
    	<legend>2. CHOOSE RESOURCES</legend>
81
    	<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>
87
    	</ul>
88
    	<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
    </fieldset>
165
    <div class="form-row submit">
166
	   <input type="submit" value="SUBMIT" class="submit altcol" autocomplete="off">
167
	</div>     
168
</form>
169
	 
170
 
171
{% endblock %}
b/snf-astakos-app/astakos/im/templates/im/astakosgroup_list.html
23 23
	    {% else %}
24 24
    
25 25
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <br>You can <a href="{% url group_create_list %}">create a new group</a> or <a href="{% url group_search %}">join</a> to an existing one.</p>
26
		
26 27
		<div class="widjets"> 
27 28
			<a href="#" class="widjet-x" title="remove boxes">X</a>
28 29
			<ul class="clearfix">	
29 30
				<li>
30 31
					<div>
31
						<p>WELCOME!<br>Connect with a world of people who share your passions.<br>With millions of groups at your fingertips, it's easy to find the group that's best for you -- no matter your interest.</p>
32
						<p>WELCOME!<br>Connect with a world of people who share your passions.<br>With millions of groups at your fingertips, it's easy to find the group that's best for you -- no matter your interest.</p><p style="text-align: center"><img alt="THINK ABOUT IT" src="/static/im/images/create.png"></p>
32 33
						<p class="btn"><a href="{% url group_create_list %}" class="submit">CREATE</a></p>
33 34
					</div>
34 35
				</li>
35 36
				<li>
36 37
					<div>
37
						<p>LOOKING FOR A GROUP?</p><p>Well, this is the place to start!<br>sdofuisd ofuaofi usdiof uiofu osifuaoi ufisdfiousf oiusd<br><img alt="THINK ABOUT IT" src="/static/medialibrary/2012/06/behind_okeanos.png"></p>
38
						<p>LOOKING FOR A GROUP?</p><p>Well, this is the place to start!<br>sdofuisd ofuaofi usdiof uiofu osifuaoi ufisdfiousf oiusd<br></p>
39
						<p style="text-align: center"><img alt="THINK ABOUT IT" src="/static/im/images/join.png"></p>
38 40
						<p class="btn"><a href="{% url group_search %}" class="submit">JOIN</a></p>
39 41
					</div>
40 42
				</li>
......
257 259
			                <th>Type</th>
258 260
			                <th>Issued</th>
259 261
			                <th>Expires</th>
260

  
261
			                 
262 262
			                <th>Enrolled</th>
263
			               
264
			                 
265 263
			                <th>Enrollment status</th>
266 264
			                <th>&nbsp;</th>
267 265
			              
b/snf-astakos-app/astakos/im/templates/im/astakosuserquota_list.html
4 4

  
5 5
{% block page.body %}
6 6
<div class="maincol {% block innerpage.class %}{% endblock %}">
7
    <div class="stats clearfix">
8
    	<ul>
9
    		<li class="clearfix red vm">
10
    			<div class="img-wrap">&nbsp;</div>
11
    			<div class="info">
12
    				<h3>Number of Vms</h3>
13
    				<p>
14
    					XX% Used<br>
15
    					That is XXX of your XXX MB of virtual RAM - Aouch!
16
    				</p>
17
    			</div>
18
    			<div class="bar">
19
    				<div><span style="width:89%;">89%&nbsp;</span></div>
20
    			</div>
21
    		</li>
22
    		<li class="clearfix yellow ram">
23
    			<div class="img-wrap">&nbsp;</div>
24
    			<div class="info">
25
    				<h3>Number of RAMs</h3>
26
    				<p>
27
    					XX% Used<br>
28
    					That is XXX of your XXX MB of virtual RAM - Aouch!
29
    				</p>
30
    			</div>
31
    			<div class="bar">
32
    				<div><span style="width:30%;">30%&nbsp;</span></div>
33
    			</div>
34
    		</li>
35
    		<li class="clearfix green disks">
36
    			<div class="img-wrap">&nbsp;</div>
37
    			<div class="info">
38
    				<h3>Number of Vms</h3>
39
    				<p>
40
    					XX% Used<br>
41
    					That is XXX of your XXX MB of virtual RAM - Aouch!
42
    				</p>
43
    			</div>
44
    			<div class="bar">
45
    				<div><span style="width:60%;">30%&nbsp;</span></div>
46
    			</div>
47
    		</li>
48
    	</ul>
49
    </div>    
50
    <!--
7 51
    <div class="section">
8 52
            {% for k, v in user.quota|items %}
9 53
                <strong>{{k}}</strong>
......
15 59
                      </tr>
16 60
                    </thead>
17 61
 -->
62
 <!--
18 63
                    <tbody>
19 64
                    {% for m in user.membership_set.select_related.all %}
20 65
                        {% if m.group.is_enabled %}
......
38 83
                    </tbody>
39 84
                </table>
40 85
            {% endfor %}
41
    </div>
86
    </div>-->
42 87
</div>
43 88
{% endblock %}
b/snf-astakos-app/astakos/im/templates/im/base.html
27 27

  
28 28
  {% block page.css %}
29 29
       
30
      <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600,700&subset=latin,greek-ext,greek' rel='stylesheet' type='text/css'>
30
      <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,600,700&subset=latin,greek-ext,greek' rel='stylesheet' type='text/css'>
31 31
      <link rel="stylesheet" type="text/css" href="{{ IM_STATIC_URL }}css/global.css">
32 32
      <link rel="stylesheet" type="text/css" href="{{ IM_STATIC_URL }}css/print.css" media="print">
33 33
      <!--[if lte IE 7]>
......
35 35
      <![endif]-->
36 36
      <link rel="stylesheet" media="screen and (max-width: 960px)" href="{{ IM_STATIC_URL }}css/max960.css"/>
37 37
      <link rel="stylesheet" media="screen and (max-width: 768px)" href="{{ IM_STATIC_URL }}css/max768.css"/>  
38
      <link rel="stylesheet" media="screen and (max-width: 480px)" href="{{ IM_STATIC_URL }}css/max480.css"/>  
38
      <link rel="stylesheet" media="screen and (max-width: 480px)" href="{{ IM_STATIC_URL }}css/max480.css"/> 
39 39
      <link rel="stylesheet" type="text/css" href="{{ IM_STATIC_URL }}css/jquery-ui-1.8.21.custom.css"/>
40 40
      
41 41
  {% endblock page.css %}
b/snf-astakos-app/astakos/im/urls.py
80 80
                           'disapprove_member', {}, name='disapprove_member'),
81 81
                       url(r'^group/create/?$', 'group_create_list', {},
82 82
                           name='group_create_list'),
83
                       url(r'^group/create_demo/?$', 'group_create_demo', {},
84
                           name='group_create_demo'),
83 85
                       )
84 86

  
85 87
if EMAILCHANGE_ENABLED:
b/snf-astakos-app/astakos/im/views.py
1097 1097
    data['bill_diskspace'] = filter(servicefilter('diskspace'), data['bill'])
1098 1098
    data['bill_addcredits'] = filter(servicefilter('addcredits'), data['bill'])
1099 1099
        
1100
    return data
1100
    return data
1101

  
1102
def group_create_demo(request):
1103
    return render_response(
1104
        template='im/astakosgroup_form_demo.html',
1105
        context_instance=get_context(request))
1106
    

Also available in: Unified diff