Dolphin支持弹窗模板渲染
// ==UserScript==
// @name TemplateRender
// @namespace http://tampermonkey.net/
// @version 2024-05-14
// @description Dolphin支持弹窗模板渲染
// @author yangxiaodi
// @match https://cloud.bytedance.net/dolphin/cn/bizline/207/event/*
// @icon https://www.google.com/s2/favicons?sz=64&domain=tampermonkey.net
// @grant GM_addStyle
// @grant GM_xmlhttpRequest
// @grant unsafeWindow
// @license none
// ==/UserScript==
(function () {
'use strict';
GM_addStyle(`
#popup-preview-container{
width:25%;
border: 0.5px solid rgb(223,224,225);
margin-top:32px;
margin-bottom:24px;
}
#popup-preview{
width:100%;
height:100%;
}
#json-editor{
margin-top:32px;
width:25%;
}
`);
function loadCSS(href) {
var cssLink = document.createElement("link");
cssLink.rel = "stylesheet";
cssLink.type = "text/css";
cssLink.href = href;
document.getElementsByTagName("head")[0].appendChild(cssLink);
}
function loadScript(src) {
let script = document.createElement('script');
script.setAttribute('type', 'text/javascript');
script.src = src
document.documentElement.appendChild(script);
}
// 使用示例：
loadCSS("https://cdn.bootcdn.net/ajax/libs/jsoneditor/10.0.0/jsoneditor.min.css");
loadScript("https://cdn.bootcdn.net/ajax/libs/jsoneditor/10.0.0/jsoneditor.min.js");
let mock_data =
{
cache_data: {
upsells: {
sell_vip_type: "vip_end",
upsell_infos: {},
},
ads_config: {
ad_unit_configs: [
{
ad_supported_scene: {
ad_type: 2,
},
reward_advance_release_days: 2,
},
],
},
subscription: {
auto_renew_cancel_guidance: false,
subs_info: {
is_vip: false,
vip_stage: "",
play_entitlements: {
expire_at: new Date().getTime(),
reward_tasks_finished: 0,
reward_tasks_time_ms: [1800000, 1800000, -1],
video_complete_acquired_time_ms: [],
reward_finished_task_info: {
days_finished: 0,
tasks_finished: 0,
},
},
auto_renew_cancel_guidance: false,
},
to_purchase_offers: [
{
currency_code: "CNY",
external_offer_id: "luna.premium.month_renew_discount",
offer_id: "tdP2dk7ORJMZNZefyTax",
resource: {
resource_id: "357",
benefits: [
{
title: "会员曲库",
sub_title: "畅听千万会员曲库",
},
{
title: "下载特权",
sub_title: "300首/月付费歌曲免费下载",
},
{
title: "会员音质",
sub_title: "尊享高音质听歌体验",
},
],
offer_preview: {
name: "连续包月",
price: "1.00元",
selected: true,
promotion_info: {
origin_price: "8元",
promotion_label: "新用户专享价",
show_countdown: true,
countdown_duration: 3600000,
},
rich_desc: [
{
text: "到期续费8元/月，同一Apple ID仅可享受 1 次优惠",
text_color: "FFFFFF80",
},
],
},
purchase_btn: {
purchase_action_text: "1元开通",
colours: [
{
rgb: "#00CB64",
},
],
bubble_text: "",
},
user_agreement: [
{
text: "已阅读并同意",
text_color: "FFFFFF80",
},
{
link: "汽水音乐",
text: "《会员服务协议》",
text_color: "FFFFFF",
},
{
is_auto_renew_tip: true,
},
],
offer_params: {
type: "1_month_auto_renew",
},
},
amount: 1000000,
offer_type: "auto_renew",
offer_sub_type: "one_month_discount",
original_amount: 1000000,
// vip_stage: 'vip',
},
{
currency_code: "CNY",
external_offer_id: "com.luna.one_year_renew",
offer_id: "j8QDe2vIcxJHplLDw5vE",
resource: {
resource_id: "44",
benefits: [
{
title: "会员曲库",
sub_title: "畅听千万会员曲库",
},
{
title: "下载特权",
sub_title: "300首/月付费歌曲免费下载",
},
{
title: "会员音质",
sub_title: "尊享高音质听歌体验",
},
],
offer_preview: {
name: "连续包年",
price: "88.00元",
promotion_info: {
origin_price: "96元",
promotion_label: "单月最低",
},
rich_desc: [
{
text: "到期续费88元/年",
text_color: "FFFFFF80",
},
],
},
purchase_btn: {
purchase_action_text: "88元开通",
colours: [
{
rgb: "#00CB64",
},
],
bubble_text: "",
},
user_agreement: [
{
text: "已阅读并同意",
text_color: "FFFFFF80",
},
{
link: "汽水音乐",
text: "《会员服务协议》",
text_color: "FFFFFF",
},
{
is_auto_renew_tip: true,
},
],
offer_params: {
type: "12_month_auto_renew",
},
},
amount: 88000000,
offer_type: "auto_renew",
offer_sub_type: "12_month_plan",
original_amount: 88000000,
// vip_stage: 'vip',
},
{
currency_code: "CNY",
external_offer_id: "com.luna.premium_six_month",
offer_id: "rQ7lpcINVsgxK6U7NDTa",
resource: {
resource_id: "6",
benefits: [
{
title: "会员曲库",
sub_title: "畅听千万会员曲库",
},
{
title: "下载特权",
sub_title: "300首/月付费歌曲免费下载",
},
{
title: "会员音质",
sub_title: "尊享高音质听歌体验",
},
],
offer_preview: {
name: "6个月",
price: "45.00元",
promotion_info: {
origin_price: "48元",
},
},
purchase_btn: {
purchase_action_text: "45元开通",
colours: [
{
rgb: "#00CB64",
},
],
bubble_text: "",
},
user_agreement: [
{
text: "开通即同意",
text_color: "FFFFFF80",
},
{
link: "汽水音乐",
text: "《会员服务协议》",
text_color: "FFFFFF",
},
],
offer_params: {
type: "6_month",
},
},
amount: 45000000,
offer_type: "one_off",
offer_sub_type: "six_month_plan",
original_amount: 45000000
},
{
currency_code: "CNY",
external_offer_id: "com.luna.premium_12_month",
offer_id: "3RyrHt1PYpBanaSuGgIY",
resource: {
resource_id: "8",
benefits: [
{
title: "会员曲库",
sub_title: "畅听千万会员曲库",
},
{
title: "下载特权",
sub_title: "300首/月付费歌曲免费下载",
},
{
title: "会员音质",
sub_title: "尊享高音质听歌体验",
},
],
offer_preview: {
name: "12个月",
price: "88.00元",
promotion_info: {
origin_price: "96元",
},
},
purchase_btn: {
purchase_action_text: "88元开通",
colours: [
{
rgb: "#00CB64",
},
],
bubble_text: "",
},
user_agreement: [
{
text: "开通即同意",
text_color: "FFFFFF80",
},
{
link: "汽水音乐",
text: "《会员服务协议》",
text_color: "FFFFFF",
},
],
offer_params: {
type: "12_month",
},
},
amount: 88000000,
offer_type: "one_off",
offer_sub_type: "12_month_plan",
original_amount: 88000000
},
{
currency_code: "CNY",
external_offer_id: "com.luna.premium_one_month",
offer_id: "byf09hFJZQfd6YjcqXMi",
resource: {
resource_id: "2",
benefits: [
{
title: "会员曲库",
sub_title: "畅听千万会员曲库",
},
{
title: "下载特权",
sub_title: "300首/月付费歌曲免费下载",
},
{
title: "会员音质",
sub_title: "尊享高音质听歌体验",
},
],
offer_preview: {
name: "1个月",
price: "8.00元",
},
purchase_btn: {
purchase_action_text: "8元开通",
colours: [
{
rgb: "#00CB64",
},
],
bubble_text: "",
},
user_agreement: [
{
text: "开通即同意",
text_color: "FFFFFF80",
},
{
link: "汽水音乐",
text: "《会员服务协议》",
text_color: "FFFFFF",
},
],
offer_params: {
type: "1_month",
},
},
amount: 8000000,
offer_type: "one_off",
offer_sub_type: "one_month_plan",
original_amount: 8000000
},
],
},
},
upsell_scene: "reward_preview_popup_with_process_bar",
popup_template:
'{"version": 1, "templateID": "reward_preview_popup_with_process_bar", "content": [{"type": "top_bar", "presetData": "isPlayingInfo"}, {"type": "space", "size": 20}, {"type": "text", "preset": "reward_top_desc_heavy", "text": "当前VIP歌曲仅试听片段"}, {"type": "text", "preset": "reward_title", "text": "看视频免费听"}, {"type": "space", "size": 24}, {"type": "board_progress", "presetData": "adProcess"}, {"type": "space", "size": 24}, {"type": "button", "span": 11.5, "text": "开会员听整月", "action": "vip", "background": "#F3F3F3", "textColor": "#121212"}, {"type": "space", "size": 0, "span": 1}, {"type": "button", "span": 11.5, "text": "去看视频", "action": "ad", "background": ["#9BFF8A 0%", "#64E34F 100%"], "textColor": "#121212"}]}',
};
let editor = undefined;
let index = -1;
function createJsonEditor() {
let container = document.createElement('div');
container.id = "json-editor";
var options = { mode: 'text' };
editor = new JSONEditor(container, options, editor_data);
// 创建一个观察器实例并传入回调函数
let observer = new MutationObserver(callback);
// 开始观察目标节点
observer.observe(container, config);
let guard = document.getElementsByClassName("overflow-guard")[0];
container.style.height = guard.style.height;
return container
}
function isJSON(str) {
try {
JSON.parse(str);
return true;
} catch (e) {
return false;
}
}
let post = function () {
let popupTemplate = editor.get();
console.log(popupTemplate)
// 构造数据
let preview = document.getElementById("popup-preview");
if (preview == undefined) {
return
}
let preview_window = preview.contentWindow;
mock_data.popup_template = JSON.stringify(popupTemplate);
console.log(mock_data)
preview_window.postMessage(mock_data, 'https://luna-web-lynx-container.gf-boe.bytedance.net/web_lynx/index.html');
console.log("postMessage done")
}
let preview = function () {
let container = document.createElement('div');
container.id = "popup-preview-container";
let preview_format = `<iframe class="iframe" src="https://luna-web-lynx-container.gf-boe.bytedance.net/web_lynx/index.html" id="popup-preview"></iframe>`;
let parser = new DOMParser();
let previewWrapper = parser.parseFromString(preview_format, "text/html");
let editor = document.getElementById("json-editor");
let preview_dom = previewWrapper.body.firstChild
container.style.height = editor.style.height;
container.append(preview_dom)
return container
}
const config = { attributes: true, childList: true, subtree: true };
let callback = function (mutationsList, observer) {
post();
};
let editor_data = '关闭后重新加载';
setInterval(() => {
console.log("油猴监听中")
let modals = document.getElementsByClassName("arco-modal");
if (modals.length == 0) {
return
}
let modal = modals[0];
modal.style.width = "100vw";
let modal_contents = document.getElementsByClassName("arco-modal-content")
if (modal_contents.length == 0) {
return
}
let modal_content = modal_contents[0];
if (modal_content.lastChild.id == 'json-editor' || modal_content.lastChild.id == "popup-preview-container") {
return
}
console.log("click")
let edits = document.getElementsByClassName("dolphin-c64ade");
Array.from(edits).forEach(function (item, idx) {
let i = idx;
item.onclick = function (e) {
console.log("click")
index = i;
let modal_contents = document.getElementsByClassName("arco-modal-content");
if (modal_contents.length == 0) {
return
}
let modal_content = modal_contents[0];
if (modal_content.lastChild.id == "popup-preview-container") {
modal_content.removeChild(modal_content.lastChild);
modal_content.appendChild(preview());
}
editor_data = JSON.parse(document.getElementsByClassName("dolphin-1u46wo3")[i * 4 + 2].textContent);
editor.set(editor_data);
post();
}
})
let forms = document.getElementsByClassName("arco-form");
if (forms.length == 0) {
return
}
let form = forms[0];
form.style.width = "50%";
modal_content.style.display = 'flex';
//editor_data = JSON.parse(document.getElementsByClassName("dolphin-1u46wo3")[index * 4 + 2].textContent);
modal_content.appendChild(createJsonEditor());
modal_content.appendChild(preview());
}, 5000)
})();