WIP publish, projects are rendering due to a bug on the json response…

…, sponsor tribes widget layout is nearly completed, just the javascript vue work remains
gitcoinco · Apr 8, 2020 · 1e29d83 · 1e29d83
1 parent 1b52b3b
commit 1e29d83
Show file tree

Hide file tree

Showing 9 changed files with 1,222 additions and 940 deletions.
diff --git a/app/app/urls.py b/app/app/urls.py
@@ -208,11 +208,11 @@
     path('revenue/attestations/new', revenue.views.new_attestation, name='revenue_new_attestation'),
 
     # Hackathons / special events
-    url(r'^hackathon/<str:hackathon>/(?P<tab>\w+)/$', dashboard.views.hackathon, name='hackathon'),
     path('hackathon/<str:hackathon>/', dashboard.views.hackathon, name='hackathon'),
+    path('hackathon/<str:hackathon>/<str:panel>/', dashboard.views.hackathon, name='hackathon'),
     path('hackathon/onboard/<str:hackathon>/', dashboard.views.hackathon_onboard, name='hackathon_onboard'),
-    path('hackathon/projects/<str:hackathon>/', dashboard.views.hackathon_projects, name='hackathon_projects'),
-    path('hackathon/projects/<str:hackathon>', dashboard.views.hackathon_projects, name='hackathon_projects2'),
+    path('hackathon/<str:hackathon>/projects/', dashboard.views.hackathon_projects, name='hackathon_projects'),
+    path('hackathon/<str:hackathon>/projects/', dashboard.views.hackathon_projects, name='hackathon_projects2'),
     path(
         'hackathon/projects/<str:hackathon>/<str:project>', dashboard.views.hackathon_project, name='hackathon_project'
     ),
@@ -228,8 +228,10 @@
         name='hackathon_edit_project'
     ),
     path('modal/save_project/', dashboard.views.hackathon_save_project, name='hackathon_save_project'),
-    re_path(r'^hackathon/?$/?', dashboard.views.hackathon, name='hackathon_idx'),
-    re_path(r'^hackathon/(.*)?$', dashboard.views.hackathon, name='hackathon_idx2'),
+    # re_path(r'^hackathon/?$/?', dashboard.views.hackathon, name='hackathon_idx'),
+    # re_path(r'^hackathon/(.*)?$', dashboard.views.hackathon, name='hackathon_idx2'),
+    url(r'^hackathon/<str:hackathon>/?$/?', dashboard.views.hackathon, name='hackathon'),
+    url(r'^hackathon/<str:hackathon>/<str:panel>/?$/?', dashboard.views.hackathon, name='hackathon'),
     path('hackathon-list/', dashboard.views.get_hackathons, name='get_hackathons'),
     path('hackathon-list', dashboard.views.get_hackathons, name='get_hackathons2'),
     re_path(r'^hackathon/?$', dashboard.views.get_hackathons, name='get_hackathons3'),
@@ -696,6 +698,9 @@
     url(r'^api/v0.1/user_bounties/', dashboard.views.get_user_bounties, name='get_user_bounties'),
     url(r'^api/v0.1/users_fetch/', dashboard.views.users_fetch, name='users_fetch'),
 
+    #projets
+    url(r'^api/v0.1/projects_fetch/', dashboard.views.projects_fetch, name='projects_fetch'),
+
     # wiki
     path('wiki/notifications/', include('django_nyt.urls')),
 ]

diff --git a/app/assets/v2/css/users.css b/app/assets/v2/css/users.css
@@ -1,3 +1,8 @@
+
+.sidebar-container .container {
+  background-color: #ffffff;
+}
+
 .grid-4 {
   display: grid;
   grid-template-columns: repeat(1, 1fr);

diff --git a/app/assets/v2/js/pages/dashboard.js b/app/assets/v2/js/pages/dashboard.js
@@ -1,6 +1,14 @@
 /* eslint-disable no-loop-func */
 (function($) {
 
+  let hackathonProjects = []
+  let projectsPage = 1;
+  let hackathonSponsors = document.hackathonSponsors;
+  let projectsNumPages = '';
+  let projectsHasNext = false;
+  let numProjects = '';
+  let hackathonId = document.hasOwnProperty('hackathon_id') ? document.hackathon_id : '';
+
   var filters = [
     'experience_level',
     'project_length',
@@ -106,10 +114,11 @@
     }
     let _filters = filters.slice();
 
-    _filters.push('keywords', 'order_by', 'org');
+    _filters.push('keywords', 'order_by', 'org', 'tab');
     if (document.hackathon) {
       resetFilters(true);
-      filters.push('org');
+      filters.push('org', 'tab');
+
     }
     _filters.forEach(filter => {
       if (getParam(filter)) {
@@ -466,10 +475,8 @@
 
   var addPopover = () => {
     // $('[data-toggle="popover"]').popover();
-    console.log("pops enabled");
-
-    $('body').popover({
-      selector: '.bounty_row',
+    console.log('pops enabled');
+    $('.bounty_row').popover({
       html: true,
       trigger: 'hover',
       placement: 'auto',
@@ -518,10 +525,10 @@
       toggleAny(event);
 
       const org = $("input[name='org']:checked").val();
-
+      console.log("we're here")
       localStorage['org'] = org === 'any' ? '' : org;
       localStorage['order_by'] = $('#sort_option').val();
-      window.history.pushState('', '', window.location.pathname + '?' + buildURI(['org']));
+      window.history.pushState('', '', window.location.pathname + '?' + buildURI([ 'org', 'tab' ]));
     }
 
     if (!append) {
@@ -798,33 +805,33 @@
     });
 
     if (localStorage['referrer'] === 'onboard' && !document.hackathon) {
-    $('#sidebar_container').addClass('invisible');
-    $('#dashboard-title').addClass('hidden');
-    $('#onboard-dashboard').removeClass('hidden');
-    $('#onboard-footer').removeClass('hidden');
-    resetFilters(true);
-    $('input[name=idx_status][value=open]').prop('checked', true);
-    $('.search-area input[type=text]').text(getURLParams('q'));
+      $('#sidebar_container').addClass('invisible');
+      $('#dashboard-title').addClass('hidden');
+      $('#onboard-dashboard').removeClass('hidden');
+      $('#onboard-footer').removeClass('hidden');
+      resetFilters(true);
+      $('input[name=idx_status][value=open]').prop('checked', true);
+      $('.search-area input[type=text]').text(getURLParams('q'));
 
-    $('#onboard-alert').on('click', function(e) {
+      $('#onboard-alert').on('click', function(e) {
 
-      if (!$('.no-results').hasClass('hidden'))
-        $('.nonefound').css('display', 'block');
+        if (!$('.no-results').hasClass('hidden'))
+          $('.nonefound').css('display', 'block');
 
-      $('.bounty_row').each(function(index) {
-        $(this).removeClass('hidden');
-      });
+        $('.bounty_row').each(function(index) {
+          $(this).removeClass('hidden');
+        });
 
-      $('#onboard-dashboard').addClass('hidden');
-      $('#onboard-footer').addClass('hidden');
-      $('#sidebar_container').removeClass('invisible');
-      $('#dashboard-title').removeClass('hidden');
-      $('#dashboard-content').removeClass('hidden');
+        $('#onboard-dashboard').addClass('hidden');
+        $('#onboard-footer').addClass('hidden');
+        $('#sidebar_container').removeClass('invisible');
+        $('#dashboard-title').removeClass('hidden');
+        $('#dashboard-content').removeClass('hidden');
 
-      localStorage['referrer'] = '';
-      e.preventDefault();
-    });
-  } else {
+        localStorage['referrer'] = '';
+        e.preventDefault();
+      });
+    } else {
       $('#dashboard-content').removeClass('hidden');
       $('#onboard-dashboard').addClass('hidden');
       $('#onboard-footer').addClass('hidden');
@@ -836,21 +843,164 @@
 
 
   $(function() {
+    Vue = Vue.extend({
+      delimiters: [ '[[', ']]' ]
+    });
+    Vue.component('project-directory', {
+      delimiters: [ '[[', ']]' ],
+      methods: {
+        fetchProjects: function(newPage) {
+          let vm = this;
+
+          vm.isLoading = true;
+          vm.noResults = false;
+
+          if (newPage) {
+            vm.projectsPage = newPage;
+          }
+          vm.params.page = vm.projectsPage;
+          vm.params.hackathon = hackathonId;
+          if (vm.searchTerm) {
+            vm.params.search = vm.searchTerm;
+          } else {
+            delete vm.params['search'];
+          }
+
+          let searchParams = new URLSearchParams(vm.params);
+
+          let apiUrlProjects = `/api/v0.1/projects_fetch/?${searchParams.toString()}`;
 
+          var getProjects = fetchData (apiUrlProjects, 'GET');
+
+          $.when(getProjects).then(function(response) {
+            vm.hackathonProjects = [];
+            response.data.forEach(function(item) {
+              vm.hackathonProjects.push(item);
+            });
+
+            vm.projectsNumPages = response.num_pages;
+            vm.projectsHasNext = response.has_next;
+            vm.numProjects = response.count;
+            if (vm.projectsHasNext) {
+              vm.projectsPage = ++vm.projectsPage;
+
+            } else {
+              vm.projectsPage = 1;
+            }
+
+            if (vm.hackathonProjects.length) {
+              vm.noResults = false;
+            } else {
+              vm.noResults = true;
+            }
+            vm.isLoading = false;
+          });
+        },
+        searchProjects: function() {
+          let vm = this;
+
+          vm.hackathonProjects = [];
+
+          vm.fetchProjects(1);
+
+        }
+      },
+      data: () => ({
+        hackathonSponsors,
+        hackathonProjects,
+        projectsPage,
+        hackathonId,
+        projectsNumPages,
+        projectsHasNext,
+        numProjects,
+        media_url,
+        searchTerm: null,
+        bottom: false,
+        params: {},
+        isFunder: false,
+        showModal: false,
+        showFilters: true,
+        skills: document.keywords || [],
+        selectedSkills: [],
+        noResults: false,
+        isLoading: true,
+        hideFilterButton: false
+      }),
+      mounted() {
+        this.fetchProjects();
+        this.$watch('params', function(newVal, oldVal) {
+          this.searchProjects();
+        }, {
+          deep: true
+        });
+      },
+      created() {
+        // this.extractURLFilters();
+      },
+      beforeMount() {
+        window.addEventListener('scroll', () => {
+          this.bottom = this.bottomVisible();
+        }, false);
+      },
+      beforeDestroy() {
+        window.removeEventListener('scroll', () => {
+          this.bottom = this.bottomVisible();
+        });
+      }
+    });
     var app = new Vue({
+      delimiters: [ '[[', ']]' ],
       el: '#dashboard-vue-app',
       updated: () => {
         addPopover();
       },
       mounted: () => {
-        set_sidebar_defaults();
-        reset_offset();
-        refreshBounties(null, 0, false);
-        initDOM();
-        addPopover();
+        setTimeout(() => {
+          set_sidebar_defaults();
+          reset_offset();
+          refreshBounties(null, 0, false);
+          initDOM();
+          addPopover();
+        }, 0);
+      },
+      methods: {
+        tabChange: (input) => {
+          let vm = this;
+
+          console.log(vm.activePanel);
+          console.log(vm.hackathonObj);
+          addPopover();
+
+          switch (input) {
+            default:
+            case 0:
+              newPathName = 'townsquare';
+              break;
+            case 1:
+              newPathName = 'chat';
+              break;
+            case 2:
+              newPathName = 'prizes';
+              break;
+            case 3:
+              newPathName = 'projects';
+              break;
+            case 4:
+              newPathName = 'participants';
+              break;
+          }
+          let newUrl = `/hackathon/${vm.hackathonObj['slug']}/${newPathName}/${window.location.search}`;
+
+          history.pushState({}, `${vm.hackathonObj['slug']} - ${newPathName}`, newUrl);
+        }
       },
       data: () => ({
-        message: 'Hello World'
+        is_registered: document.is_registered,
+        activePanel: document.activePanel,
+        hackathonObj: document.hackathonObj,
+        hackathonSponsors: document.hackathonSponsors,
+        chatURL: document.chatURL,
+        timeuntil: document.timeuntil
       })
     });
   });

diff --git a/app/dashboard/models.py b/app/dashboard/models.py
@@ -4675,6 +4675,14 @@ def url(self):
     def get_absolute_url(self):
         return self.url()
 
+from rest_framework import serializers
+
+class HackathonProjectSerializer(serializers.ModelSerializer):
+    class Meta:
+        model = HackathonProject
+        fields = ('chat_channel_id', 'status', 'badge', 'bounty', 'summary', 'work_url', 'profiles', 'hackathon', 'summary', 'logo')
+        depth = 1
+
 
 class FeedbackEntry(SuperModel):
     bounty = models.ForeignKey(