diff --git a/app/app/context.py b/app/app/context.py index 459d2d5dc4e..0ae730252da 100644 --- a/app/app/context.py +++ b/app/app/context.py @@ -153,6 +153,7 @@ def preprocess(request): 'footer_msg': footer_msg, 'INFURA_V3_PROJECT_ID': settings.INFURA_V3_PROJECT_ID, 'email_key': email_key, + 'giphy_key': settings.GIPHY_KEY, 'orgs': profile.organizations if profile else [], 'profile_id': profile.id if profile else '', 'hotjar': settings.HOTJAR_CONFIG, diff --git a/app/app/local.env b/app/app/local.env index 6dd2aa9014f..9324b41626c 100644 --- a/app/app/local.env +++ b/app/app/local.env @@ -36,3 +36,4 @@ CONTACT_EMAIL= FEE_ADDRESS= FEE_ADDRESS_PRIVATE_KEY= +GIPHY_KEY= diff --git a/app/app/settings.py b/app/app/settings.py index e3e9349bbc9..c42ddc2dfc1 100644 --- a/app/app/settings.py +++ b/app/app/settings.py @@ -49,6 +49,8 @@ SECRET_KEY = env('SECRET_KEY', default='YOUR-SupEr-SecRet-KeY') ADMINS = (env.tuple('ADMINS', default=('TODO', 'todo@todo.net'))) BASE_DIR = root() +#social integrations +GIPHY_KEY = env('GIPHY_KEY', default='LtaY19ToaBSckiLU4QjW0kV9nIP75NFy') # Ratelimit RATELIMIT_ENABLE = env.bool('RATELIMIT_ENABLE', default=True) @@ -569,7 +571,6 @@ SOCIAL_AUTH_GH_CUSTOM_SECRET = GITHUB_CLIENT_SECRET SOCIAL_AUTH_GH_CUSTOM_SCOPE = ['read:org', 'public_repo'] - SOCIAL_AUTH_PIPELINE = ( 'social_core.pipeline.social_auth.social_details', 'social_core.pipeline.social_auth.social_uid', 'social_core.pipeline.social_auth.auth_allowed', 'social_core.pipeline.social_auth.social_user', diff --git a/app/assets/v2/css/town_square.css b/app/assets/v2/css/town_square.css index 29e03afb0aa..2558a37615e 100644 --- a/app/assets/v2/css/town_square.css +++ b/app/assets/v2/css/town_square.css @@ -383,8 +383,20 @@ a.offer_container.animate:hover .prize-gift::after { .offer_container.secret.empty{ display: none; } +.gif-grid { + display: flex; + width: 300px; + height: 450px; + flex-wrap: wrap; + overflow: scroll; + overflow-x: hidden; - +} +.pick-gif { + max-width: 300px; + max-height: 250px; + flex-grow: 1; +} div.back0, body.back0 { background: url('/static/v2/images/quests/backs/0.gif') repeat; diff --git a/app/assets/v2/js/lib/yall.min.js b/app/assets/v2/js/lib/yall.min.js new file mode 100644 index 00000000000..d8fd19ce8db --- /dev/null +++ b/app/assets/v2/js/lib/yall.min.js @@ -0,0 +1 @@ +var yall=function(){"use strict";return function(e){var n=(e=e||{}).lazyClass||"lazy",t=e.lazyBackgroundClass||"lazy-bg",o="idleLoadTimeout"in e?e.idleLoadTimeout:200,i=e.observeChanges||!1,r=e.events||{},a=window,s="requestIdleCallback",u="IntersectionObserver",c=["srcset","src","poster"],d=[],queryDOM=function(e,o){return d.slice.call((o||document).querySelectorAll(e||"img."+n+",video."+n+",iframe."+n+",."+t))},yallLoad=function(n){var o=n.parentNode;"PICTURE"==o.nodeName&&yallApplyFn(queryDOM("source",o),yallFlipDataAttrs),"VIDEO"==n.nodeName&&yallApplyFn(queryDOM("source",n),yallFlipDataAttrs),yallFlipDataAttrs(n),n.autoplay&&n.load();var i=n.classList;i.contains(t)&&(i.remove(t),i.add(e.lazyBackgroundLoaded||"lazy-bg-loaded"))},yallBindEvents=function(e){for(var n in r)e.addEventListener(n,r[n].listener||r[n],r[n].options||void 0)},yallFlipDataAttrs=function(e){var _loop=function(n){c[n]in e.dataset&&a.requestAnimationFrame((function(){e.setAttribute(c[n],e.dataset[c[n]])}))};for(var n in c)_loop(n)},yallApplyFn=function(e,n){for(var t=0;t { if (!document.contxt.github_handle) { - //elem.preventDefault(); _alert('Please login first.', 'error'); return; } $(elem).attr('disabled', true); - //elem.preventDefault(); const tribe = $(elem).data('jointribe'); const url = `/tribe/${tribe}/join/`; const sendJoin = fetchData (url, 'POST', {}, {'X-CSRFToken': $("input[name='csrfmiddlewaretoken']").val()}); @@ -57,7 +55,7 @@ const joinTribeDirect = (elem) => { }).fail(function(error) { $(elem).attr('disabled', false); }); -} +}; const tribeLeader = () => { diff --git a/app/assets/v2/js/pages/townsquare.js b/app/assets/v2/js/pages/townsquare.js index 38a8c74ed96..d5f0647bf3c 100644 --- a/app/assets/v2/js/pages/townsquare.js +++ b/app/assets/v2/js/pages/townsquare.js @@ -128,4 +128,42 @@ $(document).ready(function() { $('.announce .remove').click(function() { $(this).parents('.announce').remove(); }); + + function onIntersection(imageEntites, observer) { + imageEntites.forEach(image => { + if (image.isIntersecting) { + observer.unobserve(image.target); + image.target.src = image.target.dataset.src; + image.target.onload = () => image.target.classList.add('loaded'); + } + }); + } + const interactSettings = { + root: document.querySelector('.loader-container'), + rootMargin: '0px 200px 200px 200px', + threshold: 0.01 + }; + + function loadImages() { + if ('IntersectionObserver' in window) { + let images = [...document.querySelectorAll("img[loading='lazy']")]; + let observer = new IntersectionObserver(onIntersection, interactSettings); + + images.forEach(img => { + img.setAttribute('loading', ''); + observer.observe(img); + }); + } else { + const images = document.querySelectorAll("img[loading='lazy']"); + + images.forEach(img => { + img.src = img.dataset.src; + img.setAttribute('loading', ''); + }); + } + + window.setTimeout(loadImages, 700); + } + + loadImages(); }(jQuery)); diff --git a/app/assets/v2/js/status.js b/app/assets/v2/js/status.js index ec37afc24f6..25a53853693 100644 --- a/app/assets/v2/js/status.js +++ b/app/assets/v2/js/status.js @@ -1,9 +1,45 @@ const url_re = /https?:\/\/(www\.)?[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,10}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/; const youtube_re = /(?:https?:\/\/|\/\/)?(?:www\.|m\.)?(?:youtu\.be\/|youtube\.com\/(?:embed\/|v\/|watch\?v=|watch\?.+&v=))([\w-]{11})(?![\w-])/; +const giphy_re = /(?:https?:\/\/)?(?:media0\.)?(?:giphy\.com\/media\/)/; $(document).ready(function() { - embedded_resource = ''; + var embedded_resource = ''; + const GIPHY_API_KEY = document.contxt.giphy_key; + let button = document.querySelector('#btn_post'); + + function selectGif(e) { + embedded_resource = $(e.target).data('src'); + $('#preview-img').attr('src', embedded_resource); + $('#preview').show(); + $('#thumbnail').hide(); + } + + + function injectGiphy(query) { + const endpoint = 'https://api.giphy.com/v1/gifs/search?limit=13&api_key=' + GIPHY_API_KEY + '&offset=0&rating=G&lang=en&q=' + query; + const result = fetchData(endpoint); + + $.when(result).then(function(response) { + $('.pick-gif').remove(); + + for (let i = 0; i < response.data.length; i++) { + let item = response.data[i]; + let downsize = item.images.original.webp; + let preview = item.images.fixed_width_downsampled.webp; + + $('.gif-grid').append('' + item.slug + ''); + } + $('.pick-gif').on('click', selectGif); + }); + } + + $('#search-gif').on('input', function(e) { + e.preventDefault(); + const query = e.target.value; + + injectGiphy(query); + }); if (button) { button.addEventListener( @@ -31,6 +67,11 @@ $(document).ready(function() { const youtube = e.target.value.match(youtube_re); const no_lb = e.originalEvent.inputType !== 'insertLineBreak'; + // GIF has priority, no other display info allowed + if (typeof embedded_resource === 'string' && embedded_resource.match(giphy_re)) { + return; + } + if (youtube !== null && youtube[1].length === 11 && no_lb) { let videoId = youtube[1]; @@ -46,6 +87,7 @@ $(document).ready(function() { $('#thumbnail-img').attr('src', 'https://img.youtube.com/vi/' + videoId + '/default.jpg'); embedded_resource = youtube[0]; $('#thumbnail').show(); + $('#preview').hide(); } else { $('#thumbnail').hide(); $('#thumbnail-desc').text(''); @@ -75,6 +117,7 @@ $(document).ready(function() { embedded_resource = url; $('#thumbnail').show(); + $('#preview').hide(); } else { $('#thumbnail').hide(); $('#thumbnail-desc').text(''); @@ -192,18 +235,25 @@ $(document).ready(function() { const image = $('#thumbnail-img').attr('src'); const youtube = embedded_resource.match(youtube_re); - if (youtube !== null && youtube[1].length === 11) { + if (embedded_resource.match(giphy_re)) { + data.append('resource', 'gif'); + data.append('resourceProvider', 'giphy'); + data.append('resourceId', embedded_resource); + } else if (youtube !== null && youtube[1].length === 11) { data.append('resource', 'video'); data.append('resourceProvider', 'youtube'); data.append('resourceId', youtube[1]); + data.append('title', title); + data.append('description', description); + data.append('image', image); } else { data.append('resource', 'content'); data.append('resourceProvider', link); data.append('resourceId', embedded_resource); + data.append('title', title); + data.append('description', description); + data.append('image', image); } - data.append('title', title); - data.append('description', description); - data.append('image', image); } fetch('/api/v0.1/activity', { @@ -216,7 +266,9 @@ $(document).ready(function() { $('#thumbnail-title').text(''); $('#thumbnail-provider').text(''); $('#thumbnail-desc').text(''); - $('#thumbnail-img').attr(''); + $('#thumbnail-img').attr('src', ''); + $('#preview').hide(); + $('#preview-img').attr('src', ''); embedded_resource = ''; _alert( @@ -243,6 +295,8 @@ $(document).ready(function() { }) .catch(err => console.log('Error ', err)); } + + injectGiphy('latest'); }); window.addEventListener('DOMContentLoaded', function() { var button = document.querySelector('#emoji-button'); diff --git a/app/dashboard/export.py b/app/dashboard/export.py index ddee488d299..f985bfa1e0e 100644 --- a/app/dashboard/export.py +++ b/app/dashboard/export.py @@ -166,17 +166,7 @@ def get_created_at(self, instance): return instance.created.isoformat() def get_url(self, instance): - action = self.get_action(instance) - if action in ('bounty', ): - return instance.bounty.get_absolute_url() - - if action in ('kudos', ): - return instance.kudos.kudos_token.get_absolute_url() - - if action in ('profile', ): - return instance.profile.absolute_url - - return '' + return instance.action_url def get_action(self, instance): action = '' diff --git a/app/dashboard/templates/profiles/status_box.html b/app/dashboard/templates/profiles/status_box.html index b0372fae887..29a844a76ac 100644 --- a/app/dashboard/templates/profiles/status_box.html +++ b/app/dashboard/templates/profiles/status_box.html @@ -29,6 +29,22 @@ +
+
+ + +
+
+ diff --git a/app/dashboard/views.py b/app/dashboard/views.py index c30b702d83a..9fcb168be11 100644 --- a/app/dashboard/views.py +++ b/app/dashboard/views.py @@ -2455,7 +2455,7 @@ def profile_backup(request): # grants data["grants"] = GrantExportSerializer(profile.get_my_grants, many=True).data # portfolio, active work, bounties - portfolio_bounties = profile.fulfilled.filter(bounty__network='mainnet', bounty__current_bounty=True) + portfolio_bounties = profile.get_fulfilled_bounties() active_work = Bounty.objects.none() interests = profile.active_bounties for interest in interests: diff --git a/app/retail/templates/shared/activity.html b/app/retail/templates/shared/activity.html index d7683af52c5..2be7f6f951f 100644 --- a/app/retail/templates/shared/activity.html +++ b/app/retail/templates/shared/activity.html @@ -306,7 +306,14 @@ - {% if row.metadata.resource.provider == 'youtube' %} + + {% if row.metadata.resource.type == 'gif' %} +
+
+ +
+
+ {% elif row.metadata.resource.provider == 'youtube' %}