Show More
@@ -1,76 +1,81 b'' | |||||
1 | .ui-button { |
|
1 | .ui-button { | |
2 | display: none; |
|
2 | display: none; | |
3 | } |
|
3 | } | |
4 |
|
4 | |||
5 | .ui-dialog-content { |
|
5 | .ui-dialog-content { | |
6 | padding: 0; |
|
6 | padding: 0; | |
7 | min-height: 0; |
|
7 | min-height: 0; | |
8 | } |
|
8 | } | |
9 |
|
9 | |||
10 | .mark_btn { |
|
10 | .mark_btn { | |
11 | cursor: pointer; |
|
11 | cursor: pointer; | |
12 | } |
|
12 | } | |
13 |
|
13 | |||
14 | .img-full { |
|
14 | .img-full { | |
15 | position: fixed; |
|
15 | position: fixed; | |
16 | background-color: #CCC; |
|
16 | background-color: #CCC; | |
17 | border: 1px solid #000; |
|
17 | border: 1px solid #000; | |
18 | cursor: pointer; |
|
18 | cursor: pointer; | |
19 | } |
|
19 | } | |
20 |
|
20 | |||
21 | .strikethrough { |
|
21 | .strikethrough { | |
22 | text-decoration: line-through; |
|
22 | text-decoration: line-through; | |
23 | } |
|
23 | } | |
24 |
|
24 | |||
25 | .post_preview { |
|
25 | .post_preview { | |
26 | z-index: 300; |
|
26 | z-index: 300; | |
27 | position:absolute; |
|
27 | position:absolute; | |
28 | } |
|
28 | } | |
29 |
|
29 | |||
30 | .gallery_image { |
|
30 | .gallery_image { | |
31 | display: inline-block; |
|
31 | display: inline-block; | |
32 | } |
|
32 | } | |
33 |
|
33 | |||
34 | @media print { |
|
34 | @media print { | |
35 | .post-form-w { |
|
35 | .post-form-w { | |
36 | display: none; |
|
36 | display: none; | |
37 | } |
|
37 | } | |
38 | } |
|
38 | } | |
39 |
|
39 | |||
40 | input[name="image"] { |
|
40 | input[name="image"] { | |
41 | display: block; |
|
41 | display: block; | |
42 | width: 100px; |
|
42 | width: 100px; | |
43 | height: 100px; |
|
43 | height: 100px; | |
44 | cursor: pointer; |
|
44 | cursor: pointer; | |
45 | position: absolute; |
|
45 | position: absolute; | |
46 | opacity: 0; |
|
46 | opacity: 0; | |
47 | z-index: 1; |
|
47 | z-index: 1; | |
48 | } |
|
48 | } | |
49 |
|
49 | |||
50 | .file_wrap { |
|
50 | .file_wrap { | |
51 | width: 100px; |
|
51 | width: 100px; | |
52 | height: 100px; |
|
52 | height: 100px; | |
53 | border: solid 1px white; |
|
53 | border: solid 1px white; | |
54 | display: inline-block; |
|
54 | display: inline-block; | |
55 | } |
|
55 | } | |
56 |
|
56 | |||
57 | form > .file_wrap { |
|
57 | form > .file_wrap { | |
58 | float: left; |
|
58 | float: left; | |
59 | } |
|
59 | } | |
60 |
|
60 | |||
61 | .file-thumb { |
|
61 | .file-thumb { | |
62 | width: 100px; |
|
62 | width: 100px; | |
63 | height: 100px; |
|
63 | height: 100px; | |
64 | background-size: cover; |
|
64 | background-size: cover; | |
65 | background-position: center; |
|
65 | background-position: center; | |
66 | } |
|
66 | } | |
67 |
|
67 | |||
68 | .compact-form-text { |
|
68 | .compact-form-text { | |
69 | margin-left:110px; |
|
69 | margin-left:110px; | |
70 | } |
|
70 | } | |
71 |
|
71 | |||
72 | textarea, input { |
|
72 | textarea, input { | |
73 | -moz-box-sizing: border-box; |
|
73 | -moz-box-sizing: border-box; | |
74 | -webkit-box-sizing: border-box; |
|
74 | -webkit-box-sizing: border-box; | |
75 | box-sizing: border-box; |
|
75 | box-sizing: border-box; | |
76 | } No newline at end of file |
|
76 | } | |
|
77 | ||||
|
78 | .compact-form-text > textarea { | |||
|
79 | height: 100px; | |||
|
80 | width: 100%; | |||
|
81 | } |
@@ -1,45 +1,45 b'' | |||||
1 |
var isCompact = |
|
1 | var isCompact = false; | |
2 |
|
2 | |||
3 | $('input[name=image]').wrap($('<div class="file_wrap"></div>')); |
|
3 | $('input[name=image]').wrap($('<div class="file_wrap"></div>')); | |
4 |
|
4 | |||
5 | $('body').on('change', 'input[name=image]', function(event) { |
|
5 | $('body').on('change', 'input[name=image]', function(event) { | |
6 | var file = event.target.files[0]; |
|
6 | var file = event.target.files[0]; | |
7 |
|
7 | |||
8 | if(file.type.match('image.*')) { |
|
8 | if(file.type.match('image.*')) { | |
9 | var fileReader = new FileReader(); |
|
9 | var fileReader = new FileReader(); | |
10 |
|
10 | |||
11 | fileReader.addEventListener("load", function(event) { |
|
11 | fileReader.addEventListener("load", function(event) { | |
12 | var wrapper = $('.file_wrap'); |
|
12 | var wrapper = $('.file_wrap'); | |
13 |
|
13 | |||
14 | wrapper.find('.file-thumb').remove(); |
|
14 | wrapper.find('.file-thumb').remove(); | |
15 | wrapper.append( |
|
15 | wrapper.append( | |
16 | $('<div class="file-thumb" style="background-image: url('+event.target.result+')"></div>') |
|
16 | $('<div class="file-thumb" style="background-image: url('+event.target.result+')"></div>') | |
17 | ); |
|
17 | ); | |
18 | }); |
|
18 | }); | |
19 |
|
19 | |||
20 | fileReader.readAsDataURL(file); |
|
20 | fileReader.readAsDataURL(file); | |
21 | } |
|
21 | } | |
22 | }); |
|
22 | }); | |
23 |
|
23 | |||
24 | var compactForm = $('.swappable-form-compact'); |
|
|||
25 | var fullForm = $('.swappable-form-full'); |
|
24 | var fullForm = $('.swappable-form-full'); | |
26 |
|
25 | |||
27 | function swapForm() { |
|
26 | function swapForm() { | |
28 | compactForm.toggle(); |
|
|||
29 | fullForm.toggle(); |
|
|||
30 |
|
||||
31 | if (isCompact) { |
|
27 | if (isCompact) { | |
32 | var oldText = compactForm.find('textarea')[0].value; |
|
28 | // TODO Use IDs (change the django form code) instead of absolute numbers | |
33 |
fullForm.find('textarea')[ |
|
29 | fullForm.find('textarea').appendTo(fullForm.find('.form-row')[4]); | |
|
30 | fullForm.find('.file_wrap').appendTo(fullForm.find('.form-row')[7]); | |||
|
31 | fullForm.find('.form-row').show(); | |||
34 | } else { |
|
32 | } else { | |
35 | var oldText = fullForm.find('textarea')[0].value; |
|
33 | fullForm.find('textarea').appendTo($('.compact-form-text')); | |
36 | compactForm.find('textarea')[0].value = oldText; |
|
34 | fullForm.find('.file_wrap').insertBefore($('.compact-form-text')); | |
|
35 | fullForm.find('.form-row').hide(); | |||
|
36 | fullForm.find('input[type=text]').val(''); | |||
37 | } |
|
37 | } | |
38 | isCompact = !isCompact; |
|
38 | isCompact = !isCompact; | |
39 |
|
39 | |||
40 | scrollToBottom(); |
|
40 | scrollToBottom(); | |
41 | } |
|
41 | } | |
42 |
|
42 | |||
43 | if (compactForm.length > 0) { |
|
43 | $(document).ready(function() { | |
44 | fullForm.toggle(); |
|
44 | swapForm(); | |
45 | } |
|
45 | }) |
@@ -1,108 +1,95 b'' | |||||
1 | {% extends "boards/base.html" %} |
|
1 | {% extends "boards/base.html" %} | |
2 |
|
2 | |||
3 | {% load i18n %} |
|
3 | {% load i18n %} | |
4 | {% load cache %} |
|
4 | {% load cache %} | |
5 | {% load static from staticfiles %} |
|
5 | {% load static from staticfiles %} | |
6 | {% load board %} |
|
6 | {% load board %} | |
7 |
|
7 | |||
8 | {% block head %} |
|
8 | {% block head %} | |
9 | <title>{{ opening_post.get_title|striptags|truncatewords:10 }} |
|
9 | <title>{{ opening_post.get_title|striptags|truncatewords:10 }} | |
10 | - {{ site_name }}</title> |
|
10 | - {{ site_name }}</title> | |
11 | {% endblock %} |
|
11 | {% endblock %} | |
12 |
|
12 | |||
13 | {% block content %} |
|
13 | {% block content %} | |
14 | {% spaceless %} |
|
14 | {% spaceless %} | |
15 | {% get_current_language as LANGUAGE_CODE %} |
|
15 | {% get_current_language as LANGUAGE_CODE %} | |
16 |
|
16 | |||
17 | {% cache 600 thread_view thread.id thread.last_edit_time moderator LANGUAGE_CODE %} |
|
17 | {% cache 600 thread_view thread.id thread.last_edit_time moderator LANGUAGE_CODE %} | |
18 |
|
18 | |||
19 | <div class="image-mode-tab"> |
|
19 | <div class="image-mode-tab"> | |
20 | <a class="current_mode" href="{% url 'thread' opening_post.id %}">{% trans 'Normal mode' %}</a>, |
|
20 | <a class="current_mode" href="{% url 'thread' opening_post.id %}">{% trans 'Normal mode' %}</a>, | |
21 | <a href="{% url 'thread_mode' opening_post.id 'gallery' %}">{% trans 'Gallery mode' %}</a> |
|
21 | <a href="{% url 'thread_mode' opening_post.id 'gallery' %}">{% trans 'Gallery mode' %}</a> | |
22 | </div> |
|
22 | </div> | |
23 |
|
23 | |||
24 | {% if bumpable %} |
|
24 | {% if bumpable %} | |
25 | <div class="bar-bg"> |
|
25 | <div class="bar-bg"> | |
26 | <div class="bar-value" style="width:{{ bumplimit_progress }}%" id="bumplimit_progress"> |
|
26 | <div class="bar-value" style="width:{{ bumplimit_progress }}%" id="bumplimit_progress"> | |
27 | </div> |
|
27 | </div> | |
28 | <div class="bar-text"> |
|
28 | <div class="bar-text"> | |
29 | <span id="left_to_limit">{{ posts_left }}</span> {% trans 'posts to bumplimit' %} |
|
29 | <span id="left_to_limit">{{ posts_left }}</span> {% trans 'posts to bumplimit' %} | |
30 | </div> |
|
30 | </div> | |
31 | </div> |
|
31 | </div> | |
32 | {% endif %} |
|
32 | {% endif %} | |
33 |
|
33 | |||
34 | <div class="thread"> |
|
34 | <div class="thread"> | |
35 | {% with can_bump=thread.can_bump %} |
|
35 | {% with can_bump=thread.can_bump %} | |
36 | {% for post in thread.get_replies %} |
|
36 | {% for post in thread.get_replies %} | |
37 | {% if forloop.first %} |
|
37 | {% if forloop.first %} | |
38 | {% post_view post moderator=moderator is_opening=True thread=thread can_bump=can_bump opening_post_id=opening_post.id %} |
|
38 | {% post_view post moderator=moderator is_opening=True thread=thread can_bump=can_bump opening_post_id=opening_post.id %} | |
39 | {% else %} |
|
39 | {% else %} | |
40 | {% post_view post moderator=moderator is_opening=False thread=thread can_bump=can_bump opening_post_id=opening_post.id %} |
|
40 | {% post_view post moderator=moderator is_opening=False thread=thread can_bump=can_bump opening_post_id=opening_post.id %} | |
41 | {% endif %} |
|
41 | {% endif %} | |
42 | {% endfor %} |
|
42 | {% endfor %} | |
43 | {% endwith %} |
|
43 | {% endwith %} | |
44 | </div> |
|
44 | </div> | |
45 |
|
45 | |||
46 | {% if not thread.archived %} |
|
46 | {% if not thread.archived %} | |
47 |
|
47 | |||
48 | <div class="post-form-w" id="form"> |
|
48 | <div class="post-form-w" id="form"> | |
49 | <script src="{% static 'js/panel.js' %}"></script> |
|
49 | <script src="{% static 'js/panel.js' %}"></script> | |
50 | <div class="form-title">{% trans "Reply to thread" %} #{{ opening_post.id }}</div> |
|
50 | <div class="form-title">{% trans "Reply to thread" %} #{{ opening_post.id }}</div> | |
51 | <div class="post-form" id="compact-form"> |
|
51 | <div class="post-form" id="compact-form"> | |
52 | <div class="swappable-form-compact"> |
|
|||
53 | <form enctype="multipart/form-data" method="post" |
|
|||
54 | >{% csrf_token %} |
|
|||
55 | <input type="file" name="image" accept="image/*"/> |
|
|||
56 | <div class="compact-form-text"> |
|
|||
57 | <textarea name="text" style="height: 100px; |
|
|||
58 | width: 100%; |
|
|||
59 | "></textarea> |
|
|||
60 | </div> |
|
|||
61 | <div class="form-submit"> |
|
|||
62 | <input type="submit" value="{% trans "Post" %}"/> |
|
|||
63 | </div> |
|
|||
64 | </form> |
|
|||
65 | </div> |
|
|||
66 | <div class="swappable-form-full"> |
|
52 | <div class="swappable-form-full"> | |
67 | <form enctype="multipart/form-data" method="post" |
|
53 | <form enctype="multipart/form-data" method="post" | |
68 | >{% csrf_token %} |
|
54 | >{% csrf_token %} | |
|
55 | <div class="compact-form-text"></div> | |||
69 | {{ form.as_div }} |
|
56 | {{ form.as_div }} | |
70 | <div class="form-submit"> |
|
57 | <div class="form-submit"> | |
71 | <input type="submit" value="{% trans "Post" %}"/> |
|
58 | <input type="submit" value="{% trans "Post" %}"/> | |
72 | </div> |
|
59 | </div> | |
73 | </form> |
|
60 | </form> | |
74 | </div> |
|
61 | </div> | |
75 | <a onclick="swapForm(); return false;" href="#"> |
|
62 | <a onclick="swapForm(); return false;" href="#"> | |
76 | {% trans 'Switch mode' %} |
|
63 | {% trans 'Switch mode' %} | |
77 | </a> |
|
64 | </a> | |
78 | <div><a href="{% url "staticpage" name="help" %}"> |
|
65 | <div><a href="{% url "staticpage" name="help" %}"> | |
79 | {% trans 'Text syntax' %}</a></div> |
|
66 | {% trans 'Text syntax' %}</a></div> | |
80 | </div> |
|
67 | </div> | |
81 | </div> |
|
68 | </div> | |
82 |
|
69 | |||
83 | <script src="{% static 'js/jquery.form.min.js' %}"></script> |
|
70 | <script src="{% static 'js/jquery.form.min.js' %}"></script> | |
84 | <script src="{% static 'js/thread_update.js' %}"></script> |
|
71 | <script src="{% static 'js/thread_update.js' %}"></script> | |
85 | {% endif %} |
|
72 | {% endif %} | |
86 |
|
73 | |||
87 | <script src="{% static 'js/form.js' %}"></script> |
|
74 | <script src="{% static 'js/form.js' %}"></script> | |
88 | <script src="{% static 'js/thread.js' %}"></script> |
|
75 | <script src="{% static 'js/thread.js' %}"></script> | |
89 |
|
76 | |||
90 | {% endcache %} |
|
77 | {% endcache %} | |
91 |
|
78 | |||
92 | {% endspaceless %} |
|
79 | {% endspaceless %} | |
93 | {% endblock %} |
|
80 | {% endblock %} | |
94 |
|
81 | |||
95 | {% block metapanel %} |
|
82 | {% block metapanel %} | |
96 |
|
83 | |||
97 | {% get_current_language as LANGUAGE_CODE %} |
|
84 | {% get_current_language as LANGUAGE_CODE %} | |
98 |
|
85 | |||
99 | <span class="metapanel" data-last-update="{{ last_update }}"> |
|
86 | <span class="metapanel" data-last-update="{{ last_update }}"> | |
100 | {% cache 600 thread_meta thread.last_edit_time moderator LANGUAGE_CODE %} |
|
87 | {% cache 600 thread_meta thread.last_edit_time moderator LANGUAGE_CODE %} | |
101 | <span id="reply-count">{{ thread.get_reply_count }}</span>/{{ max_replies }} {% trans 'replies' %}, |
|
88 | <span id="reply-count">{{ thread.get_reply_count }}</span>/{{ max_replies }} {% trans 'replies' %}, | |
102 | <span id="image-count">{{ thread.get_images_count }}</span> {% trans 'images' %}. |
|
89 | <span id="image-count">{{ thread.get_images_count }}</span> {% trans 'images' %}. | |
103 | {% trans 'Last update: ' %}<span id="last-update">{{ thread.last_edit_time }}</span> |
|
90 | {% trans 'Last update: ' %}<span id="last-update">{{ thread.last_edit_time }}</span> | |
104 | [<a href="rss/">RSS</a>] |
|
91 | [<a href="rss/">RSS</a>] | |
105 | {% endcache %} |
|
92 | {% endcache %} | |
106 | </span> |
|
93 | </span> | |
107 |
|
94 | |||
108 | {% endblock %} |
|
95 | {% endblock %} |
General Comments 0
You need to be logged in to leave comments.
Login now