当ブログのサイドバーに、ヘミシンクタイトルのシンクロ・ルーレットを設置しました。また少し賑やかなブログになったかな。
シンクロ・ルーレット
ヘミシンクの「ゲートウェイ・エクスペリエンス」「シングル・タイトル」「アルバム・シリーズ」などから、日本語版ガイド付きの56タイトルをピックアップ。
「START」すると「本日のシンクロニシティ」タイトルを1枚選んでくれるルーレットです。【詳細へ｜PR >>】ボタンからは、ヘミシンク公式サイトの説明・販売ページにジャンプもできます。
・今日聴く1枚
・次に買うヘミシンク
・今自分に必要な1枚
・おみくじがわりのラッキーヘミシンク
などなど、自由にテーマを決め、息抜きにポチッと遊んでいってくださいね。
わたしは自分でも更新のたびに「こんなのがあったんだ！」と知るために使おうと考えています。
※こちらはサンプル画像のため動きません↓
タイトル表示のみのシンプルバージョン
詳細リンクなし、タイトルだけが表示されるシンプルバージョンもご用意↓
※こちらは実際に動きますのでお試しください。
★ TODAY'S MY TUNE ★
こちらのバージョンのみ、下にコードを置いておきますので、ヘミシンク関連ブログの装飾にお使いください。
HTML対応ブログなら、右上の【コピー】ボタンでコピーしてサイドバーのHTMLウィジェット（ガジェット）にペーストするだけで動くはず。
★ TODAY'S MY TUNE ★ →部分をお好きなタイトルに
いま、あなたに必要なテーマ →部分をお好きな文字列に
書き換えてお使いいただけます。
AIとの共同作成です。許可不要・ノーサポート。
動かない、崩れる場合は、各AIに聞いて直してもらってください。
（思い立ってしまったため、昨日はヘミシンクができませんでした…）
<div id="casino-roulette" style="text-align: center; border: 4px solid #9e9c97; padding: 20px; background: #2a1f3d; border-radius: 15px; font-family: 'Helvetica Neue', Arial, sans-serif; color: #fff; box-shadow: 0 0 20px rgba(158, 156, 151, 0.3); max-width: 280px; margin: 0 auto;">
<div style="color: #9e9c97; font-size: 13px; font-weight: bold; letter-spacing: 1px; margin-bottom: 15px;">★ TODAY'S MY TUNE ★</div>
<div id="casino-wheel-wrapper" style="position: relative; width: 160px; height: 160px; margin: 0 auto;">
<div id="casino-wheel" style="width: 100%; height: 100%; border-radius: 50%; border: 6px solid #9e9c97; transition: transform 4s cubic-bezier(0.1, 0.8, 0.1, 1); background: conic-gradient(#8f65ba 0% 10%, #583e79 10% 20%, #8f65ba 20% 30%, #583e79 30% 40%, #8f65ba 40% 50%, #583e79 50% 60%, #8f65ba 60% 70%, #583e79 70% 80%, #8f65ba 80% 90%, #583e79 90% 100%); box-shadow: inset 0 0 15px rgba(0,0,0,0.5);"></div>
<div style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 20px; height: 20px; background: #9e9c97; border-radius: 50%; box-shadow: 0 0 8px #fff;"></div>
<div style="position: absolute; top: -12px; left: 50%; transform: translateX(-50%); width: 0; height: 0; border-left: 12px solid transparent; border-right: 12px solid transparent; border-top: 22px solid #9e9c97; z-index: 10; filter: drop-shadow(0px 2px 4px rgba(0,0,0,0.5));"></div>
</div export>
<button onclick="spinCasino()" id="casino-btn" style="margin-top: 20px; padding: 10px 0; background: linear-gradient(135deg, #9e9c97, #7e7c77); color: #fff; border: none; border-radius: 25px; cursor: pointer; width: 85%; font-weight: bold; font-size: 16px; box-shadow: 0 4px 10px rgba(0,0,0,0.5); transition: 0.2s;">START</button>
<div id="result-box" style="margin-top: 20px; padding: 15px; background: rgba(0,0,0,0.3); border: 1px dashed #9e9c97; border-radius: 8px; display: none; animation: fadeIn 0.5s ease;">
<div style="font-size: 11px; color: #ccc; margin-bottom: 5px;">いま、あなたに必要なテーマ</div>
<div id="casino-result-name" style="font-size: 15px; font-weight: bold; color: #fff; text-shadow: 0 0 10px rgba(255,255,255,0.5); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; line-height: 1.4; display: flex; align-items: center; justify-content: center; min-height: 2.8em;"></div>
</div>
</div>
<style>
@keyframes fadeIn {
from { opacity: 0; transform: translateY(10px); }
to { opacity: 1; transform: translateY(0); }
}
#casino-btn:hover:not(:disabled) {
filter: brightness(1.1);
}
</style>
<script>
// 配布された方が自由にアイテムを書き換え・追加できる配列です
const casinoItems = [
"インナーステーツ 気づきの目覚め", "落ち込みと不安からの回復", "スリーピング・スルー・ザ・レイン 雨に眠る", "何かに依存しがちなあなたへ", "地球と触れ合う（タッチング・アース）", "Hemi-Sync(R) でダイエット", "ハートソング", "内なるヒーラー", "パートナーズ・メディテーション", "ハイヤーセルフへの帰還", "インナーチャイルドを癒やす", "体外離脱テクニック", "セイクレッド・スペース 聖なる領域", "タイムレス・ピース 永遠のやすらぎ", "イントゥ・ザ・ライト 光の中へ～臨死体験の瞑想", "がん治療サポートシリーズ（4CD）", "Hemi-Syncによる成功の創出", "未来の探索", "Hemi-Syncによる過去世（別の人生）探究", "ストリーム・ヘブン", "メビウス・ウエスト〔新しい未来をプログラムする〕", "ミディアムシップ：ザ・トレーニング・グラウンド", "マジカル・パス", "インナーステーツII：光への帰還", "ミディアムシップ：パワーを高める", "Hemi-Syncによる創造性開発（クリエイティヴ・ウェイ）", "体外への旅 ― サポート用Hemi-Syncシリーズ", "キャットナッパー 猫のうたた寝", "ディープ10リラクゼーション", "ザ・ビジット 訪問", "ペイン・マネージメント 痛みのコントロール", "モーメント・オブ・レバレーション 啓示の瞬間", "オープニング・ザ・ハート", "ザ・シャーマンズ・ハート・プログラム（真の力、目的、存在への道）", "ゴーイング・ホーム（患者用）", "パティ・サマーズの動物たちと話そう", "Hemi-Syncで心と体の若返り", "Hemi-Syncによるチャクラ瞑想", "Hemi-Syncによる癒しの旅のサポート", "Hemi-Syncによる具現化", "エネルギーにアクセスする", "情報にアクセスする", "内なるガイドにつながる", "内なる英知", "ウサギのロビー", "化学療法の手引き", "放射線治療の手引き", "T細胞をめぐる旅", "Wave I ディスカバリー（発見）", "Wave II スレッショルド（境界点）", "Wave III フリーダム（自由）", "Wave IV アドベンチャー（冒険）", "Wave V エクスプロアリング（探索）Focus 15への旅", "Wave VI オデッセイ（旅）Focus 21への旅", "Wave VII ヴォイジャー（航海） Focus 27への旅", "Wave VIII ユニオン（統合）時空を超えた旅"
];
let casinoSpinning = false;
function decodeHtmlText(input) {
const doc = new DOMParser().parseFromString(input, "text/html");
return doc.documentElement.textContent || doc.body.innerText;
}
function spinCasino() {
if (casinoSpinning) return;
casinoSpinning = true;
const wheel = document.getElementById('casino-wheel');
const btn = document.getElementById('casino-btn');
const resultBox = document.getElementById('result-box');
const resultName = document.getElementById('casino-result-name');
resultBox.style.display = 'none';
btn.disabled = true;
btn.innerText = "TUNING...";
const rotation = Math.floor(Math.random() * 360) + 5400;
wheel.style.transform = `rotate(${rotation}deg)`;
setTimeout(() => {
const winner = casinoItems[Math.floor(Math.random() * casinoItems.length)];
resultName.innerText = decodeHtmlText(winner);
resultBox.style.display = 'block';
casinoSpinning = false;
btn.disabled = false;
btn.innerText = "START";
}, 4000);
}
</script>
