diff options
| -rw-r--r-- | ignis/views.py | 16 | ||||
| -rw-r--r-- | static/css/home.css | 31 | ||||
| -rw-r--r-- | static/images/backgrounds/welcome-banner.gif | bin | 4500727 -> 0 bytes | |||
| -rw-r--r-- | static/images/backgrounds/welcome-banner.png | bin | 0 -> 378295 bytes | |||
| -rw-r--r-- | templates/blog/home.html | 24 |
5 files changed, 67 insertions, 4 deletions
diff --git a/ignis/views.py b/ignis/views.py index bb52c9f8..da39301d 100644 --- a/ignis/views.py +++ b/ignis/views.py @@ -9,7 +9,7 @@ import requests from django.core.files.base import ContentFile from captcha.image import ImageCaptcha from users.tokens import CaptchaTokenGenerator - +from django.conf import settings from django.http import HttpResponse from django.views.decorators.cache import never_cache from PIL import Image @@ -182,11 +182,23 @@ def get_screenshot(request): driver = webdriver.Firefox(options=options) driver.set_window_size(1280, 1440) - url = 'https://www.thatcomputerscientist.com' + url = 'https://www.thatcomputerscientist.com' if not settings.DEBUG else 'https://preview.thatcomputerscientist.com' + print(settings.DEBUG) # Wait until the page is loaded driver.get(url) time.sleep(5) + + # write 3 chat messages in #chatbox-input + chatbox = driver.find_element('id', 'chatbox-input') + chatbox.send_keys('Hello!') + chatbox.send_keys(u'\ue007') + + chatbox.send_keys('Welcome to my website!') + chatbox.send_keys(u'\ue007') + + chatbox.send_keys('You are currently viewing a a dynamically generated screenshot of my website!') + chatbox.send_keys(u'\ue007') screenshot = driver.get_screenshot_as_png() screenshot = Image.open(BytesIO(screenshot)) diff --git a/static/css/home.css b/static/css/home.css index cbce7204..82cad039 100644 --- a/static/css/home.css +++ b/static/css/home.css @@ -1,7 +1,7 @@ #welcome { width: 730px; height: 262px; - background: url('../images/backgrounds/welcome-banner.gif') no-repeat; + background: url('../images/backgrounds/welcome-banner.png') no-repeat; background-size: 730px 262px; margin: 0px auto 20px auto; border: 0px; @@ -12,13 +12,40 @@ } #welcome > p { - width: 400px; + width: 375px; margin: 12px 0px 12px 50px; position: relative; top: 30px; text-align: justify; } +#chatbox { + position: absolute; + right: 110px; + width: 160px; + top: 25px; +} + +#messages { + height: 175px; + overflow-y: scroll; + position: relative; +} + +.message { + text-align: left; +} + +#chatbox-input { + width: 156px; + border: none; + padding: 10px 2px 2px 2px; + resize: none; + border-top: solid 1px rgba(222, 222, 222, 0.7); + border-radius: 0; + height: 35px; +} + #announcements { background: url('../images/backgrounds/announcements.png') no-repeat; background-size: 730px 300px; diff --git a/static/images/backgrounds/welcome-banner.gif b/static/images/backgrounds/welcome-banner.gif Binary files differdeleted file mode 100644 index de3bbfd1..00000000 --- a/static/images/backgrounds/welcome-banner.gif +++ /dev/null diff --git a/static/images/backgrounds/welcome-banner.png b/static/images/backgrounds/welcome-banner.png Binary files differnew file mode 100644 index 00000000..8edf6a54 --- /dev/null +++ b/static/images/backgrounds/welcome-banner.png diff --git a/templates/blog/home.html b/templates/blog/home.html index 7252736c..5509f8ca 100644 --- a/templates/blog/home.html +++ b/templates/blog/home.html @@ -10,8 +10,13 @@ Please note that I am continuously working on this site, and it is still under construction. So, not all features are available yet, and some features may not work as intended. </p> <p> + There's also a some of <a href="#fun-stuff">fun stuff</a> you can find in the sidebar, that you can play around with. I will be adding more in the not so distant future. Also, To participate around various sections of the site, you will need to <a href="{% url 'blog:register' %}">register</a> for an account. I hope you enjoy your stay here. </p> + <div id="chatbox"> + <div id="messages"></div> + <textarea id="chatbox-input" placeholder="Type your message here... (⏎ to send)"></textarea> + </div> </div> <img src="{% static 'images/gifs/construction.gif' %}" style="width: 730px;"> <div id="announcements"> @@ -52,5 +57,24 @@ </div> {% include 'blog/partials/mathjax.html' %} {% endif %} +<script src="{% static 'js/jquery-1.12.4.min.js' %}"></script> +<script type="text/javascript"> + var username = "{{ user.username }}" ? "{{ user.username }}" : "Anonymous"; + $(document).ready(function() { + $('#chatbox-input').on('keyup', function(e) { + if (e.keyCode === 13) { + var msg = $('#chatbox-input').val(); + if (msg.trim().length > 0) { + var message = document.createElement("div"); + message.className = "message"; + message.innerHTML = "<b>" + username + "</b>: " + msg; + $('#messages').append(message); + $('#messages').animate({scrollTop: $('#messages').prop("scrollHeight")}, 100); + } + $('#chatbox-input').val(""); + } + }); + }); +</script> {% endblock %} |
