Merge remote-tracking branch 'origin/dev' into dev

apps/course/migrations/0005_course_from_author.py

@@ -0,0 +1,18 @@
+# Generated by Django 2.0.1 on 2018-01-29 09:44
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('course', '0004_auto_20180128_1311'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='course',
+            name='from_author',
+            field=models.TextField(default='', verbose_name='От автора'),
+        ),
+    ]

apps/course/models.py

@@ -24,6 +24,7 @@ class Course(models.Model):
     author = models.ForeignKey(User, on_delete=models.SET_NULL, null=True, blank=True)
     title = models.CharField("Название курса", max_length=100)
     short_description = models.TextField("Краткое описание курса")
+    from_author = models.TextField("От автора", default='')
     cover = models.ImageField("Фон курса", upload_to='courses')
     price = models.DecimalField("Цена курса", help_text="Если цены нету, то курс бесплатный", max_digits=10, decimal_places=2, null=True, blank=True)
     is_infinite = models.BooleanField(default=False)

apps/course/templates/course/_items.html

@@ -1,6 +1,6 @@
 {% load static %}
 <div class="courses__item" data-course data-course-id={{ course.id }} data-likes-count={{ course.likes.count }} {% if course.is_deferred_start %}data-future-course data-future-course-time={{ course.deferred_start_at.timestamp }}{% endif %}>
-  <a class="courses__preview" href="#">
+  <a class="courses__preview" href="{% url 'course' course.id %}">
     <img class="courses__pic" src="{{ course.cover.url }}" />
     <div class="courses__view">Подробнее</div>
     {% if course.is_featured %}
@@ -24,25 +24,25 @@
   <div class="courses__user user">
     {% if course.author.photo %}
     <div class="user__ava ava">
-      <img class="ava__pic" src={{ course.author.photo.url }}/>
+      <img class="ava__pic" src="{{ course.author.photo.url }}"/>
     </div>
     {% else %}
     <div class="user__ava ava">
-      <img class="ava__pic" src={% static "img/user.jpg" %}/>
+      <img class="ava__pic" src="{% static 'img/user.jpg' %}"/>
     </div>
     {% endif %}
     <div class="user__info">
-      <div class="user__name">{{ course.author.first_name }} {{ course.author.last_name }}</div>
+      <div class="user__name">{{ course.author.get_full_name }}</div>
       <div class="user__meta">
         <div class="user__date">{{ course.created_at_humanize }}</div>
         <a class="user__likes likes" data-course-likes data-course-likes-count="{{ course.likes.count }}" data-course-id="{{ course.id }}" href="#">
           <div class="likes__counter">{{ course.likes.count }}</div>
           <div class="likes__icon">
             <svg class="icon icon-like">
-              <use xlink:href="{% get_static_prefix %}img/sprite.svg#icon-like-bold"></use>
+              <use xlink:href="{% static 'img/sprite.svg' %}#icon-like"></use>
             </svg>
             <svg class="icon icon-like-fill">
-              <use xlink:href="{% get_static_prefix %}img/sprite.svg#icon-like-fill-bold"></use>
+              <use xlink:href="{% static 'img/sprite.svg' %}#icon-like-fill"></use>
             </svg>
           </div>
         </a>

apps/course/templates/course/course.html

@@ -0,0 +1,270 @@
+{% extends "templates/lilcity/index.html" %}
+{% load static %}
+
+{% block content %}
+<div class="section section_border">
+  <div class="section__center center center_sm">
+    <div class="go">
+      <a class="go__item" href="#">
+        <div class="go__arrow"><svg class="icon icon-arrow-left"><use xlink:href="{% static 'img/sprite.svg' %}#icon-arrow-left"></use></svg></div>
+        <div class="go__title">Вернуться</div>
+      </a><button class="go__btn btn btn_md" data-popup=".js-popup-buy">КУПИТЬ КУРС</button></div>
+    <div class="course" data-course data-course-id={{ course.id }} data-likes-count={{ course.likes.count }} {% if course.is_deferred_start %}data-future-course data-future-course-time={{ course.deferred_start_at.timestamp }}{% endif %}>
+      <div class="course__head">
+        <div class="course__theme theme theme_green">{{ course.category.title | upper }}</div>
+        <a class="course__likes likes" href="#">
+          <div class="likes__counter">{{ course.likes.count }}</div>
+          <div class="likes__icon"><svg class="icon icon-like-bold"><use xlink:href="{% static 'img/sprite.svg' %}#icon-like-bold"></use></svg><svg class="icon icon-like-fill-bold"><use xlink:href="img/sprite.svg#icon-like-fill-bold"></use></svg></div>
+        </a>
+      </div>
+      <div class="course__title title">{{ course.title }}</div>
+      <div class="course__content">{{ course.short_description }}</div>
+      <div class="course__user user">
+        {% if course.author.photo %}
+        <div class="user__ava ava"><img class="ava__pic" src="{{ course.author.photo.url }}"></div>
+        {% else %}
+        <div class="user__ava ava"><img class="ava__pic" src="{% static 'img/user.jpg' %}"></div>
+        {% endif %}
+        <div class="user__info">
+          <div class="user__name">{{ course.author.get_full_name }}</div>
+          <div class="user__meta">
+            <div class="user__date">{{ course.created_at_humanize }}</div>
+          </div>
+        </div>
+      </div>
+      <div class="course__metas">
+        <div class="course__meta meta">
+          <div class="meta__item">
+            <div class="meta__icon"><svg class="icon icon-time"><use xlink:href="{% static 'img/sprite.svg' %}#icon-time"></use></svg></div>
+            <div class="meta__title">12 часов</div>
+          </div>
+          <div class="meta__item">
+            <div class="meta__icon"><svg class="icon icon-date"><use xlink:href="{% static 'img/sprite.svg' %}#icon-date"></use></svg></div>
+            <div class="meta__title">15 ноября</div>
+          </div>
+          <div class="meta__item">
+            <div class="meta__icon"><svg class="icon icon-money"><use xlink:href="{% static 'img/sprite.svg' %}#icon-money"></use></svg></div>
+            <div class="meta__title">{{ course.price|floatformat:"-2" }}$</div>
+          </div>
+        </div>
+        <div class="course__meta meta">
+          <div class="meta__item">
+            <div class="meta__icon"><svg class="icon icon-showcase"><use xlink:href="{% static 'img/sprite.svg' %}#icon-showcase"></use></svg></div>
+            <div class="meta__title">5 уроков</div>
+          </div>
+          <div class="meta__item">
+            <div class="meta__icon"><svg class="icon icon-video"><use xlink:href="{% static 'img/sprite.svg' %}#icon-video"></use></svg></div>
+            <div class="meta__title">12 видео</div>
+          </div>
+        </div>
+      </div>
+      <div class="course__actions"><button class="course__action btn btn_lg btn_stroke">Описание курса</button><button class="course__action btn btn_lg btn_gray">УРОКИ<svg class="icon icon-lock"><use xlink:href="{% static 'img/sprite.svg' %}#icon-lock"></use></svg></button></div><a class="course__video video"
+        href="#"><img class="video__pic" src="{% static 'img/video-1.jpg' %}"><svg class="icon icon-play"><use xlink:href="{% static 'img/sprite.svg' %}#icon-play"></use></svg></a>
+      <div class="course__share share share_sm">
+        <div class="share__title">Поделиться курсом</div>
+        <div class="share__list"><a class="share__item" href="#"><svg class="icon icon-share-facebook"><use xlink:href="{% static 'img/sprite.svg' %}#icon-share-facebook"></use></svg></a><a class="share__item" href="#"><svg class="icon icon-share-twitter"><use xlink:href="{% static 'img/sprite.svg' %}#icon-share-twitter"></use></svg></a>
+          <a
+            class="share__item" href="#"><svg class="icon icon-share-google"><use xlink:href="{% static 'img/sprite.svg' %}#icon-share-google"></use></svg></a><a class="share__item" href="#"><svg class="icon icon-share-pinterest"><use xlink:href="{% static 'img/sprite.svg' %}#icon-share-pinterest"></use></svg></a></div>
+      </div>
+    </div>
+    {% if course.from_author %}    
+    <div class="author">
+      <div class="author__title title">От автора</div>
+      <div class="author__row">
+        {% if course.author.photo %}
+        <div class="author__ava ava"><img class="ava__pic" src="{{ course.author.photo.url }}"></div>
+        {% else %}
+        <div class="author__ava ava"><img class="ava__pic" src="{% static 'img/user.jpg' %}"></div>
+        {% endif %}
+        <div class="author__wrap">
+          <div class="author__hi">Привет всем!</div>
+          <div class="author__content">
+            {{ course.from_author }}
+          </div><a class="author__name" href="#">{{ course.author.get_full_name }}</a></div>
+        </div>
+      </div>
+    </div>
+    {% endif %}
+</div>
+<div class="section">
+  <div class="section__center center center_sm">
+    <div class="lessons">
+      <div class="lessons__title title">Содержание курса</div>
+      <div class="lessons__list">
+        <div class="lessons__item">
+          <div class="lessons__subtitle subtitle">1 УРОК</div>
+          <div class="lessons__row">
+            <div class="lessons__preview"><img class="lessons__pic" src="{% static 'img/pic-3.jpg' %}"></div>
+            <div class="lessons__content">Выбираем сюжет, с которым мы будем работать на курсе и главного героя вашей истории. С этим героем мы будем работать на протяжении всего курса.</div>
+          </div>
+        </div>
+        <div class="lessons__item">
+          <div class="lessons__subtitle subtitle">2 УРОК</div>
+          <div class="lessons__row">
+            <div class="lessons__preview"><img class="lessons__pic" src="{% static 'img/pic-3.jpg' %}"></div>
+            <div class="lessons__content">
+              <p>Выделяем основные черты внешности и характера вашего персонажа. Вам нужно будет ответить на несколько ключевых вопросов:</p><br>
+              <p>– Кто он и как он выглядит?</p>
+              <p>– Где и в какое время он живет?</p>
+              <p>– Какой его характерный признак?</p>
+            </div>
+          </div>
+        </div>
+        <div class="lessons__item">
+          <div class="lessons__subtitle subtitle">1 УРОК</div>
+          <div class="lessons__row">
+            <div class="lessons__preview"><img class="lessons__pic" src="{% static 'img/pic-3.jpg' %}"></div>
+            <div class="lessons__content">
+              <p>Собираем материал и экспериментируем с образом героя, используя полученный список характерных особенностей персонажа. По каждому признаку нужно будет собрать «референсы». Рисуем элементы образа в своем стиле.</p>
+              <p>Собираем из них нашего персонажа. Выбираем самые удачные элементы, объединяем их в одном наброске.</p>
+            </div>
+          </div>
+        </div>
+        <div class="lessons__item">
+          <div class="lessons__subtitle subtitle">1 УРОК</div>
+          <div class="lessons__row">
+            <div class="lessons__preview"><img class="lessons__pic" src="{% static 'img/pic-3.jpg' %}"></div>
+            <div class="lessons__content">
+              <p>Попробуем оживить персонажа. Выбираем 5 характерных действий для вашего героя и того сюжета, в котором он принимает участие, рисуем эскизы вашего персонажа в разных характерных для него позах и движении.</p>
+              <p>Выделяем 5 характерных эмоций для героя, над которым работаем. По эмоциям подбираем референсы и стилизуем их в своем стиле.</p>
+            </div>
+          </div>
+        </div>
+        <div class="lessons__item">
+          <div class="lessons__subtitle subtitle">1 УРОК</div>
+          <div class="lessons__row">
+            <div class="lessons__preview"><img class="lessons__pic" src="{% static 'img/pic-3.jpg' %}"></div>
+            <div class="lessons__content">Адаптируем вашего героя в соответствии с целевой аудиторией. Рассматриваем, как люди разных возрастов по разному воспринимают образы, героев и их эмоции. Выделяем 3 основные группы — дети, подростки и взрослые люди.</div>
+          </div>
+        </div>
+      </div>
+      <div class="lessons__load load"><button class="load__btn btn">еще</button></div>
+    </div>
+  </div>
+</div>
+<div class="section">
+  <div class="section__center center center_sm">
+    <div class="title">Материалы, которые понадобятся</div>
+    <div class="materials">
+      <div class="materials__item">
+        <div class="materials__preview"><img class="materials__pic" src="{% static 'img/pic-3.jpg' %}"></div>
+        <div class="materials__wrap">
+          <div class="materials__title">Бумага акварельная</div>
+          <div class="materials__content">Этот курс поможет детям узнать о том как из простых форм создавать веселый и харизматичных персонажей.</div>
+        </div>
+      </div>
+      <div class="materials__item">
+        <div class="materials__preview"><img class="materials__pic" src="{% static 'img/pic-3.jpg' %}"></div>
+        <div class="materials__wrap">
+          <div class="materials__title">Бумага акварельная</div>
+          <div class="materials__content">Этот курс поможет детям узнать о том как из простых форм создавать веселый и харизматичных персонажей.</div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+<div class="section section_gradient">
+  <div class="section__center center center_sm">
+    <div class="title">Галерея итогов обучения</div>
+    <div class="examples">
+      <div class="examples__item"><img class="examples__pic" src="{% static 'img/box.jpg' %}"></div>
+      <div class="examples__item"><img class="examples__pic" src="{% static 'img/box.jpg' %}"></div>
+      <div class="examples__item"><img class="examples__pic" src="{% static 'img/box.jpg' %}"></div>
+      <div class="examples__item"><img class="examples__pic" src="{% static 'img/box.jpg' %}"></div>
+      <div class="examples__item"><img class="examples__pic" src="{% static 'img/box.jpg' %}"></div>
+      <div class="examples__item"><img class="examples__pic" src="{% static 'img/box.jpg' %}"></div>
+      <div class="examples__item"><img class="examples__pic" src="{% static 'img/box.jpg' %}"></div>
+      <div class="examples__item"><img class="examples__pic" src="{% static 'img/box.jpg' %}"></div>
+      <div class="examples__item"><img class="examples__pic" src="{% static 'img/box.jpg' %}"></div>
+      <div class="examples__item"><img class="examples__pic" src="{% static 'img/box.jpg' %}"></div>
+      <div class="examples__item"><img class="examples__pic" src="{% static 'img/box.jpg' %}"></div>
+      <div class="examples__item"><img class="examples__pic" src="{% static 'img/box.jpg' %}"></div>
+    </div>
+  </div>
+</div>
+<div class="course course_promo" style="background-image: url({% static 'img/video-1.jpg' %});">
+  <div class="course__center center center_sm">
+    <div class="course__head">
+      <div class="course__theme theme theme_green">ПЕРСОНАЖИ</div>
+      <a class="course__likes likes" href="#">
+        <div class="likes__counter">{{ course.likes.count }}</div>
+        <div class="likes__icon"><svg class="icon icon-like-bold"><use xlink:href="{% static 'img/sprite.svg' %}#icon-like-bold"></use></svg><svg class="icon icon-like-fill-bold"><use xlink:href="img/sprite.svg#icon-like-fill-bold"></use></svg></div>
+      </a>
+    </div>
+    <div class="course__title title">Как просто научиться рисовать простых персонажей.</div>
+    <div class="course__content">Этот курс поможет детям узнать о том как из простых форм создавать веселый и харизматичных персонажей.</div>
+    <div class="course__user user user_white">
+      {% if course.author.photo %}
+      <div class="user__ava ava"><img class="ava__pic" src="{{ course.author.photo.url }}"></div>
+      {% else %}
+      <div class="user__ava ava"><img class="ava__pic" src="{% static 'img/user.jpg' %}"></div>
+      {% endif %}
+      <div class="user__info">
+        <div class="user__name">{{ course.author.get_full_name }}</div>
+        <div class="user__meta">
+          <div class="user__date">{{ course.created_at_humanize }}</div>
+        </div>
+      </div>
+    </div>
+    <div class="course__info">
+      <div class="course__meta meta meta_white">
+        <div class="meta__item">
+          <div class="meta__icon"><svg class="icon icon-time"><use xlink:href="{% static 'img/sprite.svg' %}#icon-time"></use></svg></div>
+          <div class="meta__title">12 часов</div>
+        </div>
+        <div class="meta__item">
+          <div class="meta__icon"><svg class="icon icon-date"><use xlink:href="{% static 'img/sprite.svg' %}#icon-date"></use></svg></div>
+          <div class="meta__title">15 ноября</div>
+        </div>
+        <div class="meta__item">
+          <div class="meta__icon"><svg class="icon icon-money"><use xlink:href="{% static 'img/sprite.svg' %}#icon-money"></use></svg></div>
+          <div class="meta__title">{{ course.price|floatformat:"-2" }}$</div>
+        </div>
+      </div><button class="course__buy btn btn_md" data-popup=".js-popup-buy">КУПИТЬ КУРС</button></div>
+  </div>
+</div>
+<div class="section section_gray">
+  <div class="section__center center center_sm">
+    <div class="title">Задавайте вопросы:</div>
+    <div class="questions">
+      <div class="questions__form">
+        <div class="questions__ava ava"><img class="ava__pic" src="{% static 'img/user.jpg' %}"></div>
+        <div class="questions__wrap">
+          <div class="questions__field"><textarea class="questions__textarea" placeholder="Спросите автора курса интересующие вас вопросы"></textarea></div><button class="questions__btn btn btn_light">ОТПРАВИТЬ</button></div>
+      </div>
+      <div class="questions__list">
+        <div class="questions__item">
+          <div class="questions__ava ava"><img class="ava__pic" src="{% static 'img/user.jpg' %}"></div>
+          <div class="questions__wrap">
+            <div class="questions__details">
+              <div class="questions__head"><span class="questions__author">Богиня Недалекая</span><span class="questions__date">16 Сен, 16:52</span></div>
+              <div class="questions__content">А можно ли заниматься если у меня нет интернета и компьютера. Можно ли запустить видео на моей микроволновке?</div>
+            </div>
+            <div class="questions__foot"><button class="questions__action">ОТВЕТИТЬ</button></div>
+          </div>
+        </div>
+        <div class="questions__item questions__item_reply">
+          <div class="questions__ava ava"><img class="ava__pic" src="{% static 'img/user.jpg' %}"></div>
+          <div class="questions__wrap">
+            <div class="questions__details">
+              <div class="questions__head"><span class="questions__author">Богиня Недалекая</span><span class="questions__date">16 Сен, 16:52</span></div>
+              <div class="questions__content">А можно ли заниматься если у меня нет интернета и компьютера. Можно ли запустить видео на моей микроволновке?</div>
+            </div>
+            <div class="questions__foot"><button class="questions__action">ОТВЕТИТЬ</button></div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+<div class="section">
+  <div class="section__center center center_sm">
+    <div class="share">
+      <div class="share__title">Поделиться курсом</div>
+      <div class="share__list"><a class="share__item" href="#"><svg class="icon icon-share-facebook"><use xlink:href="{% static 'img/sprite.svg' %}#icon-share-facebook"></use></svg></a><a class="share__item" href="#"><svg class="icon icon-share-twitter"><use xlink:href="{% static 'img/sprite.svg' %}#icon-share-twitter"></use></svg></a>
+        <a
+          class="share__item" href="#"><svg class="icon icon-share-google"><use xlink:href="{% static 'img/sprite.svg' %}#icon-share-google"></use></svg></a><a class="share__item" href="#"><svg class="icon icon-share-pinterest"><use xlink:href="{% static 'img/sprite.svg' %}#icon-share-pinterest"></use></svg></a></div>
+    </div>
+  </div>
+</div>
+{% endblock content %}

apps/course/views.py

@@ -1,7 +1,7 @@
 from django.contrib.auth.decorators import login_required
 from django.http import JsonResponse
 from django.template import loader
-from django.views.generic import View, ListView
+from django.views.generic import View, DetailView, ListView
 from django.views.decorators.csrf import csrf_exempt
 from django.views.decorators.http import require_http_methods
 from .models import Course, Like
@@ -37,6 +37,12 @@ def likes(request, course_id):
         })
 
 
+class CourseView(DetailView):
+    model = Course
+    context_object_name = 'course'
+    template_name = 'course/course.html'
+
+
 class CoursesView(ListView):
     model = Course
     context_object_name = 'course_items'

project/urls.py

@@ -18,12 +18,13 @@ from django.urls import path, include
 from django.views.generic import TemplateView
 from django.conf import settings
 
-from apps.course.views import CoursesView, likes
+from apps.course.views import CoursesView, likes, CourseView
 
 urlpatterns = [
     path('admin/', admin.site.urls),
     path('auth/', include(('apps.auth.urls', 'lilcity'))),
     path('courses/', CoursesView.as_view(), name='courses'),
+    path('course/<int:pk>/', CourseView.as_view(), name='course'),
     path('course/<int:course_id>/like', likes, name='likes'),
     path('', TemplateView.as_view(template_name="templates/lilcity/main.html"), name='index'),
 ]