Всплывающее окно при скачивании файла

Поддержка форумов на phpBB 3.2.x
Аватара пользователя
romaamor

Всплывающее окно при скачивании файла

romaamor 11 авг 2018, 14:06 Сообщение

CabinetAdmin, как можно сделать так, что бы при нажатии - скачать файл, появлялось всплывающее окно или включалась новая вкладка с обратным отчётом ? После скажем истечения 15 секунд браузер подхватывал ссылку на скачивание как обычно.

Аватара пользователя
CabinetAdmin

Всплывающее окно при скачивании файла

CabinetAdmin 11 авг 2018, 16:06 Сообщение

Могу рассказать такой рецепт - обычная форма, после клика вместо названия появляется заданный отсчёт, после начнётся загрузка и опять появится название файла.
Создать форум бесплатно на http://luckbb.ru/
Хочешь поблагодарить? Есть способы Поддержать проект

Аватара пользователя
romaamor

Всплывающее окно при скачивании файла

romaamor 11 авг 2018, 16:26 Сообщение

Мне надо что бы реклама показывалась. :oooo:

Аватара пользователя
CabinetAdmin

Всплывающее окно при скачивании файла

CabinetAdmin 11 авг 2018, 17:06 Сообщение

Надо подумать...
Создать форум бесплатно на http://luckbb.ru/
Хочешь поблагодарить? Есть способы Поддержать проект

Аватара пользователя
CabinetAdmin

Всплывающее окно при скачивании файла

CabinetAdmin 11 авг 2018, 20:24 Сообщение

Пока что правкой кода, поскольку расширением можно только часть сделать. Завтра выложу рецепт.
Создать форум бесплатно на http://luckbb.ru/
Хочешь поблагодарить? Есть способы Поддержать проект

Аватара пользователя
romaamor

Всплывающее окно при скачивании файла

romaamor 11 авг 2018, 20:47 Сообщение

CabinetAdmin писал(а):Источник цитаты Пока что правкой кода

Не беда, думаю разберусь. Если нет - спрошу. :)

Аватара пользователя
CabinetAdmin

Всплывающее окно при скачивании файла

CabinetAdmin 12 авг 2018, 16:49 Сообщение

По колдовал сегодня ещё - фигня какая-то получается. Пускай даже это модальное окно, оно закрывается простым кликом вне окна и толку от рекламы никакой... По сути правильным решением конечно было бы новое окно, а это уже полноценное расширение.
Создать форум бесплатно на http://luckbb.ru/
Хочешь поблагодарить? Есть способы Поддержать проект

Аватара пользователя
romaamor

Всплывающее окно при скачивании файла

romaamor 12 авг 2018, 17:22 Сообщение

CabinetAdmin писал(а):Источник цитаты оно закрывается простым кликом вне окна и толку от рекламы никакой...

Так а смысл пользователю закрывать окно если он хочет скачать файл ? Он по любому будет смотреть рекламу скажем секунд 15 пока не появится ссылка на скачивание. Ссылка должна быть в окне или в новой вкладке, и отчёт времени. вот как к примеру тут - http://www.satdl.com/#section-producers

Аватара пользователя
CabinetAdmin

Всплывающее окно при скачивании файла

CabinetAdmin 13 авг 2018, 20:06 Сообщение

Вот что у меня сегодня получилось, на более свежую голову.

Принцип работы.
При клике на вложение будет открываться модальное окно с заголовком названием файла и таймером, по истечении которого ссылка на скачивание вложения станет доступна. При закрытии окна таймер останавливается и запускается с остановленного места при новом открытии этого же вложения.

Открываем файл attachment.html, находим:

Код: Выделить всё

<dt><!-- IF _file.UPLOAD_ICON -->{_file.UPLOAD_ICON} <!-- ENDIF --><a class="postlink" href="{_file.U_DOWNLOAD_LINK}">{_file.DOWNLOAD_NAME}</a>

и меняем на:

Код: Выделить всё

<dt><!-- IF _file.UPLOAD_ICON -->{_file.UPLOAD_ICON} <!-- ENDIF --> <div class="attach_download"><a class="postlink" href="{_file.U_DOWNLOAD_LINK}" onclick="return false;">{_file.DOWNLOAD_NAME}</a></div> <div class="attach-modal" style="display:none"> <div class="attach-content"> <div title="Закрыть" class="close"><i class="icon fa-times"></i></div> <h2>Скачивание <strong>{_file.DOWNLOAD_NAME}</strong></h2> <div class="attach-ads"> <!-- Блок с рекламой или баннером --> </div> <div id="timer_1">Ссылка будет доступна через <span class="fa-stack"><i class="icon icon-red fa-circle-o-notch fa-spin fa-fw fa-stack-2x"></i><span id="timer_num" class="fa-stack-1x" style="font-size:11px;"></span></span> сек.</div> <div id="timer_2" style="display:none"><a class="postlink" href="{_file.U_DOWNLOAD_LINK}">{_file.DOWNLOAD_NAME}</a></div> </div> </div>

Примечания.
  • По правильному, как учит поддержка phpbb, надо вынести слова в языковые файлы и использовать в коде переменные. Если вам плевать на это, можете смело копировать и менять как есть.
  • <!-- Блок с рекламой или баннером --> меняем на блок с баннером или рекламой.
  • В нынешнем варианте ссылка на вложение ведёт на само вложение и можно его скачать без всплывающего окна путём клика правой кнопки мыши, если хочется обрубить эту возможность, то надо заменить {_file.U_DOWNLOAD_LINK} (первый код) на #.

Открываем overall_footer.html и перед </body> добавляем:

Код: Выделить всё

<script type="text/javascript"> /* * Modal attach * phpBB 3.1.x, 3.2.x * Modified by: xaocZ ( CabinetAdmin ) * Support mod: http://cabinetadmina.ru */ (function($) { $('.attach_download').each(function() { var $attach = $(this), $attachmodal = $attach.next('.attach-modal'), $attachclose = $('.close'), timer_seconds = 10, // Число задержки в секундах int, openAttach = function() { $attachmodal.data('open',true).addClass('attach-open'); int = setInterval(function() { if (timer_seconds > 0) { timer_seconds--; $attachmodal.find('#timer_num').text(timer_seconds); } else { clearInterval(int); $attachmodal.find('#timer_1').css({'display' : 'none'}); $attachmodal.find('#timer_2').css({'display' : 'block'}); } }, 1000); $attachclose.focus(); return false; }, closeAttach = function() { $attachmodal.data('open',false).removeClass('attach-open'); clearInterval(int); }; $attachclose.on('click',function(e) { e.stopPropagation(); $attachmodal.data('open',true); }); $attach.on('click',function(e) { e.stopPropagation(); if( !$attachmodal.data('open') ) { openAttach(); $attachclose.on( 'click', function(e) { closeAttach(); } ); } else { if( $attachclose.val() === '' ) { closeAttach(); return false; } } }); }); })(jQuery); </script>

Количество секунд до появления ссылки помечено комментарием // Число задержки в секундах.

Открываем common.css вашего стиля и в самый конец добавляем:

Код: Выделить всё

/* Modal attach */ .attach-modal { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,0.8); z-index: 99999; -webkit-transition: opacity 400ms ease-in; -moz-transition: opacity 400ms ease-in; transition: opacity 400ms ease-in; display: none; pointer-events: none; } .attach-modal.attach-open { display: block !important; pointer-events: auto; } .attach-content { width: 50%; max-width: 560px; min-width: 220px; position: relative; margin: 10% auto; padding: 3em; background: #fff; text-align: center; } .attach-content h2 { margin: 0 0 1em; line-height: normal; font-size: 1.8em; } .attach-ads { margin-bottom: 20px; } .attach-ads img { max-width: 100%; } .attach-content .close { background: #606061; color: #ffffff; line-height: 26px; position: absolute; right: -12px; text-align: center; top: -10px; width: 24px; height: 24px; text-decoration: none; font-weight: 400; padding: 3px; border-radius: 50%; outline: none; cursor: pointer; } .attach-content .close .icon { font-size: 18px; padding-left: 2px; } .attach-content .close:hover { background: #D31141; }


Собственно всё.
Создать форум бесплатно на http://luckbb.ru/
Хочешь поблагодарить? Есть способы Поддержать проект

Аватара пользователя
romaamor

Всплывающее окно при скачивании файла

romaamor 13 авг 2018, 22:38 Сообщение

Видать где то ошибка. Клацаю на файл - вообще не чего. Не скачевается, нет окошка. :(

Аватара пользователя
CabinetAdmin

Всплывающее окно при скачивании файла

CabinetAdmin 14 авг 2018, 19:20 Сообщение

Стили наверно не подтянулись, опять кэш?
Создать форум бесплатно на http://luckbb.ru/
Хочешь поблагодарить? Есть способы Поддержать проект

Аватара пользователя
romaamor

Всплывающее окно при скачивании файла

romaamor 14 авг 2018, 20:24 Сообщение

CabinetAdmin писал(а):Источник цитаты Стили наверно не подтянулись, опять кэш?

Нет. Кеш не причём. Само собой что чистил.

Аватара пользователя
romaamor

Всплывающее окно при скачивании файла

romaamor 14 авг 2018, 21:01 Сообщение

Проверил на чистом просильвире, тестовом форуме - то же самое.

Аватара пользователя
CabinetAdmin

Всплывающее окно при скачивании файла

CabinetAdmin 14 авг 2018, 21:03 Сообщение

Давай ссылку на тестовый, а то у меня на моём тестовом работает.
Создать форум бесплатно на http://luckbb.ru/
Хочешь поблагодарить? Есть способы Поддержать проект

Аватара пользователя
romaamor

Всплывающее окно при скачивании файла

romaamor 14 авг 2018, 21:08 Сообщение

Последний раз редактировалось romaamor 14 авг 2018, 21:19, всего редактировалось 1 раз.



Похожие темы

Вернуться в «Поддержка phpBB 3.2.x»

Кто сейчас на конференции

Сейчас этот форум просматривают: нет зарегистрированных пользователей и 1 гость