- Help_text for group create form
authorOlga Brani <olgabrani@grnet.gr>
Tue, 6 Nov 2012 16:18:51 +0000 (18:18 +0200)
committerOlga Brani <olgabrani@grnet.gr>
Tue, 6 Nov 2012 16:18:51 +0000 (18:18 +0200)
- Resource_presentation dict

12 files changed:
snf-astakos-app/.settings/org.eclipse.core.resources.prefs
snf-astakos-app/astakos/im/static/im/css/modules.css
snf-astakos-app/astakos/im/static/im/images/create-compute.png [new file with mode: 0644]
snf-astakos-app/astakos/im/static/im/images/create-storage.png [new file with mode: 0644]
snf-astakos-app/astakos/im/static/im/js/common.js
snf-astakos-app/astakos/im/static/im/js/forms.js
snf-astakos-app/astakos/im/static/im/js/quotas.js
snf-astakos-app/astakos/im/synnefo_settings.py
snf-astakos-app/astakos/im/templates/im/astakosgroup_form_demo.html
snf-astakos-app/astakos/im/templatetags/filters.py
snf-astakos-app/astakos/im/views.py
snf-astakos-app/setup.py

index d6497d3..d88f102 100644 (file)
@@ -1,5 +1,6 @@
-#Mon Nov 05 15:29:48 EET 2012
+#Mon Nov 05 16:04:44 EET 2012
 eclipse.preferences.version=1
 encoding//astakos/im/migrations/0010_auto__add_field_astakosuser_activation_sent__chg_field_service_url.py=utf-8
 encoding//astakos/im/migrations/0011_set_old_activation_sent.py=utf-8
 encoding//astakos/im/migrations/0017_populate_resource_data.py=utf-8
+encoding//astakos/im/migrations/0030_populate_resource_data.py=utf-8
index 64719be..ccd7118 100644 (file)
@@ -350,7 +350,7 @@ table.alt-style tr td a.more-info:hover                     { background-image:url(../images/plus-
 table.alt-style tr td a.open                                   { background-position:-16px 0} \r
 \r
 .projects .details a.edit                                              { float:right; margin-left:20px;  }\r
-.projects .details .data                                               { overflow:hidden; }
+.projects .details .data                                               { overflow:hidden; }\r
 .projects .editable form textarea                              { width:70%; height:50px; max-width:70%; width:270px; height:120px;}\r
 \r
 \r
@@ -361,20 +361,20 @@ table.alt-style tr td a.open                                      { background-position:-16px 0}
 .quotas-form fieldset legend span                              { color:#222; }\r
 .quotas-form .with-checkbox .checkbox-widget   { margin-top:12px; } \r
 .quotas-form .with-checkbox span.info                  { bottom:22px; }\r
-
 .quotas-form .form-row.submit                                  { text-align:center; }\r
 .quotas-form input[type="submit"]                              { margin:15px 0; background-color:#B3B3B3 }\r
 .quotas-form input[type="submit"]:hover                        { background:#55B577 }\r
 .quotas-form input[type="submit"]:focus                        { border-color: #B3B3B3}\r
 .quotas-form input[type="submit"]:focus:hover  { border-color: #55B577}\r
-.quotas-form fieldset ul                                               { padding:0; margin:0 0 1em; }\r
+.quotas-form fieldset ul                                               { padding:0; margin:0 0 1em; position:relative; }\r
 .quotas-form fieldset ul li                                            { list-style:none outside none; float:left; padding:0 0 0 60px; margin:0; }\r
 .quotas-form fieldset ul li:first-child                        { padding-left:0; }\r
 .quotas-form fieldset ul li a                                  { display:block; width:82px; height:82px; overflow:hidden; }\r
-.quotas-form fieldset ul li a:hover    img                     { margin-top:-151px; }\r
-.quotas-form fieldset ul li a.selected img             { margin-top:-313px; }\r
-
+.quotas-form fieldset ul li a:hover    img                     { margin-top:-84px; }\r
+.quotas-form fieldset ul li a.selected img             { margin-top:-168px; }\r
 .quotas-form fieldset ul li a.selected:focus   { outline:0 none; }\r
+.quotas-form fieldset ul li p                                  { position:absolute; top:95px; left:0; display: none;}\r
+.quotas-form fieldset ul li:hover p                            { display:block; }\r
 .quotas-form p.msg                                                             { color:#B3B3B3; }\r
 .quotas-form a.delete                                                  { position:absolute; right:0; top:0; color:#B3B3B3; z-index:2 }\r
 .quotas-form .group                                                            { display:none; position:relative; background:url(../images/dots.jpg) repeat-x scroll center bottom; margin-bottom:2em; padding-bottom:2em;}\r
@@ -391,34 +391,10 @@ form.quotas-form legend span.info                         { top:0; bottom:auto; left:225px; }
 form.quotas-form legend span.info span                 { width:400px; }\r
 .quotas-form .with-checkbox+.with-checkbox             { width:196px; }\r
  \r
-.quotas-form .radios label                                             { font-size:1.077em; } \r
-.quotas-form .radios .radio-wrap label                 { width:auto; margin-right:11px;}\r
-.quotas-form .radios .radio-wrap>.radio                        { float:left; margin:10px 10px 0 0; }  \r
-.quotas-form .radios input[type="text"]                        { width:60px;  margin:9px 15px -9px;  padding:6px; display:none;}\r
-\r
 /* stats */\r
 .stats ul                                                                              { margin:0; padding:0; list-style:none outside none; }\r
 .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}\r
 .stats .bar                                                                            { padding: 0; text-align:center;  float:left; width:200px;}\r
-.quotas-form p.msg                                                             { color:#B3B3B3; }\r
-.quotas-form fieldset legend                                   { margin-bottom:1em; font-size:1.154em }\r
-.quotas-form a.delete                                                  { position:absolute; right:0; top:0; color:#B3B3B3; }\r
-.quotas-form .quota                                                            { display:none; }\r
-.quotas-form fieldset ul li.rel+li.rel                 { background:url(../images/quota-related-bg.png) no-repeat left center; }\r
-.quotas-form .quota    .with-checkbox input[type="text"] { width:100px; margin:10px 0 0; float:left;}\r
-.quotas-form .quota .with-checkbox label               { position:absolute; left:0; top:0; }\r
-.quotas-form .quota .with-checkbox p                   { padding-left:224px; float:left; }\r
-.quotas-form .quota .double-checkbox                   { float:left; }\r
-.quotas-form .quota .double-checkbox + .double-checkbox label   { display:none; }\r
-.quotas-form .quota .double-checkbox + .double-checkbox p              { padding-left:20px; }\r
-.quotas-form .quota .double-checkbox .checkbox-widget                  { position:static; }\r
-\r
-\r
-/* stats */\r
-.stats ul                                                                              { margin:0; padding:0; list-style:none outside none; }\r
-.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}\r
-.stats .bar                                                                            { padding:20px 0; text-align:center;  float:left; width:200px;}\r
-
 .stats .bar div                                                                        { width:340px; height:30px; border:1px solid #000;}\r
 .stats .bar span                                                               { text-align:right; display:block; height:100%; color:#fff;  line-height:30px; font-size:1.231em; text-indent:50px;}\r
 .stats .red .bar span                                                  { background:#ef4f54; }\r
diff --git a/snf-astakos-app/astakos/im/static/im/images/create-compute.png b/snf-astakos-app/astakos/im/static/im/images/create-compute.png
new file mode 100644 (file)
index 0000000..4c24a21
Binary files /dev/null and b/snf-astakos-app/astakos/im/static/im/images/create-compute.png differ
diff --git a/snf-astakos-app/astakos/im/static/im/images/create-storage.png b/snf-astakos-app/astakos/im/static/im/images/create-storage.png
new file mode 100644 (file)
index 0000000..735ae96
Binary files /dev/null and b/snf-astakos-app/astakos/im/static/im/images/create-storage.png differ
index 1868eae..0ab8e1f 100644 (file)
@@ -229,35 +229,10 @@ $(document).ready(function() {
                $(this).hide();\r
        })\r
        \r
-// quota form actions\r
-       \r
-       $('.quotas-form ul li a').click(function(e){\r
-               e.preventDefault();\r
-               $(this).addClass('selected');\r
-               var id = $(this).attr('id');\r
-               $('.quotas-form fieldset').each(function() {\r
-                       if($(this).hasClass(id)) {\r
-                               $(this).show('slow');\r
-                       }\r
-               });     \r
-               \r
-       });\r
-       \r
-       $('.quotas-form fieldset .delete').click(function(e){\r
-               e.preventDefault();\r
-               $(this).parents('fieldset').find('input').val('');\r
-               $(this).parents('fieldset').hide('slow');\r
-               fieldsetClass = $(this).parents('fieldset').attr('class').replace('quota ', '');\r
-               $('.quotas-form ul li a').each(function() {\r
-                       if($(this).attr('id')==fieldsetClass) {\r
-                               $(this).removeClass('selected');\r
-                       }\r
-               }); \r
-                \r
-                \r
-       })\r
\r
        \r
        \r
+});\r
        \r
 $(window).resize(function() {\r
     \r
@@ -266,4 +241,4 @@ $(window).resize(function() {
                $('.widjets  li div').equalHeights();\r
        }\r
 \r
-});
+});
\ No newline at end of file
index 55c66d3..b5e39c1 100644 (file)
@@ -22,6 +22,7 @@
                 if (src == "LABEL" || src == "label") {
                     el.toggleClass("checked"); 
                     $this.attr('checked', el.hasClass("checked"));
+                    $this.trigger('changed');
                 };
                 
             })
          el.addClass(className);       
                
       el.click(function() {
+
         el.toggleClass("checked");
         $this.attr('checked', el.hasClass("checked"));
+        $this.trigger('changed');
       });
       
       el.keypress(function(e){
@@ -47,6 +50,7 @@
                e.preventDefault();
                el.toggleClass("checked");
                $this.attr('checked', el.hasClass("checked"));
+               $this.trigger('changed');
        }
       })
 
index fed3572..679eb23 100644 (file)
@@ -1,8 +1,9 @@
 $(document).ready(function() {
 
-       // quota form actions
        $('.quotas-form ul li a').click(function(e){
-               //e.preventDefault();
+               if ( $(this).hasClass('selected')){
+                       e.preventDefault();
+               }
                if ( !$(this).hasClass('selected')){
                        $(this).addClass('selected');
                        var id = $(this).attr('id');
@@ -34,14 +35,12 @@ $(document).ready(function() {
                                $(this).removeClass('selected');
                        }
                }); 
-               
                 
                 
        });
         
                
-       $('.quotas-form .checkbox-widget.limited').click(function(e){
-               e.preventDefault();
+       $('.quotas-form input.limited').bind("changed", function(e){
                $(this).siblings('input[type="text"]').toggle();
                $(this).siblings('input[type="text"]').focus();
                parentdiv = $(this).parents('.form-row').prev('.form-row');
@@ -50,7 +49,7 @@ $(document).ready(function() {
                 
        });
        
-       $('.quotas-form .checkbox-widget.unlimited').click(function(e){
+       $('.quotas-form input.unlimited').bind("changed", function(e){
                parentdiv = $(this).parents('.form-row').next('.form-row');
                if (parentdiv.find('.checkbox-widget').hasClass('checked')){
                        parentdiv.find('.checkbox-widget').removeClass('checked');
@@ -63,7 +62,7 @@ $(document).ready(function() {
                
        })
        
-       $('input:radio').uniform();
+       //$('input:radio').uniform();
        $('.radio .radio span').each(function(index) {      
                if ($(this).hasClass('checked')){
                        alert('f');
index 3c37b28..21a4ea5 100644 (file)
@@ -43,8 +43,8 @@ installed_apps = [
     'django.contrib.contenttypes',
     'django.contrib.sessions',
     'django.contrib.messages',
-    'djcelery',
-    'debug_toolbar',
+#    'djcelery',
+#    'debug_toolbar',
 ]
 
 context_processors = [
@@ -68,7 +68,7 @@ middlware_classes = [
     'synnefo.lib.middleware.LoggingConfigMiddleware',
     'synnefo.lib.middleware.SecureMiddleware',
     'django.middleware.csrf.CsrfViewMiddleware',
-    'debug_toolbar.middleware.DebugToolbarMiddleware',
+#    'debug_toolbar.middleware.DebugToolbarMiddleware',
 ]
 
 loggers = {
index c8ec714..20bfff5 100644 (file)
@@ -1,12 +1,13 @@
 {% extends "im/account_base.html" %}
 
 {% load filters %}
-{% block page.body %}
 {% block headjs %}
        {{ block.super }}        
        <script src="{{ IM_STATIC_URL }}js/quotas.js"></script> 
-{% endblock %}         
+{% endblock %} 
+{% block page.body %}
+       
 <form action="" method="post" class="withlabels quotas-form">{% csrf_token %}
         
     <fieldset>
@@ -38,7 +39,8 @@
                </div>
                
        </div> 
-    </fieldset>       
+    </fieldset>     
+    
     <fieldset id="icons">
        <legend>
                2. CHOOSE RESOURCES
     {% with resource_catalog|lookup:'resources' as resources %}
     {% with resource_catalog|lookup:'groups' as groups %}      
        <ul class="clearfix">
-            {% for g, rs in groups.items %}                    
-               <li><a href="#{{'group_'|add:g}}" id="{{'group_'|add:g}}"><img src="/static/im/images/create-resource-vm.png" alt="vm"/></a></li>
-<!-- 
-               <li><a href="#storage_1" id="storage_1"><img src="/static/im/images/create-resource-storage.png" alt="storage"/></a></li>
- -->
+            {% for g, rs in groups.items %}   
+            {% with resource_presentation|lookup:g as group_info %}            
+               <li>
+                       <a href="#{{ g }}" id="{{'group_'|add:g}}"><img src="/static/im/images/create-{{ g }}.png" alt="vm"/></a>
+                       <p class="msg">{{ group_info.help_text }}</p>
+               </li>
+               {% endwith %}
             {% endfor %}
        </ul>
-       <!--p class="msg">if you choose CPU without selecting any VMs you must also select RAM and DISKSPACE</p-->
+       
     </fieldset>
+   
     <div class="foo">
     
     </div>
-    
+    <div class="not-foo">
         {% for g, rs in groups.items %}
-        <div class="{{'group_'|add:g}}">
-                       <a href="#icons" class="delete"><strong>X</strong> remove resource</a>  
+        
+        <div class="group {{'group_'|add:g}}" id="{{ g }}">
+                       <a href="#icons" class="delete">X remove resource</a>   
                    {% for r in rs %}
+                   {% with resource_presentation|lookup:r as resource_info %}
+                   {% with resources|lookup:r as resource%}
                    <fieldset class="quota storage">
-                       <legend>{{r|upper}}</legend>
-<!-- 
-                       <div class="form-row">
+                       <legend>
+                               {{ r|get_value_after_dot|capfirst }}
+                               <span class="info"> 
+                                       <em>more info</em>
+                                       <span>{{ resource_info.help_text }}</span>
+                               </span>  
+                       </legend>
+<!--           <div class="form-row">
                                <p class="clearfix">
                                        <label for="num_storage">Total storage</label>
                                        <input type="text" name="num_storage">
                                        <span class="extra-img">&nbsp;</span>
-                                       <span class="info"> 
-                                               <em>more info</em>
-                                               <span>Help Text</span>
-                                       </span>
+                                       <span class="info"><em>more info</em><span>Help Text</span></span>
                                </p>
-                       </div>
- -->
-                       <div class="double-checks">
-                               <label>Max Storage per user</label>
+                       </div>-->
+                               <div class="double-checks">
+                               <label>Max {{ r|get_value_after_dot }}{% if not resource.unit %}s {% endif  %} per user</label>
                                <div class="form-row">
                                        <p class="clearfix">
                                                <label for="{{r|add:'_unlimited'}}">Unlimited</label>
                                
                        </div> 
                    </fieldset>
+                   {% endwith %}
+                   {% endwith %}
                    {% endfor %}
            </div>
-    {% endfor %}
-
+           
+       {% endfor %}
+       </div>
     {% endwith %}
     {% endwith %}
-       </div>
+        
     <div class="form-row submit">
                <input type="submit" value="SUBMIT" class="submit altcol" autocomplete="off">
        </div>     
        
 </script>       
  
-{% endblock %}
+{% endblock %}
\ No newline at end of file
index 541283e..11c9690 100644 (file)
@@ -141,3 +141,8 @@ def items(d):
     if isinstance(d, defaultdict):
         return d.iteritems()
     return d
+
+
+@register.filter
+def get_value_after_dot(value):
+    return value.split(".")[1]
\ No newline at end of file
index 39039dd..933f0fa 100644 (file)
@@ -1162,6 +1162,34 @@ def group_create_demo(request, kind_name='default'):
         }
         form = form_class(data)
 
+    resource_presentation = {
+       'compute': {
+            'help_text':'group compute help text',
+                     
+        },
+        'storage': {
+            'help_text':'group storage help text',
+                      
+        },  
+        'pithos+.diskspace': {
+            'help_text':'resource pithos+.diskspace help text',
+                      
+        },  
+        'cyclades.vm': {
+            'help_text':'resource cyclades.vm help text resource cyclades.vm help text resource cyclades.vm help text resource cyclades.vm help text',
+                      
+        },  
+        'cyclades.disksize': {
+            'help_text':'resource cyclades.disksize help text',
+                      
+        },  
+        'cyclades.ram': {
+            'help_text':'resource cyclades.ram help text',
+                      
+        }                        
+                             
+    }
+    
     # Create the template, context, response
     template_name = "%s/%s_form_demo.html" % (
         model._meta.app_label,
@@ -1171,7 +1199,8 @@ def group_create_demo(request, kind_name='default'):
     c = RequestContext(request, {
         'form': form,
         'kind': kind,
-        'resource_catalog':resource_catalog
+        'resource_catalog':resource_catalog,
+        'resource_presentation':resource_presentation
     }, context_processors)
     return HttpResponse(t.render(c))
 
index 0093752..a5fe173 100644 (file)
@@ -83,7 +83,8 @@ INSTALL_REQUIRES = [
     'commissioning',
     'celery',
     'requests',
-    'inflect'
+    'inflect',
+#TODO add commissioning
 ]
 
 EXTRAS_REQUIRES = {