From adb8c39f041d7a81abc90c3c0aeb5eff2fc94b5d Mon Sep 17 00:00:00 2001 From: Keshav Garg Date: Wed, 31 Jul 2019 18:00:55 +0530 Subject: [PATCH] community/: Add a form for uploading google forms Not everyone, will be able to fill forms. Only the logged in users will be able to fill them and some of the forms, can only be filled by developers or contributors who are a part of more than one team. At every step, the check is performed whether the user is authenticated or not, to avoid false form submissions. Closes https://github.com/coala/community/issues/265 --- community/forms.py | 24 ++++++++ community/views.py | 11 +++- static/css/main.css | 54 ++++++++++++++++++ static/js/forms.js | 101 +++++++++++++++++++++++++++++++++ static/js/main.js | 29 ++++++++-- templates/base.html | 51 ++++++++++++++--- templates/community_forms.html | 53 +++++++++++++++++ 7 files changed, 310 insertions(+), 13 deletions(-) create mode 100644 static/js/forms.js create mode 100644 templates/community_forms.html diff --git a/community/forms.py b/community/forms.py index c109f7ff..f4d95dcf 100644 --- a/community/forms.py +++ b/community/forms.py @@ -80,3 +80,27 @@ class JoinCommunityForm(forms.Form): } ) ) + + +class CommunityGoogleForm(forms.Form): + user = forms.CharField( + max_length=50, label='GitHub Username', + widget=forms.TextInput(attrs={'autocomplete': 'off'}) + ) + title = forms.CharField( + max_length=100, label='Title', + widget=forms.TextInput(attrs={'autocomplete': 'off'}) + ) + description = forms.CharField( + max_length=1000, label='Form Description', required=False, + widget=forms.Textarea(attrs={'autocomplete': 'off'}) + ) + url = forms.URLField( + label='Google Form URL', + widget=forms.TextInput(attrs={'autocomplete': 'off'}) + ) + expiry_date = forms.DateTimeField( + label='Expiry date and time', required=False, + help_text='DateTime Format should be YYYY-MM-DD HH:MM:SS', + widget=forms.TextInput(attrs={'autocomplete': 'off'}) + ) diff --git a/community/views.py b/community/views.py index 5144b0ae..5a4e22d9 100644 --- a/community/views.py +++ b/community/views.py @@ -12,7 +12,7 @@ get_org_name, get_remote_url ) -from .forms import JoinCommunityForm +from .forms import JoinCommunityForm, CommunityGoogleForm from data.models import Team from gamification.models import Participant as GamificationParticipant from meta_review.models import Participant as MetaReviewer @@ -42,10 +42,19 @@ def initialize_org_context_details(): return org_details +def get_community_google_form_variables(context): + context['community_google_form'] = CommunityGoogleForm() + context['community_google_form_name'] = os.environ.get( + 'OSFORMS_NETLIFY_FORM_NAME', None + ) + return context + + def get_header_and_footer(context): context['isTravis'] = Travis.TRAVIS context['travisLink'] = Travis.TRAVIS_BUILD_WEB_URL context['org'] = initialize_org_context_details() + context = get_community_google_form_variables(context) print('Running on Travis: {}, build link: {}'.format(context['isTravis'], context['travisLink'] )) diff --git a/static/css/main.css b/static/css/main.css index e7d2f304..6b74aa1e 100644 --- a/static/css/main.css +++ b/static/css/main.css @@ -38,6 +38,46 @@ body { justify-content: center; } +.community-form { + position: absolute; + width: 70%; + min-width: 330px; + top: 15%; + left: 15%; + border-radius: 20px; + box-shadow: 0 -5px 15px black; + background-color: #edf5af; + padding: 20px; + height: 80%; + overflow-x: auto; +} + +.community-form form { + padding-bottom: inherit; + +} +.community-form form label { + font-weight: bold; + font-size: 1.5rem; + color: darkcyan; +} + +.community-form form p{ + margin: 0; +} + +.community-form form textarea{ + margin-top: 10px; +} + +.community-form form .row{ + margin-bottom: 0; +} + +.community-form ::placeholder { + color: black; +} + .evenly-spread-content { justify-content: space-evenly; } @@ -53,6 +93,10 @@ body { padding: 5px 10px; } +.display-none { + display: none; +} + .form-popup, .form-submission-popup { width: 100%; @@ -221,6 +265,10 @@ strong { list-style: none; } +.text-center { + text-align: center; +} + #user-dropdown li.user-profile, #user-dropdown li.user-logout { display: none; @@ -249,3 +297,9 @@ strong { margin: 0; } } + +@media only screen and (max-width: 400px) { + .community-form { + left: 10px; + } +} \ No newline at end of file diff --git a/static/js/forms.js b/static/js/forms.js new file mode 100644 index 00000000..2f5d2ed8 --- /dev/null +++ b/static/js/forms.js @@ -0,0 +1,101 @@ +/* globals Cookies */ +$(document).ready(function () { + + var community_google_form_op = $('.community-google-form-op'); + var newcomer_promotion_form_op = $('.newcomer-promotion-form-op'); + var calendar_event_form_op = $('.calendar-event-form-op'); + var get_issue_assigned_form_op = $('.get-issue-assigned-form-op'); + var participated_in_gsoc_form_op = $('.participated-in-gsoc-form-op'); + var mentor_students_form_op = $('.mentor-students-form-op'); + + var community_google_form = $('.community-google-form'); + var newcomer_promotion_form = $('.newcomer-promotion-form'); + var calendar_event_form = $('.calendar-event-form'); + var get_issue_assigned_form = $('.get-issue-assigned-form'); + var participated_in_gsoc_form = $('.participated-in-gsoc-form'); + var mentor_students_form = $('.mentor-students-form'); + + var is_user_authenticated = Cookies.get('authenticated'); + var authenticated_username = Cookies.get('username'); + + var username_input = $('[name=user]'); + username_input.attr('value', authenticated_username || 'Anonymous User'); + username_input.attr('disabled', true); + + $('form').attr( + 'action',window.location.pathname + + '?form_submitted=True&form_type=community' + ); + + $.getJSON("/static/contributors-data.json", function (data) { + var contributor_data = data[authenticated_username]; + var teams = contributor_data.teams; + if(teams.length === 1){ + community_google_form_op.get(0).remove(); + calendar_event_form_op.get(0).remove(); + mentor_students_form_op.get(0).remove(); + community_google_form.get(0).remove(); + calendar_event_form.get(0).remove(); + mentor_students_form.get(0).remove(); + } + }); + + function display_error_message(message){ + if(message){ + $('.important-message').text(message); + } + else { + $('.important-message').text('You tried to open a form, which is ' + + 'available to only authenticated users. Please join the community' + + ' or Login(if already a member of organization)'); + } + $('.form-submission-popup').css('display', 'block'); + } + + function display_form_or_error(form_object){ + if(is_user_authenticated && authenticated_username){ + $('.community-form').css('display', 'block'); + form_object.css('display', 'block'); + } + else { + display_error_message(); + } + } + + community_google_form_op.on('click', function () { + display_form_or_error(community_google_form); + }); + + newcomer_promotion_form_op.on('click', function () { + display_form_or_error(newcomer_promotion_form); + }); + + calendar_event_form_op.on('click', function () { + display_form_or_error(calendar_event_form); + }); + + get_issue_assigned_form_op.on('click', function () { + display_form_or_error(get_issue_assigned_form); + }); + + participated_in_gsoc_form_op.on('click', function () { + display_form_or_error(participated_in_gsoc_form); + }); + + mentor_students_form_op.on('click', function () { + display_form_or_error(mentor_students_form); + }); + + $(':input').focusin(function () { + if (is_user_authenticated===undefined && + authenticated_username===undefined) { + $('.community-form').css('display', 'none'); + display_error_message(); + } + }); + + $('.user_disabled_input').focusin(function () { + display_error_message('Sorry! But you are not allowed to change this' + + ' field value.'); + }); +}); \ No newline at end of file diff --git a/static/js/main.js b/static/js/main.js index 55ece8c8..8f32de83 100644 --- a/static/js/main.js +++ b/static/js/main.js @@ -6,10 +6,28 @@ $(document).ready(function(){ var urlParams = new URLSearchParams(location.search); var formSubmitted = urlParams.get('form_submitted'); + var formType = urlParams.get('form_type'); if(formSubmitted==='True'){ + var message = ''; + if(formType==='login'){ + message = 'You request to join community, form has been' + + ' submitted! You will receive an invite email within 24hrs, if' + + ' all the validation checks are passed. Else, you will receive' + + ' an email with the information regarding what all checks got' + + ' failed!'; + } + else if(formType==='community'){ + message = 'Your request has been received and will be soon' + + ' processed. You will receive an email notifying you whether' + + ' the validation checks are passed or not. If not, the email' + + ' will contain the validation errors. Correct them, if any'; + } + $('.important-message').text(message); $('.form-submission-popup').css('display', 'block'); } + + function activate_dropdown(){ if ($('nav').width() < 992 ){ $(".dropdown-trigger-sidenav").dropdown({coverTrigger: false}); @@ -23,7 +41,7 @@ $(document).ready(function(){ function check_user_authenticated_or_not() { if(Cookies.get('authenticated')){ - modify_html_elements('none', 'none','block', 'block'); + modify_html_elements('none', 'none','block', 'block', 'block'); } } @@ -39,11 +57,13 @@ $(document).ready(function(){ function modify_html_elements(popup_form_display, login_option_display, profile_option_display, - logout__option_display) { + logout__option_display, + form_option_display) { $('.form-popup').css('display', popup_form_display); login_user_el.css('display', login_option_display); $('.user-profile').css('display', profile_option_display); logout_user_el.css('display', logout__option_display); + $('.forms-dropdown-option').css('display', form_option_display); } function manipulate_web_page_data(oauth_provider, http_response_text) { @@ -51,7 +71,7 @@ $(document).ready(function(){ if (json_data.valid) { Cookies.set('authenticated', true); Cookies.set('username', json_data.user); - modify_html_elements('none', 'none','block', 'block'); + modify_html_elements('none', 'none','block', 'block', 'block'); } else { display_error_message(oauth_provider, json_data.message); @@ -108,12 +128,13 @@ $(document).ready(function(){ $('.form-popup').css('display', 'none'); $('.form-submission-popup').css('display', 'none'); $('.oauth-error').css('display', 'none'); + $('.community-form').css('display', 'none'); }); logout_user_el.click(function () { Cookies.remove('authenticated'); Cookies.remove('username'); - modify_html_elements('none', 'block','none', 'none'); + modify_html_elements('none', 'block','none', 'none', 'none'); }); $('.login-with-github').click(function(e) { diff --git a/templates/base.html b/templates/base.html index 5942ae2c..2e762b6c 100644 --- a/templates/base.html +++ b/templates/base.html @@ -8,19 +8,29 @@ {% block title %}{% endblock %} - + - - + + {% block add_css_files %}{% endblock %} - + + {% block add_js_files %}{% endblock %} @@ -28,7 +38,8 @@