From 1d4c7969b4c76352a1abd061962ef2c5487cb89b Mon Sep 17 00:00:00 2001 From: Viktor Baranov Date: Fri, 30 Jul 2021 18:52:29 +0300 Subject: [PATCH] Custom Ad --- apps/block_scout_web/assets/js/lib/ad.js | 48 +++++++++++++------ .../assets/js/lib/autocomplete.js | 8 ++-- apps/block_scout_web/assets/js/lib/text_ad.js | 10 ++++ apps/block_scout_web/assets/webpack.config.js | 42 +++------------- .../advertisement/text_ad/index.html.eex | 6 +-- .../templates/layout/app.html.eex | 2 +- 6 files changed, 58 insertions(+), 58 deletions(-) create mode 100644 apps/block_scout_web/assets/js/lib/text_ad.js diff --git a/apps/block_scout_web/assets/js/lib/ad.js b/apps/block_scout_web/assets/js/lib/ad.js index e6838d44d3..3c2b3d4d85 100644 --- a/apps/block_scout_web/assets/js/lib/ad.js +++ b/apps/block_scout_web/assets/js/lib/ad.js @@ -1,13 +1,9 @@ import $ from 'jquery' -$(function () { - if (showAd()) { - fetchTextAdData() - } -}) - function countImpressions (impressionUrl) { - $.get(impressionUrl) + if (impressionUrl) { + $.get(impressionUrl) + } } function showAd () { @@ -27,11 +23,25 @@ function showAd () { } } -function getTextAdData () { +function getTextAdData (customAds) { return new Promise((resolve) => { if (showAd()) { $.get('https://request-global.czilladx.com/serve/native.php?z=19260bf627546ab7242', function (data) { - resolve(data) + if (!data) { + if (customAds) { + try { + data = JSON.parse(customAds) + const ind = getRandomInt(0, data.length) + resolve(data[ind]) + } catch (_e) { + resolve(null) + } + } else { + resolve(null) + } + } else { + resolve(data) + } }) } else { resolve(null) @@ -39,24 +49,32 @@ function getTextAdData () { }) } -function fetchTextAdData () { +function fetchTextAdData (customAds) { if (showAd()) { - getTextAdData() + getTextAdData(customAds) .then(data => { if (data) { const { ad: { name, description_short: descriptionShort, thumbnail, url, cta_button: ctaButton, impressionUrl } } = data - $('.ad').removeClass('d-none') $('.ad-name').text(name) $('.ad-short-description').text(descriptionShort) $('.ad-cta-button').text(ctaButton) $('.ad-url').attr('href', url) - $('.ad-img-url').attr('src', thumbnail) + const urlObject = new URL(url) + if (urlObject.hostname === 'nifty.ink') { + $('.ad-img-url').replaceWith('🎨') + } else { + $('.ad-img-url').attr('src', thumbnail) + } countImpressions(impressionUrl) - } else { - $('.ad').addClass('d-none') } }) } } +function getRandomInt (min, max) { + min = Math.ceil(min) + max = Math.floor(max) + return Math.floor(Math.random() * (max - min)) + min +} + export { showAd, getTextAdData, fetchTextAdData } diff --git a/apps/block_scout_web/assets/js/lib/autocomplete.js b/apps/block_scout_web/assets/js/lib/autocomplete.js index 8732ca4f5b..bd834a7c32 100644 --- a/apps/block_scout_web/assets/js/lib/autocomplete.js +++ b/apps/block_scout_web/assets/js/lib/autocomplete.js @@ -2,6 +2,8 @@ import AutoComplete from '@tarekraafat/autocomplete.js/dist/autoComplete.js' import { getTextAdData, fetchTextAdData } from './ad.js' import { DateTime } from 'luxon' +const customAds = process.env.CUSTOM_ADS + const placeHolder = 'Search by address, token symbol, name, transaction hash, or block number' const dataSrc = async (query, id) => { try { @@ -28,7 +30,7 @@ const dataSrc = async (query, id) => { const resultsListElement = (list, data) => { const info = document.createElement('p') const adv = ` -
+
Sponsored: -
` info.innerHTML = adv @@ -40,7 +42,7 @@ const resultsListElement = (list, data) => { list.prepend(info) - fetchTextAdData() + fetchTextAdData(customAds) } const searchEngine = (query, record) => { if (record.name.toLowerCase().includes(query.toLowerCase()) || @@ -137,7 +139,7 @@ const openOnFocus = (event, type) => { autoCompleteJSMobile.start(query) } } else { - getTextAdData() + getTextAdData(customAds) .then(adData => { if (adData) { if (type === 'desktop') { diff --git a/apps/block_scout_web/assets/js/lib/text_ad.js b/apps/block_scout_web/assets/js/lib/text_ad.js new file mode 100644 index 0000000000..10660cee24 --- /dev/null +++ b/apps/block_scout_web/assets/js/lib/text_ad.js @@ -0,0 +1,10 @@ +import $ from 'jquery' +import { showAd, fetchTextAdData } from './ad.js' + +const customAds = process.env.CUSTOM_ADS + +$(function () { + if (showAd()) { + fetchTextAdData(customAds) + } +}) diff --git a/apps/block_scout_web/assets/webpack.config.js b/apps/block_scout_web/assets/webpack.config.js index 3cf96477a0..dc077d364e 100644 --- a/apps/block_scout_web/assets/webpack.config.js +++ b/apps/block_scout_web/assets/webpack.config.js @@ -32,39 +32,6 @@ const jsOptimizationParams = { parallel: true } -const autocompleteJs = { - entry: { - autocomplete: './js/lib/autocomplete.js', - }, - output: { - filename: '[name].min.js', - path: path.resolve(__dirname, '../priv/static/js') - }, - module: { - rules: [ - { - test: /\.css$/, - use: [ - MiniCssExtractPlugin.loader, - { - loader: 'css-loader', - } - ] - } - ] - }, - optimization: { - minimizer: [ - new TerserJSPlugin(jsOptimizationParams), - ] - }, - plugins: [ - new MiniCssExtractPlugin({ - filename: '../css/autocomplete.css' - }) - ] -} - const dropzoneJs = { entry: { dropzone: './js/lib/dropzone.js', @@ -126,7 +93,9 @@ const appJs = 'main-page': './css/main-page.scss', 'tokens': './js/pages/token/search.js', 'ad': './js/lib/ad.js', - 'banner': './js/lib/banner.js' + 'text_ad': './js/lib/text_ad.js', + 'banner': './js/lib/banner.js', + 'autocomplete': './js/lib/autocomplete.js', }, output: { filename: '[name].js', @@ -202,7 +171,8 @@ const appJs = ), new ContextReplacementPlugin(/moment[\/\\]locale$/, /en/), new webpack.DefinePlugin({ - 'process.env.SOCKET_ROOT': JSON.stringify(process.env.SOCKET_ROOT) + 'process.env.SOCKET_ROOT': JSON.stringify(process.env.SOCKET_ROOT), + 'process.env.CUSTOM_ADS': JSON.stringify(process.env.CUSTOM_ADS) }), new webpack.ProvidePlugin({ process: 'process/browser', @@ -213,4 +183,4 @@ const appJs = const viewScripts = glob.sync('./js/view_specific/**/*.js').map(transpileViewScript) -module.exports = viewScripts.concat(appJs, autocompleteJs, dropzoneJs) +module.exports = viewScripts.concat(appJs, dropzoneJs) diff --git a/apps/block_scout_web/lib/block_scout_web/templates/advertisement/text_ad/index.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/advertisement/text_ad/index.html.eex index 33cfff87dd..1db3412a38 100644 --- a/apps/block_scout_web/lib/block_scout_web/templates/advertisement/text_ad/index.html.eex +++ b/apps/block_scout_web/lib/block_scout_web/templates/advertisement/text_ad/index.html.eex @@ -1,4 +1,4 @@ - -
+ +
Sponsored: - -
\ No newline at end of file +
\ No newline at end of file diff --git a/apps/block_scout_web/lib/block_scout_web/templates/layout/app.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/layout/app.html.eex index cb98a8f672..1117ef0410 100644 --- a/apps/block_scout_web/lib/block_scout_web/templates/layout/app.html.eex +++ b/apps/block_scout_web/lib/block_scout_web/templates/layout/app.html.eex @@ -278,6 +278,6 @@ } } - +