Feature/utm hypercharge (#7502)

* Add hackathons events * Add UTMs to hypercharge mode * DRY hackathonslist and change color footer on roundup * Change roundup background Co-authored-by: Aditya Anand M C <[email protected]>
gitcoinco · Oct 4, 2020 · 9aafb39 · 9aafb39
1 parent 143649f
commit 9aafb39
Show file tree

Hide file tree

Showing 23 changed files with 219 additions and 135 deletions.
diff --git a/app/app/templates/shared/hackathon-list.html b/app/app/templates/shared/hackathon-list.html
@@ -0,0 +1,87 @@
+{% load date_fromisoformat timesince_fromisoformat %}
+<div class="row my-4">
+  {% if events|length %}
+  <div class="container custom-container">
+  <div class="row">
+  {% for event in events %}
+      <style>
+        #{{event.slug}} .card-header {
+          background: {{ event.background_color }};
+        }
+      </style>
+
+      <div class="col-xs-12 col-md-9 col-lg-8 col-xl-6 mx-auto hackathon-list {{ event.type }} {% if event.type != default_tab %}hidden{% endif %}">
+
+        <div class="card flex-row flex-wrap mb-5" id="{{ event.slug }}">
+
+          <div class="card-header text-center col-12 col-sm-4 px-0">
+            <a href="{% url 'hackathon' event.slug %}">
+            {% if event.logo %}
+              <img class="hackathon-card-logo" src="{{ MEDIA_URL }}{{ event.logo }}" alt="Hackathon logo" />
+            {% else %}
+              <div class="hackathon-card-logo text-center px-3 font-caption">
+                {{ event.name }}
+              </div>
+            {% endif %}
+            </a>
+          </div>
+          <div class="card-body col-12 col-sm-8 {% if left_align_cards %}text-left{% endif %}">
+            <h5 class="font-subheader font-weight-semibold">
+              <a href="{% url 'hackathon' event.slug %}" class="text-black {% if force_color %}no-pink{% endif %}" rel="noopener noreferrer">
+                {{ event.name }}
+              </a>
+            </h5>
+
+            <div class="font-smaller-2 {% if left_align_cards %}text-left{% endif %}">
+              <span class>From</span>
+              <time class="font-weight-bold" datetime="{{ event.start_date|date_fromisoformat:'c' }}">{{ event.start_date|date_fromisoformat:"m/d/Y" }}</time>
+              <span>To</span>
+              <time class="font-weight-bold" datetime="{{ event.end_date|date_fromisoformat:'c' }}">{{ event.end_date|date_fromisoformat:"m/d/Y" }}</time>
+            </div>
+            <div class="mt-3 font-smaller-2 hackathon-summary {% if left_align_cards %}text-left{% endif %}">
+              <p>{{ event.summary }}</p>
+            </div>
+            {% if event.sponsor_profiles|length %}
+              <div class="mt-3 font-smaller-2">
+                <span class="pr-1">Sponsored by</span>
+                {% for sponsor in event.sponsor_profiles %}
+                  <a href="{{ sponsor.absolute_url }}" target="_blank"><img class="rounded-circle" style="width:21px;" src="{{ sponsor.avatar_url }}" /></a>
+                {% endfor %}
+              </div>
+            {% endif %}
+
+            <div class="mt-3 hackathon-actions">
+              {% if event.end_date|timesince_fromisoformat <= "1 min" %}
+                <a href="{% url 'hackathon_onboard' event.slug %}" class="btn {% if force_color %}no-pink{% endif %} btn-gc-blue font-caption font-weight-semibold px-3 mb-2">
+                  <i class="fas fa-user-plus mr-2 d-none d-sm-inline"></i>
+                  Join
+                </a>
+              {% endif %}
+              {% if event.display_showcase %}
+              <a href="{% url 'hackathon_showcase_proxy' event.slug %}" class="btn {% if force_color %}no-pink{% endif %} btn-gc-blue font-caption font-weight-semibold px-3 mb-2">
+                <i class="fas fa-star d-none d-sm-inline" style="font-size:6.5px;position:relative;top:0.2rem;left:0.2rem;"></i>
+                <i class="fas fa-star mr-1 d-none d-sm-inline"></i>
+                Showcase
+              </a>
+              {% endif %}
+              {% if event.start_date|timesince_fromisoformat >= "1 min" and event.end_date|timesince_fromisoformat <= "1 min"%}
+                <a href="{% url 'hackathon_prizes' event.slug %}" class="btn {% if force_color %}no-pink{% endif %} button--secondary font-caption font-weight-semibold px-3 mb-2">
+                  <i class="fas fa-trophy mr-2 d-none d-sm-inline"></i>
+                  Prizes
+                </a>
+              {% endif %}
+              {% if event.show_results %}
+                <a href="{% url 'hackathon_projects' event.slug %}" class="btn {% if force_color %}no-pink{% endif %} button--secondary font-caption font-weight-semibold px-3 mb-2">
+                  <i class="fas fa-dharmachakra mr-2 d-none d-sm-inline"></i>
+                  Projects
+                </a>
+              {% endif %}
+            </div>
+          </div>
+        </div>
+      </div>
+  {% endfor %}
+  </div>
+  </div>
+  {% endif %}
+</div>
diff --git a/app/assets/onepager/css/main.css b/app/assets/onepager/css/main.css
@@ -544,6 +544,23 @@ body #main a:not(.button):hover {
   color: #ec5597;
 }
 
+
+body #main a.no-pink {
+  color: var(--gc-blue);
+}
+
+body #main a.no-pink:hover {
+  color: var(--gc-blue-hover);
+}
+
+body #main a.no-pink.btn-gc-blue {
+  color: #ffffff;
+}
+
+body #main a.text-black.no-pink {
+  color: black;
+}
+
 .proPic {
   width: 25vmin;
   margin: 0.75vmin;

diff --git a/app/assets/v2/images/social/facebook-mint.png b/app/assets/v2/images/social/facebook-mint.png
diff --git a/app/assets/v2/images/social/medium-mint.png b/app/assets/v2/images/social/medium-mint.png
diff --git a/app/assets/v2/images/social/reddit-mint.png b/app/assets/v2/images/social/reddit-mint.png
diff --git a/app/assets/v2/images/social/slack-mint.png b/app/assets/v2/images/social/slack-mint.png
diff --git a/app/assets/v2/images/social/twitter-mint.png b/app/assets/v2/images/social/twitter-mint.png
diff --git a/app/assets/v2/js/shared.js b/app/assets/v2/js/shared.js
@@ -858,6 +858,10 @@ const renderFeaturedBountiesFromResults = (results, renderForExplorer) => {
     if (relatedTokenDetails && relatedTokenDetails.decimals) {
       decimals = relatedTokenDetails.decimals;
     }
+    if (result.metadata.hypercharge_mode) {
+      result['url'] = `${result['url']}?utm_source=hypercharge-auto-hack-explorer&utm_medium=gitcoin&utm_campaign=${result['title']}`;
+    }
+
     result['rounded_amount'] = normalizeAmount(result['value_in_token'], decimals);
 
     html += tmpl.render(result);

diff --git a/app/dashboard/gas_views.py b/app/dashboard/gas_views.py
@@ -245,6 +245,15 @@ def gas_history_view(request):
         for gh in gas_histories[i]:
             max_y = max(gh[0], max_y)
     breakdown_ui = breakdown.replace('ly', '') if breakdown != 'daily' else 'day'
+
+    events = JSONStore.objects.get(key='hackathons', view='hackathons').data[1]
+    default_tab = 'current'
+
+    tabs = [
+        ('current', 'happening now'),
+        ('upcoming', 'upcoming'),
+        ('finished', 'completed'),
+    ]
     context = {
         'title': _('Live Ethereum (ETH) Gas History'),
         'card_desc': _('See and comment on the Ethereum (ETH) Gas - Hourly History Graph'),
@@ -254,5 +263,8 @@ def gas_history_view(request):
         'breakdown': breakdown,
         'breakdown_ui': breakdown_ui,
         'granularity_options': granularity_options,
+        'events': events,
+        'tabs': tabs,
+        'default_tab': default_tab
     }
     return TemplateResponse(request, 'gas_history.html', context)
diff --git a/app/dashboard/models.py b/app/dashboard/models.py
@@ -1333,11 +1333,13 @@ def post_save_bounty(sender, instance, created, **kwargs):
 
         # Publish and pin on townsquare
         profile = Profile.objects.filter(handle=HYPERCHARGE_BOUNTIES_PROFILE_HANDLE).first()
+
+        utm = f'utm_source=hypercharge-auto-pinned-post&utm_medium=twitter&utm_campaign={instance.title}'
         if profile:
             metadata = {
                     'title': title,
                     'description': truncatechars(instance.issue_description_text, 500),
-                    'url': instance.get_absolute_url(),
+                    'url': f'{instance.get_absolute_url()}?{utm}',
                     'ask': '#announce'
             }
             activity = Activity.objects.create(profile=profile, activity_type='hypercharge_bounty',

diff --git a/app/dashboard/notifications.py b/app/dashboard/notifications.py
@@ -156,8 +156,11 @@ def maybe_market_to_twitter(bounty, event_name):
 
     random.shuffle(tweet_txts)
     tweet_txt = tweet_txts[0]
+    utm = ''
+    if bounty.metadata.get('hyper_tweet_counter', False):
+        utm = f'utm_source=hypercharge-auto&utm_medium=twitter&utm_campaign={bounty.title}'
 
-    url = bounty.get_absolute_url()
+    url = f'{bounty.get_absolute_url()}?{utm}'
     is_short = False
     for shortener in ['Tinyurl', 'Adfly', 'Isgd', 'QrCx']:
         try:

diff --git a/app/dashboard/router.py b/app/dashboard/router.py
@@ -307,7 +307,7 @@ class Meta:
             'fulfillment_started_on', 'fulfillment_submitted_on', 'canceled_on', 'web3_created', 'bounty_owner_address',
             'avatar_url', 'network', 'standard_bounties_id', 'github_org_name', 'interested', 'token_name', 'value_in_usdt',
             'keywords', 'value_in_token', 'project_type', 'is_open', 'expires_date', 'latest_activity', 'token_address',
-            'bounty_categories'
+            'bounty_categories', 'metadata'
         )
 
 

diff --git a/app/dashboard/templates/dashboard/explorer.html b/app/dashboard/templates/dashboard/explorer.html
@@ -405,7 +405,8 @@ <h3 class="featured-bounties__title">
                       <div class="tag token">[[ bountyFeat.rounded_amount ]] <span>[[ bountyFeat.token_name ]]</span></div>
                       <div class="tag usd">[[ bountyFeat.value_in_usdt ]] <span>USD</span></div>
                     </div>
-                    <a :href="bountyFeat.url" class="bounty-card__link">View Bounty</a>
+                    <a :href="`${bountyFeat.url}?utm_source=hypercharge-auto-prize-explorer&utm_medium=gitcoin&utm_campaign=${bountyFeat.title}`" class="bounty-card__link" v-if="bountyFeat.metadata.hypercharge_mode">View Bounty</a>
+                    <a :href="bountyFeat.url" class="bounty-card__link" v-else>View Bounty</a>
                   </div>
                 </div>
               </div>

diff --git a/app/dashboard/templates/dashboard/hackathon/hackathons.html b/app/dashboard/templates/dashboard/hackathon/hackathons.html
@@ -113,94 +113,7 @@ <h2 class="mt-4">Build with the coolest Web3 projects </h2>
           </ul>
         </div>
       </div>
-
-      <div class="row my-4">
-      {% if events|length %}
-      {% load date_fromisoformat timesince_fromisoformat %}
-      <div class="container custom-container">
-      <div class="row">
-      {% for event in events %}
-          <style>
-            #{{event.slug}} .card-header {
-              background: {{ event.background_color }};
-            }
-          </style>
-
-          <div class="col-xs-12 col-md-9 col-lg-8 col-xl-6 mx-auto hackathon-list {{ event.type }} {% if event.type != default_tab %}hidden{% endif %}">
-
-            <div class="card flex-row flex-wrap mb-5" id="{{ event.slug }}">
-
-              <div class="card-header text-center col-12 col-sm-4 px-0">
-                <a href="{% url 'hackathon' event.slug %}">
-                {% if event.logo %}
-                  <img class="hackathon-card-logo" src="{{ MEDIA_URL }}{{ event.logo }}" alt="Hackathon logo" />
-                {% else %}
-                  <div class="hackathon-card-logo text-center px-3 font-caption">
-                    {{ event.name }}
-                  </div>
-                {% endif %}
-                </a>
-              </div>
-
-              <div class="card-body col-12 col-sm-8">
-                <h5 class="font-subheader font-weight-semibold">
-                  <a href="{% url 'hackathon' event.slug %}" class="text-black" rel="noopener noreferrer">
-                    {{ event.name }}
-                  </a>
-                </h5>
-                <div class="font-smaller-2">
-                  <span class>From</span>
-                  <time class="font-weight-bold" datetime="{{ event.start_date|date_fromisoformat:'c' }}">{{ event.start_date|date_fromisoformat:"m/d/Y" }}</time>
-                  <span>To</span>
-                  <time class="font-weight-bold" datetime="{{ event.end_date|date_fromisoformat:'c' }}">{{ event.end_date|date_fromisoformat:"m/d/Y" }}</time>
-                </div>
-                <div class="mt-3 font-smaller-2 hackathon-summary">
-                  <p>{{ event.summary }}</p>
-                </div>
-                {% if event.sponsor_profiles|length %}
-                  <div class="mt-3 font-smaller-2">
-                    <span class="pr-1">Sponsored by</span>
-                    {% for sponsor in event.sponsor_profiles %}
-                      <a href="{{ sponsor.absolute_url }}" target="_blank"><img class="rounded-circle" style="width:21px;" src="{{ sponsor.avatar_url }}" /></a>
-                    {% endfor %}
-                  </div>
-                {% endif %}
-                <div class="mt-3 hackathon-actions">
-                  {% if event.end_date|timesince_fromisoformat <= "1 min" %}
-                    <a href="{% url 'hackathon_onboard' event.slug %}" class="btn btn-gc-blue font-caption font-weight-semibold px-3 mb-2">
-                      <i class="fas fa-user-plus mr-2 d-none d-sm-inline"></i>
-                      Join
-                    </a>
-                  {% endif %}
-                  {% if event.display_showcase %}
-                  <a href="{% url 'hackathon_showcase_proxy' event.slug %}" class="btn btn-gc-blue font-caption font-weight-semibold px-3 mb-2">
-                    <i class="fas fa-star d-none d-sm-inline" style="font-size:6.5px;position:relative;top:0.2rem;left:0.2rem;"></i>
-                    <i class="fas fa-star mr-1 d-none d-sm-inline"></i>
-                    Showcase
-                  </a>
-                  {% endif %}
-                  {% if event.start_date|timesince_fromisoformat >= "1 min" and event.end_date|timesince_fromisoformat <= "1 min"%}
-                    <a href="{% url 'hackathon_prizes' event.slug %}" class="btn button--secondary font-caption font-weight-semibold px-3 mb-2">
-                      <i class="fas fa-trophy mr-2 d-none d-sm-inline"></i>
-                      Prizes
-                    </a>
-                  {% endif %}
-                  {% if event.show_results %}
-                    <a href="{% url 'hackathon_projects' event.slug %}" class="btn button--secondary font-caption font-weight-semibold px-3 mb-2">
-                      <i class="fas fa-dharmachakra mr-2 d-none d-sm-inline"></i>
-                      Projects
-                    </a>
-                  {% endif %}
-                </div>
-              </div>
-            </div>
-          </div>
-      {% endfor %}
-      </div>
-      </div>
-      {% endif %}
-      </div>
-
+      {% include 'shared/hackathon-list.html' %}
     </div>
     {% include 'shared/analytics.html' %}
     {% include 'shared/footer_scripts.html' %}

diff --git a/app/dashboard/templates/onepager/base.html b/app/dashboard/templates/onepager/base.html
@@ -55,6 +55,11 @@
       .select2-container--default .select2-selection--single .select2-selection__arrow {
         height: 32px;
       }
+
+      img.hackathon-card-logo {
+        max-height: 12rem;
+        max-width: 9rem;
+      }
     </style>
 
     <script>

diff --git a/app/marketing/management/commands/hypercharge_mode.py b/app/marketing/management/commands/hypercharge_mode.py
@@ -31,12 +31,13 @@
 
 
 def make_secret_offer(profile, title, desc, bounty):
+    utm = f'utm_source=hypercharge-auto-secret&utm_medium=gitcoinbot&utm_campaign={bounty.title}'
     Offer.objects.create(
         created_by=profile,
         title=title,
         desc=desc,
         key='secret',
-        url=bounty.absolute_url,
+        url=f'{bounty.absolute_url}?{utm}',
         valid_from=timezone.now(),
         valid_to=timezone.now() + timezone.timedelta(hours=3),
         public=True,

diff --git a/app/retail/templates/emails/bounty.html b/app/retail/templates/emails/bounty.html
@@ -69,15 +69,15 @@
             {{ primer }}
           {% elif bounty.title %}
             {% if bounty.value_true and bounty.token_name %}
-              ({{ bounty.value_true|floatformat }} {{ bounty.token_name }}) - 
+              ({{ bounty.value_true|floatformat }} {{ bounty.token_name }}) -
             {% endif %}
             {{ bounty.title }}
           {% endif %}
           {% if prize %}</b>{% endif %}
         </p>
       </li>
     </ul>
-      
+
       {% if not small %}
         {% if bounty.keywords %}
           <p>
@@ -141,5 +141,5 @@
           </p>
         {%  endif %}
       {% endif %}
-    {% include 'emails/shared_bounty_actions.html' with prize=prize %}
+    {% include 'emails/shared_bounty_actions.html' with featured=featured prize=prize %}
 </div>
diff --git a/app/retail/templates/emails/bounty_hypercharged.html b/app/retail/templates/emails/bounty_hypercharged.html
@@ -26,7 +26,7 @@ <h1>{% trans "Checkout this bounty worth" %} {{ bounty.value_true|floatformat }}
 <p>Work on "{{ bounty.title }}" and receive {{ bounty.value_true|floatformat }} {{ bounty.token_name }}</p>
 
 <div style="margin-bottom: 1em; margin-top: 1em;">
-  <a class="button" href="{{ bounty.absolute_url }}">{% trans "View on Gitcoin.co" %}</a>
+  <a class="button" href="{{ bounty.absolute_url }}?utm_source=hypercharge-auto-notify&utm_medium=email&utm_campaign={{ bounty.title }}">{% trans "View on Gitcoin.co" %}</a>
 </div>
 
 <p>