Categories creation adjust

Zambom
1 parent e484c624
Showing 5 changed files with 154 additions and 113 deletions Show diff stats
amadeus/static/css/base/amadeus.css
amadeus/static/img/switch.png
categories/templates/categories/_form.html
categories/templates/categories/create.html
categories/views.py
@@ -126,6 +126,19 @@
     margin-bottom: 15px;
 }
+.ms-container {
+    width: 100% !important;
+}
+
+#coordinators_accordion .panel-heading {
+    background: #FFFFFF;
+    border: none;
+}
+
+#coordinators_accordion .panel-collapse {
+    padding: 10px;
+}
+
 /* category app ends */
 .clearfix{
@@ -0,0 +1,118 @@
+{% load widget_tweaks static i18n switchevenodd %}
+
+<form method="post" action="" enctype="multipart/form-data">
+	{% csrf_token %}
+	{% for field in form %}
+		{% if field.auto_id == 'id_coordinators' %}
+			<div class="panel-group" id="coordinators_accordion" role="tablist" aria-multiselectable="true">
+				<div class="panel panel-info">
+        			<div class="panel-heading">
+            			<div class="row">
+                			<div class="col-md-12">
+                    			<a data-parent="#coordinators_accordion" data-toggle="collapse" href="#coords">
+                    				<h4 class="panel-title">
+                            			<button class="btn btn-default btn-xs text-center cat-selector"><i class="fa fa-angle-right fa-2x" aria-hidden="true"></i></button><label for="{{ field.auto_id }}">{{ field.label }}</label>
+                    				</h4>
+                    			</a>
+                    		</div>
+                    	</div>
+                    </div>
+                    <div id="coords" class="panel-collapse collapse">
+                    	<p><em>{% trans 'Atribute coordinators role to users' %}:</em></p>
+                    	{% render_field field class='form-control' %}
+                    </div>
+                </div>
+			</div>
+		{% else %}
+			<div class="form-group {% if form.has_error %} has-error {% endif %} is-fileinput">
+				{% if field.auto_id != 'id_visible' %}
+					<label for="{{ field.auto_id }}">{{ field.label }}</label>
+				{% endif %}
+				{% if field.auto_id == 'id_visible' %}
+					<div class="checkbox">
+						<label for="{{ field.auto_id }}">
+	      					{% render_field field %} {{field.label}}
+	  					</label>
+					</div>
+				{% elif field.auto_id == 'id_description' %}
+					{% render_field field class='form-control text_wysiwyg' %}
+				{% else %}
+					{% render_field field class='form-control' %}
+				{% endif %}
+				<span class="help-block">{{ field.help_text }}</span>
+				{% if field.errors %}
+					<div class="row">
+						</br>
+						<div class="alert alert-danger alert-dismissible" role="alert">
+		  					<button type="button" class="close" data-dismiss="alert" aria-label="Close">
+		  						<span aria-hidden="true">&times;</span>
+	  						</button>
+							<ul>
+								{% for error in field.errors %}
+									<li>{{ error }}</li>
+								{% endfor %}
+							</ul>
+						</div>
+					</div>
+				{% endif %}
+			</div>
+		{% endif %}
+	{% endfor %}
+	<div class="row text-center">
+		<input type="submit" value="{% trans 'Register' %}" class="btn btn-primary btn-raised" />
+	</div>
+</form>
+
+<script type="text/javascript">
+    $('#id_coordinators').multiSelect({
+	  	selectableHeader: "<input type='text' class='form-control search-input category-search-users' autocomplete='off' placeholder='{% trans "try an username" %} '>",
+	  	selectionHeader: "<input type='text' class='form-control search-input category-search-users' autocomplete='off' placeholder='{% trans "try an username" %} '>",
+	  	afterInit: function(ms){
+		    var that = this,
+		        $selectableSearch = that.$selectableUl.prev(),
+		        $selectionSearch = that.$selectionUl.prev(),
+		        selectableSearchString = '#'+that.$container.attr('id')+' .ms-elem-selectable:not(.ms-selected)',
+		        selectionSearchString = '#'+that.$container.attr('id')+' .ms-elem-selection.ms-selected';
+
+		    that.qs1 = $selectableSearch.quicksearch(selectableSearchString)
+		    .on('keydown', function(e){
+		      	if (e.which === 40){
+		        	that.$selectableUl.focus();
+		        	return false;
+		      	}
+		    });
+
+		    that.qs2 = $selectionSearch.quicksearch(selectionSearchString)
+		    .on('keydown', function(e){
+		      	if (e.which == 40){
+		        	that.$selectionUl.focus();
+		        	return false;
+		      	}
+		    });
+	  	},
+	  	afterSelect: function(){
+		    this.qs1.cache();
+		    this.qs2.cache();
+	  	},
+	  	afterDeselect: function(){
+		    this.qs1.cache();
+		    this.qs2.cache();
+	  	}
+	});// Used to create multi-select css style
+
+	$('.collapse').on('show.bs.collapse', function (e) {
+    	if($(this).is(e.target)){
+        	var btn = $(this).parent().find('.fa-angle-right');
+
+        	btn.switchClass("fa-angle-right", "fa-angle-down", 250, "easeInOutQuad");
+        }
+    });
+
+    $('.collapse').on('hide.bs.collapse', function (e) {
+    	if($(this).is(e.target)){
+        	var btn = $(this).parent().find('.fa-angle-down');
+
+        	btn.switchClass("fa-angle-down", "fa-angle-right", 250, "easeInOutQuad");
+        }
+    });
+</script>
 \ No newline at end of file
-{% extends 'categories/home.html' %}
+{% extends 'categories/list.html' %}
 {% load widget_tweaks static i18n permission_tags django_bootstrap_breadcrumbs switchevenodd %}
 {% block breadcrumbs %}
-  {{ block.super }}
-  {% breadcrumb 'Create Category' 'categories:create' %}
+	{{ block.super }}
+	{% breadcrumb 'Create Category' 'categories:create' %}
 {% endblock %}
 {% block content %}
-<div class="card card-content">
-    <div class="card-body">
-		<form method="post" action="" enctype="multipart/form-data">
-			{% csrf_token %}
-			{% for field in form %}
-				<div class="form-group {% if form.has_error %} has-error {% endif %} is-fileinput">
-					{% if field.auto_id != 'id_visible' %}
-						<label for="{{ field.auto_id }}">{{ field.label }}</label>
-					{% endif %}
-					{% if field.auto_id == 'id_init_register_date' or field.auto_id == 'id_end_register_date' or field.auto_id == 'id_init_date' or field.auto_id == 'id_end_date'%}
-						<input type="text" class="form-control date-picker" name="{{field.name}}" value="{{field.value|date}}" min="{{now|date:'SHORT_DATE_FORMAT'}}">
-					{% elif field.auto_id == 'id_visible' %}
-						<div class="checkbox">
-							<label for="{{ field.auto_id }}">
-		      					{% render_field field %} {{field.label}}
-		  					</label>
-						</div>
-					{% elif field.auto_id == 'id_description' %}
-						{% render_field field class='form-control text_wysiwyg' %}
-
-						
-					{% comment %}
-						
-					{% endcomment %}
-					{% elif field.auto_id == 'id_coordinators' %}
-						<select id="{{field.auto_id}}" multiple="multiple" class="form-control"
-						style="position: absolute; left: -9999px;" name="coordinators">
-						
-							{% for value, name in form.fields.coordinators.choices %}	
-								<option value="{{value}}">{{name}}</option>
-							{% endfor %}
-						</select>
-					
-					{% else %}
-						{% render_field field class='form-control' %}
-					{% endif %}
-					<span class="help-block">{{ field.help_text }}</span>
-					{% if field.errors %}
-					<div class="row">
-					</br>
-							<div class="alert alert-danger alert-dismissible" role="alert">
-			  					<button type="button" class="close" data-dismiss="alert" aria-label="Close">
-			  						<span aria-hidden="true">&times;</span>
-		  						</button>
-								<ul>
-									{% for error in field.errors %}
-										<li>{{ error }}</li>
-									{% endfor %}
-								</ul>
-							</div>
-					</div>
-					{% endif %}
-				</div>
-			{% endfor %}
-			<div class="row text-center">
-					<input type="submit" value="{% trans 'Register' %}" class="btn btn-primary btn-raised" />
-			</div>
-      	</form>
+	<div class="card card-content">
+	    <div class="card-body">
+	    	{% include 'categories/_form.html' %}
+		</div>
 	</div>
-</div>
-</br>
-</br>
-</br>
-<script type="text/javascript">
-    var locale = navigator.language || navigator.userLanguage;
-    $('.date-picker').datepicker({
-        language: locale,
-    });
-
-     $('#id_coordinators').multiSelect({
-		  selectableHeader: "<input type='text' class='search-input category-search-users' autocomplete='off' placeholder='{% trans "try an username" %} '>",
-		  selectionHeader: "<input type='text' class='search-input category-search-users' autocomplete='off' placeholder='{% trans "try an username" %} '>",
-		  afterInit: function(ms){
-		    var that = this,
-		        $selectableSearch = that.$selectableUl.prev(),
-		        $selectionSearch = that.$selectionUl.prev(),
-		        selectableSearchString = '#'+that.$container.attr('id')+' .ms-elem-selectable:not(.ms-selected)',
-		        selectionSearchString = '#'+that.$container.attr('id')+' .ms-elem-selection.ms-selected';
-
-		    that.qs1 = $selectableSearch.quicksearch(selectableSearchString)
-		    .on('keydown', function(e){
-		      if (e.which === 40){
-		        that.$selectableUl.focus();
-		        return false;
-		      }
-		    });
-
-		    that.qs2 = $selectionSearch.quicksearch(selectionSearchString)
-		    .on('keydown', function(e){
-		      if (e.which == 40){
-		        that.$selectionUl.focus();
-		        return false;
-		      }
-		    });
-		  },
-		  afterSelect: function(){
-		    this.qs1.cache();
-		    this.qs2.cache();
-		  },
-		  afterDeselect: function(){
-		    this.qs1.cache();
-		    this.qs2.cache();
-		  }
-	});// Used to create multi-select css style
-</script>
+	<br clear="all">
+	<br clear="all">
 {% endblock %}
 \ No newline at end of file
@@ -32,7 +32,6 @@ class IndexView(views.SuperuserRequiredMixin, LoginRequiredMixin, ListView):
     template_name = 'categories/list.html'
     context_object_name = 'categories'
-
     def get_queryset(self):
         result = super(IndexView, self).get_queryset()
@@ -77,8 +76,6 @@ class CreateCategory(views.SuperuserRequiredMixin, HasRoleMixin, LogMixin, Creat
     template_name = 'categories/create.html'
     success_url = reverse_lazy('categories:index')
-
-
     def get_initial(self):
         initial = super(CreateCategory, self).get_initial()
@@ -89,19 +86,25 @@ class CreateCategory(views.SuperuserRequiredMixin, HasRoleMixin, LogMixin, Creat
             initial['description'] = category.description
             initial['name'] = category.name
             initial['visible'] = category.visible
-           
             self.log_action = 'replicate'
             self.log_context['replicated_category_id'] = category.id
             self.log_context['replicated_category_name'] = category.name
             self.log_context['replicated_category_slug'] = category.slug
+
         return initial
     def get_context_data(self, **kwargs):
         context = super(CreateCategory, self).get_context_data(**kwargs)
         context['users_count'] = User.objects.all().count()
         context['switch'] = True
+
+        if self.kwargs.get('slug'):
+            context['title'] = _('Replicate Category')
+        else:
+            context['title'] = _('Create Category')
+
         return context
@@ -145,7 +148,6 @@ class DeleteCategory(LogMixin, DeleteView):
     model = Category
     template_name = 'categories/delete.html'
-
     def delete(self, request, *args, **kwargs):
         category = get_object_or_404(Category, slug = self.kwargs.get('slug'))
         subjects = Subject.objects.filter(category = category)
@@ -181,7 +183,6 @@ class UpdateCategory(LogMixin, UpdateView):
     login_url = reverse_lazy("users:login")
     redirect_field_name = 'next'
-
     def get_success_url(self):
         self.log_context['category_id'] = self.object.id
         self.log_context['category_name'] = self.object.name
@@ -191,8 +192,15 @@ class UpdateCategory(LogMixin, UpdateView):
         objeto = self.object.name
         messages.success(self.request, _('Category "%s" updated successfully!')%(objeto))
+
         return reverse_lazy('categories:index')
+    def get_context_data(self, **kwargs):
+        context = super(UpdateCategory, self).get_context_data(**kwargs)
+        context['title'] = _('Update Category')
+
+        return context
+
 @log_decorator_ajax('category', 'view', 'category')
 def category_view_log(request, category):
     action = request.GET.get('action')
	@@ -126,6 +126,19 @@		@@ -126,6 +126,19 @@
126	margin-bottom: 15px;	126	margin-bottom: 15px;
127	}	127	}
128		128
		129	+.ms-container {
		130	+ width: 100% !important;
		131	+}
		132	+
		133	+#coordinators_accordion .panel-heading {
		134	+ background: #FFFFFF;
		135	+ border: none;
		136	+}
		137	+
		138	+#coordinators_accordion .panel-collapse {
		139	+ padding: 10px;
		140	+}
		141	+
129	/* category app ends */	142	/* category app ends */
130		143
131	.clearfix{	144	.clearfix{
	@@ -0,0 +1,118 @@		@@ -0,0 +1,118 @@
		1	+{% load widget_tweaks static i18n switchevenodd %}
		2	+
		3	+<form method="post" action="" enctype="multipart/form-data">
		4	+ {% csrf_token %}
		5	+ {% for field in form %}
		6	+ {% if field.auto_id == 'id_coordinators' %}
		7	+ <div class="panel-group" id="coordinators_accordion" role="tablist" aria-multiselectable="true">
		8	+ <div class="panel panel-info">
		9	+ <div class="panel-heading">
		10	+ <div class="row">
		11	+ <div class="col-md-12">
		12	+ <a data-parent="#coordinators_accordion" data-toggle="collapse" href="#coords">
		13	+ <h4 class="panel-title">
		14	+ <button class="btn btn-default btn-xs text-center cat-selector"><i class="fa fa-angle-right fa-2x" aria-hidden="true"></i></button><label for="{{ field.auto_id }}">{{ field.label }}</label>
		15	+ </h4>
		16	+ </a>
		17	+ </div>
		18	+ </div>
		19	+ </div>
		20	+ <div id="coords" class="panel-collapse collapse">
		21	+ <p><em>{% trans 'Atribute coordinators role to users' %}:</em></p>
		22	+ {% render_field field class='form-control' %}
		23	+ </div>
		24	+ </div>
		25	+ </div>
		26	+ {% else %}
		27	+ <div class="form-group {% if form.has_error %} has-error {% endif %} is-fileinput">
		28	+ {% if field.auto_id != 'id_visible' %}
		29	+ <label for="{{ field.auto_id }}">{{ field.label }}</label>
		30	+ {% endif %}
		31	+ {% if field.auto_id == 'id_visible' %}
		32	+ <div class="checkbox">
		33	+ <label for="{{ field.auto_id }}">
		34	+ {% render_field field %} {{field.label}}
		35	+ </label>
		36	+ </div>
		37	+ {% elif field.auto_id == 'id_description' %}
		38	+ {% render_field field class='form-control text_wysiwyg' %}
		39	+ {% else %}
		40	+ {% render_field field class='form-control' %}
		41	+ {% endif %}
		42	+ <span class="help-block">{{ field.help_text }}</span>
		43	+ {% if field.errors %}
		44	+ <div class="row">
		45	+ </br>
		46	+ <div class="alert alert-danger alert-dismissible" role="alert">
		47	+ <button type="button" class="close" data-dismiss="alert" aria-label="Close">
		48	+ <span aria-hidden="true">×</span>
		49	+ </button>
		50	+ <ul>
		51	+ {% for error in field.errors %}
		52	+ <li>{{ error }}</li>
		53	+ {% endfor %}
		54	+ </ul>
		55	+ </div>
		56	+ </div>
		57	+ {% endif %}
		58	+ </div>
		59	+ {% endif %}
		60	+ {% endfor %}
		61	+ <div class="row text-center">
		62	+ <input type="submit" value="{% trans 'Register' %}" class="btn btn-primary btn-raised" />
		63	+ </div>
		64	+</form>
		65	+
		66	+<script type="text/javascript">
		67	+ $('#id_coordinators').multiSelect({
		68	+ selectableHeader: "<input type='text' class='form-control search-input category-search-users' autocomplete='off' placeholder='{% trans "try an username" %} '>",
		69	+ selectionHeader: "<input type='text' class='form-control search-input category-search-users' autocomplete='off' placeholder='{% trans "try an username" %} '>",
		70	+ afterInit: function(ms){
		71	+ var that = this,
		72	+ $selectableSearch = that.$selectableUl.prev(),
		73	+ $selectionSearch = that.$selectionUl.prev(),
		74	+ selectableSearchString = '#'+that.$container.attr('id')+' .ms-elem-selectable:not(.ms-selected)',
		75	+ selectionSearchString = '#'+that.$container.attr('id')+' .ms-elem-selection.ms-selected';
		76	+
		77	+ that.qs1 = $selectableSearch.quicksearch(selectableSearchString)
		78	+ .on('keydown', function(e){
		79	+ if (e.which === 40){
		80	+ that.$selectableUl.focus();
		81	+ return false;
		82	+ }
		83	+ });
		84	+
		85	+ that.qs2 = $selectionSearch.quicksearch(selectionSearchString)
		86	+ .on('keydown', function(e){
		87	+ if (e.which == 40){
		88	+ that.$selectionUl.focus();
		89	+ return false;
		90	+ }
		91	+ });
		92	+ },
		93	+ afterSelect: function(){
		94	+ this.qs1.cache();
		95	+ this.qs2.cache();
		96	+ },
		97	+ afterDeselect: function(){
		98	+ this.qs1.cache();
		99	+ this.qs2.cache();
		100	+ }
		101	+ });// Used to create multi-select css style
		102	+
		103	+ $('.collapse').on('show.bs.collapse', function (e) {
		104	+ if($(this).is(e.target)){
		105	+ var btn = $(this).parent().find('.fa-angle-right');
		106	+
		107	+ btn.switchClass("fa-angle-right", "fa-angle-down", 250, "easeInOutQuad");
		108	+ }
		109	+ });
		110	+
		111	+ $('.collapse').on('hide.bs.collapse', function (e) {
		112	+ if($(this).is(e.target)){
		113	+ var btn = $(this).parent().find('.fa-angle-down');
		114	+
		115	+ btn.switchClass("fa-angle-down", "fa-angle-right", 250, "easeInOutQuad");
		116	+ }
		117	+ });
		118	+</script>
0	\ No newline at end of file	119	\ No newline at end of file
1	-{% extends 'categories/home.html' %}	1	+{% extends 'categories/list.html' %}
2		2
3	{% load widget_tweaks static i18n permission_tags django_bootstrap_breadcrumbs switchevenodd %}	3	{% load widget_tweaks static i18n permission_tags django_bootstrap_breadcrumbs switchevenodd %}
4		4
5	{% block breadcrumbs %}	5	{% block breadcrumbs %}
6	- {{ block.super }}
7	- {% breadcrumb 'Create Category' 'categories:create' %}	6	+ {{ block.super }}
		7	+ {% breadcrumb 'Create Category' 'categories:create' %}
8	{% endblock %}	8	{% endblock %}
9		9
10	{% block content %}	10	{% block content %}
11	-<div class="card card-content">
12	- <div class="card-body">
13	- <form method="post" action="" enctype="multipart/form-data">
14	- {% csrf_token %}
15	- {% for field in form %}
16	- <div class="form-group {% if form.has_error %} has-error {% endif %} is-fileinput">
17	- {% if field.auto_id != 'id_visible' %}
18	- <label for="{{ field.auto_id }}">{{ field.label }}</label>
19	- {% endif %}
20	- {% if field.auto_id == 'id_init_register_date' or field.auto_id == 'id_end_register_date' or field.auto_id == 'id_init_date' or field.auto_id == 'id_end_date'%}
21	- <input type="text" class="form-control date-picker" name="{{field.name}}" value="{{field.value\|date}}" min="{{now\|date:'SHORT_DATE_FORMAT'}}">
22	- {% elif field.auto_id == 'id_visible' %}
23	- <div class="checkbox">
24	- <label for="{{ field.auto_id }}">
25	- {% render_field field %} {{field.label}}
26	- </label>
27	- </div>
28	- {% elif field.auto_id == 'id_description' %}
29	- {% render_field field class='form-control text_wysiwyg' %}
30	-
31	-
32	- {% comment %}
33	-
34	- {% endcomment %}
35	- {% elif field.auto_id == 'id_coordinators' %}
36	- <select id="{{field.auto_id}}" multiple="multiple" class="form-control"
37	- style="position: absolute; left: -9999px;" name="coordinators">
38	-
39	- {% for value, name in form.fields.coordinators.choices %}
40	- <option value="{{value}}">{{name}}</option>
41	- {% endfor %}
42	- </select>
43	-
44	- {% else %}
45	- {% render_field field class='form-control' %}
46	- {% endif %}
47	- <span class="help-block">{{ field.help_text }}</span>
48	- {% if field.errors %}
49	- <div class="row">
50	- </br>
51	- <div class="alert alert-danger alert-dismissible" role="alert">
52	- <button type="button" class="close" data-dismiss="alert" aria-label="Close">
53	- <span aria-hidden="true">×</span>
54	- </button>
55	- <ul>
56	- {% for error in field.errors %}
57	- <li>{{ error }}</li>
58	- {% endfor %}
59	- </ul>
60	- </div>
61	- </div>
62	- {% endif %}
63	- </div>
64	- {% endfor %}
65	- <div class="row text-center">
66	- <input type="submit" value="{% trans 'Register' %}" class="btn btn-primary btn-raised" />
67	- </div>
68	- </form>	11	+ <div class="card card-content">
		12	+ <div class="card-body">
		13	+ {% include 'categories/_form.html' %}
		14	+ </div>
69	</div>	15	</div>
70	-</div>
71	-</br>
72	-</br>
73	-</br>
74	-<script type="text/javascript">
75	- var locale = navigator.language \|\| navigator.userLanguage;
76	- $('.date-picker').datepicker({
77	- language: locale,
78	- });
79	-
80	- $('#id_coordinators').multiSelect({
81	- selectableHeader: "<input type='text' class='search-input category-search-users' autocomplete='off' placeholder='{% trans "try an username" %} '>",
82	- selectionHeader: "<input type='text' class='search-input category-search-users' autocomplete='off' placeholder='{% trans "try an username" %} '>",
83	- afterInit: function(ms){
84	- var that = this,
85	- $selectableSearch = that.$selectableUl.prev(),
86	- $selectionSearch = that.$selectionUl.prev(),
87	- selectableSearchString = '#'+that.$container.attr('id')+' .ms-elem-selectable:not(.ms-selected)',
88	- selectionSearchString = '#'+that.$container.attr('id')+' .ms-elem-selection.ms-selected';
89	-
90	- that.qs1 = $selectableSearch.quicksearch(selectableSearchString)
91	- .on('keydown', function(e){
92	- if (e.which === 40){
93	- that.$selectableUl.focus();
94	- return false;
95	- }
96	- });
97	-
98	- that.qs2 = $selectionSearch.quicksearch(selectionSearchString)
99	- .on('keydown', function(e){
100	- if (e.which == 40){
101	- that.$selectionUl.focus();
102	- return false;
103	- }
104	- });
105	- },
106	- afterSelect: function(){
107	- this.qs1.cache();
108	- this.qs2.cache();
109	- },
110	- afterDeselect: function(){
111	- this.qs1.cache();
112	- this.qs2.cache();
113	- }
114	- });// Used to create multi-select css style
115	-</script>	16	+ <br clear="all">
		17	+ <br clear="all">
116	{% endblock %}	18	{% endblock %}
117	\ No newline at end of file	19	\ No newline at end of file