Adjusting news image and adding it in presentation

Zambom
1 parent 43aeeef6
Showing 3 changed files with 14 additions and 7 deletions Show diff stats
amadeus/static/js/crop_news.js
news/forms.py
news/templates/news/view.html
 $(function () {
 	/* Script para abrir o modal com a imagem selecionada */
 	$("#id_image").change(function () {
-		var max_size = 2*1024*1024;
+		var max_size = 5*1024*1024;
 		var submit_btn = $("#news-form").find("input[type='submit']");
 		var mimeTypes = $(this).data('mimetypes');
 		var errors = 0;
@@ -21,7 +21,7 @@ $(function () {
 				$(".size").show();
  
 				errors++;
-			} 
+			}
  
 			if (!mimeTypes.includes(this.files[0].type)) {
 				$(submit_btn).prop('disable', true);
@@ -30,8 +30,8 @@ $(function () {
 				$(".client-file-errors").show();
 				$(".format").show();
  
-				errors++;	
-			}			
+				errors++;
+			}
  
 			if (errors == 0) {
 				var reader = new FileReader();
@@ -51,7 +51,7 @@ $(function () {
 	$("#modalCrop").on("shown.bs.modal", function () {
 		$image.cropper({
 			viewMode: 1 ,
-			aspectRatio: 24/5,
+			aspectRatio: 3/1,
 			minCropBoxWidth: 200,
 			minCropBoxHeight: 200,
 			dragMode: 'move',
@@ -31,7 +31,7 @@ class NewsForm(forms.ModelForm):
 	        image = Image.open(self.instance.image)
 	        if not x is None:
 		        cropped_image = image.crop((x, y, w+x, h+y))
-		        resized_image = cropped_image.resize((1200, 250), Image.ANTIALIAS)
+		        resized_image = cropped_image.resize((1200, 400), Image.ANTIALIAS)
  
 		        folder_path = join(settings.MEDIA_ROOT, 'news')
 		        #check if the folder already exists
@@ -29,9 +29,16 @@
   <div class="row-fluid panel panel-default" >
             <div class="panel-body" id="printArea">
                 <div class="col-md-12" style="display:inline-block">
-                  <h2><b>{{new.title}}</b></h2> <button style="text-transform:none; text-decoration: underline;"   type="button" class="pull-right btn btn-default btn-sm" id="printButton" name="button">{% trans "Print News" %}        <i class="fa fa-print" aria-hidden="true"></i></button><br>
+                  <h2><b>{{new.title}}</b></h2>
+                </div>
+                <div class="col-md-12" style="margin-top: -30px;">
+                  <button style="text-transform:none; text-decoration: underline;"   type="button" class="pull-right btn btn-default btn-sm" id="printButton" name="button">{% trans "Print News" %}
+                    <i class="fa fa-print" aria-hidden="true"></i></button><br>
                   <p>{{new.creator}}, em {{new.create_date}}</p>
                 </div>
+                <div class="col-md-12" style="margin-top: 20px; margin-bottom: 20px;">
+                  <span><img src="{% if new.image %}{{ new.image.url }}{% endif %}" width="100%"></span>
+                </div>
                 <div class="col-md-12">
                   <br>
                     {% autoescape off %}
1	1	$(function () {
2	2	/* Script para abrir o modal com a imagem selecionada */
3	3	$("#id_image").change(function () {
4		- var max_size = 210241024;
	4	+ var max_size = 510241024;
5	5	var submit_btn = $("#news-form").find("input[type='submit']");
6	6	var mimeTypes = $(this).data('mimetypes');
7	7	var errors = 0;
...	...	@@ -21,7 +21,7 @@ $(function () {
21	21	$(".size").show();
22	22
23	23	errors++;
24		- }
	24	+ }
25	25
26	26	if (!mimeTypes.includes(this.files[0].type)) {
27	27	$(submit_btn).prop('disable', true);
...	...	@@ -30,8 +30,8 @@ $(function () {
30	30	$(".client-file-errors").show();
31	31	$(".format").show();
32	32
33		- errors++;
34		- }
	33	+ errors++;
	34	+ }
35	35
36	36	if (errors == 0) {
37	37	var reader = new FileReader();
...	...	@@ -51,7 +51,7 @@ $(function () {
51	51	$("#modalCrop").on("shown.bs.modal", function () {
52	52	$image.cropper({
53	53	viewMode: 1 ,
54		- aspectRatio: 24/5,
	54	+ aspectRatio: 3/1,
55	55	minCropBoxWidth: 200,
56	56	minCropBoxHeight: 200,
57	57	dragMode: 'move',
...	...
...	...	@@ -31,7 +31,7 @@ class NewsForm(forms.ModelForm):
31	31	image = Image.open(self.instance.image)
32	32	if not x is None:
33	33	cropped_image = image.crop((x, y, w+x, h+y))
34		- resized_image = cropped_image.resize((1200, 250), Image.ANTIALIAS)
	34	+ resized_image = cropped_image.resize((1200, 400), Image.ANTIALIAS)
35	35
36	36	folder_path = join(settings.MEDIA_ROOT, 'news')
37	37	#check if the folder already exists
...	...
...	...	@@ -29,9 +29,16 @@
29	29	<div class="row-fluid panel panel-default" >
30	30	<div class="panel-body" id="printArea">
31	31	<div class="col-md-12" style="display:inline-block">
32		- <h2><b>{{new.title}}</b></h2> <button style="text-transform:none; text-decoration: underline;" type="button" class="pull-right btn btn-default btn-sm" id="printButton" name="button">{% trans "Print News" %} <i class="fa fa-print" aria-hidden="true"></i></button><br>
	32	+ <h2><b>{{new.title}}</b></h2>
	33	+ </div>
	34	+ <div class="col-md-12" style="margin-top: -30px;">
	35	+ <button style="text-transform:none; text-decoration: underline;" type="button" class="pull-right btn btn-default btn-sm" id="printButton" name="button">{% trans "Print News" %}
	36	+ <i class="fa fa-print" aria-hidden="true"></i></button><br>
33	37	<p>{{new.creator}}, em {{new.create_date}}</p>
34	38	</div>
	39	+ <div class="col-md-12" style="margin-top: 20px; margin-bottom: 20px;">
	40	+ <span><img src="{% if new.image %}{{ new.image.url }}{% endif %}" width="100%"></span>
	41	+ </div>
35	42	<div class="col-md-12">
36	43	<br>
37	44	{% autoescape off %}
...	...