{% extends "base.html" %}
{% load compress staticfiles i18n %}
{% load embed_video_tags %}
{% load thumbnail %}
{% load get_three_artworks %}
{% load account socialaccount %}
{% block page_title %}
{{job_appliers.title}}
{% endblock %}
{% block meta_og_title %}
{{job_appliers.title}}
{% endblock %}
{% block meta_og_description %}
{% if job_appliers.job_description %}
{{job_appliers.job_description|safe}}
{% endif %}
{% endblock %}
{% block meta_og_image %}{% if request.is_secure %}https://{% else %}http://{% endif %}{{ request.get_host }}/static/images/blaenks_jobs.png{% endblock %}
{% block content %}
<div class="browse_wrapper browser-main-wrapper-section">
<div class="row browse browser-main-section">
<div class="main-background-browse-section">
<div class="main-navigation-tab-section">
<div class="container">
<div class="row">
<ul class="nav nav-tabs nav-discover-section">
<li>
<a href="{% url 'fearfront:spotlight' %}">Spotlight</a>
</li>
<li>
<a href="{% url 'fearfront:artists' %}">Artists</a>
</li>
<li>
<a href="{% url 'fearfront:artworks' %}">Artworks</a>
</li>
<li class="active">
<a href="/jobs">Jobs</a>
</li>
</ul>
</div>
</div>
<div class="container-fluid">
<div class="post-job-area">
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 post-pre-job">
<!--Desktop myjob postions tabs-->
<div class="skills-only">
{% if request.user.is_authenticated %}
<ul class="nav nav-tabs nav-tabs-pills" role="tablist">
<li role="presentation" class="active"><a href="#jobskills" aria-controls="jobskills" role="tab" data-toggle="tab">My Job Postings</a></li>
</ul>
<!-- Tab panes -->
<div class="tab-content tab-content-area hidden-xs hidden-sm">
<div role="tabpanel" class="tab-pane active">
<div class="content-area jobs-list ">
<div class="content-area-heading content-decre-sub" style="padding: 20px 0;">
<!-- Desktop tabs html start-->
{% for jobs in show_posted_jobs %}
<div class="grey-tri skills-heading post_jobs_wrapper large_jobs_close" data-id="{{jobs.id}}">
<!-- edit jobs for desktop view -->
<h1>
{{jobs.title}}
</h1>
<p class="desktop-paid-para">{{jobs.select_job}}/{{jobs.job_location}}/{{jobs.created_date|date:'d.m.Y'}}/{{jobs.job_type}}</p>
<!-- <div class="triangle-div active"></div> -->
<div class="display-flex">
<div class="edit-job-btn">
<button type="submit" class="btn btn-danger edit-btn edit-desktop-job" data-id="{{jobs.id}}">edit job / project</button>
</div>
<div class="review-job-btn">
<button type="submit" name="review_app_button" class="btn btn-success review-btn deep-review-jobs" data-id="{{jobs.id}}">
review applications ({{jobs.review_count}})
</button>
</div>
</div>
<div class="my-job-triangle" id="myjob{{jobs.id}}"></div>
<div class="my-review-triangle" id="myreview{{jobs.id}}"></div>
</div>
{% endfor %}
<!-- Desktop tabs html end -->
{% if show_posted_jobs|length > 3 %}
<div class="artwork_slide_down_button">
<div align="center">
<a href="#" id="load_myjobs" style="color: #999999">• • •</a>
{% include "partials/_spinner.html" %}
</div>
</div>
{% endif %}
</div>
</div>
</div>
</div>
<!-- Tab panes -->
<div class="tab-content tab-content-area hidden-md hidden-lg">
<div role="tabpanel" class="tab-pane active">
<div class="content-area">
<div class="content-area-heading main-job-hedin" style="padding: 20px 0;">
<!-- Mobile tabs html start-->
{% for jobs in show_posted_jobs %}
<!-- --edit--jobs-for---mobile--view--- -->
<div class="jobs-heading grey-tri skills-heading main-job-close main-job-close-subs">
<input type="hidden" name="edit_mobile_jobs_id"
value="{{jobs.id}}">
<h1>
{{jobs.title}}
</h1>
<p>{{jobs.select_job}}/{{jobs.job_location}}/{{jobs.created_date|date:'d.m.Y'}}/{{jobs.job_type}}</p>
<!-- <div class="triangle-div active edit-job"></div> -->
<div class="display-flex">
<div class="edit-job-btn">
<button type="submit" name="edit-mobile-button" class="btn btn-danger edit-btn edit-job edit-mob-job edit-desktop-job" data-id="{{jobs.id}}" id="edit_button_mob">edit job / project</button>
</div>
<div class="review-job-btn">
<button type="submit" name="review_app_button" class="btn btn-success review-btn deep-review-jobs" data-id={{jobs.id}}>review applications ({{jobs.review_count}})</button>
</div>
</div>
</div>
{% endfor %}
<!-- Mobile tabs html end-->
<!--Mobile Job postings start-->
<!-- --- edit-- mobile post jobs -->
{% comment %}
<div class="edit-jobpost mobile-view-edit-jobpost main-sub-menu-job-edit">
<div class="new-job-heading edit-job-heading">
<div class="mobile-edit-btn">
<h5 class="hidden-sm hidden-xs">edit job / project </h5>
<button type="submit" class="btn btn-danger edit-btn hidden-md hidden-lg" data-id="{{jobs.id}}">edit job / project</button>
</div>
</div>
<div class="new-job-bg">
<div class="new-job-description sub-menu-job-edit-desc sub-menu-job-edit-desc-clos">
<form action="{% url 'editjob' %}" method="POST" name="edit_desktop_jobs">
{% csrf_token %}
<input type="hidden" name="edit_job_id" id="job_id_edit_mobile">
<div class="form-projects">
<div class="job-title-decrip">
<label>
Job/ Project Title
</label>
<input type="text" name="edit_job_desk" required id="get_edit_mobile_title" class="form-control input-control">
</div>
<div class="job-title-decrip">
<label>
Select field of creativity
</label>
<select name="edit_select_job" id="get_mobile_optn" class="form-control input-control" data-toggle="dropdown">
{% for field_of_creativity in get_dropdwon_data %}
<option value="{{field_of_creativity.id}}">{{field_of_creativity.name}}</option>
{% endfor %}
</select>
</div>
<div class="job-title-decrip">
<label>
City / Location
</label>
<input type="text" required name="edit_location_desk" id="get_mobile_location" class="form-control input-control">
</div>
<div class="job-title-decrip ck-heading">
<label>
Job Description
</label>
<textarea id="mobile_edit_job" name="edit_desc_desk" class="form-control input-control"></textarea>
<p class="ck-editor-para">please consider adding date, time and other details like required experience or links to moodboards / inspiration</p>
</div>
<div class="row">
<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 project-div">
<div class="radio radio-button">
<label>
<input type="radio" name="radio_desk" id="paid_job_mobile" value="Paid Job" aria-label="..."style="margin-top: 3px;">
Paid Job
</label>
</div>
<div class="radio radio-button">
<label>
<input type="radio" name="radio_desk" id="free_job_mobile" value="Free Project" aria-label="..."style="margin-top: 3px;">
Free Project
</label>
</div>
</div>
</div>
<div class="checkbox-button">
<label>
<input type="checkbox" name="checkbox" id="edit_check_box" value="edited" aria-label="...">
<span>send this message to all applicants so far</span>
</label>
</div>
<div class="edit-textarea textarea-for-mobile">
<textarea name="send_msg_desk" id="send_msg_desk" cols="30" rows="3" required=""></textarea>
</div>
<div class="post-job-btn edit-btn-danger main-mobile-sub-dangr">
<button type="submit" id="submit_edit_desk" name="" class="btn btn-danger">Safe changes to this job / project (and send message)</button>
</div>
</div>
</form>
</div>
</div>
</div>
{% endcomment %}
{% if show_posted_jobs|length > 3 %}
<div class="artwork_slide_down_button">
<div align="center">
<span class="artwork_slide_down_bottom mobile-allpost-jobs" id="edit_load_mob">• • •</span>
{% include "partials/_spinner.html" %}
</div>
</div>
{% endif %}
<!--Mobile Job postings end-->
</div>
</div>
</div>
</div>
{% endif %}
</div>
<!--Desktop myjob postions tabs-->
<div class="paid-tabs-jobs">
<!-- Nav tabs -->
<ul class="nav nav-tabs nav-tabs-pills" role="tablist">
{% if job_appliers.job_type == "Paid Job" %}
<li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">Paid Jobs</a></li>
<li role="presentation" class="free-project"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">Free Projects</a></li>
{% endif %}
{% if job_appliers.job_type == "Free Project" %}
<li role="presentation" class=""><a href="#home" aria-controls="home" role="tab" data-toggle="tab">Paid Jobs</a></li>
<li role="presentation" class="free-project active"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">Free Projects</a></li>
{% endif %}
<li role="presentation" class="post-job-project post-job-desktop" id="post_job_web">
{% if request.user.is_authenticated %}
<a href="#profile" aria-controls="profile" role="tab" class="post-job hidden-xs visible-sm visible-md visible-lg">post a job / project</a>
{% else %}
<a href="/login" aria-controls="profile" role="tab" class="post-job hidden-xs visible-sm visible-md visible-lg">post a job / project</a>
{% endif %}
</li>
<li role="presentation" class="post-job-project post-job-mobile" id="add_job_mobile">
{% if request.user.is_authenticated %}
<a href="#profile" aria-controls="profile" role="tab" class="post-job visible-xs hidden-sm hidden-md hidden-lg">add job </a>
{% else %}
<a href="/login" aria-controls="profile" role="tab" class="post-job visible-xs hidden-sm hidden-md hidden-lg"> add job </a>
{% endif %}
</li>
</ul>
<!-- Tab panes -->
<div class="tab-content tab-content-area">
<div role="tabpanel" class="tab-pane {% if job_appliers.job_type == 'Paid Job' %} active {% endif %}" id="home">
<div class="content-area">
<div class="menu-item text-right">
{% if request.user.is_authenticated %}
<ul>
<li><a href="{% url 'allskills' %}">all Skills</a></li>
<li class="skills-links my-skills-desktop"><a href="{% url 'myskill' %}" data-id="{{request.user.id}}" id="my_skills_only">my Skills only</a></li>
</ul>
{% endif %}
</div>
<div class="content-area-heading job-list mobile-job-list" style="padding-bottom: 5px;">
<!-- Desktop tabs html start-->
<!-- paid jobs desktop -->
{% for jobs in all_posted_jobs %}
{% if jobs.job_type == "Paid Job" %}
<div class="heading-para show-all-jobs grey-tri-main hidden-xs view-post-job close_main {% if jobs.id == convert_job_id %} active {% endif %} deep-comn-view" data-id="{{jobs.id}}" id="current{{jobs.id}}">
<h1>
{{jobs.title}}
</h1>
<p class="desktop-paid-para">{{jobs.select_job}}/{{jobs.job_location}}/{{jobs.created_date|date:'d.m.Y'}}/{{jobs.job_type}}</p>
<div class="triangle-div" id="curr{{jobs.id}}" style="{% if jobs.id == convert_job_id %} display: block; {% endif %}"></div>
</div>
{% endif %}
{% endfor %}
{% if get_paid_count > 10 %}
<div class="artwork_slide_down_button">
<div align="center">
<span class="artwork_slide_down_bottom see_posted_job" id="load_paid_desk">• • •</span>
{% include "partials/_spinner.html" %}
</div>
</div>
{% endif %}
<!-- Desktop tabs html end-->
<!-- Mobile tabs html start-->
<!-- Nav tabs -->
<!-- paid jobs mobile -->
<div class="main-resp-section">
{% for jobs in all_posted_jobs %}
{% if jobs.job_type == "Paid Job" %}
<ul class="nav mobile-view-tabs-heading interview_post_name apply-job-mobile-paid list-paid-mob close-paid-job-mob" role="tablist" data-id="{{jobs.id}}">
<li role="presentation" data-id="{{jobs.id}}" class="check-hide apply-job-mobile interview_post_name_li">
<a href="#interview_post{{jobs.id}}" aria-controls="home" role="tab" data-toggle="tab">
<h1>
{{jobs.title}}
</h1>
<p>
{{jobs.select_job}}/{{jobs.job_location}}/{{jobs.created_date|date:'d.m.Y'}}/{{jobs.job_type}}
</p>
</a>
<div class="mobile-second-tirangle-div" style="{% if jobs.id == convert_job_id %} display: block; {% endif %}"></div>
</li>
<!-- Tab panes -->
<div class="tab tab-content mobile-tabs hidden-md hidden-lg">
<div role="tabpanel" class="tab-pane tabs-pills" id="interview_post{{jobs.id}}" style="{% if jobs.id == convert_job_id %} display: block; {% endif %}">
<div class="mobile-tabs-view hidden-lg hidden-md active">
<div class="flex-icons-data">
<div class="person-icon">
{% if jobs.user.profile_picture %}
<a href="/profile/{{jobs.user.id}}">
<img class="img-responsive single-img" src="
{% if not jobs.user.socialaccount_set.all.0.get_avatar_url %}
{% if jobs.user.profile_thumbnail %}
{{ jobs.user.profile_thumbnail.url }}
{% else %}
{% static 'images/person.jpg' %}
{% endif %}
{% endif %}"
data-gallery-src="{% if not jobs.user.socialaccount_set.all.0.get_avatar_url %}
{% if jobs.user.profile_thumbnail %}
{{ jobs.user.profile_thumbnail.url }}
{% else %}
{% static 'images/person.jpg' %}
{% endif %}
{% endif %}">
{% endif %}
{% if not jobs.user.profile_picture %}
<img src="{% static 'images/person.jpg' %}">
{% endif %}
</a>
</div>
<div class="new-project-heading">
<a href="/profile/{{jobs.user.id}}">
<h1>{{ jobs.user.get_full_name }}</h1>
</a>
<p>
{% if request.user.is_authenticated %}
{% if jobs.user.get_user_expertises_comma %}
{{jobs.user.get_user_expertises_comma}}
{% else %} None {% endif %}
-
{% if jobs.user.city %}
{{jobs.user.city}}
{% else %} City
{% endif %}
{% endif %}
</p>
</div>
</div>
<!-- Apply for job Mobile View -->
<div class="form-projects">
<div class="heading-para apply-job-heading">
<div class="heading_share">
<h1>
{{jobs.title}}
</h1>
<a class="btn btn-info btn-lg user_url_modal_btn share-button" data-url="{% if is_secure %}https://{% else %}http://{% endif %}{{ request.get_host }}/jobs/{{jobs.id}}" title="Share"><img src="{% static 'images/share.png' %}"></a>
</div>
</div>
<div class="edit-post-para">
<p>{{jobs.select_job}}/{{jobs.job_location}}/{{jobs.created_date|date:'d.m.Y'}}/{{jobs.job_type}}
</p>
<p>{{jobs.job_description|safe}}</p>
</div>
<div class="edit-apply-job">
<div class="apply-content">apply for this job</div>
<div class="border-bottom"></div>
</div>
{% if not request.user.is_authenticated %}
<div style="margin-left: 12px;">
<div class="">
<div class="row">
<div class="col-xs-3">
<h2 class="guest-heading">
Guest
</h2>
</div>
<div class="col-xs-9">
<div style="margin: 24px 0px;">
<div class="guest-btns">
{% get_providers as socialaccount_providers %}
{% if socialaccount_providers %}
<a class="fb-btn" href="javascript:allauth.facebook.login('', 'authenticate', 'login')"><i class="fa fa-facebook" aria-hidden="true"></i>
<div class="login-btn">Log in</div>
</a>
{% include "socialaccount/snippets/login_extra.html" %}
{% endif %}
<a class="email-btn" href="/login">
<i class="fa fa-envelope-o" aria-hidden="true"></i>
<div class="login-btn">Log in</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
{% endif %}
<div class="flex-icons-data">
<div class="person-icon">
{% if request.user.is_authenticated %}
{% for image in get_current_user_pic %}
{% if image.profile_picture %}
<img src="{{ image.profile_picture|thumbnail_url:'artwork_cover_tiny' }}" style="height: 50px; width: 50px">
{% else %}
<img src="{% static 'images/icons/person.jpg' %}" alt="person-icon">
{% endif %}
{% endfor %}
{% else %}
<img src="{% static 'images/icons/person.jpg' %}" alt="person-icon">
{% endif %}
</div>
<div class="new-project-heading apply-heading">
<h1>
{% if request.user.is_authenticated %}
{{ user.get_full_name }}
{% else %} Guest
{% endif %}
</h1>
<p>
{% if request.user.is_authenticated %}
{% if request.user.get_user_expertises_comma %}
{{request.user.get_user_expertises_comma}}
{% else %} None {% endif %}
-
{% if request.user.city %}
{{request.user.city}}
{% else %} City
{% endif %}
{% endif %}
</p>
</div>
</div>
<form action="{% url 'applyjob' %}" name="apply_job_form" method="post" class="three-artworks remove-value-mob-{{jobs.id}}">
{% csrf_token %}
<label class="selected-artworks" for="">select 3 Artworks that refer to the Job description</label>
<input type="hidden" name="single_job" value="{{jobs.id}}">
<div class="row">
<div class="container">
<div class="edit-img-selector">
<!-- First art work for mobile -->
<div class="col-xs-4 col-sm-4"style="padding: 0;">
<img src="{% static 'images/group-7.png' %}" class="img-responsive reset_artwork_mobile" alt="group-7.png" name="clear_artwork_data" id="reset_artwork-{{jobs.id}}-4" data-number="4" data-job_id="{{jobs.id}}" style="display: none;">
<img src="{% static 'images/artwork_default_cover.png' %}" class="img-responsive artwork-{{jobs.id}}-4 rect-img" alt="artwork_default_cover" data-toggle="modal" data-target="#model_drop-{{jobs.id}}-1" id="art-{{jobs.id}}-4">
</div>
<div class="modal fade remove-over" id="model_drop-{{jobs.id}}-1" role="dialog" data-background="false" data-keyboard="false">
<!-- Modal--->
<div class="modal-dialog paid-img-dropdown">
<!-- Modal content-->
<div class="modal-content" style="background: #4a4a4a; border-radius: 0;width: 85%; margin: auto;">
<div class="modal-body" style="font-family: SFUIDisplay-Ultralight;font-size: 20px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: 1px; color: #fff;">
<select name="select_job_desk[]" data-job_id="{{jobs.id}}" id="artwork-{{jobs.id}}-4" data-number="4" class="common-img-cls-mob moibile_select moibile-select-{{jobs.id}} artwork-{{jobs.id}}-s" style="width: 100%; background: #4a4a4a url(/static/images/bottom.png) no-repeat;
background-size: 24px;
background-position: 97% center; box-shadow: none;
-webkit-appearance: none; -moz-appearance: none; appearance: none;">
<option selected value="" id="clear_artwork-{{jobs.id}}-4"> --- select your artwork --- </option>
{% for get_artwork in user.allArtworks %}
<option value="{{get_artwork.id}}">{{get_artwork.artwork_name}}</option>
{% endfor %}
</select>
</div>
</div>
</div>
</div>
<!-- End First art work for mobile -->
<!-- Second art work for mobile -->
<div class="col-xs-4 col-sm-4"style="padding: 0;">
<img src="{% static 'images/group-7.png' %}" class="img-responsive reset_artwork_mobile" alt="group-7.png" name="clear_artwork_data" id="reset_artwork-{{jobs.id}}-5" data-number="5" data-job_id="{{jobs.id}}" style="display: none;">
<img src="{% static 'images/artwork_default_cover.png' %}" class="img-responsive artwork-{{jobs.id}}-5 rect-img" alt="artwork_default_cover" data-toggle="modal" data-target="#model_drop-{{jobs.id}}-2" id="art-{{jobs.id}}-5">
</div>
<div class="modal fade remove-over" id="model_drop-{{jobs.id}}-2" role="dialog" data-background="false">
<!-- Modal--->
<div class="modal-dialog paid-img-dropdown">
<!-- Modal content-->
<div class="modal-content" style="background: #4a4a4a; border-radius: 0;width: 85%; margin: auto;">
<div class="modal-body" style="font-family: SFUIDisplay-Ultralight;font-size: 20px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: 1px; color: #fff;">
<select name="select_job_desk[]" data-job_id="{{jobs.id}}" id="artwork-{{jobs.id}}-5" data-number="5" class="common-img-cls-mob moibile-select-{{jobs.id}} moibile_select artwork-{{jobs.id}}-s" style="width: 100%; background: #4a4a4a url(/static/images/bottom.png) no-repeat;
background-size: 24px;
background-position: 97% center; box-shadow: none;
-webkit-appearance: none; -moz-appearance: none; appearance: none;">
<option selected value="" id="clear_artwork-{{jobs.id}}-5"> --- select your artwork --- </option>
{% for get_artwork in user.allArtworks %}
<option value="{{get_artwork.id}}">{{get_artwork.artwork_name}}</option>
{% endfor %}
</select>
</div>
</div>
</div>
</div>
<!-- End Second art work for mobile -->
<!-- Third art work for mobile -->
<div class="col-xs-4 col-sm-4"style="padding: 0;">
<img src="{% static 'images/group-7.png' %}" class="img-responsive reset_artwork_mobile" alt="group-7.png" name="clear_artwork_data" id="reset_artwork-{{jobs.id}}-6" data-number="6" data-job_id="{{jobs.id}}" style="display: none;">
<img src="{% static 'images/artwork_default_cover.png' %}" class="img-responsive artwork-{{jobs.id}}-6 rect-img" alt="artwork_default_cover" data-toggle="modal" data-target="#model_drop-{{jobs.id}}-3" id="art-{{jobs.id}}-6">
</div>
<div class="modal fade remove-over" id="model_drop-{{jobs.id}}-3" role="dialog" data-background="false">
<!-- Modal--->
<div class="modal-dialog paid-img-dropdown">
<!-- Modal content-->
<div class="modal-content" style="background: #4a4a4a; border-radius: 0;width: 85%; margin: auto;">
<div class="modal-body" style="font-family: SFUIDisplay-Ultralight;font-size: 20px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: 1px; color: #fff;">
<select name="select_job_desk[]" data-job_id="{{jobs.id}}" id="artwork-{{jobs.id}}-6" data-number="6" class=" common-img-cls-mob moibile-select-{{jobs.id}} moibile_select artwork-{{jobs.id}}-s" style="width: 100%; background: #4a4a4a url(/static/images/bottom.png) no-repeat;
background-size: 24px;
background-position: 97% center; box-shadow: none;
-webkit-appearance: none; -moz-appearance: none; appearance: none;">
<option selected value="" id="clear_artwork-{{jobs.id}}-6"> --- select your artwork --- </option>
{% for get_artwork in user.allArtworks %}
<option value="{{get_artwork.id}}">{{get_artwork.artwork_name}}</option>
{% endfor %}
</select>
</div>
</div>
</div>
</div>
<!-- End of Third art work for mobile -->
</div>
</div>
</div>
<div class="edit-artworks-textarea">
<label for="">application text</label><br>
<textarea name="app_text_desk" id="app_text_mob" required cols="76" rows="2"></textarea>
<label for="">…please add something - ideas?</label>
</div>
<div class="row">
<div class="apply-daily-rates">
{% if not request.user.is_authenticated %}
<div class="col-xs-6 col-sm-6 col-md-8 col-lg-8" style="margin-bottom: 8px;">
<label for="">email address</label><br>
<div class="artwork-input">
<input type="text" class="form-control" id="free_guest_mail" name="guest_email" required>
</div>
</div>
{% endif %}
<div class="main-daily-section">
<div class="col-xs-6 col-sm-6 col-md-8 col-lg-8" style="margin-bottom: 8px;">
<label for="">your daily rate</label><br>
<div class="artwork-input">
<input type="text" class="form-control" name="daily_rate_desk" required maxlength="20">
</div>
</div>
<div class="col-xs-6 col-sm-6 col-md-4 col-lg-4">
<div class="post-job-btn">
<button type="submit" name="" class="btn btn-success">Send Application</button>
</div>
</div>
</div>
{% if request.user.is_authenticated %}
<div class="email_content_desk">
<label class="check_it"><input type="checkbox" checked name="allow_email_paid" class="allow_email_paid"><span class="copy_text">send a copy of my job / project application </span><span class="checkmark"></span></label>
</div>
{% endif %}
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</ul>
{% endif %}
{% endfor %}
</div>
{% if get_paid_count > 10 %}
<div class="artwork_slide_down_button">
<div align="center">
<span class="artwork_slide_down_bottom load-more-paid-mobile" id="mobile_paid_load">• • •</span>
{% include "partials/_spinner.html" %}
</div>
</div>
{% endif %}
</div>
</div>
</div>
<!-- hide free job list -->
<!-- list end here -->
<div role="tabpanel" class="tab-pane {% if job_appliers.job_type == 'Free Project' %} active {% endif %}" id="profile">
<div class="content-area">
<div class="">
<div class="content-area">
<div class="menu-item text-right">
{% if request.user.is_authenticated %}
<ul>
<li><a href="{% url 'allskills' %}">all Skills</a></li>
<li class="skills-links my-skills-desktop"><a href="{% url 'myskill' %}" data-id="{{request.user.id}}" id="my_skills_only">my Skills only</a></li>
</ul>
{% endif %}
</div>
<div class="content-area-heading free-list-jobs jobs-sublist" style="padding-top: 30px; padding-bottom: 5px;">
<!-- Desktop tabs html start-->
<!-- Free Jobs Desktop here -->
{% for jobs in all_posted_jobs %}
{% if jobs.job_type == "Free Project" %}
<div class="heading-para grey-tri show-free-jobs view-post-job load-free-jobs-desk hide-jobs close-free-job{% if jobs.id == convert_job_id %}active{% endif %} deep-comn-view" data-id="{{jobs.id}}" id="current{{jobs.id}}">
<h1>
{{jobs.title}}
</h1>
<p class="desktop-paid-para">{{jobs.select_job}} / {{jobs.job_location}} / {{jobs.created_date|date:'d.m.Y'}} / {{jobs.job_type}}</p>
<div class="triangle-div" id="curr{{jobs.id}}" style="{% if jobs.id == convert_job_id %} display: block; {% endif %}"></div>
</div>
{% endif %}
{% endfor %}
{% if get_free_count > 10 %}
<div class="artwork_slide_down_button">
<div align="center">
<span class="artwork_slide_down_bottom load-more-free-job-mobile load-more-once hidden-xs hidden-sm visible-md visible-lg" id="load_free_desk">• • •</span>
{% include "partials/_spinner.html" %}
</div>
</div>
{% endif %}
<!-- Desktop tabs html end-->
<!--Mobile free project start-->
<!-- Nav tabs -->
<div class="frre-main-sub">
{% for jobs in all_posted_jobs %}
{% if jobs.job_type == "Free Project" %}
<ul class="nav mobile-view-tabs-heading test_class free_interview_post_name new-mob-min-sub close-mob-main-sec close-free-job" role="tablist" data-id="{{jobs.id}}">
<li role="presentation" data-id="{{jobs.id}}" class="check-hide apply-job-mobile free_interview_post_name_li">
<a href="#interview_post{{jobs.id}}" aria-controls="home" role="tab" data-toggle="tab">
<h1>
{{jobs.title}}
</h1>
<p>
{{jobs.select_job}}/{{jobs.job_location}}/{{jobs.created_date|date:'d.m.Y'}}/{{jobs.job_type}}
</p>
</a>
<div class="mobile-second-tirangle-div" style="{% if jobs.id == convert_job_id %} display: block; {% endif %}"></div>
</li>
<!-- Tab panes -->
<div class="tab tab-content mobile-tabs hidden-md hidden-lg">
<div role="tabpanel" class="tab-pane tabs-pills" id="interview_post{{jobs.id}}" style="{% if jobs.id == convert_job_id %} display: block; {% endif %}">
<div class="mobile-tabs-view hidden-lg hidden-md active">
<div role="tabpanel" class="tab-pane tabs-pills" id="free_interview_post">
<div class="mobile-tabs-view free_mobile_tabs_view hidden-lg hidden-md active">
<div class="flex-icons-data">
<div class="person-icon">
{% if jobs.user.profile_picture %}
<a href="/profile/{{jobs.user.id}}">
<img class="img-responsive single-img" src="
{% if not jobs.user.socialaccount_set.all.0.get_avatar_url %}
{% if jobs.user.profile_thumbnail %}
{{ jobs.user.profile_thumbnail.url }}
{% else %}
{% static 'images/person.jpg' %}
{% endif %}
{% endif %}"
data-gallery-src="{% if not jobs.user.socialaccount_set.all.0.get_avatar_url %}
{% if jobs.user.profile_thumbnail %}
{{ jobs.user.profile_thumbnail.url }}
{% else %}
{% static 'images/person.jpg' %}
{% endif %}
{% else %}
{{ jobs.user.socialaccount_set.all.0.get_avatar_url }}
{% endif %}">
{% endif %}
{% if not jobs.user.profile_picture %}
<img src="{% static 'images/person.jpg' %}"
>
{% endif %}
</a>
</div>
<div class="new-project-heading">
<a href="/profile/{{jobs.user.id}}">
<h1 id="">
{{ jobs.user.get_full_name }}
</h1>
</a>
<p>
{% if request.user.is_authenticated %}
{% if jobs.user.get_user_expertises_comma %}
{{jobs.user.get_user_expertises_comma}}
{% else %} None {% endif %}
-
{% if jobs.user.city %}
{{jobs.user.city}}
{% else %} City
{% endif %}
{% endif %}
</p>
</div>
</div>
<!-- Apply for job Mobile View -->
<div class="form-projects">
<div class="heading-para apply-job-heading">
<div class="heading_share">
<h1>
{{jobs.title}}
</h1>
<a class="btn btn-info btn-lg user_url_modal_btn share-button" data-url="{% if is_secure %}https://{% else %}http://{% endif %}{{ request.get_host }}/jobs/{{jobs.id}}" title="Share"><img src="{% static 'images/share.png' %}"></a>
</div>
</div>
<div class="edit-post-para">
<p>
{{jobs.select_job}}/{{jobs.job_location}}/{{jobs.created_date|date:'d.m.Y'}}/{{jobs.job_type}}
</p>
<p>{{jobs.job_description|safe}}</p>
</div>
<div class="edit-apply-job">
<div class="apply-content">apply for this job</div>
<div class="border-bottom"></div>
</div>
{% if not request.user.is_authenticated %}
<div style="margin-left: 12px;">
<div class="">
<div class="row">
<div class="col-xs-3">
<h2 class="guest-heading">
Guest
</h2>
</div>
<div class="col-xs-9">
<div style="margin: 24px 0px;">
<div class="guest-btns">
{% get_providers as socialaccount_providers %}
{% if socialaccount_providers %}
<a class="fb-btn" href="javascript:allauth.facebook.login('', 'authenticate', 'login')"><i class="fa fa-facebook" aria-hidden="true"></i>
<div class="login-btn">Log in</div>
</a>
{% include "socialaccount/snippets/login_extra.html" %}
{% endif %}
<a class="email-btn" href="/login">
<i class="fa fa-envelope-o" aria-hidden="true"></i>
<div class="login-btn">Log in</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
{% endif %}
<div class="flex-icons-data">
<div class="person-icon">
{% if request.user.is_authenticated %}
{% for image in get_current_user_pic %}
{% if image.profile_picture %}
<img src="{{ image.profile_picture|thumbnail_url:'artwork_cover_tiny' }}" style="height: 50px; width: 50px">
{% else %}
<img src="{% static 'images/icons/person.jpg' %}" alt="person-icon">
{% endif %}
{% endfor %}
{% else %}
<img src="{% static 'images/icons/person.jpg' %}" alt="person-icon">
{% endif %}
</div>
<div class="new-project-heading apply-heading">
<h1>
{% if request.user.is_authenticated %}
{{ user.get_full_name }}
{% else%} Guest
{% endif %}
</h1>
<p>
{% if request.user.is_authenticated %}
{% if request.user.get_user_expertises_comma %}
{{request.user.get_user_expertises_comma}}
{% else %} None {% endif %}
-
{% if request.user.city %}
{{request.user.city}}
{% else %} City {% endif %}
{% endif %}
</p>
</div>
</div>
<form action="{% url 'applyjob' %}" name="apply_job_form" method="post" class="three-artworks">
{% csrf_token %}
<label class="selected-artworks" for="">select 3 Artworks that refer to the Job description</label>
<input type="hidden" name="single_job" value="{{jobs.id}}">
<div class="row">
<div class="container">
<div class="edit-img-selector">
<!-- First art work for mobile free -->
<div class="col-xs-4 col-sm-4"style="padding: 0;">
<img src="{% static 'images/group-7.png' %}" class="img-responsive reset_artwork_mobile" alt="group-7.png" name="clear_artwork_data" id="reset_artwork-{{jobs.id}}-7" data-number="7" data-job_id="{{jobs.id}}" style="display: none;">
<img src="{% static 'images/artwork_default_cover.png' %}" class="img-responsive artwork-{{jobs.id}}-7 rect-img" alt="artwork_default_cover" data-toggle="modal" data-target="#model_drop-{{jobs.id}}-4" id="art-{{jobs.id}}-7">
</div>
<div class="modal fade remove-over" id="model_drop-{{jobs.id}}-4" role="dialog" data-background="false">
<!-- Modal--->
<div class="modal-dialog paid-img-dropdown">
<!-- Modal content-->
<div class="modal-content" style="background: #4a4a4a; border-radius: 0;width: 85%; margin: auto;">
<div class="modal-body" style="font-family: SFUIDisplay-Ultralight;font-size: 20px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: 1px; color: #fff;">
<select name="select_job_desk[]" data-job_id="{{jobs.id}}" id="artwork-{{jobs.id}}-7" data-number="7" class=" common-img-cls-mob moibile-select-{{jobs.id}} moibile_select artwork-{{jobs.id}}-s" style="width: 100%; background: #4a4a4a url(/static/images/bottom.png) no-repeat;
background-size: 24px;
background-position: 97% center; box-shadow: none;
-webkit-appearance: none; -moz-appearance: none; appearance: none;">
<option selected value="" id="clear_artwork-{{jobs.id}}-7"> --- select your artwork --- </option>
{% for get_artwork in user.allArtworks %}
<option value="{{get_artwork.id}}">{{get_artwork.artwork_name}}</option>
{% endfor %}
</select>
</div>
</div>
</div>
</div>
<!-- End First art work for mobile free -->
<!-- Second art work for mobile free -->
<div class="col-xs-4 col-sm-4"style="padding: 0;">
<img src="{% static 'images/group-7.png' %}" class="img-responsive reset_artwork_mobile" alt="group-7.png" name="clear_artwork_data" id="reset_artwork-{{jobs.id}}-8" data-number="8" data-job_id="{{jobs.id}}" style="display: none;">
<img src="{% static 'images/artwork_default_cover.png' %}" class="img-responsive artwork-{{jobs.id}}-8 rect-img" alt="artwork_default_cover" data-toggle="modal" data-target="#model_drop-{{jobs.id}}-5" id="art-{{jobs.id}}-8">
</div>
<div class="modal fade remove-over" id="model_drop-{{jobs.id}}-5" role="dialog" data-background="false">
<!-- Modal--->
<div class="modal-dialog paid-img-dropdown">
<!-- Modal content-->
<div class="modal-content" style="background: #4a4a4a; border-radius: 0;width: 85%; margin: auto;">
<div class="modal-body" style="font-family: SFUIDisplay-Ultralight;font-size: 20px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: 1px; color: #fff;">
<select name="select_job_desk[]" data-job_id="{{jobs.id}}" id="artwork-{{jobs.id}}-8" data-number="8" class=" common-img-cls-mob moibile-select-{{jobs.id}} moibile_select artwork-{{jobs.id}}-s" style="width: 100%; background: #4a4a4a url(/static/images/bottom.png) no-repeat;
background-size: 24px;
background-position: 97% center; box-shadow: none;
-webkit-appearance: none; -moz-appearance: none; appearance: none;">
<option selected value="" id="clear_artwork-{{jobs.id}}-8"> --- select your artwork --- </option>
{% for get_artwork in user.allArtworks %}
<option value="{{get_artwork.id}}">{{get_artwork.artwork_name}}</option>
{% endfor %}
</select>
</div>
</div>
</div>
</div>
<!-- End Second art work for mobile -->
<!-- Third art work for mobile free -->
<div class="col-xs-4 col-sm-4"style="padding: 0;">
<img src="{% static 'images/group-7.png' %}" class="img-responsive reset_artwork_mobile" alt="group-7.png" name="clear_artwork_data" id="reset_artwork-{{jobs.id}}-9" data-number="9" data-job_id="{{jobs.id}}" style="display: none;">
<img src="{% static 'images/artwork_default_cover.png' %}" class="img-responsive artwork-{{jobs.id}}-9 rect-img" alt="artwork_default_cover" data-toggle="modal" data-target="#model_drop-{{jobs.id}}-6" id="art-{{jobs.id}}-9">
</div>
<div class="modal fade remove-over" id="model_drop-{{jobs.id}}-6" role="dialog" data-background="false">
<!-- Modal--->
<div class="modal-dialog paid-img-dropdown">
<!-- Modal content-->
<div class="modal-content" style="background: #4a4a4a; border-radius: 0;width: 85%; margin: auto;">
<div class="modal-body" style="font-family: SFUIDisplay-Ultralight;font-size: 20px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: 1px; color: #fff;">
<select name="select_job_desk[]" data-job_id="{{jobs.id}}" id="artwork-{{jobs.id}}-9" data-number="9" class=" common-img-cls-mob moibile-select-{{jobs.id}} moibile_select artwork-{{jobs.id}}-s" style="width: 100%; background: #4a4a4a url(/static/images/bottom.png) no-repeat;
background-size: 24px;
background-position: 97% center; box-shadow: none;
-webkit-appearance: none; -moz-appearance: none; appearance: none;">
<option selected value="" id="clear_artwork-{{jobs.id}}-9"> --- select your artwork --- </option>
{% for get_artwork in user.allArtworks %}
<option value="{{get_artwork.id}}">{{get_artwork.artwork_name}}</option>
{% endfor %}
</select>
</div>
</div>
</div>
</div>
<!-- End Third art work for mobile -->
</div>
</div>
</div>
<div class="edit-artworks-textarea">
<label for="">application text</label><br>
<textarea name="app_text_desk" id="app_text_mob" required cols="76" rows="2"></textarea>
<label for="">…please add something - ideas?</label>
</div>
<div class="row">
<div class="apply-daily-rates">
{% if not request.user.is_authenticated %}
<div class="col-xs-6 col-sm-6 col-md-8 col-lg-8" style="margin-bottom: 8px;">
<label for="">email address</label><br>
<div class="artwork-input">
<input type="text" class="form-control" id="free_guest_mail" name="guest_email" required>
</div>
</div>
{% endif %}
<div class="col-xs-6 col-sm-6 col-md-4 col-lg-4">
<div class="post-job-btn">
<button type="submit" name="" class="btn btn-success">Send Application</button>
</div>
</div>
{% if request.user.is_authenticated %}
<div class="email_content_desk">
<label class="check_it"><input type="checkbox" checked name="allow_email_free" class="allow_email_free"><span class="copy_text">send a copy of my job / project application </span><span class="checkmark"></span></label>
</div>
{% endif %}
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</ul>
{% endif %}
{% endfor %}
</div>
<!--Mobile free project start-->
{% if get_free_count > 10 %}
<div class="artwork_slide_down_button">
<div align="center">
<span class="artwork_slide_down_bottom load-more-free-job-mobile load-more-once visible-xs hidden-sm hidden-md hidden-lg" id="load_free_mob">• • •</span>
{% include "partials/_spinner.html" %}
</div>
</div>
{% endif %}
</div>
</div>
</div>
<!-- Mobile free project end -->
</div>
</div>
<!-- hide paid job list -->
<!-- hide paid job list end here -->
</div>
</div>
</div>
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 new-project-editor main-editor-sub">
<div class="new-jobs new-job-bg-close">
<div class="new-job-heading">
<h5>new job / project</h5>
<div class="newjob-close-icon">
<img src="{% static 'images/close-icon-black.png' %}" class="img-responsive" alt="close-icon-black">
</div>
</div>
<div class="new-job-bg new-project">
<div class="new-job-description ">
<div class="flex-icons-data">
<div class="person-icon">
{% for image in get_current_user_pic %}
{% if image.profile_picture %}
<img src="{{ image.profile_picture|thumbnail_url:'artwork_cover_tiny' }}" style="height: 50px; width: 50px">
{% else %}
<img src="{% static 'images/icons/person.jpg' %}" alt="person-icon">
{% endif %}
{% endfor %}
</div>
<div class="new-project-heading">
<h1>
{% if request.user.is_authenticated %}
{{ request.user.get_full_name }}
</h1>
<p>
{% if request.user.is_authenticated %}
{% if request.user.get_user_expertises_comma %}
{{request.user.get_user_expertises_comma}}
{% else %} None {% endif %}
-
{% if request.user.city %}
{{request.user.city}}
{% else %} City {% endif %}
{% endif %}
{% endif %}
</p>
</div>
</div>
<form action="{% url 'post_jobs' %}" method="post" name="new_job_post" id="new_job_post">
{% csrf_token %}
<div class="form-projects">
<div class="job-title-decrip">
<label>
Job/ Project Title
</label>
<input type="text" name="job_title" required id="job_title" class="form-control input-control" placeholder="Name / Title of Job">
</div>
<div class="job-title-decrip">
<label>
Select field of creativity
</label>
<select name="select_job" class="form-control input-control">
{% for field_of_creativity in get_dropdwon_data %}
<option class="creativity-dropdown" value="{{field_of_creativity.id}}">
{{field_of_creativity.name}}
</option>
{% endfor %}
</select>
</div>
<div class="job-title-decrip">
<label>
City / Location
</label>
<input type="text" required name="location" id="job_location" class="form-control input-control" placeholder="City / Location">
</div>
<div class="job-title-decrip ck-heading">
<label>
Job Description
</label>
<textarea id="job_desc" name="job_desc" class="form-control input-control"></textarea>
<p>please consider adding date, time and other details like required experience or links to moodboards / inspiration</p>
</div>
<div class="row">
<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 project-div">
<div class="radio radio-button">
<label>
<input type="radio" name="radio" id="paid_job" value="Paid Job" aria-label="..."style="margin-top: 3px;">
Paid Job
</label>
</div>
<div class="radio radio-button">
<label>
<input type="radio" name="radio" id="free_job" value="Free Project" aria-label="..."style="margin-top: 3px;" checked>
Free Project
</label>
</div>
</div>
<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6 text-right">
<div class="post-job-btn">
<button type="submit" name="" class="btn btn-success">Post Job / Project</button>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<!--Job postings start-->
<!-- Edit job pop up -->
<div class="edit-jobpost edit-job-bg-close sub-main-job" style="{% if request.user.id == job_appliers.user.id %} display: block; {% else %} display: none; {% endif %}" data-id="{{job_appliers.id}}">
<div class="new-job-heading edit-job-heading">
<h5>edit job / project </h5>
<div class="edit-close-icon">
<img src="/static/images/close-icon.png" class="img-responsive" alt="close-icon">
</div>
</div>
<div class="new-job-bg">
<div class="new-job-description new-job-desc-close new-job-dv-close">
<div class="flex-icons-data">
<div class="person-icon">
{% if request.user.profile_picture %}
<img class="img-responsive single-img" src="
{% if not request.user.socialaccount_set.all.0.get_avatar_url %}
{% if request.user.profile_thumbnail %}
{{ request.user.profile_thumbnail.url }}
{% else %}
{% static 'images/person.jpg' %}
{% endif %}
{% endif %}">
{% endif %}
{% if not request.user.profile_picture %}
<img src="{% static 'images/person.jpg' %}">
{% endif %}
</div>
<div class="new-project-heading">
<h1>
{% if request.user.is_authenticated %}
{{ request.user.get_full_name }}
</h1>
<p>
{% if request.user.is_authenticated %}
{% if request.user.get_user_expertises_comma %}
{{request.user.get_user_expertises_comma}}
{% else %} None {% endif %}
-
{% if request.user.city %}
{{request.user.city}}
{% else %} City {% endif %}
{% endif %}
{% endif %}
</p>
</div>
</div>
<!-- edit form desktop -->
<form action="{% url 'editjob' %}" method="POST" name="edit_desktop_jobs">
{% csrf_token %}
<input type="hidden" name="edit_job_id" id="job_id_edit">
<div class="form-projects">
<div class="job-title-decrip">
<label>
Job/ Project Title
</label>
<input type="text" name="edit_job_desk" required class="form-control input-control" id="get_edit_desktop_title">
</div>
<div class="job-title-decrip">
<label>
Select field of creativity
</label>
<select id="get_desktop_optn" name="edit_select_job" class="form-control input-control" data-toggle="dropdown">
{% for field_of_creativity in get_dropdwon_data %}
<option class="creativity-dropdown" value="{{field_of_creativity.id}}">{{field_of_creativity.name}}</option>
{% endfor %}
</select>
</div>
<div class="job-title-decrip">
<label>
City / Location
</label>
<input type="text" required name="edit_location_desk" id="get_desktop_location" class="form-control input-control">
</div>
<div class="job-title-decrip ck-heading">
<label>
Job Description
</label>
<textarea id="edit_job" name="edit_desc_desk" class="form-control input-control"></textarea>
<p>please consider adding date, time and other details like required experience or links to moodboards / inspiration</p>
</div>
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
<div class="radio radio-button">
<label>
<input type="radio" name="radio_desk" id="paid_job_desktop" value="Paid Job" aria-label="..."style="margin-top: 7px;">
Paid Job
</label>
</div>
<div class="radio radio-button">
<label>
<input type="radio" name="radio_desk" id="free_job_desktop" value="Free Project" aria-label="..."style="margin-top: 6px;">
Free Project
</label>
</div>
<div class="checkbox-button">
<label>
<input type="checkbox" name="checkbox" id="edit_check_box" value="edited" aria-label="...">
<span>send this message to all applicants so far</span>
</label>
</div>
<div class="edit-textarea">
<textarea name="send_msg_desk" id="send_msg_desk" cols="30" rows="3"></textarea>
</div>
<div class="post-job-btn edit-btn-danger">
<button type="submit" id="submit_edit_desk" name="" class="btn btn-danger">Safe changes to this job / project (and send message)</button>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<!-- Edit job pop up end here -->
<!-- Review Job applications start here -->
<div class="review-jobpost review-job-bg-close" id="render_data">
<!-- Render to review_applications html -->
</div>
<!--- Review Job applications end here-->
<!-- Apply job pop up for first time -->
<div class="new-job-bg edit-post-popup new-post-close-icon hidden-xs show-all-jobs" style=" {% if request.user.id == job_appliers.user.id %} display: none; {% else %} display: block; {% endif %}">
<div class="post-close-icon">
<img src="{% static 'images/close-icon.png' %}" class="img-responsive" alt="close-icon">
</div>
<div class="new-job-description new-close-descrip single-new-post" id="reset_data">
<div class="flex-icons-data">
<div class="person-icon" id="link_to_profile">
{% if final_profile_pic %}
<a href="/profile/{{job_appliers.user.id}}">
<img src="{{final_profile_pic}}" style="height: 49px; width: 49px">
</a>
{% endif %}
</div>
<div class="new-project-heading" id="link_with_name">
<a href="/profile/{{job_appliers.user.id}}">
<h1>
{{job_appliers.user.get_full_name}}
</h1>
</a>
{% if job_appliers.user.get_user_expertises_comma %}
<p>
{{job_appliers.user.get_user_expertises_comma}}
-
{{job_appliers.user.city}}
</p>
{% endif %}
</div>
</div>
<div class="form-projects">
<div class="heading-para" style="padding-bottom: 7px;">
<div class="heading_share">
<h1 id="apply_job_head">
{{job_appliers.title}}
</h1>
<div id="job_url">
<a class="btn btn-info btn-lg user_url_modal_btn share-button" data-url="{% if is_secure %}https://{% else %}http://{% endif %}{{ request.get_host }}/jobs/{{job_appliers.id}}" title="Share"><img src="{% static 'images/share.png' %}"></a>
</div>
</div>
<p id="apply_job_para">
{{job_appliers.select_job}} / {{job_appliers.job_location}} /
{{job_appliers.created_date|date:'d.m.Y'}} / {{job_appliers.job_type}}
</p>
</div>
<div class="edit-post-para" id="description_div">
<!-- <p id="apply_job_desc"> -->
<!-- </p> -->
<!-- <div id="description_div"> -->
<p>
{{job_appliers.job_description|safe}}
</p>
<!-- </div> -->
</div>
<div class="edit-apply-job">
<div class="apply-content">apply for this job</div>
<div class="border-bottom"></div>
</div>
</div>
<div class="flex-icons-data">
<div class="person-icon">
{% if request.user.is_authenticated %}
{% for image in get_current_user_pic %}
{% if image.profile_picture %}
<img src="{{ image.profile_picture|thumbnail_url:'artwork_cover_tiny' }}" style="height: 49px; width: 49px">
{% else %}
<img src="{% static 'images/icons/person.jpg' %}" alt="person-icon">
{% endif %}
{% endfor %}
{% else %}
<img src="{% static 'images/icons/person.jpg' %}" alt="person-icon">
{% endif %}
</div>
<div class="new-project-heading">
<h1>
{% if request.user.is_authenticated %}
{{ request.user.get_full_name }}
{% else%} Guest
{% endif %}
</h1>
<p>
{% if request.user.is_authenticated %}
{% if request.user.get_user_expertises_comma %}
{{request.user.get_user_expertises_comma}}
{% else%} None {% endif %}
-
{% if request.user.city %}
{{request.user.city}}
{% else%} City {% endif %}
{% endif %}
</p>
</div>
</div>
{% if not request.user.is_authenticated %}
<div style="margin: 22px 0px;">
<div class="guest-btns">
<!-- For facebook login -->
{% get_providers as socialaccount_providers %}
{% if socialaccount_providers %}
<a class="fb-btn" href="javascript:allauth.facebook.login('', 'authenticate', 'login')"><i class="fa fa-facebook" aria-hidden="true" title="Facebook"></i>
<div class="login-btn" title="Facebook">Login with Facebook</div>
</a>
{% include "socialaccount/snippets/login_extra.html" %}
{% endif %}
<!-- End For facebook login -->
<!-- For E-Mail login -->
<a class="email-btn" href="/login">
<i class="fa fa-envelope-o" aria-hidden="true" title="Email"></i>
<div class="login-btn" title="Email">Login with Email</div>
</a>
</div>
</div>
{% endif %}
<form action="{% url 'applyjob' %}" name="apply_job_form" id="apply_job_id" method="post" class="three-artworks">
{% csrf_token %}
<label for="">select 3 Artworks that refer to the Job description</label>
<input type="hidden" name="single_job" value="{{job_appliers.id}}">
<div class="edit-img-selector">
<div class="edit-artwork-pic">
<img src="{% static 'images/artwork_default_cover.png' %}" class="img-responsive" alt="artwork_default_cover" id="art1">
</div>
<div class="edit-artworks-selector" id="test_load">
<select name="select_job_desk[]" id="artwork1" class="form-control input-control scrollable-menu common-img-cls">
<option selected value="" id="clear_art1"> --- select your artwork --- </option>
{% for get_artwork in request.user.allArtworks %}
<option value="{{get_artwork.id}}">
{{get_artwork.artwork_name}}</option>
{% endfor %}
</select>
<img src="{% static 'images/group-7.png' %}" class="img-responsive" alt="group-7.png" name="clear_artwork_data" id="clear_atrwork_value1" style="display: none;">
<!-- <input type="button" name="clear_artwork_data" value="X" id="clear_atrwork_value1" style="display: none;"> -->
</div>
</div>
<div class="clr"></div>
<div class="edit-img-selector">
<div class="edit-artwork-pic">
<img src="{% static 'images/artwork_default_cover.png' %}" class="img-responsive" alt="artwork_default_cover" id="art2">
</div>
<div class="edit-artworks-selector">
<select name="select_job_desk[]" id="artwork2" class="form-control input-control common-img-cls">
<option selected value="" id="clear_art2"> --- select your artwork --- </option>
{% for get_artwork in user.allArtworks %}
<option value="{{get_artwork.id}}">
{{get_artwork.artwork_name}}
</option>
{% endfor %}
</select>
<img src="{% static 'images/group-7.png' %}" class="img-responsive" alt="group-7.png" name="clear_artwork_data" id="clear_atrwork_value2" style="display: none;">
<!-- <input type="button" name="clear_artwork_data" value="X" id="clear_atrwork_value2" style="display: none;"> -->
</div>
</div>
<div class="clr"></div>
<div class="edit-img-selector">
<div class="edit-artwork-pic">
<img src="{% static 'images/artwork_default_cover.png' %}" class="img-responsive" alt="artwork_default_cover" id="art3">
</div>
<div class="edit-artworks-selector">
<select name="select_job_desk[]" id="artwork3" class="form-control input-control common-img-cls">
<option selected value="" id="clear_art3"> --- select your artwork --- </option>
{% for get_artwork in user.allArtworks %}
<option value="{{get_artwork.id}}">{{get_artwork.artwork_name}}</option>
{% endfor %}
</select>
<img src="{% static 'images/group-7.png' %}" class="img-responsive" alt="group-7.png" name="clear_artwork_data" value="X" id="clear_atrwork_value3" style="display: none;">
<!-- <input type="button" name="clear_artwork_data" value="X" id="clear_atrwork_value3" style="display: none;"> -->
</div>
</div>
<div class="clr"></div>
<div class="edit-artworks-textarea">
<label for="">application text</label><br>
<textarea name="app_text_desk" id="app_text_desk" cols="76" rows="7" required></textarea>
<label for="">…please add something - ideas? </label>
</div>
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 free_job_rate" style="margin-bottom: 8px;">
{% if job_appliers.job_type == "Paid Job" %}
<label for="" id="remove_head">your daily rate</label><br>
<div class="artwork-input">
<input type="text" name="daily_rate_desk" class="form-control" id="daily_rate_desktop" required maxlength="20">
</div>
{% endif %}
</div>
{% if not request.user.is_authenticated %}
<div class="col-xs-12 col-sm-12 col-md-8 col-lg-8" style="margin-bottom: 8px;">
<label for="">email address</label><br>
<div class="artwork-input">
<input type="email" name="guest_email" class="form-control" id="email_guest" required>
</div>
</div>
{% endif %}
<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 text-right">
<div class="post-job-btn">
<button type="submit" name="submit" class="btn btn-success">Send Application</button>
</div>
</div>
<div class="allow_email_deep email_content_desk">
<label class="check_it"><input type="checkbox" checked="true" name="{% if job_appliers.job_type == 'Paid Job' %}allow_email_paid{% else %}allow_email_free{% endif %}" class="allow_email_paid" value="on"><span class="copy_text">send a copy of my job / project application </span><span class="checkmark"></span></label>
</div>
</div>
</form>
</div>
</div>
<!-- Apply job pop up for first time end here -->
</div>
</div>
<!--Review applications work end-->
</div>
</div>
</div>
</div>
</div>
{% endblock %}
{% block extra_js %}
<script type="text/javascript">
var token="{{csrf_token}}";
</script>
<!-- For basic ckeditor -->
<script src="{% static 'ckeditor/ckeditor.js' %}"></script>
<script type="text/javascript">
CKEDITOR.replace( 'job_desc',
{
toolbar : 'Basic',
});
CKEDITOR.replace( 'edit_job',
{
toolbar : 'Basic',
});
CKEDITOR.replace( 'mobile_edit_job',
{
toolbar : 'Basic',
});
</script>
{% endblock %}