Skip to content
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.

Commit 7ce1de1

Browse files
committedAug 5, 2019
community/: Add a joining netlify form
The netlify form will ask some particular inputs that will be used for validating the user - whether the user is eligible to be a organization member. The checks for it have been defined in coala webservices API which will be accepting form-submissions over a cron-job defined. After the user submits the form, a success message will be displayed. Closes #89, #266
1 parent 9a9bb6b commit 7ce1de1

File tree

9 files changed

+259
-11
lines changed

9 files changed

+259
-11
lines changed
 

‎community/forms.py

+82
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,82 @@
1+
from django import forms
2+
3+
4+
class JoinCommunityForm(forms.Form):
5+
6+
github_username = forms.CharField(
7+
max_length=50, label='GitHub Username',
8+
widget=forms.TextInput(
9+
attrs={
10+
'placeholder': 'Make sure to NOT enter your github profile url',
11+
'autocomplete': 'off'
12+
}
13+
)
14+
)
15+
gh_first_repo = forms.URLField(
16+
required=False, label='GitHub Personal Repository',
17+
widget=forms.URLInput(
18+
attrs={
19+
'placeholder': 'A valid github url of your personal repository',
20+
'autocomplete': 'off'
21+
}
22+
)
23+
)
24+
gh_git_training_exercise = forms.URLField(
25+
required=False, label='From which GitHub repository you have done git'
26+
' training?',
27+
widget=forms.URLInput(
28+
attrs={
29+
'placeholder': 'A valid github url of git training repository',
30+
'autocomplete': 'off'
31+
}
32+
)
33+
)
34+
gh_most_contributed_repo = forms.URLField(
35+
required=False,
36+
label="GitHub Repository to which you've contributed most!",
37+
widget=forms.URLInput(
38+
attrs={
39+
'placeholder': 'A valid github public repository url',
40+
'autocomplete': 'off'
41+
}
42+
)
43+
)
44+
45+
gitlab_user_id = forms.IntegerField(
46+
label='GitLab User ID',
47+
widget=forms.NumberInput(
48+
attrs={
49+
'placeholder': 'Make sure to NOT enter your gitlab profile url',
50+
'autocomplete': 'off'
51+
}
52+
)
53+
)
54+
gl_first_repo_id = forms.IntegerField(
55+
required=False, label='GitLab Personal Project ID',
56+
widget=forms.NumberInput(
57+
attrs={
58+
'placeholder': 'Your personal gitlab project ID',
59+
'autocomplete': 'off'
60+
}
61+
)
62+
)
63+
gl_git_training_exercise = forms.IntegerField(
64+
required=False, label='From which GitLab project you have done git'
65+
' training?',
66+
widget=forms.NumberInput(
67+
attrs={
68+
'placeholder': 'A valid project ID of Git training project',
69+
'autocomplete': 'off'
70+
}
71+
)
72+
)
73+
gl_most_contributed_repo_id = forms.IntegerField(
74+
required=False,
75+
label="GitLab Project to which you've contributed most!",
76+
widget=forms.NumberInput(
77+
attrs={
78+
'placeholder': 'A valid ID of gitlab public project',
79+
'autocomplete': 'off',
80+
}
81+
)
82+
)

‎community/urls.py

+7-1
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
from django.conf.urls.static import static
77
from django.conf import settings
88

9-
from community.views import HomePageView
9+
from community.views import HomePageView, JoinCommunityView
1010
from gci.views import GCIStudentsList
1111
from gci.feeds import LatestTasksFeed as gci_tasks_rss
1212
from ci_build.view_log import BuildLogsView
@@ -78,6 +78,12 @@ def get_organization():
7878
distill_func=get_index,
7979
distill_file='index.html',
8080
),
81+
distill_url(
82+
r'^join/', JoinCommunityView.as_view(),
83+
name='join-community',
84+
distill_func=get_index,
85+
distill_file='join/index.html',
86+
),
8187
distill_url(
8288
r'gci/tasks/rss.xml', gci_tasks_rss(),
8389
name='gci-tasks-rss',

‎community/views.py

+22
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
import os
2+
13
import logging
24

35
import requests
@@ -10,10 +12,15 @@
1012
get_org_name,
1113
get_remote_url
1214
)
15+
from .forms import JoinCommunityForm
1316
from data.models import Team
1417
from gamification.models import Participant as GamificationParticipant
1518
from meta_review.models import Participant as MetaReviewer
1619

20+
GL_NEWCOMERS_GRP = 'https://gitlab.com/{}/roles/newcomers'.format(
21+
get_org_name()
22+
)
23+
1724

1825
def initialize_org_context_details():
1926
org_name = get_org_name()
@@ -110,3 +117,18 @@ def get_context_data(self, **kwargs):
110117
context['top_gamification_users'] = self.get_top_gamification_users(
111118
count=5)
112119
return context
120+
121+
122+
class JoinCommunityView(TemplateView):
123+
124+
template_name = 'join_community.html'
125+
126+
def get_context_data(self, **kwargs):
127+
context = super().get_context_data(**kwargs)
128+
context = get_header_and_footer(context)
129+
context['join_community_form'] = JoinCommunityForm()
130+
context['gitlab_newcomers_group_url'] = GL_NEWCOMERS_GRP
131+
context['join_community_form_name'] = os.environ.get(
132+
'JOIN_COMMUNITY_FORM_NAME', None
133+
)
134+
return context

‎static/css/join-community.css

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
.join-community-form .row {
2+
margin: 5px auto;
3+
}
4+
5+
.join-community-form .row .input-field,
6+
.join-community-form p {
7+
margin: 0 auto;
8+
}
9+
10+
.join-community-form label{
11+
font-size: 1.3em;
12+
color: black;
13+
}
14+
15+
.join-community-form ::placeholder{
16+
color: gray;
17+
}
18+
19+
.validation-checkboxes {
20+
padding: 0 15px;
21+
}
22+
23+
.submit-btn{
24+
margin: 15px;
25+
}

‎static/css/main.css

+17-6
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,8 @@ body {
5353
padding: 5px 10px;
5454
}
5555

56-
.form-popup {
56+
.form-popup,
57+
.form-submission-popup {
5758
width: 100%;
5859
height: 100%;
5960
justify-content: center;
@@ -79,11 +80,16 @@ footer .social-buttons {
7980
text-transform: none;
8081
}
8182

83+
.inline-contents {
84+
display: inline-flex;
85+
}
86+
8287
.large-font {
8388
font-size: larger;
8489
}
8590

86-
.login-form {
91+
.login-form,
92+
.form-submission-message {
8793
width: 30%;
8894
min-width: 340px;
8995
background-color: white;
@@ -100,6 +106,11 @@ footer .social-buttons {
100106
color: #37474f;
101107
}
102108

109+
.message {
110+
padding: 10px;
111+
text-align: justify;
112+
}
113+
103114
nav {
104115
background-color: #37474f;
105116
}
@@ -165,10 +176,6 @@ p {
165176
background-color: #263238;
166177
}
167178

168-
.inline-contents {
169-
display: inline-flex;
170-
}
171-
172179
.search-field {
173180
border-radius: 100px;
174181
box-shadow: 0 0 25px 2px black;
@@ -202,6 +209,10 @@ p {
202209
float: none;
203210
}
204211

212+
strong {
213+
font-weight: bold;
214+
}
215+
205216
.student {
206217
padding-bottom: 20px;
207218
}

‎static/js/main.js

+8-1
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,15 @@
1-
/* globals Cookies, netlify */
1+
/* globals Cookies, netlify, URLSearchParams */
22
$(document).ready(function(){
33

44
var login_user_el = $('.login-user');
55
var logout_user_el = $('.user-logout');
66

7+
var urlParams = new URLSearchParams(location.search);
8+
var formSubmitted = urlParams.get('form_submitted');
9+
if(formSubmitted==='True'){
10+
$('.form-submission-popup').css('display', 'block');
11+
}
12+
713
function activate_dropdown(){
814
if ($('nav').width() < 992 ){
915
$(".dropdown-trigger-sidenav").dropdown({coverTrigger: false});
@@ -100,6 +106,7 @@ $(document).ready(function(){
100106

101107
$('.close-form').click(function () {
102108
$('.form-popup').css('display', 'none');
109+
$('.form-submission-popup').css('display', 'none');
103110
$('.oauth-error').css('display', 'none');
104111
});
105112

‎templates/base.html

+21-2
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@
3434
<ul class="right hide-on-med-and-down nav-menu-font-size">
3535
<li><a href="{% url 'index' %}" class="nav-menu-font-size">Home</a></li>
3636
<li><a href="/#about" class="nav-menu-font-size">About</a></li>
37-
<li><a href="#" class="nav-menu-font-size">Join</a></li>
37+
<li><a href="{% url 'join-community' %}" class="nav-menu-font-size">Join</a></li>
3838
<li><a href="{{ org.blog_url }}" target="_blank" class="nav-menu-font-size">Blog</a></li>
3939
<li><a class="dropdown-trigger nav-menu-font-size" href="#organisation" data-target="organisation-dropdown">Organisation <i class="fa fa-caret-down"></i></a></li>
4040
<li><a class="dropdown-trigger nav-menu-font-size" href="#contributors" data-target="contributors-dropdown">Contributors <i class="fa fa-caret-down"></i></a></li>
@@ -49,7 +49,7 @@
4949

5050
<ul class="sidenav bold-text" id="mobile-menu">
5151
<li><a href="/#about" class="nav-menu-font-size">About</a></li>
52-
<li><a href="#" class="nav-menu-font-size">Join</a></li>
52+
<li><a href="{% url 'join-community' %}" class="nav-menu-font-size">Join</a></li>
5353
<li><a href="{{ org.blog_url }}" target="_blank" class="nav-menu-font-size">Blog</a></li>
5454
<li><a class="dropdown-trigger-sidenav nav-menu-font-size" href="#organisation" data-target="organisation-dropdown">Organisation <i class="fa fa-caret-down"></i></a></li>
5555
<li><a class="dropdown-trigger-sidenav nav-menu-font-size" href="#contributors" data-target="contributors-dropdown">Contributors <i class="fa fa-caret-down"></i></a></li>
@@ -114,6 +114,25 @@
114114
</div>
115115
</div>
116116

117+
<div class="apply-flex form-submission-popup">
118+
<div class="form-submission-message">
119+
<div class="apply-flex close-form">
120+
<i class="fa fa-times" aria-hidden="true"></i>
121+
</div>
122+
<span class="apply-flex organizations">
123+
<img src="{{ org.logo_url }}" class="org-logo" alt="org-logo">
124+
<i class="fa fa-plus" aria-hidden="true"></i>
125+
<img src="//flaviocopes.com/netlify/banner.png" class="netlify-image" alt="netlify-logo">
126+
</span>
127+
<div class="apply-flex message text-justify">
128+
<h6>You request to join community, form has been submitted! You will receive
129+
an invite email within 24hrs, if all the validation checks are passed. Else, you
130+
will receive an email with the information regarding what all checks got failed!</h6>
131+
<h6>Enjoy Coding 'n' Learning</h6>
132+
</div>
133+
</div>
134+
</div>
135+
117136
<div class="main-content">
118137
{% block main-content %}
119138
{% endblock %}

‎templates/index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -97,7 +97,7 @@ <h4 style="margin-top: 0">{{ team_name }}</h4>
9797
</div>
9898

9999
<div class="join-btn apply-flex center-content">
100-
<a href="#" id="join" class="waves-effect waves-light btn-large">
100+
<a href="{% url 'join-community' %}" id="join" class="waves-effect waves-light btn-large">
101101
<b>Want to join {{ org.name }}?</b>
102102
</a>
103103
</div>

‎templates/join_community.html

+76
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
{% extends 'base.html' %}
2+
{% load staticfiles %}
3+
4+
{% block add_css_files %}
5+
<link rel="stylesheet" href="{% static 'css/join-community.css' %}">
6+
{% endblock %}
7+
8+
{% block add_js_files %}
9+
{% endblock %}
10+
11+
{% block main-content %}
12+
<div class="web-page-details apply-flex center-content">
13+
<h3 style="padding-right: 15px">~</h3>
14+
<div class="page-name">
15+
<h3>Join Community</h3>
16+
</div>
17+
<h3 style="padding-left: 15px">~</h3>
18+
</div>
19+
<div class="apply-flex center-content">
20+
<form name="{{ join_community_form_name }}" method="post" netlify-honeypot="bot-field"
21+
class="join-community-form" data-netlify="true" action="/?form_submitted=True">
22+
{% csrf_token %}
23+
{% for field in join_community_form %}
24+
<div class="row">
25+
<div class="input-field col s12">
26+
<p>
27+
{{ field.label_tag }}
28+
</p>
29+
{{ field }}
30+
</div>
31+
</div>
32+
{% endfor %}
33+
<div class="validation-checkboxes">
34+
<p>
35+
<label>
36+
<input type="checkbox" required>
37+
<span>
38+
I have requested access to
39+
<a href="{{ gitlab_newcomers_group_url }}" class="bold-text">
40+
{{ org.name }} Newcomers Group
41+
</a>
42+
on GitLab
43+
</span>
44+
</label>
45+
</p>
46+
<p>
47+
<label>
48+
<input type="checkbox" required>
49+
<span>I have not created my GitHub or GitLab account in the last 60 minutes.</span>
50+
</label>
51+
</p>
52+
<p>
53+
<label>
54+
<input type="checkbox" required>
55+
<span>All of the above information provided by me has no false entries. If so, I am liable
56+
of getting blacklisted.</span>
57+
</label>
58+
</p>
59+
<p style="display: none">
60+
<label>
61+
<input type="checkbox" name="bot-field">
62+
<span>I am a bot</span>
63+
</label>
64+
</p>
65+
<p>
66+
<strong>
67+
Note: You will receive an invite email within 24 hrs, if all the validation checks are passed.
68+
</strong>
69+
</p>
70+
</div>
71+
<div class="apply-flex center-content submit-btn">
72+
<input class="waves-effect waves-light btn-large large-font" type="submit" value="Submit">
73+
</div>
74+
</form>
75+
</div>
76+
{% endblock %}

0 commit comments

Comments
 (0)
Please sign in to comment.