更新
This commit is contained in:
@@ -0,0 +1,238 @@
|
||||
"use strict";
|
||||
var __defProp = Object.defineProperty;
|
||||
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
||||
var __publicField = (obj, key, value) => {
|
||||
__defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
||||
return value;
|
||||
};
|
||||
const common_vendor = require("../../common/vendor.js");
|
||||
class AudioPool {
|
||||
constructor(src, size, volume = 1) {
|
||||
__publicField(this, "list", []);
|
||||
__publicField(this, "cursor", 0);
|
||||
__publicField(this, "warmedUp", false);
|
||||
__publicField(this, "targetVolume", 1);
|
||||
this.src = src;
|
||||
this.size = size;
|
||||
this.targetVolume = volume;
|
||||
}
|
||||
create() {
|
||||
for (let i = 0; i < this.size; i++) {
|
||||
const ctx = common_vendor.index.createInnerAudioContext();
|
||||
ctx.src = this.src;
|
||||
ctx.obeyMuteSwitch = false;
|
||||
ctx.autoplay = false;
|
||||
ctx.volume = this.targetVolume;
|
||||
this.list.push(ctx);
|
||||
}
|
||||
}
|
||||
setVolume(volume) {
|
||||
this.targetVolume = Math.max(0, Math.min(1, volume));
|
||||
this.list.forEach((ctx) => {
|
||||
try {
|
||||
ctx.volume = this.targetVolume;
|
||||
} catch (_) {
|
||||
}
|
||||
});
|
||||
}
|
||||
/**
|
||||
* 预热:短暂播放,让音频文件下载/解码到内存
|
||||
* 真正首次 play 不会再卡冷启动
|
||||
*/
|
||||
warmUp() {
|
||||
if (this.warmedUp)
|
||||
return;
|
||||
if (this.list.length === 0)
|
||||
this.create();
|
||||
this.list.forEach((ctx) => {
|
||||
try {
|
||||
ctx.volume = 0;
|
||||
ctx.play();
|
||||
setTimeout(() => {
|
||||
try {
|
||||
ctx.stop();
|
||||
ctx.volume = this.targetVolume;
|
||||
} catch (_) {
|
||||
}
|
||||
}, 60);
|
||||
} catch (_) {
|
||||
}
|
||||
});
|
||||
this.warmedUp = true;
|
||||
}
|
||||
play() {
|
||||
if (this.list.length === 0) {
|
||||
this.create();
|
||||
this.warmUp();
|
||||
}
|
||||
const ctx = this.list[this.cursor];
|
||||
this.cursor = (this.cursor + 1) % this.list.length;
|
||||
try {
|
||||
this.list.forEach((c) => {
|
||||
try {
|
||||
c.stop();
|
||||
} catch (_) {
|
||||
}
|
||||
});
|
||||
ctx.play();
|
||||
} catch (_) {
|
||||
try {
|
||||
ctx.play();
|
||||
} catch (__) {
|
||||
}
|
||||
}
|
||||
}
|
||||
destroy() {
|
||||
this.list.forEach((ctx) => {
|
||||
var _a;
|
||||
try {
|
||||
(_a = ctx.destroy) == null ? void 0 : _a.call(ctx);
|
||||
} catch (_) {
|
||||
}
|
||||
});
|
||||
this.list = [];
|
||||
this.warmedUp = false;
|
||||
}
|
||||
}
|
||||
const DEFAULT_CLICK_SRC = "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/file/20260526/20260526105128557ef8669.mp3";
|
||||
function useMetronome(options = {}) {
|
||||
const {
|
||||
initialBpm = 80,
|
||||
bpmMin = 40,
|
||||
bpmMax = 240,
|
||||
clickSrc = DEFAULT_CLICK_SRC,
|
||||
accentSrc,
|
||||
poolSize = 4,
|
||||
volume = 1,
|
||||
silent = false,
|
||||
onBeat
|
||||
} = options;
|
||||
const bpm = common_vendor.ref(initialBpm);
|
||||
const isPlaying = common_vendor.ref(false);
|
||||
const beatIndex = common_vendor.ref(0);
|
||||
const isAccent = common_vendor.ref(false);
|
||||
const accentEveryRef = common_vendor.ref(options.accentEvery ?? 4);
|
||||
const intervalMs = common_vendor.computed(() => 6e4 / bpm.value);
|
||||
let clickPool = null;
|
||||
let accentPool = null;
|
||||
let timer = null;
|
||||
let nextTickAt = 0;
|
||||
const ensureAudio = () => {
|
||||
if (silent)
|
||||
return;
|
||||
if (!clickPool) {
|
||||
clickPool = new AudioPool(clickSrc, poolSize, volume);
|
||||
clickPool.warmUp();
|
||||
}
|
||||
if (accentSrc && !accentPool) {
|
||||
accentPool = new AudioPool(accentSrc, Math.max(2, Math.ceil(poolSize / 2)), volume);
|
||||
accentPool.warmUp();
|
||||
}
|
||||
};
|
||||
const playSound = (accent) => {
|
||||
if (accent && accentPool) {
|
||||
accentPool.play();
|
||||
} else if (clickPool) {
|
||||
clickPool.play();
|
||||
}
|
||||
};
|
||||
const tick = () => {
|
||||
if (!isPlaying.value)
|
||||
return;
|
||||
const every = Math.max(1, accentEveryRef.value);
|
||||
const accent = beatIndex.value % every === 0;
|
||||
isAccent.value = accent;
|
||||
playSound(accent);
|
||||
onBeat == null ? void 0 : onBeat(beatIndex.value, accent);
|
||||
beatIndex.value++;
|
||||
nextTickAt += intervalMs.value;
|
||||
const nextDelay = Math.max(0, nextTickAt - Date.now());
|
||||
timer = setTimeout(tick, nextDelay);
|
||||
};
|
||||
const start = () => {
|
||||
if (isPlaying.value)
|
||||
return;
|
||||
ensureAudio();
|
||||
isPlaying.value = true;
|
||||
beatIndex.value = 0;
|
||||
nextTickAt = Date.now();
|
||||
tick();
|
||||
};
|
||||
const stop = () => {
|
||||
isPlaying.value = false;
|
||||
if (timer) {
|
||||
clearTimeout(timer);
|
||||
timer = null;
|
||||
}
|
||||
};
|
||||
const setBpm = (val) => {
|
||||
bpm.value = Math.max(bpmMin, Math.min(bpmMax, Math.round(val)));
|
||||
};
|
||||
const setAccentEvery = (n) => {
|
||||
accentEveryRef.value = Math.max(1, Math.min(16, Math.round(n)));
|
||||
beatIndex.value = 0;
|
||||
};
|
||||
const updateAudioSrc = (newClickSrc, newAccentSrc) => {
|
||||
const wasPlaying = isPlaying.value;
|
||||
if (wasPlaying)
|
||||
stop();
|
||||
clickPool == null ? void 0 : clickPool.destroy();
|
||||
accentPool == null ? void 0 : accentPool.destroy();
|
||||
clickPool = null;
|
||||
accentPool = null;
|
||||
clickPool = new AudioPool(newClickSrc, poolSize);
|
||||
if (newAccentSrc) {
|
||||
accentPool = new AudioPool(newAccentSrc, Math.max(2, Math.ceil(poolSize / 2)));
|
||||
}
|
||||
const previewCtx = common_vendor.index.createInnerAudioContext();
|
||||
previewCtx.src = newClickSrc;
|
||||
previewCtx.obeyMuteSwitch = false;
|
||||
previewCtx.volume = 0.4;
|
||||
try {
|
||||
previewCtx.play();
|
||||
setTimeout(() => {
|
||||
var _a;
|
||||
try {
|
||||
(_a = previewCtx.destroy) == null ? void 0 : _a.call(previewCtx);
|
||||
} catch (_) {
|
||||
}
|
||||
}, 500);
|
||||
} catch (_) {
|
||||
}
|
||||
if (wasPlaying)
|
||||
start();
|
||||
};
|
||||
const preload = () => {
|
||||
try {
|
||||
common_vendor.index.setInnerAudioOption({
|
||||
obeyMuteSwitch: false,
|
||||
mixWithOther: true
|
||||
});
|
||||
} catch (_) {
|
||||
}
|
||||
ensureAudio();
|
||||
};
|
||||
common_vendor.onUnmounted(() => {
|
||||
stop();
|
||||
clickPool == null ? void 0 : clickPool.destroy();
|
||||
accentPool == null ? void 0 : accentPool.destroy();
|
||||
clickPool = null;
|
||||
accentPool = null;
|
||||
});
|
||||
return {
|
||||
bpm,
|
||||
isPlaying,
|
||||
beatIndex,
|
||||
isAccent,
|
||||
intervalMs,
|
||||
accentEvery: accentEveryRef,
|
||||
start,
|
||||
stop,
|
||||
setBpm,
|
||||
setAccentEvery,
|
||||
updateAudioSrc,
|
||||
preload
|
||||
};
|
||||
}
|
||||
exports.useMetronome = useMetronome;
|
||||
//# sourceMappingURL=../../../.sourcemap/mp-weixin/training/hooks/useMetronome.js.map
|
||||
+466
@@ -0,0 +1,466 @@
|
||||
"use strict";
|
||||
const common_vendor = require("../../../common/vendor.js");
|
||||
const _sfc_main = /* @__PURE__ */ common_vendor.defineComponent({
|
||||
__name: "crush-canvas",
|
||||
props: {
|
||||
crushSignal: {}
|
||||
},
|
||||
setup(__props) {
|
||||
const CRUSH_ITEMS = {
|
||||
egg: {
|
||||
colors: ["#FFEB3B", "#FFF59D", "#FFFFFF", "#FFD54F", "#FFC107"],
|
||||
sparkColors: ["#FFFFFF", "#FFF9C4", "#FFEE58"],
|
||||
shapes: ["circle", "circle", "circle"],
|
||||
debrisCount: 20,
|
||||
sparkCount: 16,
|
||||
sparkleCount: 5,
|
||||
speedMin: 3,
|
||||
speedMax: 6,
|
||||
sizeMin: 4,
|
||||
sizeMax: 10,
|
||||
gravity: 0.34,
|
||||
flashColor: "#FFFDE7",
|
||||
shockwaveColor: "rgba(255, 224, 130, 0.85)"
|
||||
},
|
||||
walnut: {
|
||||
colors: ["#5D4037", "#795548", "#8D6E63", "#A1887F", "#3E2723"],
|
||||
sparkColors: ["#FFCC80", "#FFB74D", "#FFE0B2"],
|
||||
shapes: ["square", "triangle", "rect"],
|
||||
debrisCount: 22,
|
||||
sparkCount: 18,
|
||||
sparkleCount: 5,
|
||||
speedMin: 2.8,
|
||||
speedMax: 5,
|
||||
sizeMin: 4,
|
||||
sizeMax: 9,
|
||||
gravity: 0.42,
|
||||
flashColor: "#FFE0B2",
|
||||
shockwaveColor: "rgba(255, 167, 38, 0.8)"
|
||||
},
|
||||
can: {
|
||||
colors: ["#90A4AE", "#CFD8DC", "#B0BEC5", "#78909C", "#ECEFF1", "#607D8B"],
|
||||
sparkColors: ["#FFFFFF", "#E1F5FE", "#B3E5FC"],
|
||||
shapes: ["rect", "rect", "triangle", "square"],
|
||||
debrisCount: 24,
|
||||
sparkCount: 20,
|
||||
sparkleCount: 6,
|
||||
speedMin: 4,
|
||||
speedMax: 7,
|
||||
sizeMin: 3,
|
||||
sizeMax: 11,
|
||||
gravity: 0.36,
|
||||
flashColor: "#FFFFFF",
|
||||
shockwaveColor: "rgba(207, 216, 220, 0.9)"
|
||||
},
|
||||
balloon: {
|
||||
colors: ["#FF5252", "#FF4081", "#E040FB", "#7C4DFF", "#536DFE", "#448AFF", "#FFEB3B", "#69F0AE", "#FF6E40"],
|
||||
sparkColors: ["#FFFFFF", "#FF80AB", "#82B1FF", "#FFFF8D"],
|
||||
shapes: ["rect", "rect", "square"],
|
||||
debrisCount: 28,
|
||||
sparkCount: 18,
|
||||
sparkleCount: 8,
|
||||
speedMin: 4,
|
||||
speedMax: 7.5,
|
||||
sizeMin: 4,
|
||||
sizeMax: 8,
|
||||
gravity: 0.14,
|
||||
flashColor: "#FCE4EC",
|
||||
shockwaveColor: "rgba(255, 64, 129, 0.85)",
|
||||
confetti: true
|
||||
}
|
||||
};
|
||||
const PHYSICS = {
|
||||
AIR_RESISTANCE: 0.985,
|
||||
SPARK_RESISTANCE: 0.92,
|
||||
DEBRIS_DECAY: 0.018,
|
||||
SPARK_DECAY: 0.035,
|
||||
SPARKLE_DECAY: 0.045,
|
||||
FLASH_DECAY: 0.11,
|
||||
SHOCKWAVE_DECAY: 0.045
|
||||
};
|
||||
const canvasNode = common_vendor.ref(null);
|
||||
const ctx = common_vendor.ref(null);
|
||||
const canvasWidth = common_vendor.ref(240);
|
||||
const canvasHeight = common_vendor.ref(240);
|
||||
const dpr = common_vendor.ref(1);
|
||||
const rafId = common_vendor.ref(null);
|
||||
const renderRunning = common_vendor.ref(false);
|
||||
const debrisList = common_vendor.ref([]);
|
||||
const sparkList = common_vendor.ref([]);
|
||||
const sparkleList = common_vendor.ref([]);
|
||||
const flashList = common_vendor.ref([]);
|
||||
const shockwaves = common_vendor.ref([]);
|
||||
const instance = common_vendor.getCurrentInstance();
|
||||
const props = __props;
|
||||
common_vendor.watch(
|
||||
() => props.crushSignal,
|
||||
(sig) => {
|
||||
if (sig)
|
||||
triggerCrush(sig.type);
|
||||
}
|
||||
);
|
||||
common_vendor.onMounted(() => {
|
||||
initCanvas();
|
||||
});
|
||||
common_vendor.onBeforeUnmount(() => {
|
||||
cleanup();
|
||||
});
|
||||
function initCanvas() {
|
||||
setTimeout(() => {
|
||||
if (!instance)
|
||||
return;
|
||||
const query = common_vendor.index.createSelectorQuery().in(instance);
|
||||
query.select("#crush").fields({ node: true, size: true }).exec((res) => {
|
||||
if (!res || !res[0] || !res[0].node) {
|
||||
common_vendor.index.__f__("warn", "at training/pages/components/crush-canvas.vue:239", "[crush-canvas] canvas 2d not supported on this platform");
|
||||
return;
|
||||
}
|
||||
const canvas = res[0].node;
|
||||
const width = res[0].width;
|
||||
const height = res[0].height;
|
||||
const systemInfo = common_vendor.index.getSystemInfoSync();
|
||||
const pixelRatio = systemInfo.pixelRatio || 1;
|
||||
canvas.width = width * pixelRatio;
|
||||
canvas.height = height * pixelRatio;
|
||||
const context = canvas.getContext("2d");
|
||||
context.scale(pixelRatio, pixelRatio);
|
||||
canvasNode.value = canvas;
|
||||
ctx.value = context;
|
||||
canvasWidth.value = width;
|
||||
canvasHeight.value = height;
|
||||
dpr.value = pixelRatio;
|
||||
});
|
||||
}, 200);
|
||||
}
|
||||
function triggerCrush(itemType) {
|
||||
if (!ctx.value || !canvasNode.value)
|
||||
return;
|
||||
const item = CRUSH_ITEMS[itemType];
|
||||
if (!item)
|
||||
return;
|
||||
const centerX = canvasWidth.value / 2;
|
||||
const centerY = canvasHeight.value / 2;
|
||||
const maxR = Math.min(canvasWidth.value, canvasHeight.value);
|
||||
flashList.value.push({
|
||||
x: centerX,
|
||||
y: centerY,
|
||||
radius: maxR * 0.12,
|
||||
maxRadius: maxR * 0.62,
|
||||
color: item.flashColor,
|
||||
life: 1,
|
||||
decay: PHYSICS.FLASH_DECAY
|
||||
});
|
||||
shockwaves.value.push({
|
||||
x: centerX,
|
||||
y: centerY,
|
||||
radius: 12,
|
||||
maxRadius: maxR * 0.62,
|
||||
color: item.shockwaveColor,
|
||||
width: 5,
|
||||
life: 1,
|
||||
decay: PHYSICS.SHOCKWAVE_DECAY
|
||||
});
|
||||
shockwaves.value.push({
|
||||
x: centerX,
|
||||
y: centerY,
|
||||
radius: 4,
|
||||
maxRadius: maxR * 0.42,
|
||||
color: item.shockwaveColor,
|
||||
width: 3,
|
||||
life: 1,
|
||||
decay: PHYSICS.SHOCKWAVE_DECAY * 1.3
|
||||
});
|
||||
for (let i = 0; i < item.debrisCount; i++) {
|
||||
const angle = Math.PI * 2 * i / item.debrisCount + (Math.random() - 0.5) * 0.7;
|
||||
const speed = item.speedMin + Math.random() * (item.speedMax - item.speedMin);
|
||||
const size = item.sizeMin + Math.random() * (item.sizeMax - item.sizeMin);
|
||||
const color = item.colors[Math.floor(Math.random() * item.colors.length)];
|
||||
const shape = item.shapes[Math.floor(Math.random() * item.shapes.length)];
|
||||
const confetti = !!item.confetti;
|
||||
const vy0 = confetti ? Math.sin(angle) * speed - 2.5 : Math.sin(angle) * speed;
|
||||
debrisList.value.push({
|
||||
x: centerX,
|
||||
y: centerY,
|
||||
vx: Math.cos(angle) * speed,
|
||||
vy: vy0,
|
||||
size,
|
||||
color,
|
||||
shape,
|
||||
rotation: Math.random() * Math.PI * 2,
|
||||
rotationSpeed: (Math.random() - 0.5) * (confetti ? 0.5 : 0.3),
|
||||
life: 1,
|
||||
decay: PHYSICS.DEBRIS_DECAY * (confetti ? 0.7 : 1),
|
||||
gravity: item.gravity,
|
||||
glow: !confetti,
|
||||
// 彩纸不发光,实色碎片发光
|
||||
swing: confetti ? 0.6 + Math.random() * 1.2 : 0,
|
||||
age: Math.random() * Math.PI * 2
|
||||
});
|
||||
}
|
||||
for (let i = 0; i < item.sparkCount; i++) {
|
||||
const angle = Math.random() * Math.PI * 2;
|
||||
const speed = item.speedMax * (0.9 + Math.random() * 0.8);
|
||||
const color = item.sparkColors[Math.floor(Math.random() * item.sparkColors.length)];
|
||||
sparkList.value.push({
|
||||
x: centerX,
|
||||
y: centerY,
|
||||
px: centerX,
|
||||
py: centerY,
|
||||
vx: Math.cos(angle) * speed,
|
||||
vy: Math.sin(angle) * speed,
|
||||
size: 1.5 + Math.random() * 2,
|
||||
color,
|
||||
life: 1,
|
||||
decay: PHYSICS.SPARK_DECAY * (0.8 + Math.random() * 0.6),
|
||||
gravity: item.gravity * 0.3
|
||||
});
|
||||
}
|
||||
for (let i = 0; i < item.sparkleCount; i++) {
|
||||
const r = maxR * (0.08 + Math.random() * 0.32);
|
||||
const a = Math.random() * Math.PI * 2;
|
||||
const color = item.sparkColors[Math.floor(Math.random() * item.sparkColors.length)];
|
||||
sparkleList.value.push({
|
||||
x: centerX + Math.cos(a) * r,
|
||||
y: centerY + Math.sin(a) * r,
|
||||
size: 10 + Math.random() * 16,
|
||||
rotation: Math.random() * Math.PI,
|
||||
spin: (Math.random() - 0.5) * 0.16,
|
||||
color,
|
||||
life: 1 + Math.random() * 0.4,
|
||||
// 错峰出现
|
||||
decay: PHYSICS.SPARKLE_DECAY * (0.8 + Math.random() * 0.5)
|
||||
});
|
||||
}
|
||||
ensureRenderLoop();
|
||||
}
|
||||
function ensureRenderLoop() {
|
||||
if (renderRunning.value)
|
||||
return;
|
||||
renderRunning.value = true;
|
||||
renderLoop();
|
||||
}
|
||||
function renderLoop() {
|
||||
if (!canvasNode.value || !ctx.value) {
|
||||
renderRunning.value = false;
|
||||
return;
|
||||
}
|
||||
const w = canvasWidth.value;
|
||||
const h = canvasHeight.value;
|
||||
for (let i = debrisList.value.length - 1; i >= 0; i--) {
|
||||
const p = debrisList.value[i];
|
||||
p.vy += p.gravity;
|
||||
p.vx *= PHYSICS.AIR_RESISTANCE;
|
||||
p.vy *= PHYSICS.AIR_RESISTANCE;
|
||||
p.x += p.vx;
|
||||
p.y += p.vy;
|
||||
p.age += 0.2;
|
||||
if (p.swing > 0)
|
||||
p.x += Math.sin(p.age) * p.swing;
|
||||
p.rotation += p.rotationSpeed;
|
||||
p.life -= p.decay;
|
||||
if (p.life <= 0 || p.x < -60 || p.x > w + 60 || p.y > h + 60) {
|
||||
debrisList.value.splice(i, 1);
|
||||
}
|
||||
}
|
||||
for (let i = sparkList.value.length - 1; i >= 0; i--) {
|
||||
const s = sparkList.value[i];
|
||||
s.px = s.x;
|
||||
s.py = s.y;
|
||||
s.vy += s.gravity;
|
||||
s.vx *= PHYSICS.SPARK_RESISTANCE;
|
||||
s.vy *= PHYSICS.SPARK_RESISTANCE;
|
||||
s.x += s.vx;
|
||||
s.y += s.vy;
|
||||
s.life -= s.decay;
|
||||
if (s.life <= 0)
|
||||
sparkList.value.splice(i, 1);
|
||||
}
|
||||
for (let i = sparkleList.value.length - 1; i >= 0; i--) {
|
||||
const sp = sparkleList.value[i];
|
||||
sp.rotation += sp.spin;
|
||||
sp.life -= sp.decay;
|
||||
if (sp.life <= 0)
|
||||
sparkleList.value.splice(i, 1);
|
||||
}
|
||||
for (let i = flashList.value.length - 1; i >= 0; i--) {
|
||||
const f = flashList.value[i];
|
||||
f.radius += (f.maxRadius - f.radius) * 0.35;
|
||||
f.life -= f.decay;
|
||||
if (f.life <= 0)
|
||||
flashList.value.splice(i, 1);
|
||||
}
|
||||
for (let i = shockwaves.value.length - 1; i >= 0; i--) {
|
||||
const sw = shockwaves.value[i];
|
||||
sw.radius += (sw.maxRadius - sw.radius) * 0.16;
|
||||
sw.life -= sw.decay;
|
||||
if (sw.life <= 0)
|
||||
shockwaves.value.splice(i, 1);
|
||||
}
|
||||
draw();
|
||||
const alive = debrisList.value.length > 0 || sparkList.value.length > 0 || sparkleList.value.length > 0 || flashList.value.length > 0 || shockwaves.value.length > 0;
|
||||
if (alive) {
|
||||
rafId.value = canvasNode.value.requestAnimationFrame(renderLoop);
|
||||
} else {
|
||||
rafId.value = null;
|
||||
renderRunning.value = false;
|
||||
}
|
||||
}
|
||||
function draw() {
|
||||
const c = ctx.value;
|
||||
const w = canvasWidth.value;
|
||||
const h = canvasHeight.value;
|
||||
c.clearRect(0, 0, w, h);
|
||||
c.globalCompositeOperation = "source-over";
|
||||
shockwaves.value.forEach((sw) => {
|
||||
c.beginPath();
|
||||
c.arc(sw.x, sw.y, sw.radius, 0, Math.PI * 2);
|
||||
c.strokeStyle = applyAlphaToRgba(sw.color, Math.min(1, sw.life));
|
||||
c.lineWidth = sw.width * sw.life;
|
||||
c.stroke();
|
||||
});
|
||||
c.globalCompositeOperation = "lighter";
|
||||
flashList.value.forEach((f) => {
|
||||
const grd = c.createRadialGradient(f.x, f.y, 0, f.x, f.y, f.radius);
|
||||
const a = Math.min(1, f.life);
|
||||
grd.addColorStop(0, hexToRgba(f.color, 0.95 * a));
|
||||
grd.addColorStop(0.4, hexToRgba(f.color, 0.5 * a));
|
||||
grd.addColorStop(1, hexToRgba(f.color, 0));
|
||||
c.fillStyle = grd;
|
||||
c.beginPath();
|
||||
c.arc(f.x, f.y, f.radius, 0, Math.PI * 2);
|
||||
c.fill();
|
||||
});
|
||||
c.globalCompositeOperation = "source-over";
|
||||
debrisList.value.forEach((p) => {
|
||||
const alpha = Math.min(1, p.life);
|
||||
const currentSize = p.size * (0.65 + p.life * 0.35);
|
||||
if (p.glow) {
|
||||
c.fillStyle = hexToRgba(p.color, alpha * 0.22);
|
||||
c.beginPath();
|
||||
c.arc(p.x, p.y, currentSize * 1.9, 0, Math.PI * 2);
|
||||
c.fill();
|
||||
}
|
||||
c.fillStyle = hexToRgba(p.color, alpha);
|
||||
drawDebrisShape(c, p, currentSize);
|
||||
});
|
||||
c.globalCompositeOperation = "lighter";
|
||||
sparkList.value.forEach((s) => {
|
||||
const a = Math.min(1, s.life);
|
||||
c.strokeStyle = hexToRgba(s.color, a * 0.8);
|
||||
c.lineWidth = s.size * a;
|
||||
c.lineCap = "round";
|
||||
c.beginPath();
|
||||
c.moveTo(s.px, s.py);
|
||||
c.lineTo(s.x, s.y);
|
||||
c.stroke();
|
||||
c.fillStyle = hexToRgba(s.color, a);
|
||||
c.beginPath();
|
||||
c.arc(s.x, s.y, s.size * a, 0, Math.PI * 2);
|
||||
c.fill();
|
||||
});
|
||||
sparkleList.value.forEach((sp) => {
|
||||
const t = Math.max(0, Math.min(1, sp.life));
|
||||
const scale = Math.sin(Math.min(1, sp.life) * Math.PI);
|
||||
if (scale <= 0.02)
|
||||
return;
|
||||
const a = t;
|
||||
drawStar(c, sp.x, sp.y, sp.size * scale, sp.size * scale * 0.32, sp.rotation, hexToRgba(sp.color, a));
|
||||
});
|
||||
c.globalCompositeOperation = "source-over";
|
||||
}
|
||||
function drawDebrisShape(c, p, size) {
|
||||
switch (p.shape) {
|
||||
case "circle":
|
||||
c.beginPath();
|
||||
c.arc(p.x, p.y, size, 0, Math.PI * 2);
|
||||
c.fill();
|
||||
break;
|
||||
case "square":
|
||||
c.save();
|
||||
c.translate(p.x, p.y);
|
||||
c.rotate(p.rotation);
|
||||
c.fillRect(-size, -size, size * 2, size * 2);
|
||||
c.restore();
|
||||
break;
|
||||
case "rect":
|
||||
c.save();
|
||||
c.translate(p.x, p.y);
|
||||
c.rotate(p.rotation);
|
||||
c.fillRect(-size * 1.6, -size * 0.5, size * 3.2, size);
|
||||
c.restore();
|
||||
break;
|
||||
case "triangle":
|
||||
c.save();
|
||||
c.translate(p.x, p.y);
|
||||
c.rotate(p.rotation);
|
||||
c.beginPath();
|
||||
c.moveTo(0, -size);
|
||||
c.lineTo(size, size);
|
||||
c.lineTo(-size, size);
|
||||
c.closePath();
|
||||
c.fill();
|
||||
c.restore();
|
||||
break;
|
||||
}
|
||||
}
|
||||
function drawStar(c, cx, cy, outerR, innerR, rotation, fill) {
|
||||
const points = 4;
|
||||
c.save();
|
||||
c.translate(cx, cy);
|
||||
c.rotate(rotation);
|
||||
c.beginPath();
|
||||
for (let i = 0; i < points * 2; i++) {
|
||||
const r = i % 2 === 0 ? outerR : innerR;
|
||||
const a = Math.PI * i / points;
|
||||
const x = Math.cos(a) * r;
|
||||
const y = Math.sin(a) * r;
|
||||
if (i === 0)
|
||||
c.moveTo(x, y);
|
||||
else
|
||||
c.lineTo(x, y);
|
||||
}
|
||||
c.closePath();
|
||||
c.fillStyle = fill;
|
||||
c.fill();
|
||||
c.restore();
|
||||
}
|
||||
function hexToRgba(hex, alpha) {
|
||||
const r = parseInt(hex.slice(1, 3), 16);
|
||||
const g = parseInt(hex.slice(3, 5), 16);
|
||||
const b = parseInt(hex.slice(5, 7), 16);
|
||||
return `rgba(${r}, ${g}, ${b}, ${alpha})`;
|
||||
}
|
||||
function applyAlphaToRgba(rgba, alphaMultiplier) {
|
||||
const match = rgba.match(/rgba?\(([^)]+)\)/);
|
||||
if (!match)
|
||||
return rgba;
|
||||
const parts = match[1].split(",").map((s) => s.trim());
|
||||
const r = parts[0];
|
||||
const g = parts[1];
|
||||
const b = parts[2];
|
||||
const a = parts[3] ? parseFloat(parts[3]) : 1;
|
||||
return `rgba(${r}, ${g}, ${b}, ${a * alphaMultiplier})`;
|
||||
}
|
||||
function cleanup() {
|
||||
if (rafId.value !== null && canvasNode.value) {
|
||||
try {
|
||||
canvasNode.value.cancelAnimationFrame(rafId.value);
|
||||
} catch (_) {
|
||||
}
|
||||
rafId.value = null;
|
||||
}
|
||||
renderRunning.value = false;
|
||||
debrisList.value = [];
|
||||
sparkList.value = [];
|
||||
sparkleList.value = [];
|
||||
flashList.value = [];
|
||||
shockwaves.value = [];
|
||||
}
|
||||
return (_ctx, _cache) => {
|
||||
return {};
|
||||
};
|
||||
}
|
||||
});
|
||||
const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["__scopeId", "data-v-e11c993f"]]);
|
||||
wx.createComponent(Component);
|
||||
//# sourceMappingURL=../../../../.sourcemap/mp-weixin/training/pages/components/crush-canvas.js.map
|
||||
+4
@@ -0,0 +1,4 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {}
|
||||
}
|
||||
+1
@@ -0,0 +1 @@
|
||||
<view class="crush-canvas-container data-v-e11c993f"><canvas type="2d" id="crush" class="crush-canvas data-v-e11c993f"></canvas></view>
|
||||
+15
@@ -0,0 +1,15 @@
|
||||
.crush-canvas-container.data-v-e11c993f {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
pointer-events: none;
|
||||
z-index: 10;
|
||||
}
|
||||
.crush-canvas.data-v-e11c993f {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: transparent;
|
||||
}
|
||||
+278
@@ -0,0 +1,278 @@
|
||||
"use strict";
|
||||
const common_vendor = require("../../../common/vendor.js");
|
||||
const _sfc_main = {
|
||||
props: {
|
||||
isPlaying: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
bpm: {
|
||||
type: Number,
|
||||
default: 110
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
canvasWidth: 320,
|
||||
canvasHeight: 400,
|
||||
ctx: null,
|
||||
timer: null,
|
||||
renderRunning: false,
|
||||
// Interaction State (Spring Physics)
|
||||
coreScale: 1,
|
||||
coreTargetScale: 1,
|
||||
coreVelocity: 0,
|
||||
pressed: false,
|
||||
// Animation Physics (Time)
|
||||
time: 0,
|
||||
lastFrameTime: 0,
|
||||
// Metronome State
|
||||
lastBeatTime: 0,
|
||||
// Energy Waves
|
||||
waveAmplitudeMultiplier: 1,
|
||||
// Shockwaves
|
||||
shockwaves: [],
|
||||
// Rotation for outer ring
|
||||
ringAngle: 0
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.initCanvas();
|
||||
},
|
||||
beforeUnmount() {
|
||||
if (this.timer) {
|
||||
clearTimeout(this.timer);
|
||||
this.timer = null;
|
||||
}
|
||||
this.renderRunning = false;
|
||||
},
|
||||
watch: {
|
||||
isPlaying(newVal) {
|
||||
if (newVal) {
|
||||
this.waveAmplitudeMultiplier = 1;
|
||||
this.ensureRenderLoop();
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
initCanvas() {
|
||||
setTimeout(() => {
|
||||
const query = common_vendor.index.createSelectorQuery().in(this);
|
||||
query.select(".walker-canvas-container").boundingClientRect((data) => {
|
||||
if (data && data.width > 0) {
|
||||
this.canvasWidth = data.width;
|
||||
this.canvasHeight = data.height > 100 ? data.height : data.width * 1.2;
|
||||
} else {
|
||||
const sys = common_vendor.index.getSystemInfoSync();
|
||||
this.canvasWidth = sys.windowWidth - 30;
|
||||
this.canvasHeight = this.canvasWidth * 1.2;
|
||||
}
|
||||
if (!this.ctx) {
|
||||
this.ctx = common_vendor.index.createCanvasContext("walker", this);
|
||||
this.lastFrameTime = Date.now();
|
||||
this.ensureRenderLoop();
|
||||
}
|
||||
}).exec();
|
||||
}, 100);
|
||||
},
|
||||
// Expose a method to be called from parent when a beat hits
|
||||
triggerBeat() {
|
||||
const coreRadius = Math.min(this.canvasWidth, this.canvasHeight) * 0.32;
|
||||
this.shockwaves.push({
|
||||
radius: coreRadius,
|
||||
maxRadius: coreRadius * 2.2,
|
||||
opacity: 1
|
||||
});
|
||||
this.waveAmplitudeMultiplier = 2.5;
|
||||
this.coreVelocity -= 0.05;
|
||||
this.ensureRenderLoop();
|
||||
},
|
||||
onTouchStart(e) {
|
||||
const touch = e.touches[0];
|
||||
if (!touch)
|
||||
return;
|
||||
const cx = this.canvasWidth / 2;
|
||||
const cy = this.canvasHeight / 2 - 30;
|
||||
const coreRadius = Math.min(this.canvasWidth, this.canvasHeight) * 0.32;
|
||||
const dx = touch.x - cx;
|
||||
const dy = touch.y - cy;
|
||||
const dist = Math.sqrt(dx * dx + dy * dy);
|
||||
if (dist <= coreRadius + 40) {
|
||||
this.pressed = true;
|
||||
this.coreTargetScale = 0.9;
|
||||
this.ensureRenderLoop();
|
||||
}
|
||||
},
|
||||
onTouchMove(e) {
|
||||
if (!this.pressed)
|
||||
return;
|
||||
const touch = e.touches[0];
|
||||
if (!touch)
|
||||
return;
|
||||
const cx = this.canvasWidth / 2;
|
||||
const cy = this.canvasHeight / 2 - 30;
|
||||
const coreRadius = Math.min(this.canvasWidth, this.canvasHeight) * 0.32;
|
||||
const dx = touch.x - cx;
|
||||
const dy = touch.y - cy;
|
||||
const dist = Math.sqrt(dx * dx + dy * dy);
|
||||
if (dist > coreRadius + 40) {
|
||||
this.pressed = false;
|
||||
this.coreTargetScale = 1;
|
||||
}
|
||||
},
|
||||
onTouchEnd() {
|
||||
this.coreTargetScale = 1;
|
||||
if (this.pressed) {
|
||||
this.$emit("toggle-play");
|
||||
}
|
||||
this.pressed = false;
|
||||
},
|
||||
onTouchCancel() {
|
||||
this.coreTargetScale = 1;
|
||||
this.pressed = false;
|
||||
},
|
||||
ensureRenderLoop() {
|
||||
if (this.renderRunning)
|
||||
return;
|
||||
this.renderRunning = true;
|
||||
this.renderLoop();
|
||||
},
|
||||
renderLoop() {
|
||||
const fixedDt = 0.016;
|
||||
if (this.isPlaying) {
|
||||
this.time += fixedDt;
|
||||
} else {
|
||||
this.time += fixedDt * 0.2;
|
||||
}
|
||||
const tension = 120;
|
||||
const friction = 12;
|
||||
const force = (this.coreTargetScale - this.coreScale) * tension;
|
||||
this.coreVelocity += force * fixedDt;
|
||||
this.coreVelocity *= Math.exp(-friction * fixedDt);
|
||||
this.coreScale += this.coreVelocity * fixedDt;
|
||||
if (this.waveAmplitudeMultiplier > 1) {
|
||||
this.waveAmplitudeMultiplier -= fixedDt * 3;
|
||||
if (this.waveAmplitudeMultiplier < 1)
|
||||
this.waveAmplitudeMultiplier = 1;
|
||||
} else if (!this.isPlaying && this.waveAmplitudeMultiplier > 0.1) {
|
||||
this.waveAmplitudeMultiplier -= fixedDt * 2;
|
||||
if (this.waveAmplitudeMultiplier < 0.1)
|
||||
this.waveAmplitudeMultiplier = 0.1;
|
||||
}
|
||||
this.draw();
|
||||
this.ctx.draw(false);
|
||||
const shouldContinue = this.isPlaying || this.shockwaves.length > 0 || Math.abs(this.coreScale - this.coreTargetScale) >= 1e-3 || Math.abs(this.coreVelocity) >= 1e-3 || this.waveAmplitudeMultiplier > 0.11;
|
||||
if (shouldContinue) {
|
||||
this.timer = setTimeout(() => {
|
||||
this.renderLoop();
|
||||
}, 1e3 / 60);
|
||||
} else {
|
||||
this.timer = null;
|
||||
this.renderRunning = false;
|
||||
}
|
||||
},
|
||||
draw() {
|
||||
const ctx = this.ctx;
|
||||
const W = this.canvasWidth;
|
||||
const H = this.canvasHeight;
|
||||
ctx.clearRect(0, 0, W, H);
|
||||
const coreRadius = Math.min(W, H) * 0.32;
|
||||
const cx = W / 2;
|
||||
const cy = H / 2 - 30;
|
||||
for (let i = this.shockwaves.length - 1; i >= 0; i--) {
|
||||
const sw = this.shockwaves[i];
|
||||
sw.radius += (sw.maxRadius - sw.radius) * 0.08;
|
||||
sw.opacity -= 0.03;
|
||||
if (sw.opacity <= 0) {
|
||||
this.shockwaves.splice(i, 1);
|
||||
continue;
|
||||
}
|
||||
ctx.beginPath();
|
||||
ctx.arc(cx, cy, sw.radius, 0, Math.PI * 2);
|
||||
ctx.strokeStyle = `rgba(16, 185, 129, ${sw.opacity * 0.5})`;
|
||||
ctx.lineWidth = 3;
|
||||
ctx.stroke();
|
||||
}
|
||||
this.drawWaves(ctx, W, H);
|
||||
ctx.save();
|
||||
ctx.translate(cx, cy);
|
||||
ctx.scale(this.coreScale, this.coreScale);
|
||||
ctx.setShadow(0, 12, 24, "rgba(16, 185, 129, 0.3)");
|
||||
const coreGrad = ctx.createLinearGradient(-coreRadius, -coreRadius, coreRadius, coreRadius);
|
||||
coreGrad.addColorStop(0, "#34d399");
|
||||
coreGrad.addColorStop(1, "#047857");
|
||||
ctx.beginPath();
|
||||
ctx.arc(0, 0, coreRadius, 0, Math.PI * 2);
|
||||
ctx.fillStyle = coreGrad;
|
||||
ctx.fill();
|
||||
ctx.setShadow(0, 0, 0, "transparent");
|
||||
ctx.beginPath();
|
||||
ctx.arc(0, 0, coreRadius - 2, 0, Math.PI * 2);
|
||||
ctx.strokeStyle = "rgba(255, 255, 255, 0.35)";
|
||||
ctx.lineWidth = 2;
|
||||
ctx.stroke();
|
||||
const fontSize = Math.floor(coreRadius * 0.7);
|
||||
ctx.fillStyle = "#ffffff";
|
||||
ctx.font = `bold ${fontSize}px "DIN Condensed", "Inter", sans-serif`;
|
||||
ctx.textAlign = "center";
|
||||
ctx.textBaseline = "middle";
|
||||
ctx.fillText(this.bpm.toString(), 0, -12);
|
||||
ctx.fillStyle = "rgba(255, 255, 255, 0.85)";
|
||||
ctx.font = '500 16px "Inter", sans-serif';
|
||||
ctx.fillText("BPM", 0, coreRadius * 0.3);
|
||||
ctx.fillStyle = "#ffffff";
|
||||
const iconY = coreRadius * 0.55;
|
||||
if (this.isPlaying) {
|
||||
ctx.fillRect(-8, iconY - 6, 5, 14);
|
||||
ctx.fillRect(3, iconY - 6, 5, 14);
|
||||
} else {
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(-5, iconY - 8);
|
||||
ctx.lineTo(9, iconY);
|
||||
ctx.lineTo(-5, iconY + 8);
|
||||
ctx.closePath();
|
||||
ctx.fill();
|
||||
}
|
||||
ctx.restore();
|
||||
},
|
||||
drawWaves(ctx, W, H) {
|
||||
const baseY = H * 0.82;
|
||||
const dynamicAmp = H * 0.08;
|
||||
const waves = [
|
||||
{ color: "rgba(52, 211, 153, 0.3)", speed: 1.5, freq: 0.012, amp: dynamicAmp * 0.7, offset: 0 },
|
||||
{ color: "rgba(16, 185, 129, 0.6)", speed: 2.5, freq: 0.015, amp: dynamicAmp, offset: Math.PI }
|
||||
];
|
||||
const activeAmp = this.waveAmplitudeMultiplier;
|
||||
const t = this.time;
|
||||
waves.forEach((wave) => {
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(0, H);
|
||||
ctx.lineTo(0, baseY);
|
||||
const step = 25;
|
||||
for (let x = 0; x <= W; x += step) {
|
||||
const y = baseY + Math.sin(x * wave.freq + t * wave.speed + wave.offset) * wave.amp * activeAmp;
|
||||
ctx.lineTo(x, y);
|
||||
}
|
||||
const finalY = baseY + Math.sin(W * wave.freq + t * wave.speed + wave.offset) * wave.amp * activeAmp;
|
||||
ctx.lineTo(W, finalY);
|
||||
ctx.lineTo(W, H);
|
||||
ctx.closePath();
|
||||
ctx.fillStyle = wave.color;
|
||||
ctx.fill();
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
||||
return {
|
||||
a: $data.canvasWidth + "px",
|
||||
b: $data.canvasHeight + "px",
|
||||
c: common_vendor.o((...args) => $options.onTouchStart && $options.onTouchStart(...args), "a1"),
|
||||
d: common_vendor.o((...args) => $options.onTouchMove && $options.onTouchMove(...args), "c5"),
|
||||
e: common_vendor.o((...args) => $options.onTouchEnd && $options.onTouchEnd(...args), "fe"),
|
||||
f: common_vendor.o((...args) => $options.onTouchCancel && $options.onTouchCancel(...args), "2c")
|
||||
};
|
||||
}
|
||||
const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-782dd882"]]);
|
||||
wx.createComponent(Component);
|
||||
//# sourceMappingURL=../../../../.sourcemap/mp-weixin/training/pages/components/walker-canvas.js.map
|
||||
+4
@@ -0,0 +1,4 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {}
|
||||
}
|
||||
+1
@@ -0,0 +1 @@
|
||||
<view class="walker-canvas-container data-v-782dd882"><block wx:if="{{r0}}"><canvas canvas-id="walker" id="walker" class="walker-canvas data-v-782dd882" style="{{'width:' + a + ';' + ('height:' + b)}}" bindtouchstart="{{c}}" bindtouchmove="{{d}}" bindtouchend="{{e}}" bindtouchcancel="{{f}}"></canvas></block></view>
|
||||
+15
@@ -0,0 +1,15 @@
|
||||
.walker-canvas-container.data-v-782dd882 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
.walker-canvas.data-v-782dd882 {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: transparent; /* Pure transparent to blend into page */
|
||||
}
|
||||
@@ -0,0 +1,446 @@
|
||||
"use strict";
|
||||
const common_vendor = require("../../common/vendor.js");
|
||||
const TUTORIAL_VIDEO_URL = "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/video/20260528/202605281739117bf3c2914.mp4";
|
||||
const TUTORIAL_POSTER_URL = "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/images/20260529/202605291142269212d9402.jpg";
|
||||
const BGM_URL = "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/file/20260528/20260528093709c669f4659.mp3";
|
||||
const _sfc_defineComponent = common_vendor.defineComponent({
|
||||
__name: "dumbbell",
|
||||
setup(__props) {
|
||||
const DUMBBELL_PRESETS = [
|
||||
{ id: "light", bpm: 50, met: 3.5, label: "轻度", desc: "热身 · 激活" },
|
||||
{ id: "medium", bpm: 65, met: 5, label: "中度", desc: "日常 · 塑形" },
|
||||
{ id: "heavy", bpm: 80, met: 6.5, label: "重度", desc: "强化 · 挑战" }
|
||||
];
|
||||
const TARGET_OPTIONS = [
|
||||
{ minutes: 0, label: "自由" },
|
||||
{ minutes: 5, label: "5 分钟" },
|
||||
{ minutes: 10, label: "10 分钟" },
|
||||
{ minutes: 15, label: "15 分钟" }
|
||||
];
|
||||
const MILESTONES = [
|
||||
{ emoji: "💪", title: "热身完成", desc: "肌肉已激活!", minReps: 8, maxReps: 12 },
|
||||
{ emoji: "🔥", title: "力量提升", desc: "动作很标准!", minReps: 15, maxReps: 20 },
|
||||
{ emoji: "⚡", title: "塑形进阶", desc: "线条感很棒!", minReps: 25, maxReps: 30 },
|
||||
{ emoji: "🏆", title: "完美收官", desc: "太强了!", minReps: 40, maxReps: 50 }
|
||||
];
|
||||
const FOOD_SUGAR_TABLE = [
|
||||
{ emoji: "🍬", name: "糖果", sugar: 95, unit: "颗", weight: 5 },
|
||||
// 1颗糖果约5g
|
||||
{ emoji: "🍪", name: "饼干", sugar: 65, unit: "块", weight: 10 },
|
||||
// 1块饼干约10g
|
||||
{ emoji: "🍫", name: "巧克力", sugar: 51.5, unit: "块", weight: 50 },
|
||||
// 1块巧克力约50g
|
||||
{ emoji: "🍎", name: "苹果", sugar: 10.3, unit: "个", weight: 200 },
|
||||
// 1个苹果约200g
|
||||
{ emoji: "🍌", name: "香蕉", sugar: 12.2, unit: "根", weight: 120 },
|
||||
// 1根香蕉约120g
|
||||
{ emoji: "🍚", name: "米饭", sugar: 25.9, unit: "碗", weight: 150 },
|
||||
// 1碗米饭约150g
|
||||
{ emoji: "🥤", name: "可乐", sugar: 10.6, unit: "罐", weight: 330 }
|
||||
// 1罐可乐330ml
|
||||
];
|
||||
const currentPreset = common_vendor.ref("medium");
|
||||
const targetMinutes = common_vendor.ref(0);
|
||||
const isPlaying = common_vendor.ref(false);
|
||||
const beatTimer = common_vendor.ref(null);
|
||||
const showRewardPopup = common_vendor.ref(false);
|
||||
const showSummary = common_vendor.ref(false);
|
||||
const currentReward = common_vendor.ref(MILESTONES[0]);
|
||||
const bgmAudioCtx = common_vendor.ref(null);
|
||||
const bgmEnabled = common_vendor.ref(true);
|
||||
const totalReps = common_vendor.ref(0);
|
||||
const elapsedSeconds = common_vendor.ref(0);
|
||||
const totalSugar = common_vendor.ref(0);
|
||||
const beatCount = common_vendor.ref(0);
|
||||
const rewardIndex = common_vendor.ref(0);
|
||||
const nextRewardAt = common_vendor.ref(0);
|
||||
const startTime = common_vendor.ref(0);
|
||||
const timerInterval = common_vendor.ref(null);
|
||||
const preset = common_vendor.computed(() => DUMBBELL_PRESETS.find((p) => p.id === currentPreset.value) || DUMBBELL_PRESETS[1]);
|
||||
const currentBpm = common_vendor.computed(() => preset.value.bpm);
|
||||
const currentMet = common_vendor.computed(() => preset.value.met);
|
||||
const targetExpanded = common_vendor.ref(false);
|
||||
const currentTargetLabel = common_vendor.computed(() => {
|
||||
const opt = TARGET_OPTIONS.find((t) => t.minutes === targetMinutes.value);
|
||||
return opt ? opt.label : "自由";
|
||||
});
|
||||
const benefitExpanded = common_vendor.ref(false);
|
||||
const TRAINING_BENEFIT = {
|
||||
muscles: ["肱二头肌", "三角肌", "胸大肌", "背阔肌"],
|
||||
effect: "多角度抗阻训练上肢与肩背肌群,提升肌肉力量与耐力,雕塑手臂与肩部线条,增强骨密度,改善上肢日常功能。"
|
||||
};
|
||||
common_vendor.watch(isPlaying, (playing) => {
|
||||
const videoCtx = common_vendor.index.createVideoContext("dumbbellDemoVideo");
|
||||
if (!videoCtx)
|
||||
return;
|
||||
if (playing) {
|
||||
videoCtx.play();
|
||||
} else {
|
||||
videoCtx.pause();
|
||||
}
|
||||
});
|
||||
const intervalMs = common_vendor.computed(() => 6e4 / currentBpm.value);
|
||||
const hasStats = common_vendor.computed(() => isPlaying.value || totalReps.value > 0);
|
||||
const isPaused = common_vendor.computed(() => !isPlaying.value && totalReps.value > 0 && !showSummary.value);
|
||||
const remainingSeconds = common_vendor.computed(() => {
|
||||
if (targetMinutes.value === 0)
|
||||
return null;
|
||||
const total = targetMinutes.value * 60;
|
||||
return Math.max(0, total - elapsedSeconds.value);
|
||||
});
|
||||
const centerHintText = common_vendor.computed(() => isPaused.value ? "点击继续" : "点击开始");
|
||||
const statusText = common_vendor.computed(() => {
|
||||
if (isPlaying.value)
|
||||
return "训练中";
|
||||
if (isPaused.value)
|
||||
return "已暂停";
|
||||
return "待开始";
|
||||
});
|
||||
const shareTitle = common_vendor.computed(() => {
|
||||
if (totalReps.value === 0)
|
||||
return "哑铃训练 · 一起练起来";
|
||||
return `刚刚完成 ${totalReps.value} 次哑铃训练,约消耗 ${totalSugar.value.toFixed(1)}g 糖分 💪`;
|
||||
});
|
||||
const rootStyle = common_vendor.computed(() => ({
|
||||
"--beat-duration": `${intervalMs.value}ms`
|
||||
}));
|
||||
const sugarComparisons = common_vendor.computed(() => {
|
||||
if (totalSugar.value === 0)
|
||||
return [];
|
||||
const results = [];
|
||||
for (const food of FOOD_SUGAR_TABLE) {
|
||||
const foodSugar = food.sugar * food.weight / 100;
|
||||
const count = totalSugar.value / foodSugar;
|
||||
if (count >= 0.1 && count <= 50) {
|
||||
results.push({
|
||||
emoji: food.emoji,
|
||||
name: food.name,
|
||||
count: count >= 10 ? Math.round(count).toString() : count.toFixed(1),
|
||||
unit: food.unit
|
||||
});
|
||||
}
|
||||
}
|
||||
return results.slice(0, 3);
|
||||
});
|
||||
function onBeat() {
|
||||
beatCount.value++;
|
||||
if (beatCount.value % 2 === 0) {
|
||||
totalReps.value++;
|
||||
if (totalReps.value >= nextRewardAt.value && rewardIndex.value < MILESTONES.length) {
|
||||
triggerReward();
|
||||
}
|
||||
}
|
||||
}
|
||||
function calculateSugar(seconds) {
|
||||
const hours = seconds / 3600;
|
||||
const weight = 60;
|
||||
const calories = currentMet.value * weight * hours;
|
||||
return calories / 4;
|
||||
}
|
||||
function formatTime(seconds) {
|
||||
const mins = Math.floor(seconds / 60);
|
||||
const secs = seconds % 60;
|
||||
return `${mins}:${secs.toString().padStart(2, "0")}`;
|
||||
}
|
||||
function triggerReward() {
|
||||
const reward = MILESTONES[rewardIndex.value];
|
||||
currentReward.value = reward;
|
||||
triggerHaptic();
|
||||
rewardIndex.value++;
|
||||
if (rewardIndex.value < MILESTONES.length) {
|
||||
const nextReward = MILESTONES[rewardIndex.value];
|
||||
const range = nextReward.maxReps - nextReward.minReps;
|
||||
nextRewardAt.value = totalReps.value + nextReward.minReps + Math.floor(Math.random() * (range + 1));
|
||||
}
|
||||
setTimeout(() => {
|
||||
showRewardPopup.value = true;
|
||||
}, 400);
|
||||
}
|
||||
function closeRewardPopup() {
|
||||
showRewardPopup.value = false;
|
||||
}
|
||||
function triggerHaptic() {
|
||||
common_vendor.index.vibrateShort({
|
||||
type: "medium",
|
||||
fail: () => {
|
||||
try {
|
||||
common_vendor.index.vibrateShort({});
|
||||
} catch (_) {
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
function startRhythm() {
|
||||
stopRhythm();
|
||||
isPlaying.value = true;
|
||||
const beatMs = 6e4 / currentBpm.value;
|
||||
beatTimer.value = setInterval(onBeat, beatMs);
|
||||
}
|
||||
function stopRhythm() {
|
||||
isPlaying.value = false;
|
||||
if (beatTimer.value) {
|
||||
clearInterval(beatTimer.value);
|
||||
beatTimer.value = null;
|
||||
}
|
||||
}
|
||||
function startBgm() {
|
||||
if (!bgmEnabled.value)
|
||||
return;
|
||||
if (bgmAudioCtx.value) {
|
||||
try {
|
||||
bgmAudioCtx.value.play();
|
||||
} catch (_) {
|
||||
}
|
||||
return;
|
||||
}
|
||||
bgmAudioCtx.value = common_vendor.index.createInnerAudioContext();
|
||||
bgmAudioCtx.value.src = BGM_URL;
|
||||
bgmAudioCtx.value.loop = true;
|
||||
bgmAudioCtx.value.obeyMuteSwitch = false;
|
||||
bgmAudioCtx.value.volume = 0.4;
|
||||
try {
|
||||
bgmAudioCtx.value.play();
|
||||
} catch (_) {
|
||||
}
|
||||
}
|
||||
function stopBgm() {
|
||||
if (bgmAudioCtx.value) {
|
||||
try {
|
||||
bgmAudioCtx.value.pause();
|
||||
} catch (_) {
|
||||
}
|
||||
}
|
||||
}
|
||||
function toggleBgm() {
|
||||
bgmEnabled.value = !bgmEnabled.value;
|
||||
if (bgmEnabled.value && isPlaying.value) {
|
||||
startBgm();
|
||||
} else {
|
||||
stopBgm();
|
||||
}
|
||||
}
|
||||
function onPresetTap(id) {
|
||||
if (isPlaying.value)
|
||||
return;
|
||||
currentPreset.value = id;
|
||||
if (beatTimer.value) {
|
||||
stopRhythm();
|
||||
startRhythm();
|
||||
}
|
||||
}
|
||||
function onTargetTap(minutes) {
|
||||
if (isPlaying.value)
|
||||
return;
|
||||
targetMinutes.value = minutes;
|
||||
}
|
||||
function onTogglePlay() {
|
||||
if (isPlaying.value) {
|
||||
pauseTraining();
|
||||
} else {
|
||||
if (totalReps.value === 0) {
|
||||
resetStats();
|
||||
}
|
||||
startTrainingInternal();
|
||||
}
|
||||
}
|
||||
function startTrainingInternal() {
|
||||
startRhythm();
|
||||
startBgm();
|
||||
startTimer();
|
||||
common_vendor.index.setKeepScreenOn({ keepScreenOn: true });
|
||||
}
|
||||
function pauseTraining() {
|
||||
stopRhythm();
|
||||
stopBgm();
|
||||
stopTimer();
|
||||
common_vendor.index.setKeepScreenOn({ keepScreenOn: false });
|
||||
}
|
||||
function onEndTraining() {
|
||||
if (totalReps.value === 0)
|
||||
return;
|
||||
pauseTraining();
|
||||
showSummary.value = true;
|
||||
}
|
||||
function dismissSummary() {
|
||||
showSummary.value = false;
|
||||
resetStats();
|
||||
}
|
||||
function onFinish() {
|
||||
showSummary.value = false;
|
||||
resetStats();
|
||||
}
|
||||
function onRestart() {
|
||||
showSummary.value = false;
|
||||
resetStats();
|
||||
startTrainingInternal();
|
||||
}
|
||||
function resetStats() {
|
||||
totalReps.value = 0;
|
||||
elapsedSeconds.value = 0;
|
||||
totalSugar.value = 0;
|
||||
beatCount.value = 0;
|
||||
rewardIndex.value = 0;
|
||||
startTime.value = Date.now();
|
||||
const firstReward = MILESTONES[0];
|
||||
const range = firstReward.maxReps - firstReward.minReps;
|
||||
nextRewardAt.value = firstReward.minReps + Math.floor(Math.random() * (range + 1));
|
||||
}
|
||||
function startTimer() {
|
||||
if (timerInterval.value)
|
||||
return;
|
||||
startTime.value = Date.now() - elapsedSeconds.value * 1e3;
|
||||
timerInterval.value = setInterval(() => {
|
||||
elapsedSeconds.value = Math.floor((Date.now() - startTime.value) / 1e3);
|
||||
totalSugar.value = calculateSugar(elapsedSeconds.value);
|
||||
if (targetMinutes.value > 0 && elapsedSeconds.value >= targetMinutes.value * 60) {
|
||||
onEndTraining();
|
||||
}
|
||||
}, 1e3);
|
||||
}
|
||||
function stopTimer() {
|
||||
if (timerInterval.value) {
|
||||
clearInterval(timerInterval.value);
|
||||
timerInterval.value = null;
|
||||
}
|
||||
}
|
||||
common_vendor.onShareAppMessage(() => ({
|
||||
title: shareTitle.value,
|
||||
path: "/training/pages/dumbbell",
|
||||
imageUrl: TUTORIAL_POSTER_URL
|
||||
}));
|
||||
common_vendor.onShareTimeline(() => ({
|
||||
title: shareTitle.value,
|
||||
imageUrl: TUTORIAL_POSTER_URL
|
||||
}));
|
||||
function cleanupAllMedia() {
|
||||
var _a;
|
||||
stopRhythm();
|
||||
stopTimer();
|
||||
common_vendor.index.setKeepScreenOn({ keepScreenOn: false });
|
||||
try {
|
||||
(_a = common_vendor.index.createVideoContext("dumbbellDemoVideo")) == null ? void 0 : _a.pause();
|
||||
} catch (_) {
|
||||
}
|
||||
if (bgmAudioCtx.value) {
|
||||
try {
|
||||
bgmAudioCtx.value.stop();
|
||||
} catch (_) {
|
||||
}
|
||||
try {
|
||||
bgmAudioCtx.value.destroy();
|
||||
} catch (_) {
|
||||
}
|
||||
bgmAudioCtx.value = null;
|
||||
}
|
||||
}
|
||||
common_vendor.onHide(cleanupAllMedia);
|
||||
common_vendor.onUnload(cleanupAllMedia);
|
||||
return (_ctx, _cache) => {
|
||||
return common_vendor.e({
|
||||
a: common_vendor.t(statusText.value),
|
||||
b: isPlaying.value ? 1 : "",
|
||||
c: isPaused.value ? 1 : "",
|
||||
d: TUTORIAL_VIDEO_URL,
|
||||
e: TUTORIAL_POSTER_URL,
|
||||
f: !isPlaying.value
|
||||
}, !isPlaying.value ? {
|
||||
g: common_vendor.t(centerHintText.value)
|
||||
} : {
|
||||
h: common_vendor.t(currentBpm.value)
|
||||
}, {
|
||||
i: common_vendor.o(onTogglePlay, "f3"),
|
||||
j: isPlaying.value ? 1 : "",
|
||||
k: common_vendor.t(bgmEnabled.value ? "🎵" : "🔇"),
|
||||
l: common_vendor.o(toggleBgm, "e3"),
|
||||
m: remainingSeconds.value !== null && hasStats.value
|
||||
}, remainingSeconds.value !== null && hasStats.value ? {
|
||||
n: common_vendor.t(formatTime(remainingSeconds.value))
|
||||
} : {}, {
|
||||
o: isPlaying.value
|
||||
}, isPlaying.value ? {} : {}, {
|
||||
p: common_vendor.f(DUMBBELL_PRESETS, (p, k0, i0) => {
|
||||
return {
|
||||
a: common_vendor.t(p.label),
|
||||
b: common_vendor.t(p.bpm),
|
||||
c: p.id,
|
||||
d: currentPreset.value === p.id ? 1 : "",
|
||||
e: common_vendor.o(($event) => onPresetTap(p.id), p.id)
|
||||
};
|
||||
}),
|
||||
q: isPlaying.value ? 1 : "",
|
||||
r: common_vendor.t(currentTargetLabel.value),
|
||||
s: common_vendor.t(targetExpanded.value ? "▲" : "▼"),
|
||||
t: common_vendor.o(($event) => targetExpanded.value = !targetExpanded.value, "52"),
|
||||
v: targetExpanded.value
|
||||
}, targetExpanded.value ? {
|
||||
w: common_vendor.f(TARGET_OPTIONS, (t, k0, i0) => {
|
||||
return {
|
||||
a: common_vendor.t(t.label),
|
||||
b: t.minutes,
|
||||
c: targetMinutes.value === t.minutes ? 1 : "",
|
||||
d: common_vendor.o(($event) => onTargetTap(t.minutes), t.minutes)
|
||||
};
|
||||
}),
|
||||
x: isPlaying.value ? 1 : ""
|
||||
} : {}, {
|
||||
y: common_vendor.t(benefitExpanded.value ? "收起 ▲" : "展开 ▼"),
|
||||
z: common_vendor.o(($event) => benefitExpanded.value = !benefitExpanded.value, "f5"),
|
||||
A: benefitExpanded.value
|
||||
}, benefitExpanded.value ? {
|
||||
B: common_vendor.f(TRAINING_BENEFIT.muscles, (m, k0, i0) => {
|
||||
return {
|
||||
a: common_vendor.t(m),
|
||||
b: m
|
||||
};
|
||||
}),
|
||||
C: common_vendor.t(TRAINING_BENEFIT.effect)
|
||||
} : {}, {
|
||||
D: isPaused.value
|
||||
}, isPaused.value ? {
|
||||
E: common_vendor.o(onTogglePlay, "6e"),
|
||||
F: common_vendor.o(onEndTraining, "4a")
|
||||
} : {}, {
|
||||
G: isPlaying.value ? 1 : "",
|
||||
H: isPaused.value ? 1 : "",
|
||||
I: common_vendor.s(rootStyle.value),
|
||||
J: showRewardPopup.value
|
||||
}, showRewardPopup.value ? {
|
||||
K: common_vendor.t(currentReward.value.emoji),
|
||||
L: common_vendor.t(currentReward.value.title),
|
||||
M: common_vendor.t(currentReward.value.desc),
|
||||
N: common_vendor.t(totalReps.value),
|
||||
O: common_vendor.o(closeRewardPopup, "7c"),
|
||||
P: common_vendor.o(() => {
|
||||
}, "ef"),
|
||||
Q: common_vendor.o(closeRewardPopup, "fd")
|
||||
} : {}, {
|
||||
R: showSummary.value
|
||||
}, showSummary.value ? common_vendor.e({
|
||||
S: common_vendor.t(totalReps.value),
|
||||
T: common_vendor.t(formatTime(elapsedSeconds.value)),
|
||||
U: common_vendor.t(totalSugar.value.toFixed(1)),
|
||||
V: sugarComparisons.value.length > 0
|
||||
}, sugarComparisons.value.length > 0 ? {
|
||||
W: common_vendor.f(sugarComparisons.value, (food, idx, i0) => {
|
||||
return {
|
||||
a: common_vendor.t(food.emoji),
|
||||
b: common_vendor.t(food.count),
|
||||
c: common_vendor.t(food.unit),
|
||||
d: common_vendor.t(food.name),
|
||||
e: idx
|
||||
};
|
||||
})
|
||||
} : {}, {
|
||||
X: common_vendor.o(onRestart, "f6"),
|
||||
Y: common_vendor.o(onFinish, "44"),
|
||||
Z: common_vendor.o(() => {
|
||||
}, "16"),
|
||||
aa: common_vendor.o(dismissSummary, "84")
|
||||
}) : {});
|
||||
};
|
||||
}
|
||||
});
|
||||
_sfc_defineComponent.__runtimeHooks = 6;
|
||||
const MiniProgramPage = /* @__PURE__ */ common_vendor._export_sfc(_sfc_defineComponent, [["__scopeId", "data-v-99a2f98c"]]);
|
||||
wx.createPage(MiniProgramPage);
|
||||
//# sourceMappingURL=../../../.sourcemap/mp-weixin/training/pages/dumbbell.js.map
|
||||
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"navigationBarTitleText": "哑铃训练",
|
||||
"navigationBarBackgroundColor": "#f8fafc",
|
||||
"navigationBarTextStyle": "black",
|
||||
"backgroundColor": "#f8fafc",
|
||||
"usingComponents": {}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,446 @@
|
||||
"use strict";
|
||||
const common_vendor = require("../../common/vendor.js");
|
||||
const TUTORIAL_VIDEO_URL = "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/video/20260528/20260528173911fd8002487.mp4";
|
||||
const TUTORIAL_POSTER_URL = "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/images/20260529/2026052911251788eb49233.jpg";
|
||||
const BGM_URL = "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/file/20260528/20260528093709c669f4659.mp3";
|
||||
const _sfc_defineComponent = common_vendor.defineComponent({
|
||||
__name: "foot-pedal",
|
||||
setup(__props) {
|
||||
const FOOT_PEDAL_PRESETS = [
|
||||
{ id: "light", bpm: 55, met: 4, label: "轻度", desc: "热身 · 激活" },
|
||||
{ id: "medium", bpm: 70, met: 5.5, label: "中度", desc: "日常 · 燃脂" },
|
||||
{ id: "heavy", bpm: 85, met: 7, label: "重度", desc: "强化 · 挑战" }
|
||||
];
|
||||
const TARGET_OPTIONS = [
|
||||
{ minutes: 0, label: "自由" },
|
||||
{ minutes: 5, label: "5 分钟" },
|
||||
{ minutes: 10, label: "10 分钟" },
|
||||
{ minutes: 15, label: "15 分钟" }
|
||||
];
|
||||
const MILESTONES = [
|
||||
{ emoji: "🦵", title: "腿部激活", desc: "热身到位!", minReps: 8, maxReps: 12 },
|
||||
{ emoji: "🔥", title: "燃脂加速", desc: "节奏很好!", minReps: 15, maxReps: 20 },
|
||||
{ emoji: "⚡", title: "耐力提升", desc: "坚持很棒!", minReps: 25, maxReps: 30 },
|
||||
{ emoji: "🏆", title: "完美收官", desc: "太厉害了!", minReps: 40, maxReps: 50 }
|
||||
];
|
||||
const FOOD_SUGAR_TABLE = [
|
||||
{ emoji: "🍬", name: "糖果", sugar: 95, unit: "颗", weight: 5 },
|
||||
// 1颗糖果约5g
|
||||
{ emoji: "🍪", name: "饼干", sugar: 65, unit: "块", weight: 10 },
|
||||
// 1块饼干约10g
|
||||
{ emoji: "🍫", name: "巧克力", sugar: 51.5, unit: "块", weight: 50 },
|
||||
// 1块巧克力约50g
|
||||
{ emoji: "🍎", name: "苹果", sugar: 10.3, unit: "个", weight: 200 },
|
||||
// 1个苹果约200g
|
||||
{ emoji: "🍌", name: "香蕉", sugar: 12.2, unit: "根", weight: 120 },
|
||||
// 1根香蕉约120g
|
||||
{ emoji: "🍚", name: "米饭", sugar: 25.9, unit: "碗", weight: 150 },
|
||||
// 1碗米饭约150g
|
||||
{ emoji: "🥤", name: "可乐", sugar: 10.6, unit: "罐", weight: 330 }
|
||||
// 1罐可乐330ml
|
||||
];
|
||||
const currentPreset = common_vendor.ref("medium");
|
||||
const targetMinutes = common_vendor.ref(0);
|
||||
const isPlaying = common_vendor.ref(false);
|
||||
const beatTimer = common_vendor.ref(null);
|
||||
const showRewardPopup = common_vendor.ref(false);
|
||||
const showSummary = common_vendor.ref(false);
|
||||
const currentReward = common_vendor.ref(MILESTONES[0]);
|
||||
const bgmAudioCtx = common_vendor.ref(null);
|
||||
const bgmEnabled = common_vendor.ref(true);
|
||||
const totalReps = common_vendor.ref(0);
|
||||
const elapsedSeconds = common_vendor.ref(0);
|
||||
const totalSugar = common_vendor.ref(0);
|
||||
const beatCount = common_vendor.ref(0);
|
||||
const rewardIndex = common_vendor.ref(0);
|
||||
const nextRewardAt = common_vendor.ref(0);
|
||||
const startTime = common_vendor.ref(0);
|
||||
const timerInterval = common_vendor.ref(null);
|
||||
const preset = common_vendor.computed(() => FOOT_PEDAL_PRESETS.find((p) => p.id === currentPreset.value) || FOOT_PEDAL_PRESETS[1]);
|
||||
const currentBpm = common_vendor.computed(() => preset.value.bpm);
|
||||
const currentMet = common_vendor.computed(() => preset.value.met);
|
||||
const targetExpanded = common_vendor.ref(false);
|
||||
const currentTargetLabel = common_vendor.computed(() => {
|
||||
const opt = TARGET_OPTIONS.find((t) => t.minutes === targetMinutes.value);
|
||||
return opt ? opt.label : "自由";
|
||||
});
|
||||
const benefitExpanded = common_vendor.ref(false);
|
||||
const TRAINING_BENEFIT = {
|
||||
muscles: ["股四头肌", "腘绳肌", "小腿肌群", "臀大肌"],
|
||||
effect: "低冲击有氧蹬踏,强化下肢肌力与心肺耐力,促进腿部血液循环、帮助燃脂塑形,特别适合久坐人群激活双腿。"
|
||||
};
|
||||
common_vendor.watch(isPlaying, (playing) => {
|
||||
const videoCtx = common_vendor.index.createVideoContext("footPedalDemoVideo");
|
||||
if (!videoCtx)
|
||||
return;
|
||||
if (playing) {
|
||||
videoCtx.play();
|
||||
} else {
|
||||
videoCtx.pause();
|
||||
}
|
||||
});
|
||||
const intervalMs = common_vendor.computed(() => 6e4 / currentBpm.value);
|
||||
const hasStats = common_vendor.computed(() => isPlaying.value || totalReps.value > 0);
|
||||
const isPaused = common_vendor.computed(() => !isPlaying.value && totalReps.value > 0 && !showSummary.value);
|
||||
const remainingSeconds = common_vendor.computed(() => {
|
||||
if (targetMinutes.value === 0)
|
||||
return null;
|
||||
const total = targetMinutes.value * 60;
|
||||
return Math.max(0, total - elapsedSeconds.value);
|
||||
});
|
||||
const centerHintText = common_vendor.computed(() => isPaused.value ? "点击继续" : "点击开始");
|
||||
const statusText = common_vendor.computed(() => {
|
||||
if (isPlaying.value)
|
||||
return "训练中";
|
||||
if (isPaused.value)
|
||||
return "已暂停";
|
||||
return "待开始";
|
||||
});
|
||||
const shareTitle = common_vendor.computed(() => {
|
||||
if (totalReps.value === 0)
|
||||
return "脚蹬器训练 · 一起练起来";
|
||||
return `刚刚完成 ${totalReps.value} 次脚蹬训练,约消耗 ${totalSugar.value.toFixed(1)}g 糖分 🔥`;
|
||||
});
|
||||
const rootStyle = common_vendor.computed(() => ({
|
||||
"--beat-duration": `${intervalMs.value}ms`
|
||||
}));
|
||||
const sugarComparisons = common_vendor.computed(() => {
|
||||
if (totalSugar.value === 0)
|
||||
return [];
|
||||
const results = [];
|
||||
for (const food of FOOD_SUGAR_TABLE) {
|
||||
const foodSugar = food.sugar * food.weight / 100;
|
||||
const count = totalSugar.value / foodSugar;
|
||||
if (count >= 0.1 && count <= 50) {
|
||||
results.push({
|
||||
emoji: food.emoji,
|
||||
name: food.name,
|
||||
count: count >= 10 ? Math.round(count).toString() : count.toFixed(1),
|
||||
unit: food.unit
|
||||
});
|
||||
}
|
||||
}
|
||||
return results.slice(0, 3);
|
||||
});
|
||||
function onBeat() {
|
||||
beatCount.value++;
|
||||
if (beatCount.value % 2 === 0) {
|
||||
totalReps.value++;
|
||||
if (totalReps.value >= nextRewardAt.value && rewardIndex.value < MILESTONES.length) {
|
||||
triggerReward();
|
||||
}
|
||||
}
|
||||
}
|
||||
function calculateSugar(seconds) {
|
||||
const hours = seconds / 3600;
|
||||
const weight = 60;
|
||||
const calories = currentMet.value * weight * hours;
|
||||
return calories / 4;
|
||||
}
|
||||
function formatTime(seconds) {
|
||||
const mins = Math.floor(seconds / 60);
|
||||
const secs = seconds % 60;
|
||||
return `${mins}:${secs.toString().padStart(2, "0")}`;
|
||||
}
|
||||
function triggerReward() {
|
||||
const reward = MILESTONES[rewardIndex.value];
|
||||
currentReward.value = reward;
|
||||
triggerHaptic();
|
||||
rewardIndex.value++;
|
||||
if (rewardIndex.value < MILESTONES.length) {
|
||||
const nextReward = MILESTONES[rewardIndex.value];
|
||||
const range = nextReward.maxReps - nextReward.minReps;
|
||||
nextRewardAt.value = totalReps.value + nextReward.minReps + Math.floor(Math.random() * (range + 1));
|
||||
}
|
||||
setTimeout(() => {
|
||||
showRewardPopup.value = true;
|
||||
}, 400);
|
||||
}
|
||||
function closeRewardPopup() {
|
||||
showRewardPopup.value = false;
|
||||
}
|
||||
function triggerHaptic() {
|
||||
common_vendor.index.vibrateShort({
|
||||
type: "medium",
|
||||
fail: () => {
|
||||
try {
|
||||
common_vendor.index.vibrateShort({});
|
||||
} catch (_) {
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
function startRhythm() {
|
||||
stopRhythm();
|
||||
isPlaying.value = true;
|
||||
const beatMs = 6e4 / currentBpm.value;
|
||||
beatTimer.value = setInterval(onBeat, beatMs);
|
||||
}
|
||||
function stopRhythm() {
|
||||
isPlaying.value = false;
|
||||
if (beatTimer.value) {
|
||||
clearInterval(beatTimer.value);
|
||||
beatTimer.value = null;
|
||||
}
|
||||
}
|
||||
function startBgm() {
|
||||
if (!bgmEnabled.value)
|
||||
return;
|
||||
if (bgmAudioCtx.value) {
|
||||
try {
|
||||
bgmAudioCtx.value.play();
|
||||
} catch (_) {
|
||||
}
|
||||
return;
|
||||
}
|
||||
bgmAudioCtx.value = common_vendor.index.createInnerAudioContext();
|
||||
bgmAudioCtx.value.src = BGM_URL;
|
||||
bgmAudioCtx.value.loop = true;
|
||||
bgmAudioCtx.value.obeyMuteSwitch = false;
|
||||
bgmAudioCtx.value.volume = 0.4;
|
||||
try {
|
||||
bgmAudioCtx.value.play();
|
||||
} catch (_) {
|
||||
}
|
||||
}
|
||||
function stopBgm() {
|
||||
if (bgmAudioCtx.value) {
|
||||
try {
|
||||
bgmAudioCtx.value.pause();
|
||||
} catch (_) {
|
||||
}
|
||||
}
|
||||
}
|
||||
function toggleBgm() {
|
||||
bgmEnabled.value = !bgmEnabled.value;
|
||||
if (bgmEnabled.value && isPlaying.value) {
|
||||
startBgm();
|
||||
} else {
|
||||
stopBgm();
|
||||
}
|
||||
}
|
||||
function onPresetTap(id) {
|
||||
if (isPlaying.value)
|
||||
return;
|
||||
currentPreset.value = id;
|
||||
if (beatTimer.value) {
|
||||
stopRhythm();
|
||||
startRhythm();
|
||||
}
|
||||
}
|
||||
function onTargetTap(minutes) {
|
||||
if (isPlaying.value)
|
||||
return;
|
||||
targetMinutes.value = minutes;
|
||||
}
|
||||
function onTogglePlay() {
|
||||
if (isPlaying.value) {
|
||||
pauseTraining();
|
||||
} else {
|
||||
if (totalReps.value === 0) {
|
||||
resetStats();
|
||||
}
|
||||
startTrainingInternal();
|
||||
}
|
||||
}
|
||||
function startTrainingInternal() {
|
||||
startRhythm();
|
||||
startBgm();
|
||||
startTimer();
|
||||
common_vendor.index.setKeepScreenOn({ keepScreenOn: true });
|
||||
}
|
||||
function pauseTraining() {
|
||||
stopRhythm();
|
||||
stopBgm();
|
||||
stopTimer();
|
||||
common_vendor.index.setKeepScreenOn({ keepScreenOn: false });
|
||||
}
|
||||
function onEndTraining() {
|
||||
if (totalReps.value === 0)
|
||||
return;
|
||||
pauseTraining();
|
||||
showSummary.value = true;
|
||||
}
|
||||
function dismissSummary() {
|
||||
showSummary.value = false;
|
||||
resetStats();
|
||||
}
|
||||
function onFinish() {
|
||||
showSummary.value = false;
|
||||
resetStats();
|
||||
}
|
||||
function onRestart() {
|
||||
showSummary.value = false;
|
||||
resetStats();
|
||||
startTrainingInternal();
|
||||
}
|
||||
function resetStats() {
|
||||
totalReps.value = 0;
|
||||
elapsedSeconds.value = 0;
|
||||
totalSugar.value = 0;
|
||||
beatCount.value = 0;
|
||||
rewardIndex.value = 0;
|
||||
startTime.value = Date.now();
|
||||
const firstReward = MILESTONES[0];
|
||||
const range = firstReward.maxReps - firstReward.minReps;
|
||||
nextRewardAt.value = firstReward.minReps + Math.floor(Math.random() * (range + 1));
|
||||
}
|
||||
function startTimer() {
|
||||
if (timerInterval.value)
|
||||
return;
|
||||
startTime.value = Date.now() - elapsedSeconds.value * 1e3;
|
||||
timerInterval.value = setInterval(() => {
|
||||
elapsedSeconds.value = Math.floor((Date.now() - startTime.value) / 1e3);
|
||||
totalSugar.value = calculateSugar(elapsedSeconds.value);
|
||||
if (targetMinutes.value > 0 && elapsedSeconds.value >= targetMinutes.value * 60) {
|
||||
onEndTraining();
|
||||
}
|
||||
}, 1e3);
|
||||
}
|
||||
function stopTimer() {
|
||||
if (timerInterval.value) {
|
||||
clearInterval(timerInterval.value);
|
||||
timerInterval.value = null;
|
||||
}
|
||||
}
|
||||
common_vendor.onShareAppMessage(() => ({
|
||||
title: shareTitle.value,
|
||||
path: "/training/pages/foot-pedal",
|
||||
imageUrl: TUTORIAL_POSTER_URL
|
||||
}));
|
||||
common_vendor.onShareTimeline(() => ({
|
||||
title: shareTitle.value,
|
||||
imageUrl: TUTORIAL_POSTER_URL
|
||||
}));
|
||||
function cleanupAllMedia() {
|
||||
var _a;
|
||||
stopRhythm();
|
||||
stopTimer();
|
||||
common_vendor.index.setKeepScreenOn({ keepScreenOn: false });
|
||||
try {
|
||||
(_a = common_vendor.index.createVideoContext("footPedalDemoVideo")) == null ? void 0 : _a.pause();
|
||||
} catch (_) {
|
||||
}
|
||||
if (bgmAudioCtx.value) {
|
||||
try {
|
||||
bgmAudioCtx.value.stop();
|
||||
} catch (_) {
|
||||
}
|
||||
try {
|
||||
bgmAudioCtx.value.destroy();
|
||||
} catch (_) {
|
||||
}
|
||||
bgmAudioCtx.value = null;
|
||||
}
|
||||
}
|
||||
common_vendor.onHide(cleanupAllMedia);
|
||||
common_vendor.onUnload(cleanupAllMedia);
|
||||
return (_ctx, _cache) => {
|
||||
return common_vendor.e({
|
||||
a: common_vendor.t(statusText.value),
|
||||
b: isPlaying.value ? 1 : "",
|
||||
c: isPaused.value ? 1 : "",
|
||||
d: TUTORIAL_VIDEO_URL,
|
||||
e: TUTORIAL_POSTER_URL,
|
||||
f: !isPlaying.value
|
||||
}, !isPlaying.value ? {
|
||||
g: common_vendor.t(centerHintText.value)
|
||||
} : {
|
||||
h: common_vendor.t(currentBpm.value)
|
||||
}, {
|
||||
i: common_vendor.o(onTogglePlay, "06"),
|
||||
j: isPlaying.value ? 1 : "",
|
||||
k: common_vendor.t(bgmEnabled.value ? "🎵" : "🔇"),
|
||||
l: common_vendor.o(toggleBgm, "56"),
|
||||
m: remainingSeconds.value !== null && hasStats.value
|
||||
}, remainingSeconds.value !== null && hasStats.value ? {
|
||||
n: common_vendor.t(formatTime(remainingSeconds.value))
|
||||
} : {}, {
|
||||
o: isPlaying.value
|
||||
}, isPlaying.value ? {} : {}, {
|
||||
p: common_vendor.f(FOOT_PEDAL_PRESETS, (p, k0, i0) => {
|
||||
return {
|
||||
a: common_vendor.t(p.label),
|
||||
b: common_vendor.t(p.bpm),
|
||||
c: p.id,
|
||||
d: currentPreset.value === p.id ? 1 : "",
|
||||
e: common_vendor.o(($event) => onPresetTap(p.id), p.id)
|
||||
};
|
||||
}),
|
||||
q: isPlaying.value ? 1 : "",
|
||||
r: common_vendor.t(currentTargetLabel.value),
|
||||
s: common_vendor.t(targetExpanded.value ? "▲" : "▼"),
|
||||
t: common_vendor.o(($event) => targetExpanded.value = !targetExpanded.value, "cb"),
|
||||
v: targetExpanded.value
|
||||
}, targetExpanded.value ? {
|
||||
w: common_vendor.f(TARGET_OPTIONS, (t, k0, i0) => {
|
||||
return {
|
||||
a: common_vendor.t(t.label),
|
||||
b: t.minutes,
|
||||
c: targetMinutes.value === t.minutes ? 1 : "",
|
||||
d: common_vendor.o(($event) => onTargetTap(t.minutes), t.minutes)
|
||||
};
|
||||
}),
|
||||
x: isPlaying.value ? 1 : ""
|
||||
} : {}, {
|
||||
y: common_vendor.t(benefitExpanded.value ? "收起 ▲" : "展开 ▼"),
|
||||
z: common_vendor.o(($event) => benefitExpanded.value = !benefitExpanded.value, "35"),
|
||||
A: benefitExpanded.value
|
||||
}, benefitExpanded.value ? {
|
||||
B: common_vendor.f(TRAINING_BENEFIT.muscles, (m, k0, i0) => {
|
||||
return {
|
||||
a: common_vendor.t(m),
|
||||
b: m
|
||||
};
|
||||
}),
|
||||
C: common_vendor.t(TRAINING_BENEFIT.effect)
|
||||
} : {}, {
|
||||
D: isPaused.value
|
||||
}, isPaused.value ? {
|
||||
E: common_vendor.o(onTogglePlay, "0f"),
|
||||
F: common_vendor.o(onEndTraining, "0f")
|
||||
} : {}, {
|
||||
G: isPlaying.value ? 1 : "",
|
||||
H: isPaused.value ? 1 : "",
|
||||
I: common_vendor.s(rootStyle.value),
|
||||
J: showRewardPopup.value
|
||||
}, showRewardPopup.value ? {
|
||||
K: common_vendor.t(currentReward.value.emoji),
|
||||
L: common_vendor.t(currentReward.value.title),
|
||||
M: common_vendor.t(currentReward.value.desc),
|
||||
N: common_vendor.t(totalReps.value),
|
||||
O: common_vendor.o(closeRewardPopup, "2a"),
|
||||
P: common_vendor.o(() => {
|
||||
}, "da"),
|
||||
Q: common_vendor.o(closeRewardPopup, "f5")
|
||||
} : {}, {
|
||||
R: showSummary.value
|
||||
}, showSummary.value ? common_vendor.e({
|
||||
S: common_vendor.t(totalReps.value),
|
||||
T: common_vendor.t(formatTime(elapsedSeconds.value)),
|
||||
U: common_vendor.t(totalSugar.value.toFixed(1)),
|
||||
V: sugarComparisons.value.length > 0
|
||||
}, sugarComparisons.value.length > 0 ? {
|
||||
W: common_vendor.f(sugarComparisons.value, (food, idx, i0) => {
|
||||
return {
|
||||
a: common_vendor.t(food.emoji),
|
||||
b: common_vendor.t(food.count),
|
||||
c: common_vendor.t(food.unit),
|
||||
d: common_vendor.t(food.name),
|
||||
e: idx
|
||||
};
|
||||
})
|
||||
} : {}, {
|
||||
X: common_vendor.o(onRestart, "bf"),
|
||||
Y: common_vendor.o(onFinish, "ae"),
|
||||
Z: common_vendor.o(() => {
|
||||
}, "c7"),
|
||||
aa: common_vendor.o(dismissSummary, "50")
|
||||
}) : {});
|
||||
};
|
||||
}
|
||||
});
|
||||
_sfc_defineComponent.__runtimeHooks = 6;
|
||||
const MiniProgramPage = /* @__PURE__ */ common_vendor._export_sfc(_sfc_defineComponent, [["__scopeId", "data-v-88afe775"]]);
|
||||
wx.createPage(MiniProgramPage);
|
||||
//# sourceMappingURL=../../../.sourcemap/mp-weixin/training/pages/foot-pedal.js.map
|
||||
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"navigationBarTitleText": "脚蹬器训练",
|
||||
"navigationBarBackgroundColor": "#f8fafc",
|
||||
"navigationBarTextStyle": "black",
|
||||
"backgroundColor": "#f8fafc",
|
||||
"usingComponents": {}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,519 @@
|
||||
"use strict";
|
||||
const common_vendor = require("../../common/vendor.js");
|
||||
const training_hooks_useMetronome = require("../hooks/useMetronome.js");
|
||||
if (!Math) {
|
||||
CrushCanvas();
|
||||
}
|
||||
const CrushCanvas = () => "./components/crush-canvas.js";
|
||||
const TUTORIAL_VIDEO_URL = "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/video/20260528/20260528173911bf6f93386.mp4";
|
||||
const TUTORIAL_POSTER_URL = "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/images/20260529/202605291030231aed12802.jpg";
|
||||
const BGM_URL = "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/file/20260528/20260528093709c669f4659.mp3";
|
||||
const _sfc_defineComponent = common_vendor.defineComponent({
|
||||
__name: "grip-ring",
|
||||
setup(__props) {
|
||||
const GRIP_PRESETS = [
|
||||
{ id: "light", bpm: 60, met: 2.5, label: "轻度", desc: "热身 · 恢复" },
|
||||
{ id: "medium", bpm: 80, met: 3.5, label: "中度", desc: "日常 · 锻炼" },
|
||||
{ id: "heavy", bpm: 100, met: 4.5, label: "重度", desc: "强化 · 挑战" }
|
||||
];
|
||||
const TARGET_OPTIONS = [
|
||||
{ minutes: 0, label: "自由" },
|
||||
{ minutes: 5, label: "5 分钟" },
|
||||
{ minutes: 10, label: "10 分钟" },
|
||||
{ minutes: 15, label: "15 分钟" }
|
||||
];
|
||||
const REWARDS = [
|
||||
{
|
||||
emoji: "🥚",
|
||||
title: "捏碎鸡蛋",
|
||||
desc: "握力不错!",
|
||||
itemType: "egg",
|
||||
sound: "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/file/20260528/202605280937077bad76716.mp3",
|
||||
minReps: 8,
|
||||
maxReps: 12
|
||||
},
|
||||
{
|
||||
emoji: "🌰",
|
||||
title: "捏碎核桃",
|
||||
desc: "力量惊人!",
|
||||
itemType: "walnut",
|
||||
sound: "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/file/20260528/20260528093707b021f5794.mp3",
|
||||
minReps: 15,
|
||||
maxReps: 20
|
||||
},
|
||||
{
|
||||
emoji: "🥫",
|
||||
title: "捏扁易拉罐",
|
||||
desc: "太强了!",
|
||||
itemType: "can",
|
||||
sound: "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/file/20260528/20260528093707ebd4d5733.mp3",
|
||||
minReps: 25,
|
||||
maxReps: 30
|
||||
},
|
||||
{
|
||||
emoji: "🎈",
|
||||
title: "捏爆气球",
|
||||
desc: "完美!",
|
||||
itemType: "balloon",
|
||||
sound: "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/file/20260528/20260528093707016f07427.mp3",
|
||||
minReps: 40,
|
||||
maxReps: 50
|
||||
}
|
||||
];
|
||||
const FOOD_SUGAR_TABLE = [
|
||||
{ emoji: "🍬", name: "糖果", sugar: 95, unit: "颗", weight: 5 },
|
||||
// 1颗糖果约5g
|
||||
{ emoji: "🍪", name: "饼干", sugar: 65, unit: "块", weight: 10 },
|
||||
// 1块饼干约10g
|
||||
{ emoji: "🍫", name: "巧克力", sugar: 51.5, unit: "块", weight: 50 },
|
||||
// 1块巧克力约50g
|
||||
{ emoji: "🍎", name: "苹果", sugar: 10.3, unit: "个", weight: 200 },
|
||||
// 1个苹果约200g
|
||||
{ emoji: "🍌", name: "香蕉", sugar: 12.2, unit: "根", weight: 120 },
|
||||
// 1根香蕉约120g
|
||||
{ emoji: "🍚", name: "米饭", sugar: 25.9, unit: "碗", weight: 150 },
|
||||
// 1碗米饭约150g
|
||||
{ emoji: "🥤", name: "可乐", sugar: 10.6, unit: "罐", weight: 330 }
|
||||
// 1罐可乐330ml
|
||||
];
|
||||
const currentPreset = common_vendor.ref("medium");
|
||||
const targetMinutes = common_vendor.ref(0);
|
||||
const crushSignal = common_vendor.ref(null);
|
||||
const showRewardPopup = common_vendor.ref(false);
|
||||
const showSummary = common_vendor.ref(false);
|
||||
const currentReward = common_vendor.ref(REWARDS[0]);
|
||||
const crushAudioCtx = common_vendor.ref(null);
|
||||
const bgmAudioCtx = common_vendor.ref(null);
|
||||
const bgmEnabled = common_vendor.ref(true);
|
||||
const totalReps = common_vendor.ref(0);
|
||||
const elapsedSeconds = common_vendor.ref(0);
|
||||
const totalSugar = common_vendor.ref(0);
|
||||
const beatCount = common_vendor.ref(0);
|
||||
const rewardIndex = common_vendor.ref(0);
|
||||
const nextRewardAt = common_vendor.ref(0);
|
||||
const startTime = common_vendor.ref(0);
|
||||
const timerInterval = common_vendor.ref(null);
|
||||
const preset = common_vendor.computed(() => GRIP_PRESETS.find((p) => p.id === currentPreset.value) || GRIP_PRESETS[1]);
|
||||
const currentBpm = common_vendor.computed(() => preset.value.bpm);
|
||||
const currentMet = common_vendor.computed(() => preset.value.met);
|
||||
const targetExpanded = common_vendor.ref(false);
|
||||
const currentTargetLabel = common_vendor.computed(() => {
|
||||
const opt = TARGET_OPTIONS.find((t) => t.minutes === targetMinutes.value);
|
||||
return opt ? opt.label : "自由";
|
||||
});
|
||||
const benefitExpanded = common_vendor.ref(false);
|
||||
const TRAINING_BENEFIT = {
|
||||
muscles: ["前臂屈肌", "手部小肌群", "握力"],
|
||||
effect: "增强握力与前臂肌肉耐力,促进手部血液循环,缓解手指与腕部僵硬,适合日常碎片化锻炼及手部功能康复。"
|
||||
};
|
||||
const metronome = training_hooks_useMetronome.useMetronome({
|
||||
initialBpm: currentBpm.value,
|
||||
accentEvery: 2,
|
||||
silent: true,
|
||||
// 移除木鱼节奏音,仅保留节拍驱动(视觉缩放/次数统计)
|
||||
onBeat
|
||||
});
|
||||
const { isPlaying } = metronome;
|
||||
common_vendor.watch(isPlaying, (playing) => {
|
||||
const videoCtx = common_vendor.index.createVideoContext("gripDemoVideo");
|
||||
if (!videoCtx)
|
||||
return;
|
||||
if (playing) {
|
||||
videoCtx.play();
|
||||
} else {
|
||||
videoCtx.pause();
|
||||
}
|
||||
});
|
||||
const intervalMs = common_vendor.computed(() => 6e4 / currentBpm.value);
|
||||
const hasStats = common_vendor.computed(() => isPlaying.value || totalReps.value > 0);
|
||||
const isPaused = common_vendor.computed(() => !isPlaying.value && totalReps.value > 0 && !showSummary.value);
|
||||
const remainingSeconds = common_vendor.computed(() => {
|
||||
if (targetMinutes.value === 0)
|
||||
return null;
|
||||
const total = targetMinutes.value * 60;
|
||||
return Math.max(0, total - elapsedSeconds.value);
|
||||
});
|
||||
const centerHintText = common_vendor.computed(() => isPaused.value ? "点击继续" : "点击开始");
|
||||
const statusText = common_vendor.computed(() => {
|
||||
if (isPlaying.value)
|
||||
return "训练中";
|
||||
if (isPaused.value)
|
||||
return "已暂停";
|
||||
return "待开始";
|
||||
});
|
||||
const shareTitle = common_vendor.computed(() => {
|
||||
if (totalReps.value === 0)
|
||||
return "握力环训练 · 一起练起来";
|
||||
return `刚刚完成 ${totalReps.value} 次握力训练,约消耗 ${totalSugar.value.toFixed(1)}g 糖分 💪`;
|
||||
});
|
||||
const rootStyle = common_vendor.computed(() => ({
|
||||
"--beat-duration": `${intervalMs.value}ms`
|
||||
}));
|
||||
const sugarComparisons = common_vendor.computed(() => {
|
||||
if (totalSugar.value === 0)
|
||||
return [];
|
||||
const results = [];
|
||||
for (const food of FOOD_SUGAR_TABLE) {
|
||||
const foodSugar = food.sugar * food.weight / 100;
|
||||
const count = totalSugar.value / foodSugar;
|
||||
if (count >= 0.1 && count <= 50) {
|
||||
results.push({
|
||||
emoji: food.emoji,
|
||||
name: food.name,
|
||||
count: count >= 10 ? Math.round(count).toString() : count.toFixed(1),
|
||||
unit: food.unit
|
||||
});
|
||||
}
|
||||
}
|
||||
return results.slice(0, 3);
|
||||
});
|
||||
function onBeat() {
|
||||
beatCount.value++;
|
||||
if (beatCount.value % 2 === 0) {
|
||||
totalReps.value++;
|
||||
if (totalReps.value >= nextRewardAt.value && rewardIndex.value < REWARDS.length) {
|
||||
triggerReward();
|
||||
}
|
||||
}
|
||||
}
|
||||
function calculateSugar(seconds) {
|
||||
const hours = seconds / 3600;
|
||||
const weight = 60;
|
||||
const calories = currentMet.value * weight * hours;
|
||||
return calories / 4;
|
||||
}
|
||||
function formatTime(seconds) {
|
||||
const mins = Math.floor(seconds / 60);
|
||||
const secs = seconds % 60;
|
||||
return `${mins}:${secs.toString().padStart(2, "0")}`;
|
||||
}
|
||||
function triggerReward() {
|
||||
const reward = REWARDS[rewardIndex.value];
|
||||
currentReward.value = reward;
|
||||
crushSignal.value = { type: reward.itemType, nonce: Date.now() };
|
||||
playCrushSound(reward.sound);
|
||||
triggerHaptic();
|
||||
rewardIndex.value++;
|
||||
if (rewardIndex.value < REWARDS.length) {
|
||||
const nextReward = REWARDS[rewardIndex.value];
|
||||
const range = nextReward.maxReps - nextReward.minReps;
|
||||
nextRewardAt.value = totalReps.value + nextReward.minReps + Math.floor(Math.random() * (range + 1));
|
||||
}
|
||||
setTimeout(() => {
|
||||
showRewardPopup.value = true;
|
||||
}, 1200);
|
||||
}
|
||||
function closeRewardPopup() {
|
||||
showRewardPopup.value = false;
|
||||
}
|
||||
function triggerHaptic() {
|
||||
const buzz = (type) => {
|
||||
common_vendor.index.vibrateShort({
|
||||
type,
|
||||
fail: () => {
|
||||
try {
|
||||
common_vendor.index.vibrateShort({});
|
||||
} catch (_) {
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
buzz("heavy");
|
||||
setTimeout(() => buzz("medium"), 120);
|
||||
}
|
||||
function playCrushSound(sound) {
|
||||
if (!sound)
|
||||
return;
|
||||
if (crushAudioCtx.value) {
|
||||
try {
|
||||
crushAudioCtx.value.destroy();
|
||||
} catch (_) {
|
||||
}
|
||||
}
|
||||
crushAudioCtx.value = common_vendor.index.createInnerAudioContext();
|
||||
crushAudioCtx.value.src = sound;
|
||||
crushAudioCtx.value.obeyMuteSwitch = false;
|
||||
crushAudioCtx.value.volume = 0.6;
|
||||
try {
|
||||
crushAudioCtx.value.play();
|
||||
} catch (_) {
|
||||
}
|
||||
}
|
||||
function startBgm() {
|
||||
if (!bgmEnabled.value)
|
||||
return;
|
||||
if (bgmAudioCtx.value) {
|
||||
try {
|
||||
bgmAudioCtx.value.play();
|
||||
} catch (_) {
|
||||
}
|
||||
return;
|
||||
}
|
||||
bgmAudioCtx.value = common_vendor.index.createInnerAudioContext();
|
||||
bgmAudioCtx.value.src = BGM_URL;
|
||||
bgmAudioCtx.value.loop = true;
|
||||
bgmAudioCtx.value.obeyMuteSwitch = false;
|
||||
bgmAudioCtx.value.volume = 0.4;
|
||||
try {
|
||||
bgmAudioCtx.value.play();
|
||||
} catch (_) {
|
||||
}
|
||||
}
|
||||
function stopBgm() {
|
||||
if (bgmAudioCtx.value) {
|
||||
try {
|
||||
bgmAudioCtx.value.pause();
|
||||
} catch (_) {
|
||||
}
|
||||
}
|
||||
}
|
||||
function toggleBgm() {
|
||||
bgmEnabled.value = !bgmEnabled.value;
|
||||
if (bgmEnabled.value && isPlaying.value) {
|
||||
startBgm();
|
||||
} else {
|
||||
stopBgm();
|
||||
}
|
||||
}
|
||||
function onPresetTap(id) {
|
||||
if (isPlaying.value)
|
||||
return;
|
||||
currentPreset.value = id;
|
||||
metronome.setBpm(preset.value.bpm);
|
||||
}
|
||||
function onTargetTap(minutes) {
|
||||
if (isPlaying.value)
|
||||
return;
|
||||
targetMinutes.value = minutes;
|
||||
}
|
||||
function onTogglePlay() {
|
||||
if (isPlaying.value) {
|
||||
pauseTraining();
|
||||
} else {
|
||||
if (totalReps.value === 0) {
|
||||
resetStats();
|
||||
}
|
||||
startTrainingInternal();
|
||||
}
|
||||
}
|
||||
function startTrainingInternal() {
|
||||
metronome.start();
|
||||
startBgm();
|
||||
startTimer();
|
||||
common_vendor.index.setKeepScreenOn({ keepScreenOn: true });
|
||||
}
|
||||
function pauseTraining() {
|
||||
metronome.stop();
|
||||
stopBgm();
|
||||
stopTimer();
|
||||
common_vendor.index.setKeepScreenOn({ keepScreenOn: false });
|
||||
}
|
||||
function onEndTraining() {
|
||||
if (totalReps.value === 0)
|
||||
return;
|
||||
pauseTraining();
|
||||
showSummary.value = true;
|
||||
}
|
||||
function dismissSummary() {
|
||||
showSummary.value = false;
|
||||
resetStats();
|
||||
}
|
||||
function onFinish() {
|
||||
showSummary.value = false;
|
||||
resetStats();
|
||||
}
|
||||
function onRestart() {
|
||||
showSummary.value = false;
|
||||
resetStats();
|
||||
startTrainingInternal();
|
||||
}
|
||||
function resetStats() {
|
||||
totalReps.value = 0;
|
||||
elapsedSeconds.value = 0;
|
||||
totalSugar.value = 0;
|
||||
beatCount.value = 0;
|
||||
rewardIndex.value = 0;
|
||||
startTime.value = Date.now();
|
||||
const firstReward = REWARDS[0];
|
||||
const range = firstReward.maxReps - firstReward.minReps;
|
||||
nextRewardAt.value = firstReward.minReps + Math.floor(Math.random() * (range + 1));
|
||||
}
|
||||
function startTimer() {
|
||||
if (timerInterval.value)
|
||||
return;
|
||||
startTime.value = Date.now() - elapsedSeconds.value * 1e3;
|
||||
timerInterval.value = setInterval(() => {
|
||||
elapsedSeconds.value = Math.floor((Date.now() - startTime.value) / 1e3);
|
||||
totalSugar.value = calculateSugar(elapsedSeconds.value);
|
||||
if (targetMinutes.value > 0 && elapsedSeconds.value >= targetMinutes.value * 60) {
|
||||
onEndTraining();
|
||||
}
|
||||
}, 1e3);
|
||||
}
|
||||
function stopTimer() {
|
||||
if (timerInterval.value) {
|
||||
clearInterval(timerInterval.value);
|
||||
timerInterval.value = null;
|
||||
}
|
||||
}
|
||||
common_vendor.onShow(() => {
|
||||
metronome.preload();
|
||||
});
|
||||
common_vendor.onShareAppMessage(() => ({
|
||||
title: shareTitle.value,
|
||||
path: "/training/pages/grip-ring",
|
||||
imageUrl: TUTORIAL_POSTER_URL
|
||||
}));
|
||||
common_vendor.onShareTimeline(() => ({
|
||||
title: shareTitle.value,
|
||||
imageUrl: TUTORIAL_POSTER_URL
|
||||
}));
|
||||
function cleanupAllMedia() {
|
||||
var _a;
|
||||
try {
|
||||
metronome.stop();
|
||||
} catch (_) {
|
||||
}
|
||||
stopTimer();
|
||||
common_vendor.index.setKeepScreenOn({ keepScreenOn: false });
|
||||
try {
|
||||
(_a = common_vendor.index.createVideoContext("gripDemoVideo")) == null ? void 0 : _a.pause();
|
||||
} catch (_) {
|
||||
}
|
||||
if (bgmAudioCtx.value) {
|
||||
try {
|
||||
bgmAudioCtx.value.stop();
|
||||
} catch (_) {
|
||||
}
|
||||
try {
|
||||
bgmAudioCtx.value.destroy();
|
||||
} catch (_) {
|
||||
}
|
||||
bgmAudioCtx.value = null;
|
||||
}
|
||||
if (crushAudioCtx.value) {
|
||||
try {
|
||||
crushAudioCtx.value.stop();
|
||||
} catch (_) {
|
||||
}
|
||||
try {
|
||||
crushAudioCtx.value.destroy();
|
||||
} catch (_) {
|
||||
}
|
||||
crushAudioCtx.value = null;
|
||||
}
|
||||
}
|
||||
common_vendor.onHide(cleanupAllMedia);
|
||||
common_vendor.onUnload(cleanupAllMedia);
|
||||
return (_ctx, _cache) => {
|
||||
return common_vendor.e({
|
||||
a: common_vendor.t(statusText.value),
|
||||
b: common_vendor.unref(isPlaying) ? 1 : "",
|
||||
c: isPaused.value ? 1 : "",
|
||||
d: common_vendor.p({
|
||||
["crush-signal"]: crushSignal.value
|
||||
}),
|
||||
e: TUTORIAL_VIDEO_URL,
|
||||
f: TUTORIAL_POSTER_URL,
|
||||
g: !common_vendor.unref(isPlaying)
|
||||
}, !common_vendor.unref(isPlaying) ? {
|
||||
h: common_vendor.t(centerHintText.value)
|
||||
} : {
|
||||
i: common_vendor.t(currentBpm.value)
|
||||
}, {
|
||||
j: common_vendor.o(onTogglePlay, "9b"),
|
||||
k: common_vendor.unref(isPlaying) ? 1 : "",
|
||||
l: common_vendor.t(bgmEnabled.value ? "🎵" : "🔇"),
|
||||
m: common_vendor.o(toggleBgm, "6e"),
|
||||
n: remainingSeconds.value !== null && hasStats.value
|
||||
}, remainingSeconds.value !== null && hasStats.value ? {
|
||||
o: common_vendor.t(formatTime(remainingSeconds.value))
|
||||
} : {}, {
|
||||
p: common_vendor.unref(isPlaying)
|
||||
}, common_vendor.unref(isPlaying) ? {} : {}, {
|
||||
q: common_vendor.f(GRIP_PRESETS, (p, k0, i0) => {
|
||||
return {
|
||||
a: common_vendor.t(p.label),
|
||||
b: common_vendor.t(p.bpm),
|
||||
c: p.id,
|
||||
d: currentPreset.value === p.id ? 1 : "",
|
||||
e: common_vendor.o(($event) => onPresetTap(p.id), p.id)
|
||||
};
|
||||
}),
|
||||
r: common_vendor.unref(isPlaying) ? 1 : "",
|
||||
s: common_vendor.t(currentTargetLabel.value),
|
||||
t: common_vendor.t(targetExpanded.value ? "▲" : "▼"),
|
||||
v: common_vendor.o(($event) => targetExpanded.value = !targetExpanded.value, "16"),
|
||||
w: targetExpanded.value
|
||||
}, targetExpanded.value ? {
|
||||
x: common_vendor.f(TARGET_OPTIONS, (t, k0, i0) => {
|
||||
return {
|
||||
a: common_vendor.t(t.label),
|
||||
b: t.minutes,
|
||||
c: targetMinutes.value === t.minutes ? 1 : "",
|
||||
d: common_vendor.o(($event) => onTargetTap(t.minutes), t.minutes)
|
||||
};
|
||||
}),
|
||||
y: common_vendor.unref(isPlaying) ? 1 : ""
|
||||
} : {}, {
|
||||
z: common_vendor.t(benefitExpanded.value ? "收起 ▲" : "展开 ▼"),
|
||||
A: common_vendor.o(($event) => benefitExpanded.value = !benefitExpanded.value, "ee"),
|
||||
B: benefitExpanded.value
|
||||
}, benefitExpanded.value ? {
|
||||
C: common_vendor.f(TRAINING_BENEFIT.muscles, (m, k0, i0) => {
|
||||
return {
|
||||
a: common_vendor.t(m),
|
||||
b: m
|
||||
};
|
||||
}),
|
||||
D: common_vendor.t(TRAINING_BENEFIT.effect)
|
||||
} : {}, {
|
||||
E: isPaused.value
|
||||
}, isPaused.value ? {
|
||||
F: common_vendor.o(onTogglePlay, "8a"),
|
||||
G: common_vendor.o(onEndTraining, "d0")
|
||||
} : {}, {
|
||||
H: common_vendor.unref(isPlaying) ? 1 : "",
|
||||
I: isPaused.value ? 1 : "",
|
||||
J: common_vendor.s(rootStyle.value),
|
||||
K: showRewardPopup.value
|
||||
}, showRewardPopup.value ? {
|
||||
L: common_vendor.t(currentReward.value.emoji),
|
||||
M: common_vendor.t(currentReward.value.title),
|
||||
N: common_vendor.t(currentReward.value.desc),
|
||||
O: common_vendor.t(totalReps.value),
|
||||
P: common_vendor.o(closeRewardPopup, "ae"),
|
||||
Q: common_vendor.o(() => {
|
||||
}, "5b"),
|
||||
R: common_vendor.o(closeRewardPopup, "1a")
|
||||
} : {}, {
|
||||
S: showSummary.value
|
||||
}, showSummary.value ? common_vendor.e({
|
||||
T: common_vendor.t(totalReps.value),
|
||||
U: common_vendor.t(formatTime(elapsedSeconds.value)),
|
||||
V: common_vendor.t(totalSugar.value.toFixed(1)),
|
||||
W: sugarComparisons.value.length > 0
|
||||
}, sugarComparisons.value.length > 0 ? {
|
||||
X: common_vendor.f(sugarComparisons.value, (food, idx, i0) => {
|
||||
return {
|
||||
a: common_vendor.t(food.emoji),
|
||||
b: common_vendor.t(food.count),
|
||||
c: common_vendor.t(food.unit),
|
||||
d: common_vendor.t(food.name),
|
||||
e: idx
|
||||
};
|
||||
})
|
||||
} : {}, {
|
||||
Y: common_vendor.o(onRestart, "78"),
|
||||
Z: common_vendor.o(onFinish, "a1"),
|
||||
aa: common_vendor.o(() => {
|
||||
}, "c4"),
|
||||
ab: common_vendor.o(dismissSummary, "77")
|
||||
}) : {});
|
||||
};
|
||||
}
|
||||
});
|
||||
_sfc_defineComponent.__runtimeHooks = 6;
|
||||
const MiniProgramPage = /* @__PURE__ */ common_vendor._export_sfc(_sfc_defineComponent, [["__scopeId", "data-v-cebdebdc"]]);
|
||||
wx.createPage(MiniProgramPage);
|
||||
//# sourceMappingURL=../../../.sourcemap/mp-weixin/training/pages/grip-ring.js.map
|
||||
@@ -0,0 +1,9 @@
|
||||
{
|
||||
"navigationBarTitleText": "握力环训练",
|
||||
"navigationBarBackgroundColor": "#f8fafc",
|
||||
"navigationBarTextStyle": "black",
|
||||
"backgroundColor": "#f8fafc",
|
||||
"usingComponents": {
|
||||
"crush-canvas": "./components/crush-canvas"
|
||||
}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,150 @@
|
||||
"use strict";
|
||||
const common_vendor = require("../../common/vendor.js");
|
||||
const training_hooks_useMetronome = require("../hooks/useMetronome.js");
|
||||
if (!Math) {
|
||||
WalkerCanvas();
|
||||
}
|
||||
const WalkerCanvas = () => "./components/walker-canvas.js";
|
||||
const _sfc_main = /* @__PURE__ */ common_vendor.defineComponent({
|
||||
__name: "metronome",
|
||||
setup(__props) {
|
||||
const LOOP_PRESETS = [
|
||||
{ id: "slow", bpm: 110, label: "慢走", desc: "热身 · 恢复" },
|
||||
{ id: "normal", bpm: 130, label: "健走", desc: "日常 · 通勤" },
|
||||
{ id: "brisk", bpm: 150, label: "快走", desc: "提速 · 燃脂" }
|
||||
];
|
||||
const customExpanded = common_vendor.ref(false);
|
||||
const currentLoop = common_vendor.ref("normal");
|
||||
const currentSound = common_vendor.ref("crisp");
|
||||
const walkerCanvasRef = common_vendor.ref(null);
|
||||
const SOUND_PRESETS = {
|
||||
crisp: {
|
||||
normal: "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/file/20260527/202605271539371ebe13672.mp3",
|
||||
accent: "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/file/20260527/202605271539376ff628472.mp3"
|
||||
},
|
||||
wood: {
|
||||
normal: "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/file/20260526/202605261051282a0a94508.mp3",
|
||||
accent: "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/file/20260526/202605261051282a0a94508.mp3"
|
||||
}
|
||||
};
|
||||
const fg = training_hooks_useMetronome.useMetronome({
|
||||
initialBpm: 130,
|
||||
accentEvery: 2,
|
||||
clickSrc: SOUND_PRESETS.crisp.normal,
|
||||
accentSrc: SOUND_PRESETS.crisp.accent,
|
||||
poolSize: 4,
|
||||
// 【完美音画同步核心】
|
||||
onBeat: (index, isAccent) => {
|
||||
if (walkerCanvasRef.value && walkerCanvasRef.value.triggerBeat) {
|
||||
walkerCanvasRef.value.triggerBeat();
|
||||
}
|
||||
}
|
||||
});
|
||||
const isPlaying = common_vendor.computed(() => fg.isPlaying.value);
|
||||
const currentBpm = common_vendor.computed(() => fg.bpm.value);
|
||||
const customAccent = common_vendor.computed(() => fg.accentEvery.value);
|
||||
const intervalMs = common_vendor.computed(() => 6e4 / fg.bpm.value);
|
||||
const onCenterTap = () => {
|
||||
if (fg.isPlaying.value) {
|
||||
fg.stop();
|
||||
common_vendor.index.setKeepScreenOn({ keepScreenOn: false });
|
||||
} else {
|
||||
fg.start();
|
||||
common_vendor.index.setKeepScreenOn({ keepScreenOn: true });
|
||||
}
|
||||
};
|
||||
const onPresetTap = (id) => {
|
||||
const preset = LOOP_PRESETS.find((p) => p.id === id);
|
||||
if (!preset)
|
||||
return;
|
||||
currentLoop.value = id;
|
||||
fg.setBpm(preset.bpm);
|
||||
if (!fg.isPlaying.value) {
|
||||
fg.start();
|
||||
common_vendor.index.setKeepScreenOn({ keepScreenOn: true });
|
||||
}
|
||||
};
|
||||
const onToggleCustom = () => {
|
||||
customExpanded.value = !customExpanded.value;
|
||||
if (customExpanded.value) {
|
||||
fg.preload();
|
||||
} else {
|
||||
const matched = LOOP_PRESETS.find((p) => p.bpm === fg.bpm.value);
|
||||
currentLoop.value = matched ? matched.id : null;
|
||||
}
|
||||
};
|
||||
const onBpmDelta = (delta) => {
|
||||
fg.setBpm(fg.bpm.value + delta);
|
||||
currentLoop.value = null;
|
||||
};
|
||||
const onAccentSelect = (n) => {
|
||||
fg.setAccentEvery(n);
|
||||
};
|
||||
const onSoundSelect = (sound) => {
|
||||
currentSound.value = sound;
|
||||
const preset = SOUND_PRESETS[sound];
|
||||
fg.updateAudioSrc(preset.normal, preset.accent);
|
||||
};
|
||||
const rootStyle = common_vendor.computed(() => ({
|
||||
"--beat-duration": `${intervalMs.value}ms`
|
||||
}));
|
||||
common_vendor.onShow(() => {
|
||||
fg.preload();
|
||||
});
|
||||
function cleanupMetronome() {
|
||||
fg.stop();
|
||||
common_vendor.index.setKeepScreenOn({ keepScreenOn: false });
|
||||
}
|
||||
common_vendor.onHide(cleanupMetronome);
|
||||
common_vendor.onUnload(cleanupMetronome);
|
||||
common_vendor.onUnmounted(cleanupMetronome);
|
||||
return (_ctx, _cache) => {
|
||||
return common_vendor.e({
|
||||
a: common_vendor.sr(walkerCanvasRef, "a75aa31b-0", {
|
||||
"k": "walkerCanvasRef"
|
||||
}),
|
||||
b: common_vendor.o(onCenterTap, "0f"),
|
||||
c: common_vendor.p({
|
||||
bpm: currentBpm.value,
|
||||
["is-playing"]: isPlaying.value
|
||||
}),
|
||||
d: currentSound.value === "crisp" ? 1 : "",
|
||||
e: common_vendor.o(($event) => onSoundSelect("crisp"), "8c"),
|
||||
f: currentSound.value === "wood" ? 1 : "",
|
||||
g: common_vendor.o(($event) => onSoundSelect("wood"), "43"),
|
||||
h: common_vendor.f(LOOP_PRESETS, (p, k0, i0) => {
|
||||
return {
|
||||
a: common_vendor.t(p.label),
|
||||
b: common_vendor.t(p.bpm),
|
||||
c: common_vendor.t(p.desc),
|
||||
d: p.id,
|
||||
e: currentLoop.value === p.id ? 1 : "",
|
||||
f: common_vendor.o(($event) => onPresetTap(p.id), p.id)
|
||||
};
|
||||
}),
|
||||
i: common_vendor.t(customExpanded.value ? "✕ 收起自定义" : "⚙ 自定义节奏"),
|
||||
j: common_vendor.o(onToggleCustom, "29"),
|
||||
k: customExpanded.value
|
||||
}, customExpanded.value ? {
|
||||
l: common_vendor.o(($event) => onBpmDelta(-5), "71"),
|
||||
m: common_vendor.o(($event) => onBpmDelta(-1), "5b"),
|
||||
n: common_vendor.t(currentBpm.value),
|
||||
o: common_vendor.o(($event) => onBpmDelta(1), "90"),
|
||||
p: common_vendor.o(($event) => onBpmDelta(5), "b0"),
|
||||
q: common_vendor.f([2, 3, 4], (n, k0, i0) => {
|
||||
return {
|
||||
a: common_vendor.t(n),
|
||||
b: n,
|
||||
c: customAccent.value === n ? 1 : "",
|
||||
d: common_vendor.o(($event) => onAccentSelect(n), n)
|
||||
};
|
||||
})
|
||||
} : {}, {
|
||||
r: common_vendor.s(rootStyle.value)
|
||||
});
|
||||
};
|
||||
}
|
||||
});
|
||||
const MiniProgramPage = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["__scopeId", "data-v-a75aa31b"]]);
|
||||
wx.createPage(MiniProgramPage);
|
||||
//# sourceMappingURL=../../../.sourcemap/mp-weixin/training/pages/metronome.js.map
|
||||
@@ -0,0 +1,9 @@
|
||||
{
|
||||
"navigationBarTitleText": "耗糖节拍器",
|
||||
"navigationBarBackgroundColor": "#f8fafc",
|
||||
"navigationBarTextStyle": "black",
|
||||
"backgroundColor": "#f8fafc",
|
||||
"usingComponents": {
|
||||
"walker-canvas": "./components/walker-canvas"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
<view class="page data-v-a75aa31b" style="{{r}}"><view class="stage-canvas-wrapper data-v-a75aa31b"><walker-canvas wx:if="{{c}}" class="r data-v-a75aa31b" u-r="walkerCanvasRef" bindtogglePlay="{{b}}" u-i="a75aa31b-0" bind:__l="__l" u-p="{{c}}"/></view><view class="sound-selector data-v-a75aa31b"><view class="{{['sound-option', 'data-v-a75aa31b', d && 'active']}}" bindtap="{{e}}"><text class="sound-icon data-v-a75aa31b">✨</text><text class="sound-label data-v-a75aa31b">清脆</text></view><view class="{{['sound-option', 'data-v-a75aa31b', f && 'active']}}" bindtap="{{g}}"><text class="sound-icon data-v-a75aa31b">🪵</text><text class="sound-label data-v-a75aa31b">木鱼</text></view></view><view class="presets data-v-a75aa31b"><view wx:for="{{h}}" wx:for-item="p" wx:key="d" class="{{['preset', 'data-v-a75aa31b', p.e && 'active']}}" bindtap="{{p.f}}"><text class="preset-name data-v-a75aa31b">{{p.a}}</text><text class="preset-bpm data-v-a75aa31b">{{p.b}} BPM</text><text class="preset-desc data-v-a75aa31b">{{p.c}}</text></view></view><view class="custom-section data-v-a75aa31b"><view class="custom-header data-v-a75aa31b" bindtap="{{j}}"><text class="custom-title data-v-a75aa31b">{{i}}</text></view><view wx:if="{{k}}" class="custom-content data-v-a75aa31b"><view class="row data-v-a75aa31b"><text class="row-label data-v-a75aa31b">BPM</text><view class="bpm-stepper data-v-a75aa31b"><view class="step-btn data-v-a75aa31b" bindtap="{{l}}">−5</view><view class="step-btn data-v-a75aa31b" bindtap="{{m}}">−1</view><view class="step-val data-v-a75aa31b">{{n}}</view><view class="step-btn data-v-a75aa31b" bindtap="{{o}}">+1</view><view class="step-btn data-v-a75aa31b" bindtap="{{p}}">+5</view></view></view><view class="row data-v-a75aa31b"><text class="row-label data-v-a75aa31b">拍号</text><view class="meter-tabs data-v-a75aa31b"><view wx:for="{{q}}" wx:for-item="n" wx:key="b" class="{{['meter-tab', 'data-v-a75aa31b', n.c && 'active']}}" bindtap="{{n.d}}">{{n.a}}/4</view></view></view></view></view></view>
|
||||
@@ -0,0 +1,311 @@
|
||||
/**
|
||||
* 这里是uni-app内置的常用样式变量
|
||||
*
|
||||
* uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量
|
||||
* 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App
|
||||
*
|
||||
*/
|
||||
/**
|
||||
* 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能
|
||||
*
|
||||
* 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
|
||||
*/
|
||||
/* 颜色变量 */
|
||||
/* 行为相关颜色 */
|
||||
/* 文字基本颜色 */
|
||||
/* 背景颜色 */
|
||||
/* 边框颜色 */
|
||||
/* 尺寸变量 */
|
||||
/* 文字尺寸 */
|
||||
/* 图片尺寸 */
|
||||
/* Border Radius */
|
||||
/* 水平间距 */
|
||||
/* 垂直间距 */
|
||||
/* 透明度 */
|
||||
/* 文章场景相关 */
|
||||
/* ============================================================
|
||||
* 设计 token —— 浅色清爽
|
||||
* ============================================================ */
|
||||
/* ============================================================
|
||||
* 页面容器
|
||||
* ============================================================ */
|
||||
.page.data-v-a75aa31b {
|
||||
position: relative;
|
||||
min-height: 100vh;
|
||||
box-sizing: border-box;
|
||||
padding: 30rpx 28rpx 50rpx;
|
||||
background: #f8fafc;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 20rpx;
|
||||
color: #0f172a;
|
||||
}
|
||||
|
||||
/* ============================================================
|
||||
* 统一运动律动视区 (Canvas)
|
||||
* ============================================================ */
|
||||
.stage-canvas-wrapper.data-v-a75aa31b {
|
||||
width: 100vw;
|
||||
margin-left: -28rpx;
|
||||
margin-right: -28rpx;
|
||||
flex-shrink: 0;
|
||||
/* 防止被压缩 */
|
||||
height: 600rpx;
|
||||
/* 固定高度,不随内容变化 */
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-bottom: 24rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* ============================================================
|
||||
* 音色选择器
|
||||
* ============================================================ */
|
||||
.sound-selector.data-v-a75aa31b {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
gap: 14rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.sound-option.data-v-a75aa31b {
|
||||
flex: 1;
|
||||
background: #ffffff;
|
||||
border: 2rpx solid rgba(15, 23, 42, 0.06);
|
||||
border-radius: 24rpx;
|
||||
padding: 20rpx 16rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 10rpx;
|
||||
box-shadow: 0 4rpx 12rpx rgba(15, 23, 42, 0.04);
|
||||
transition: all 0.18s;
|
||||
}
|
||||
.sound-option .sound-icon.data-v-a75aa31b {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
.sound-option .sound-label.data-v-a75aa31b {
|
||||
font-size: 26rpx;
|
||||
font-weight: 600;
|
||||
color: #475569;
|
||||
letter-spacing: 1rpx;
|
||||
}
|
||||
.sound-option.data-v-a75aa31b:active {
|
||||
transform: scale(0.97);
|
||||
}
|
||||
.sound-option.active.data-v-a75aa31b {
|
||||
background: linear-gradient(135deg, #d1fae5 0%, #a7f3d0 100%);
|
||||
border-color: #10b981;
|
||||
box-shadow: 0 8rpx 20rpx rgba(16, 185, 129, 0.18), inset 0 0 0 2rpx rgba(16, 185, 129, 0.4);
|
||||
}
|
||||
.sound-option.active .sound-label.data-v-a75aa31b {
|
||||
color: #047857;
|
||||
}
|
||||
|
||||
/* ============================================================
|
||||
* 三档位推荐
|
||||
* ============================================================ */
|
||||
.presets.data-v-a75aa31b {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
gap: 14rpx;
|
||||
}
|
||||
.preset.data-v-a75aa31b {
|
||||
flex: 1;
|
||||
background: #ffffff;
|
||||
border: 2rpx solid rgba(15, 23, 42, 0.06);
|
||||
border-radius: 24rpx;
|
||||
padding: 26rpx 8rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 8rpx;
|
||||
box-shadow: 0 4rpx 12rpx rgba(15, 23, 42, 0.04);
|
||||
transition: all 0.18s;
|
||||
}
|
||||
.preset .preset-name.data-v-a75aa31b {
|
||||
font-size: 28rpx;
|
||||
font-weight: 700;
|
||||
color: #0f172a;
|
||||
letter-spacing: 2rpx;
|
||||
}
|
||||
.preset .preset-bpm.data-v-a75aa31b {
|
||||
font-size: 22rpx;
|
||||
color: #475569;
|
||||
font-weight: 600;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
.preset .preset-desc.data-v-a75aa31b {
|
||||
font-size: 18rpx;
|
||||
color: #94a3b8;
|
||||
letter-spacing: 1rpx;
|
||||
margin-top: 2rpx;
|
||||
}
|
||||
.preset.data-v-a75aa31b:active {
|
||||
transform: scale(0.97);
|
||||
}
|
||||
.preset.active.data-v-a75aa31b {
|
||||
background: #d1fae5;
|
||||
border-color: #10b981;
|
||||
box-shadow: 0 8rpx 20rpx rgba(16, 185, 129, 0.18), inset 0 0 0 2rpx rgba(16, 185, 129, 0.4);
|
||||
}
|
||||
.preset.active .preset-name.data-v-a75aa31b {
|
||||
color: #047857;
|
||||
}
|
||||
.preset.active .preset-bpm.data-v-a75aa31b {
|
||||
color: #047857;
|
||||
}
|
||||
.preset.active .preset-desc.data-v-a75aa31b {
|
||||
color: #10b981;
|
||||
}
|
||||
|
||||
/* ============================================================
|
||||
* 自定义节奏区域(标题栏 + 折叠内容)
|
||||
* ============================================================ */
|
||||
.custom-section.data-v-a75aa31b {
|
||||
width: 100%;
|
||||
margin-top: 12rpx;
|
||||
}
|
||||
.custom-header.data-v-a75aa31b {
|
||||
width: 100%;
|
||||
padding: 16rpx 6rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.custom-header .custom-title.data-v-a75aa31b {
|
||||
font-size: 22rpx;
|
||||
color: #94a3b8;
|
||||
letter-spacing: 0.5rpx;
|
||||
}
|
||||
.custom-header .custom-title.data-v-a75aa31b:active {
|
||||
color: #475569;
|
||||
}
|
||||
.custom-content.data-v-a75aa31b {
|
||||
width: 100%;
|
||||
background: #ffffff;
|
||||
border: 2rpx solid rgba(245, 158, 11, 0.25);
|
||||
border-radius: 24rpx;
|
||||
box-shadow: 0 6rpx 18rpx rgba(245, 158, 11, 0.08);
|
||||
padding: 20rpx 24rpx 22rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16rpx;
|
||||
margin-top: 8rpx;
|
||||
}
|
||||
.custom-warn.data-v-a75aa31b {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8rpx;
|
||||
margin-bottom: 4rpx;
|
||||
}
|
||||
.custom-warn .warn-dot.data-v-a75aa31b {
|
||||
font-size: 18rpx;
|
||||
color: #f59e0b;
|
||||
}
|
||||
.custom-warn .warn-text.data-v-a75aa31b {
|
||||
font-size: 22rpx;
|
||||
color: #b45309;
|
||||
letter-spacing: 0.5rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
.row.data-v-a75aa31b {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 12rpx;
|
||||
}
|
||||
.row .row-label.data-v-a75aa31b {
|
||||
font-size: 24rpx;
|
||||
color: #475569;
|
||||
font-weight: 600;
|
||||
letter-spacing: 1rpx;
|
||||
flex-shrink: 0;
|
||||
width: 70rpx;
|
||||
}
|
||||
.bpm-stepper.data-v-a75aa31b {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6rpx;
|
||||
flex: 1;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.bpm-stepper .step-btn.data-v-a75aa31b {
|
||||
min-width: 56rpx;
|
||||
height: 52rpx;
|
||||
line-height: 52rpx;
|
||||
text-align: center;
|
||||
font-size: 22rpx;
|
||||
color: #475569;
|
||||
background: #f1f5f9;
|
||||
border-radius: 10rpx;
|
||||
font-weight: 600;
|
||||
padding: 0 10rpx;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
.bpm-stepper .step-btn.data-v-a75aa31b:active {
|
||||
background: #e2e8f0;
|
||||
transform: scale(0.94);
|
||||
}
|
||||
.bpm-stepper .step-val.data-v-a75aa31b {
|
||||
min-width: 84rpx;
|
||||
height: 52rpx;
|
||||
line-height: 52rpx;
|
||||
text-align: center;
|
||||
font-size: 30rpx;
|
||||
font-weight: 800;
|
||||
color: #0f172a;
|
||||
font-variant-numeric: tabular-nums;
|
||||
background: #fef3c7;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
.meter-tabs.data-v-a75aa31b {
|
||||
display: flex;
|
||||
gap: 8rpx;
|
||||
}
|
||||
.meter-tabs .meter-tab.data-v-a75aa31b {
|
||||
height: 52rpx;
|
||||
line-height: 52rpx;
|
||||
padding: 0 18rpx;
|
||||
font-size: 22rpx;
|
||||
color: #475569;
|
||||
background: #f1f5f9;
|
||||
border-radius: 10rpx;
|
||||
font-weight: 600;
|
||||
letter-spacing: 1rpx;
|
||||
}
|
||||
.meter-tabs .meter-tab.active.data-v-a75aa31b {
|
||||
background: #f59e0b;
|
||||
color: #fff;
|
||||
box-shadow: 0 4rpx 10rpx rgba(245, 158, 11, 0.3);
|
||||
}
|
||||
.meter-tabs .meter-tab.data-v-a75aa31b:active {
|
||||
transform: scale(0.94);
|
||||
}
|
||||
|
||||
/* ============================================================
|
||||
* 底部行(已废弃,保留样式以防引用)
|
||||
* ============================================================ */
|
||||
.bottom-row.data-v-a75aa31b {
|
||||
width: 100%;
|
||||
margin-top: 6rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 6rpx;
|
||||
}
|
||||
.bottom-link.data-v-a75aa31b {
|
||||
font-size: 22rpx;
|
||||
color: #94a3b8;
|
||||
letter-spacing: 0.5rpx;
|
||||
padding: 8rpx 4rpx;
|
||||
}
|
||||
.bottom-link.data-v-a75aa31b:active {
|
||||
color: #475569;
|
||||
}
|
||||
.bottom-hint.data-v-a75aa31b {
|
||||
font-size: 22rpx;
|
||||
color: #94a3b8;
|
||||
letter-spacing: 0.5rpx;
|
||||
}
|
||||
@@ -0,0 +1,446 @@
|
||||
"use strict";
|
||||
const common_vendor = require("../../common/vendor.js");
|
||||
const TUTORIAL_VIDEO_URL = "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/video/20260528/202605281739110fa2d3784.mp4";
|
||||
const TUTORIAL_POSTER_URL = "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/images/20260529/2026052911251785db25125.jpg";
|
||||
const BGM_URL = "https://gz-1349751149.cos.ap-guangzhou.myqcloud.com/uploads/file/20260528/20260528093709c669f4659.mp3";
|
||||
const _sfc_defineComponent = common_vendor.defineComponent({
|
||||
__name: "pilates-ring",
|
||||
setup(__props) {
|
||||
const PILATES_PRESETS = [
|
||||
{ id: "light", bpm: 50, met: 3, label: "轻度", desc: "热身 · 激活" },
|
||||
{ id: "medium", bpm: 65, met: 4, label: "中度", desc: "日常 · 塑形" },
|
||||
{ id: "heavy", bpm: 80, met: 5, label: "重度", desc: "强化 · 挑战" }
|
||||
];
|
||||
const TARGET_OPTIONS = [
|
||||
{ minutes: 0, label: "自由" },
|
||||
{ minutes: 5, label: "5 分钟" },
|
||||
{ minutes: 10, label: "10 分钟" },
|
||||
{ minutes: 15, label: "15 分钟" }
|
||||
];
|
||||
const MILESTONES = [
|
||||
{ emoji: "🌸", title: "热身完成", desc: "身体已激活!", minReps: 8, maxReps: 12 },
|
||||
{ emoji: "💫", title: "核心稳定", desc: "动作很标准!", minReps: 15, maxReps: 20 },
|
||||
{ emoji: "✨", title: "塑形进阶", desc: "力量感很棒!", minReps: 25, maxReps: 30 },
|
||||
{ emoji: "🏆", title: "完美收官", desc: "太棒了!", minReps: 40, maxReps: 50 }
|
||||
];
|
||||
const FOOD_SUGAR_TABLE = [
|
||||
{ emoji: "🍬", name: "糖果", sugar: 95, unit: "颗", weight: 5 },
|
||||
// 1颗糖果约5g
|
||||
{ emoji: "🍪", name: "饼干", sugar: 65, unit: "块", weight: 10 },
|
||||
// 1块饼干约10g
|
||||
{ emoji: "🍫", name: "巧克力", sugar: 51.5, unit: "块", weight: 50 },
|
||||
// 1块巧克力约50g
|
||||
{ emoji: "🍎", name: "苹果", sugar: 10.3, unit: "个", weight: 200 },
|
||||
// 1个苹果约200g
|
||||
{ emoji: "🍌", name: "香蕉", sugar: 12.2, unit: "根", weight: 120 },
|
||||
// 1根香蕉约120g
|
||||
{ emoji: "🍚", name: "米饭", sugar: 25.9, unit: "碗", weight: 150 },
|
||||
// 1碗米饭约150g
|
||||
{ emoji: "🥤", name: "可乐", sugar: 10.6, unit: "罐", weight: 330 }
|
||||
// 1罐可乐330ml
|
||||
];
|
||||
const currentPreset = common_vendor.ref("medium");
|
||||
const targetMinutes = common_vendor.ref(0);
|
||||
const isPlaying = common_vendor.ref(false);
|
||||
const beatTimer = common_vendor.ref(null);
|
||||
const showRewardPopup = common_vendor.ref(false);
|
||||
const showSummary = common_vendor.ref(false);
|
||||
const currentReward = common_vendor.ref(MILESTONES[0]);
|
||||
const bgmAudioCtx = common_vendor.ref(null);
|
||||
const bgmEnabled = common_vendor.ref(true);
|
||||
const totalReps = common_vendor.ref(0);
|
||||
const elapsedSeconds = common_vendor.ref(0);
|
||||
const totalSugar = common_vendor.ref(0);
|
||||
const beatCount = common_vendor.ref(0);
|
||||
const rewardIndex = common_vendor.ref(0);
|
||||
const nextRewardAt = common_vendor.ref(0);
|
||||
const startTime = common_vendor.ref(0);
|
||||
const timerInterval = common_vendor.ref(null);
|
||||
const preset = common_vendor.computed(() => PILATES_PRESETS.find((p) => p.id === currentPreset.value) || PILATES_PRESETS[1]);
|
||||
const currentBpm = common_vendor.computed(() => preset.value.bpm);
|
||||
const currentMet = common_vendor.computed(() => preset.value.met);
|
||||
const targetExpanded = common_vendor.ref(false);
|
||||
const currentTargetLabel = common_vendor.computed(() => {
|
||||
const opt = TARGET_OPTIONS.find((t) => t.minutes === targetMinutes.value);
|
||||
return opt ? opt.label : "自由";
|
||||
});
|
||||
const benefitExpanded = common_vendor.ref(false);
|
||||
const TRAINING_BENEFIT = {
|
||||
muscles: ["核心肌群", "盆底肌", "大腿内侧", "臀部"],
|
||||
effect: "通过持续抗阻收紧核心与盆底肌,强化深层稳定肌群,改善体态、收紧腹部与腿部线条,提升身体协调性与柔韧度。"
|
||||
};
|
||||
common_vendor.watch(isPlaying, (playing) => {
|
||||
const videoCtx = common_vendor.index.createVideoContext("pilatesDemoVideo");
|
||||
if (!videoCtx)
|
||||
return;
|
||||
if (playing) {
|
||||
videoCtx.play();
|
||||
} else {
|
||||
videoCtx.pause();
|
||||
}
|
||||
});
|
||||
const intervalMs = common_vendor.computed(() => 6e4 / currentBpm.value);
|
||||
const hasStats = common_vendor.computed(() => isPlaying.value || totalReps.value > 0);
|
||||
const isPaused = common_vendor.computed(() => !isPlaying.value && totalReps.value > 0 && !showSummary.value);
|
||||
const remainingSeconds = common_vendor.computed(() => {
|
||||
if (targetMinutes.value === 0)
|
||||
return null;
|
||||
const total = targetMinutes.value * 60;
|
||||
return Math.max(0, total - elapsedSeconds.value);
|
||||
});
|
||||
const centerHintText = common_vendor.computed(() => isPaused.value ? "点击继续" : "点击开始");
|
||||
const statusText = common_vendor.computed(() => {
|
||||
if (isPlaying.value)
|
||||
return "训练中";
|
||||
if (isPaused.value)
|
||||
return "已暂停";
|
||||
return "待开始";
|
||||
});
|
||||
const shareTitle = common_vendor.computed(() => {
|
||||
if (totalReps.value === 0)
|
||||
return "瑜伽环训练 · 一起练起来";
|
||||
return `刚刚完成 ${totalReps.value} 次瑜伽环训练,约消耗 ${totalSugar.value.toFixed(1)}g 糖分 ✨`;
|
||||
});
|
||||
const rootStyle = common_vendor.computed(() => ({
|
||||
"--beat-duration": `${intervalMs.value}ms`
|
||||
}));
|
||||
const sugarComparisons = common_vendor.computed(() => {
|
||||
if (totalSugar.value === 0)
|
||||
return [];
|
||||
const results = [];
|
||||
for (const food of FOOD_SUGAR_TABLE) {
|
||||
const foodSugar = food.sugar * food.weight / 100;
|
||||
const count = totalSugar.value / foodSugar;
|
||||
if (count >= 0.1 && count <= 50) {
|
||||
results.push({
|
||||
emoji: food.emoji,
|
||||
name: food.name,
|
||||
count: count >= 10 ? Math.round(count).toString() : count.toFixed(1),
|
||||
unit: food.unit
|
||||
});
|
||||
}
|
||||
}
|
||||
return results.slice(0, 3);
|
||||
});
|
||||
function onBeat() {
|
||||
beatCount.value++;
|
||||
if (beatCount.value % 2 === 0) {
|
||||
totalReps.value++;
|
||||
if (totalReps.value >= nextRewardAt.value && rewardIndex.value < MILESTONES.length) {
|
||||
triggerReward();
|
||||
}
|
||||
}
|
||||
}
|
||||
function calculateSugar(seconds) {
|
||||
const hours = seconds / 3600;
|
||||
const weight = 60;
|
||||
const calories = currentMet.value * weight * hours;
|
||||
return calories / 4;
|
||||
}
|
||||
function formatTime(seconds) {
|
||||
const mins = Math.floor(seconds / 60);
|
||||
const secs = seconds % 60;
|
||||
return `${mins}:${secs.toString().padStart(2, "0")}`;
|
||||
}
|
||||
function triggerReward() {
|
||||
const reward = MILESTONES[rewardIndex.value];
|
||||
currentReward.value = reward;
|
||||
triggerHaptic();
|
||||
rewardIndex.value++;
|
||||
if (rewardIndex.value < MILESTONES.length) {
|
||||
const nextReward = MILESTONES[rewardIndex.value];
|
||||
const range = nextReward.maxReps - nextReward.minReps;
|
||||
nextRewardAt.value = totalReps.value + nextReward.minReps + Math.floor(Math.random() * (range + 1));
|
||||
}
|
||||
setTimeout(() => {
|
||||
showRewardPopup.value = true;
|
||||
}, 400);
|
||||
}
|
||||
function closeRewardPopup() {
|
||||
showRewardPopup.value = false;
|
||||
}
|
||||
function triggerHaptic() {
|
||||
common_vendor.index.vibrateShort({
|
||||
type: "medium",
|
||||
fail: () => {
|
||||
try {
|
||||
common_vendor.index.vibrateShort({});
|
||||
} catch (_) {
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
function startRhythm() {
|
||||
stopRhythm();
|
||||
isPlaying.value = true;
|
||||
const beatMs = 6e4 / currentBpm.value;
|
||||
beatTimer.value = setInterval(onBeat, beatMs);
|
||||
}
|
||||
function stopRhythm() {
|
||||
isPlaying.value = false;
|
||||
if (beatTimer.value) {
|
||||
clearInterval(beatTimer.value);
|
||||
beatTimer.value = null;
|
||||
}
|
||||
}
|
||||
function startBgm() {
|
||||
if (!bgmEnabled.value)
|
||||
return;
|
||||
if (bgmAudioCtx.value) {
|
||||
try {
|
||||
bgmAudioCtx.value.play();
|
||||
} catch (_) {
|
||||
}
|
||||
return;
|
||||
}
|
||||
bgmAudioCtx.value = common_vendor.index.createInnerAudioContext();
|
||||
bgmAudioCtx.value.src = BGM_URL;
|
||||
bgmAudioCtx.value.loop = true;
|
||||
bgmAudioCtx.value.obeyMuteSwitch = false;
|
||||
bgmAudioCtx.value.volume = 0.4;
|
||||
try {
|
||||
bgmAudioCtx.value.play();
|
||||
} catch (_) {
|
||||
}
|
||||
}
|
||||
function stopBgm() {
|
||||
if (bgmAudioCtx.value) {
|
||||
try {
|
||||
bgmAudioCtx.value.pause();
|
||||
} catch (_) {
|
||||
}
|
||||
}
|
||||
}
|
||||
function toggleBgm() {
|
||||
bgmEnabled.value = !bgmEnabled.value;
|
||||
if (bgmEnabled.value && isPlaying.value) {
|
||||
startBgm();
|
||||
} else {
|
||||
stopBgm();
|
||||
}
|
||||
}
|
||||
function onPresetTap(id) {
|
||||
if (isPlaying.value)
|
||||
return;
|
||||
currentPreset.value = id;
|
||||
if (beatTimer.value) {
|
||||
stopRhythm();
|
||||
startRhythm();
|
||||
}
|
||||
}
|
||||
function onTargetTap(minutes) {
|
||||
if (isPlaying.value)
|
||||
return;
|
||||
targetMinutes.value = minutes;
|
||||
}
|
||||
function onTogglePlay() {
|
||||
if (isPlaying.value) {
|
||||
pauseTraining();
|
||||
} else {
|
||||
if (totalReps.value === 0) {
|
||||
resetStats();
|
||||
}
|
||||
startTrainingInternal();
|
||||
}
|
||||
}
|
||||
function startTrainingInternal() {
|
||||
startRhythm();
|
||||
startBgm();
|
||||
startTimer();
|
||||
common_vendor.index.setKeepScreenOn({ keepScreenOn: true });
|
||||
}
|
||||
function pauseTraining() {
|
||||
stopRhythm();
|
||||
stopBgm();
|
||||
stopTimer();
|
||||
common_vendor.index.setKeepScreenOn({ keepScreenOn: false });
|
||||
}
|
||||
function onEndTraining() {
|
||||
if (totalReps.value === 0)
|
||||
return;
|
||||
pauseTraining();
|
||||
showSummary.value = true;
|
||||
}
|
||||
function dismissSummary() {
|
||||
showSummary.value = false;
|
||||
resetStats();
|
||||
}
|
||||
function onFinish() {
|
||||
showSummary.value = false;
|
||||
resetStats();
|
||||
}
|
||||
function onRestart() {
|
||||
showSummary.value = false;
|
||||
resetStats();
|
||||
startTrainingInternal();
|
||||
}
|
||||
function resetStats() {
|
||||
totalReps.value = 0;
|
||||
elapsedSeconds.value = 0;
|
||||
totalSugar.value = 0;
|
||||
beatCount.value = 0;
|
||||
rewardIndex.value = 0;
|
||||
startTime.value = Date.now();
|
||||
const firstReward = MILESTONES[0];
|
||||
const range = firstReward.maxReps - firstReward.minReps;
|
||||
nextRewardAt.value = firstReward.minReps + Math.floor(Math.random() * (range + 1));
|
||||
}
|
||||
function startTimer() {
|
||||
if (timerInterval.value)
|
||||
return;
|
||||
startTime.value = Date.now() - elapsedSeconds.value * 1e3;
|
||||
timerInterval.value = setInterval(() => {
|
||||
elapsedSeconds.value = Math.floor((Date.now() - startTime.value) / 1e3);
|
||||
totalSugar.value = calculateSugar(elapsedSeconds.value);
|
||||
if (targetMinutes.value > 0 && elapsedSeconds.value >= targetMinutes.value * 60) {
|
||||
onEndTraining();
|
||||
}
|
||||
}, 1e3);
|
||||
}
|
||||
function stopTimer() {
|
||||
if (timerInterval.value) {
|
||||
clearInterval(timerInterval.value);
|
||||
timerInterval.value = null;
|
||||
}
|
||||
}
|
||||
common_vendor.onShareAppMessage(() => ({
|
||||
title: shareTitle.value,
|
||||
path: "/training/pages/pilates-ring",
|
||||
imageUrl: TUTORIAL_POSTER_URL
|
||||
}));
|
||||
common_vendor.onShareTimeline(() => ({
|
||||
title: shareTitle.value,
|
||||
imageUrl: TUTORIAL_POSTER_URL
|
||||
}));
|
||||
function cleanupAllMedia() {
|
||||
var _a;
|
||||
stopRhythm();
|
||||
stopTimer();
|
||||
common_vendor.index.setKeepScreenOn({ keepScreenOn: false });
|
||||
try {
|
||||
(_a = common_vendor.index.createVideoContext("pilatesDemoVideo")) == null ? void 0 : _a.pause();
|
||||
} catch (_) {
|
||||
}
|
||||
if (bgmAudioCtx.value) {
|
||||
try {
|
||||
bgmAudioCtx.value.stop();
|
||||
} catch (_) {
|
||||
}
|
||||
try {
|
||||
bgmAudioCtx.value.destroy();
|
||||
} catch (_) {
|
||||
}
|
||||
bgmAudioCtx.value = null;
|
||||
}
|
||||
}
|
||||
common_vendor.onHide(cleanupAllMedia);
|
||||
common_vendor.onUnload(cleanupAllMedia);
|
||||
return (_ctx, _cache) => {
|
||||
return common_vendor.e({
|
||||
a: common_vendor.t(statusText.value),
|
||||
b: isPlaying.value ? 1 : "",
|
||||
c: isPaused.value ? 1 : "",
|
||||
d: TUTORIAL_VIDEO_URL,
|
||||
e: TUTORIAL_POSTER_URL,
|
||||
f: !isPlaying.value
|
||||
}, !isPlaying.value ? {
|
||||
g: common_vendor.t(centerHintText.value)
|
||||
} : {
|
||||
h: common_vendor.t(currentBpm.value)
|
||||
}, {
|
||||
i: common_vendor.o(onTogglePlay, "20"),
|
||||
j: isPlaying.value ? 1 : "",
|
||||
k: common_vendor.t(bgmEnabled.value ? "🎵" : "🔇"),
|
||||
l: common_vendor.o(toggleBgm, "d5"),
|
||||
m: remainingSeconds.value !== null && hasStats.value
|
||||
}, remainingSeconds.value !== null && hasStats.value ? {
|
||||
n: common_vendor.t(formatTime(remainingSeconds.value))
|
||||
} : {}, {
|
||||
o: isPlaying.value
|
||||
}, isPlaying.value ? {} : {}, {
|
||||
p: common_vendor.f(PILATES_PRESETS, (p, k0, i0) => {
|
||||
return {
|
||||
a: common_vendor.t(p.label),
|
||||
b: common_vendor.t(p.bpm),
|
||||
c: p.id,
|
||||
d: currentPreset.value === p.id ? 1 : "",
|
||||
e: common_vendor.o(($event) => onPresetTap(p.id), p.id)
|
||||
};
|
||||
}),
|
||||
q: isPlaying.value ? 1 : "",
|
||||
r: common_vendor.t(currentTargetLabel.value),
|
||||
s: common_vendor.t(targetExpanded.value ? "▲" : "▼"),
|
||||
t: common_vendor.o(($event) => targetExpanded.value = !targetExpanded.value, "31"),
|
||||
v: targetExpanded.value
|
||||
}, targetExpanded.value ? {
|
||||
w: common_vendor.f(TARGET_OPTIONS, (t, k0, i0) => {
|
||||
return {
|
||||
a: common_vendor.t(t.label),
|
||||
b: t.minutes,
|
||||
c: targetMinutes.value === t.minutes ? 1 : "",
|
||||
d: common_vendor.o(($event) => onTargetTap(t.minutes), t.minutes)
|
||||
};
|
||||
}),
|
||||
x: isPlaying.value ? 1 : ""
|
||||
} : {}, {
|
||||
y: common_vendor.t(benefitExpanded.value ? "收起 ▲" : "展开 ▼"),
|
||||
z: common_vendor.o(($event) => benefitExpanded.value = !benefitExpanded.value, "53"),
|
||||
A: benefitExpanded.value
|
||||
}, benefitExpanded.value ? {
|
||||
B: common_vendor.f(TRAINING_BENEFIT.muscles, (m, k0, i0) => {
|
||||
return {
|
||||
a: common_vendor.t(m),
|
||||
b: m
|
||||
};
|
||||
}),
|
||||
C: common_vendor.t(TRAINING_BENEFIT.effect)
|
||||
} : {}, {
|
||||
D: isPaused.value
|
||||
}, isPaused.value ? {
|
||||
E: common_vendor.o(onTogglePlay, "9c"),
|
||||
F: common_vendor.o(onEndTraining, "77")
|
||||
} : {}, {
|
||||
G: isPlaying.value ? 1 : "",
|
||||
H: isPaused.value ? 1 : "",
|
||||
I: common_vendor.s(rootStyle.value),
|
||||
J: showRewardPopup.value
|
||||
}, showRewardPopup.value ? {
|
||||
K: common_vendor.t(currentReward.value.emoji),
|
||||
L: common_vendor.t(currentReward.value.title),
|
||||
M: common_vendor.t(currentReward.value.desc),
|
||||
N: common_vendor.t(totalReps.value),
|
||||
O: common_vendor.o(closeRewardPopup, "fd"),
|
||||
P: common_vendor.o(() => {
|
||||
}, "9e"),
|
||||
Q: common_vendor.o(closeRewardPopup, "a4")
|
||||
} : {}, {
|
||||
R: showSummary.value
|
||||
}, showSummary.value ? common_vendor.e({
|
||||
S: common_vendor.t(totalReps.value),
|
||||
T: common_vendor.t(formatTime(elapsedSeconds.value)),
|
||||
U: common_vendor.t(totalSugar.value.toFixed(1)),
|
||||
V: sugarComparisons.value.length > 0
|
||||
}, sugarComparisons.value.length > 0 ? {
|
||||
W: common_vendor.f(sugarComparisons.value, (food, idx, i0) => {
|
||||
return {
|
||||
a: common_vendor.t(food.emoji),
|
||||
b: common_vendor.t(food.count),
|
||||
c: common_vendor.t(food.unit),
|
||||
d: common_vendor.t(food.name),
|
||||
e: idx
|
||||
};
|
||||
})
|
||||
} : {}, {
|
||||
X: common_vendor.o(onRestart, "bc"),
|
||||
Y: common_vendor.o(onFinish, "90"),
|
||||
Z: common_vendor.o(() => {
|
||||
}, "99"),
|
||||
aa: common_vendor.o(dismissSummary, "b4")
|
||||
}) : {});
|
||||
};
|
||||
}
|
||||
});
|
||||
_sfc_defineComponent.__runtimeHooks = 6;
|
||||
const MiniProgramPage = /* @__PURE__ */ common_vendor._export_sfc(_sfc_defineComponent, [["__scopeId", "data-v-6dc323a3"]]);
|
||||
wx.createPage(MiniProgramPage);
|
||||
//# sourceMappingURL=../../../.sourcemap/mp-weixin/training/pages/pilates-ring.js.map
|
||||
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"navigationBarTitleText": "瑜伽环训练",
|
||||
"navigationBarBackgroundColor": "#f8fafc",
|
||||
"navigationBarTextStyle": "black",
|
||||
"backgroundColor": "#f8fafc",
|
||||
"usingComponents": {}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user