Calculator Tools Calculator Tools
Create

Dead Rock Music Distribution

Aug 25, 2025

About this app

Elevate your music with Dead Rock - A dynamic music distribution platform designed for independent artists looking to amplify their reach across various streaming services.

Dead Rock Music Distribution Dead Rock Music Distribution Add New Music Select Distribution Platforms Spotify 🌍 YouTube Music 🎶 Audiomack 🔊 Bandcamp 💿 SoundCloud ☁️ Tidal 🎵 VEVO 📺 Add Music

Related apps

Put this on your site

Source

                    <html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">

<title>Dead Rock Music Distribution</title>
<meta name="description" content="Elevate your music with Dead Rock - A dynamic music distribution platform designed for independent artists looking to amplify their reach across various streaming services.">
<meta name="keywords" content="music distribution, independent artists, streaming, music platform, Dead Rock Music">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.6.0/css/fontawesome.min.css" crossorigin="anonymous">

<script type="text/javascript">
try {
document.addEventListener("DOMContentLoaded", function() {
const musicCatalog = [];

function addMusic() {
const title = document.getElementById('music-title').value;
const artist = document.getElementById('music-artist').value;
const album = document.getElementById('music-album').value;
const distributionOptions = Array.from(document.querySelectorAll('input[name="distribution"]:checked'))
.map(input => input.value);

if (title && artist && album && distributionOptions.length) {
const music = { title, artist, album, id: Date.now(), distributions: distributionOptions, available: true };
musicCatalog.push(music);
document.getElementById('music-form').reset();
renderMusicList();
} else {
alert("Please fill all fields and select at least one distribution platform.");
}
}

function renderMusicList() {
const list = document.getElementById('music-list');
list.innerHTML = '';
musicCatalog.forEach(music => {
const listItem = document.createElement('li');
listItem.className = 'list-group-item d-flex justify-content-between align-items-center';
listItem.innerHTML = `${music.title} - ${music.artist} (${music.album}) <span class="text-muted">Distributions: ${music.distributions.join(', ')}</span> <span class="badge bg-danger" onclick="removeMusic(${music.id})">Remove</span>`;
if (music.available) {
listItem.innerHTML += ' <span class="badge bg-info">Available</span>';
} else {
listItem.innerHTML += ' <span class="badge bg-secondary">Not Available</span>';
}
list.appendChild(listItem);
});
}

window.removeMusic = function(id) {
const index = musicCatalog.findIndex(music => music.id === id);
if (index !== -1) {
musicCatalog.splice(index, 1);
renderMusicList();
}
}

document.getElementById('add-music').addEventListener('click', addMusic);
});
} catch (error) {
throw error;
}
</script>

<style>
body {
background: linear-gradient(120deg, #736321, #a77418);
color: #fff;
}
#main-container {
margin-top: 50px;
}
h1 {
text-align: center;
font-family: 'Rock Thyme', sans-serif;
animation: fadeIn 2s;
}
@keyframes fadeIn {
from { opacity: 0; }
to { opacity: 1; }
}
.card {
background: rgba(41, 50, 56, 0.8);
border-radius: 10px;
padding: 15px;
}
.badge {
cursor: pointer;
}
.distribution-options {
margin-top: 10px;
}
</style>
</head>
<body>
<div id="main-container" class="container">
<h1>Dead Rock Music Distribution</h1>
<div class="card">
<h3>Add New Music</h3>
<form id="music-form">
<div class="mb-3">
<input type="text" id="music-title" class="form-control" placeholder="Music Title" required>
</div>
<div class="mb-3">
<input type="text" id="music-artist" class="form-control" placeholder="Artist Name" required>
</div>
<div class="mb-3">
<input type="text" id="music-album" class="form-control" placeholder="Official Album/Single" required>
</div>
<div class="distribution-options">
<h5>Select Distribution Platforms</h5>
<div>
<label><input type="checkbox" name="distribution" value="Spotify"> Spotify 🌍</label><br>
<label><input type="checkbox" name="distribution" value="YouTube Music"> YouTube Music 🎶</label><br>
<label><input type="checkbox" name="distribution" value="Audiomack"> Audiomack 🔊</label><br>
<label><input type="checkbox" name="distribution" value="Bandcamp"> Bandcamp 💿</label><br>
<label><input type="checkbox" name="distribution" value="SoundCloud"> SoundCloud ☁️</label><br>
<label><input type="checkbox" name="distribution" value="Tidal"> Tidal 🎵</label><br>
<label><input type="checkbox" name="distribution" value="VEVO"> VEVO 📺</label><br>
</div>
</div>
<button type="button" id="add-music" class="btn btn-success">Add Music</button>
</form>
</div>
<hr>
<ul id="music-list" class="list-group"></ul>
</div>
</body>
</html>