Dead Rock Music Distribution
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>
NEW APPS
These are apps made by the community!