welcome! SAROCK.
Experience the transformative power of personalized art! Click on the icons above to begin your journey towards owning a unique masterpiece crafted just for you!
Anime click the buttons below to see more art!
Terms and conditions ☻ Read Terms before taking a commission.
Contact For any further inquiries or assistance, please feel free to reach out to me by selecting one of the icon below.
PRICING (All prices are in USD$ (United States Dollar))
Please fill out the following form:
/* Emotes */ const emotes = [ { name: "Emotes / Stickers", price: "22 / 200 - 10" }, { name: "Animated emotes", price: "70 / 250 - 5" } ]; /* Characters */ const characters = [ { name: "Sketch / Lineart", price: "100" }, { name: "Chibi", price: "120" }, { name: "PngTubers (2 images)", price: "150" }, { name: "Colorless painting", price: "200" }, { name: "Full digital painting", price: "250" } ]; /* Characters Options */ const characters_options_one = [ { name: "Half body", price: "+ 0%" }, { name: "Headshot", price: "- 30%" }, { name: "Full body", price: "+ 40%" } ]; const characters_options_two = [ { name: "No background", price: "+ 0$" }, { name: "Vague background", price: "+ 50$" }, { name: "Detailed background", price: "+ 90$" }, { name: "Hyper detailed background", price: "+ 120$" } ]; const characters_additional_options = [ { name: "NSFW", price: "+ 30%" }, { name: "Fast Shipping", price: "+ 150$" }, { name: "Commercial use", price: "+ 50%" }, { name: "Twitch Secrecy fee", price: "+ 40%" } ]; const additionals_characters_price = [ { maxCount: 3, price: "100$" } ]; /* EMOTES SINGLE / BUNDLE */ function getPriceString(TextStr) { var PriceStr; /* Percentage Number */ if (TextStr.includes('%')) { PriceStr = TextStr.replace('$', ''); } /* Simple of Bundle Price */ else { itemPriceParts = TextStr.split('/'); /* Bundle Price */ if (itemPriceParts.length === 2) { /* Unity Price */ const priceFirstPart = itemPriceParts[0].trim(); /* X for Y */ const itemBundlePart = itemPriceParts[1].trim().split('-'); if (itemBundlePart.length === 2) { PriceStr = `${priceFirstPart}$ / ${itemBundlePart[0].trim()}$ for ${itemBundlePart[1].trim()}`; } /* ERROR */ else { PriceStr = "FORMAT [X / A - B] NOT RESPECTED"; } } /* Simple Price */ else { PriceStr = itemPriceParts + "$"; } } return PriceStr; } /* Emotes Functions */ function getEmotesQuantityPrices(Quantity, TextStr) { itemPriceParts = TextStr.split('/'); let Total = 0; /* Bundle Price */ if (itemPriceParts.length === 2) { /* Unity Price */ const priceFirstPart = itemPriceParts[0].trim(); /* X for Y */ const itemBundlePart = itemPriceParts[1].trim().split('-'); if (itemBundlePart.length === 2) { bundlePrice = itemBundlePart[0].trim(); bundleCount = itemBundlePart[1].trim(); bundlePrice = Math.floor(Quantity / bundleCount) * bundlePrice; normalPrice = (Quantity % bundleCount) * priceFirstPart; Total = bundlePrice + normalPrice; } /* ERROR */ else { Total = -666; } } /* Simple Price */ else { Total = itemPriceParts * Quantity; } return Total; } /* Character Functions */ function getCharacterPrice(chartype) { const option = characters.find(option => option.name === chartype); if (option) { return option.price; } return null; } function doMath(num, initialNumber) { lastchar = num.charAt(num.length - 1); /* Add */ if (num[0] == '+') { num = num.replace('+', '').trim(); /* Add Amount */ if (lastchar == '$') { num = Number(num.replace('$', '').trim()); return Number(num); } /* Add Percent */ else if (lastchar == '%') { num = Number(num.replace('%', '').trim()); return Number(+(initialNumber * num) / 100); } } /* Subtract */ else if(num[0] == '-') { num = num.replace('-', '').trim(); /* Substract Amount */ if (lastchar == '$') { num = Number(num.replace('$', '').trim()); return Number(-num); } /* Subtract Percent */ else if (lastchar == '%') { num = Number(num.replace('%', '').trim()); return Number(-(initialNumber * num) / 100); } } return 0; } function getTotalPrice(event) { let totalPrice = 0; /* _____________________________ Emotes Price _____________________________ */ const rows1 = document.querySelectorAll("#emotes-container tr"); rows1.forEach(row => { const quantity = parseInt(row.querySelector("select").value); let itemPriceText = row.querySelector("td:nth-child(3)").textContent.replace(/\$/g, '').replace('for', '-'); totalPrice += getEmotesQuantityPrices(quantity, itemPriceText); }); /* _____________________________ Characters Price _____________________________ */ const rows2 = document.querySelectorAll("#characters-container tr"); rows2.forEach(row => { const checkbox = row.querySelector("input[type='checkbox']"); const select1 = row.querySelector("select[name='select1']"); const select2 = row.querySelector("select[name='select2']"); const select3 = row.querySelector("select[name='select3']"); if (checkbox.checked) { let OriginalPrice = Number(getCharacterPrice(checkbox.parentNode.nextSibling.textContent)); let currentTotal = OriginalPrice; /* ITEM NAME */ /*console.log("ItemName : " + checkbox.parentNode.nextSibling.textContent);*/ /* BODY OPTIONS */ /*console.log("Selector 1 : " + select1.options[select1.selectedIndex].text.match(/\(([^)]+)\)/)[0].replace('(', '').replace(')', '').trim()); */ currentTotal += Number(doMath(select1.options[select1.selectedIndex].text.match(/\(([^)]+)\)/)[0].replace('(', '').replace(')', '').trim(), OriginalPrice)); /*console.log("Current Total :" + currentTotal); */ /* BACKGROUND OPTIONS */ /*console.log("Selector 2 : " + select2.options[select2.selectedIndex].text.match(/\(([^)]+)\)/)[0].replace('(', '').replace(')', '').trim()); */ currentTotal += Number(doMath(select2.options[select2.selectedIndex].text.match(/\(([^)]+)\)/)[0].replace('(', '').replace(')', '').trim(), OriginalPrice)); /* CHARACTERS OPTIONS */ /*console.log("Selector 3 : " + select3.options[select3.selectedIndex].text.match(/\(([^)]+)\)/)[0].replace('(', '').replace(')', '').trim()); */ currentTotal += Number(doMath(select3.options[select3.selectedIndex].text.match(/\(([^)]+)\)/)[0].replace('(', '').replace(')', '').trim(), OriginalPrice)); /* SELECTED CHECKBOXES */ const additionalCheckboxes = row.querySelectorAll("input[type='checkbox'][name='characterOption']:checked"); additionalCheckboxes.forEach(checkbox => { currentTotal += Number(doMath(checkbox.nextSibling.textContent.match(/\(([^)]+)\)/)[0].replace('(', '').replace(')', '').trim(), OriginalPrice)); /* console.log("Checkboxes : " + checkbox.nextSibling.textContent.match(/\(([^)]+)\)/)[0].replace('(', '').replace(')', '').trim()); */ }); checkbox.parentNode.querySelector("div").textContent = currentTotal + "$"; totalPrice += Number(currentTotal); } /* Unselected -> Set back the correct price */ else { checkbox.parentNode.querySelector("div").textContent = getCharacterPrice(checkbox.parentNode.nextSibling.textContent) + "$"; } }); /* Update the final Price */ document.getElementById("total-price").textContent = `Total Price: $${totalPrice}`; } { const container1 = document.getElementById("emotes-container"); emotes.forEach((item, index) => { const row = document.createElement("tr"); const quantityCell = document.createElement("td"); quantityCell.style.textAlign = 'center'; const quantitySelector = document.createElement("select"); quantitySelector.id = `quantity-${index}`; quantitySelector.setAttribute("data-item-name", item.name); for (let i = 0; i <= 30; i++) { const option = document.createElement("option"); option.value = i; option.textContent = i; quantitySelector.appendChild(option); } quantitySelector.style.padding = '2px'; quantitySelector.style.border = '2px solid #ccc'; quantitySelector.style.borderRadius = '6px'; quantitySelector.style.fontSize = '16px'; quantitySelector.style.width = '70px'; quantitySelector.addEventListener("change", getTotalPrice); quantityCell.appendChild(quantitySelector); row.appendChild(quantityCell); /* Item Name */ const itemNameCell = document.createElement("td"); itemNameCell.textContent = item.name; itemNameCell.style.textAlign = 'center'; itemNameCell.style.fontFamily = "Sora, sans-serif"; row.appendChild(itemNameCell); /* Item Price */ const itemPriceCell = document.createElement("td"); itemPriceCell.appendChild(document.createTextNode(getPriceString(item.price))); itemPriceCell.style.textAlign = 'center'; itemPriceCell.style.fontFamily = "Sora, sans-serif"; row.appendChild(itemPriceCell); container1.appendChild(row); }); } { const container2 = document.getElementById("characters-container"); container2.style.fontSize = "16px"; characters.forEach((item, index) => { const row = document.createElement("tr"); const checkboxPriceCell = document.createElement("td"); checkboxPriceCell.style.fontFamily = "Sora, sans-serif"; /* Checkbox */ const handleCheckboxChange = document.createElement("input"); handleCheckboxChange.type = "checkbox"; handleCheckboxChange.name = `characterCheckbox-${index}`; handleCheckboxChange.value = "test"; handleCheckboxChange.style.marginRight = "10px"; handleCheckboxChange.addEventListener("change", getTotalPrice); /* Price */ const priceContainer = document.createElement("div"); priceContainer.style.textAlign = 'center'; priceContainer.appendChild(document.createTextNode(getPriceString(item.price))); priceContainer.style.fontFamily = "Sora, sans-serif"; checkboxPriceCell.appendChild(handleCheckboxChange); checkboxPriceCell.appendChild(priceContainer); /* ItemName */ const itemNameCell = document.createElement("td"); itemNameCell.textContent = item.name; itemNameCell.style.fontFamily = "Sora, sans-serif"; const optionsCell = document.createElement("td"); optionsCell.style.fontFamily = "Sora, sans-serif"; const select1 = document.createElement("select"); select1.name = "select1"; select1.style.width = "85px"; characters_options_one.forEach(option => { const optionElement = document.createElement("option"); optionElement.value = option.name; optionElement.textContent = option.name + " (" + option.price + ")"; optionElement.style.fontFamily = "Sora, sans-serif"; select1.addEventListener("change", getTotalPrice); select1.appendChild(optionElement); }); const select2 = document.createElement("select"); select2.name = "select2"; select2.style.width = "115px"; characters_options_two.forEach(option => { const optionElement = document.createElement("option"); optionElement.value = option.name; optionElement.style.fontFamily = "Sora, sans-serif"; optionElement.textContent = option.name + " (" + option.price + ")"; select2.addEventListener("change", getTotalPrice); select2.appendChild(optionElement); }); const select3 = document.createElement("select"); select3.name = "select3"; select3.style.width = "110px"; let count = 0; for (let i = 0; i <= additionals_characters_price[0].maxCount; i++) { const optionElement = document.createElement("option"); optionElement.value = i; optionElement.style.fontFamily = "Sora, sans-serif"; optionElement.textContent = `+${i} Characters (+ ${count}$)`; count += Number(additionals_characters_price[0].price.replace('$', '')); select3.addEventListener("change", getTotalPrice); select3.appendChild(optionElement); } const checkboxes = document.createElement("div"); characters_additional_options.forEach(option => { const additionalCheckbox = document.createElement("input"); additionalCheckbox.type = "checkbox"; additionalCheckbox.name = "characterOption"; additionalCheckbox.value = option.name; additionalCheckbox.addEventListener("change", getTotalPrice); const label = document.createElement("label"); label.style.fontFamily = "Sora, sans-serif"; label.textContent = option.name + " (" + option.price + ")"; const br = document.createElement("br"); checkboxes.appendChild(additionalCheckbox); checkboxes.appendChild(label); checkboxes.appendChild(br); }); optionsCell.appendChild(select1); optionsCell.appendChild(select2); optionsCell.appendChild(select3); optionsCell.appendChild(checkboxes); row.appendChild(checkboxPriceCell); row.appendChild(itemNameCell); row.appendChild(optionsCell); container2.appendChild(row); }); } Total Price: $0 Send Submission
function showPrompt() { const overlay = document.getElementById("overlay"); overlay.style.display = "block"; const promptContainer = document.getElementById("prompt-container"); promptContainer.style.display = "block"; } function cancelPrompt() { const overlay = document.getElementById("overlay"); overlay.style.display = "none"; const promptContainer = document.getElementById("prompt-container"); promptContainer.style.display = "none"; } function sendPrompt() { if (document.getElementById("i_name").value.length == 0) { alert("Name is Required"); return; } if (document.getElementById("i_email").value.length == 0) { alert("Email is Required"); return; } if (document.getElementById("i_message").value.length == 0) { alert("Description / Message is Required"); return; } const data = { sendto: '[email protected] ', subject: 'sarock.carrd.co ---> Submission', message: `New Submission From:\nName: ${document.getElementById("i_name").value}\nEmail: ${document.getElementById("i_email").value}\nSocial: ${document.getElementById("i_social").value}\nMessage: ${document.getElementById("i_message").value}\n\n\n${submitSubmission()}` }; const { sendto, subject, message } = data; const mailtoUrl = `mailto:${sendto}?subject=${encodeURIComponent(subject)}&body=${encodeURIComponent(message)}`; window.open(mailtoUrl, '_blank'); cancelPrompt(); } function submitSubmission() { let totalPrice = 0; let RetString = "--------------------- Submission ---------------------\n\n"; /* _____________________________ Emotes Price _____________________________ */ const rows1 = document.querySelectorAll("#emotes-container tr"); rows1.forEach(row => { const quantity = parseInt(row.querySelector("select").value); if (Number(quantity) > 0) { const _itemname = row.querySelector("td:nth-child(2)").textContent; let itemPriceText = row.querySelector("td:nth-child(3)").textContent.replace(/\$/g, '').replace('for', '-'); totalPrice += getEmotesQuantityPrices(quantity, itemPriceText); RetString += `[ ${quantity}x ${_itemname} ] = ${totalPrice}$\n`; } }); /* _____________________________ Characters Price _____________________________ */ const rows2 = document.querySelectorAll("#characters-container tr"); rows2.forEach(row => { const checkbox = row.querySelector("input[type='checkbox']"); const select1 = row.querySelector("select[name='select1']"); const select2 = row.querySelector("select[name='select2']"); const select3 = row.querySelector("select[name='select3']"); if (checkbox.checked) { let OriginalPrice = Number(getCharacterPrice(checkbox.parentNode.nextSibling.textContent)); let currentTotal = OriginalPrice; /* ITEM NAME */ RetString += `\n${checkbox.parentNode.nextSibling.textContent}\n`; /* BODY OPTIONS */ currentTotal += Number(doMath(select1.options[select1.selectedIndex].text.match(/\(([^)]+)\)/)[0].replace('(', '').replace(')', '').trim(), OriginalPrice)); RetString += `> ${select1.options[select1.selectedIndex].text}\n`; /* BACKGROUND OPTIONS */ currentTotal += Number(doMath(select2.options[select2.selectedIndex].text.match(/\(([^)]+)\)/)[0].replace('(', '').replace(')', '').trim(), OriginalPrice)); RetString += `> ${select2.options[select2.selectedIndex].text}\n`; /* CHARACTERS OPTIONS */ currentTotal += Number(doMath(select3.options[select3.selectedIndex].text.match(/\(([^)]+)\)/)[0].replace('(', '').replace(')', '').trim(), OriginalPrice)); RetString += `> ${select3.options[select3.selectedIndex].text}\n`; const additionalCheckboxes = row.querySelectorAll("input[type='checkbox'][name='characterOption']:checked"); additionalCheckboxes.forEach(checkbox => { currentTotal += Number(doMath(checkbox.nextSibling.textContent.match(/\(([^)]+)\)/)[0].replace('(', '').replace(')', '').trim(), OriginalPrice)); RetString += `> ${checkbox.nextSibling.textContent}\n`; }); RetString += `TOTAL: ${currentTotal}$\n\n`; totalPrice += Number(currentTotal); } else { checkbox.parentNode.querySelector("div").textContent = getCharacterPrice(checkbox.parentNode.nextSibling.textContent) + "$"; } }); RetString += `\n\nGRAND TOTAL: ${totalPrice}$\n\n`; return RetString; } If you have any issues with the form, please contact me here:
