गोल्फ वॉर्स एपिसोड I: द फैंटम लाइटसैबर्स


12

गोल्फ युद्धों यहाँ छवि विवरण दर्ज करें पृष्ठभूमि विषय

परिचय

ओबी-वान केनोबी, क्यूई-गोन जिन और डार्थ मौल लड़ने वाले हैं! हालाँकि, वे सभी अपने संबंधित रोशनी लाने के लिए भूल गए हैं। एक प्रोग्राम या फ़ंक्शन लिखें, जो स्ट्रिंग Jediको इनपुट के रूप में दिया गया है , इस के समान एक छवि उत्पन्न करता है : *

यहाँ छवि विवरण दर्ज करें

और दी गई स्ट्रिंग Sith, इसके समान एक छवि उत्पन्न करती है:

यहाँ छवि विवरण दर्ज करें

छवियाँ विनिर्देशों

  • 3 में से कोई भी लाइटबसर ( अंत में गोल किनारे सहित सफेद ब्लेड (लाल एक के लिए 2 गोल किनारे) और हैंडल सहित ) 900px लंबा है (इसमें ब्लेड के चारों ओर रंग ढाल शामिल नहीं है )।

  • ब्लेड के अंत में गोल किनारे एक अर्धवृत्त (इसका एक असतत सन्निकटन है, जाहिर है) ब्लेड की चौड़ाई के बराबर व्यास के साथ।

  • ब्लेड (यानी लाइटबसर का सफेद भाग) 12px चौड़ा है।

  • हरे और नीले रंग के लाइटबेस को 200 px (हरे रंग के ब्लेड की केंद्र रेखा से नीले रंग के ब्लेड की केंद्र रेखा तक) से अलग किया जाता है।

  • सभी 3 लाइटसैबर्स का हैंडल 180px (कुल लंबाई का 1/5) है। इसलिए, गोल किनारे (एस) सहित ब्लेड नीले और हरे रंग की रोशनी के लिए 720px लंबा और लाल रोशनी के दो ब्लेड के लिए 360px लंबा है।

  • नीले और हरे रंग की रोशनी के लिए हैंडल रोशनी के तल पर है। लाल बत्ती लगाने वाले के लिए संभाल क्षैतिज केंद्रित है।

  • सफेद ब्लेड के किनारे से पूरी तरह से सफेद रंग में ढाल की लंबाई 1.5 * ब्लेड की चौड़ाई (जैसे रैखिक भागों के लिए 18px) है।

  • ग्रीन ग्रेडिएंट RGB (0,255,0) से व्हाइट (255,255,255) तक चला जाता है (या पारदर्शी हो तो आपके लिए इसे लागू करना आसान है)। लाल रंग की ढाल (255,0,0) सफेद से जाती है, और नीले रंग की ढाल सफेद से (0,0,255) तक जाती है।

  • हैंडल का रंग RGB (128,128,128) है।

  • लाइटबसर (एस) के आसपास सफेद खाली जगह हो सकती है।

इनपुट

या तो Sithया Jediएक स्ट्रिंग के रूप। आप इस स्ट्रिंग को फ़ंक्शन तर्क, कमांड लाइन पैरामीटर, या कुछ समान के रूप में STDIN से ले सकते हैं। आप मान सकते हैं कि इनपुट हमेशा Sithया बिल्कुल Jediनहीं होगा।

उत्पादन

आपको इनपुट स्ट्रिंग के अनुरूप छवि वाली एक छवि फ़ाइल बनानी होगी। जब तक आप एक सच्चा रंग छवि है, तब तक आप जो भी छवि प्रारूप चाहते हैं, उसे चुनने के लिए आप अपेक्षाकृत स्वतंत्र हैं ।

स्कोरिंग

यह , इसलिए बाइट्स में सबसे कम उत्तर जीतता है। बल आपके साथ हो।


* इस पोस्ट में छवियों को पूर्ण आकार प्रदर्शित नहीं किया गया है।


क्या हमें फ़ाइल को डिस्क पर सहेजना है या हम इसे stdout में लिख सकते हैं? स्क्रीन पर इसे प्रदर्शित करने के बारे में क्या?
मार्टिन एंडर

इसे स्क्रीन पर प्रदर्शित करना ठीक है, अगर आपकी भाषा ऐसा आसानी से कर सकती है। STDOUT करने के लिए फ़ाइल लिख खुद के लिए के रूप में, मुझे लगता है कि यह जो कर सकते हैं फ़ाइलों को डिस्क में सहेजें नहीं आसानी से भाषाओं के लिए स्वीकार्य है
Fatalize

मुझे लगता है कि शीर्षक गोल्फ वॉर्स एपिसोड I: द फैंटम डेनिस होना चाहिए ।
mbomb007

जवाबों:


9

HTML / CSS समाधान, 765 740 541 बाइट्स

<style>[id]:not(:target){display:none}table{width:900px;height:12px;border-spacing:0}td:last-child{border-radius:0 12px 12px 0}#Sith td:first-child{border-radius:12px 0 0 12px}#Sith td{box-shadow:0 0 18px red}#Jedi{transform:rotate(-90deg);margin:350px 0}#Jedi td{box-shadow:0 0 18px #0f0}*+table{margin:200px 0 0 0}#Jedi *+table td{box-shadow:0 0 18px #00f}td:nth-last-child(2){background:#888;width:180px;box-shadow:none!important}</style><div id=Jedi><table><td><td></table><table><td><td></table></div><table id=Sith><td><td><td></table>

हाल ही में रिफ्लेक्टर एक और जावास्क्रिप्ट के बजाय :targetछद्म वर्ग का उपयोग करता <form>है।

या तो इनपुट दर्ज करने के लिए, इसे लक्ष्य के रूप में URL के अंत में जोड़ें, जैसे test.html#Jediयाtest.html#Sith

यहाँ यह फिर से व्हाट्सएप और कुछ टिप्पणियों के साथ है:

<style>
  /* hide all but the anchored lightsaber (only lightsabers have ids) */
  [id]:not(:target) { display:none }

  /* tables are lightsabers */
  table { width:900px; height:12px; border-spacing:0 }
  td:last-child { border-radius:0 12px 12px 0 } /* curved tip */
  #Sith td:first-child { border-radius:12px 0 0 12px } /* 2nd curved tip */
  #Sith td { box-shadow:0 0 18px red }
  #Jedi { transform:rotate(-90deg); margin:350px 0 }
  #Jedi td { box-shadow:0 0 18px #0f0 } /* green */
  * + table { margin:200px 0 0 0 } /* gap between Jedi lightsabers */
  #Jedi * + table td { box-shadow:0 0 18px #00f } /* blue */
  /* handles */
  td:nth-last-child(2) {
    background:#888; width:180px; box-shadow:none!important }
</style>
<div id=Jedi>
  <table><td><td></table>
  <table><td><td></table>
</div>
<table id=Sith><td><td><td></table>

लाइटबैसर <table>एक सेल प्रति भाग (ब्लेड / हैंडल) वाले तत्व हैं जो उनकी idविशेषताओं के माध्यम से अनसुनी हैं ।

ब्लेड सीएसएस के साथ रंगीन होते हैं box-shadowऔर जेडी लाइटसबर्स ए से गुजरते हैं transform: rotate()

चित्र या ऐसा नहीं हुआ (पूर्ण रेस के लिए क्लिक करें):

यदि आप td{background:#fff}body{background:#000}CSS में जोड़ते हैं , तो आपको एक अच्छा अंधेरा दृश्य मिलेगा।

फ़ायरफ़ॉक्स और क्रोम (लिनक्स पर) में परीक्षण किया गया। ध्यान दें कि यह सभी मानकों के अनुरूप नहीं है, क्योंकि मैं जितना संभव हो उतना आकार को छोटा करने की कोशिश कर रहा था।

@Manatwork के लिए धन्यवाद border-spacingऔर :target


1
आप :targetछद्म वर्ग का उपयोग कर सकते हैं , जैसे मैंने एक बार किया थाpastebin.com/WtxbSsr3 फिर इसे फ़ाइल की तरह एक्सेस करें: ///tmp/test.html#Jedi और फ़ाइल: ///tmp/test.html#Sith (BTW, HTML cellspacing=0→ CSS border-spacing:0परिवर्तन मेरे फ़ायरफ़ॉक्स में सही दिखता है, लेकिन नहीं अन्य ब्राउज़रों में जाँच की गई।)
manatwork

धन्यवाद, मैं border-spacingलंबे समय से देख रहा हूं (यह 25 चार्ट सहेजा गया है)। :targetसलाह को दूर करने की अनुमति दी <form>और सभी जे एस। अपने अंतिम संपादन में, मैंने इसे और भी कड़ा कर दिया। यह छोटा हो सकता है अगर हम <hr>साथ प्रयोग करते हैं float:leftऔर clear:left, लेकिन यह करना चाहिए।
एडम काट्ज

1
यह तब भी काम करेगा जब आप पहले और आखिरी style>[id]:not(:target){display:none}table{width:900px;height:12px;border-spacing:0}td:last-child{border-radius:0 12px 12px 0}#Sith td:first-child{border-radius:12px 0 0 12px}#Sith td{box-shadow:0 0 18px red}#Jedi{transform:rotate(-90deg);margin:350px 0}#Jedi td{box-shadow:0 0 18px #0f0}*+table{margin:200px 0 0 0}#Jedi *+table td{box-shadow:0 0 18px #00f}td:nth-last-child(2){background:#888;width:180px;box-shadow:none!important}</style><div id=Jedi><table><td><td></table><table><td><td></table></div><table id=Sith><td><td><td></table
चार्ट को हटाएंगे

1
@ RudolfL.Jelínek यह पागल है! मैं उस शॉर्टकट के साथ सहज नहीं हूं, और मुझे यकीन नहीं है कि कितने ब्राउज़र इसका समर्थन करते हैं, लेकिन अगर यह सार्वभौमिक रूप से समर्थित है, तो आपने कोड के दो वर्णों को सफलतापूर्वक काट दिया है। वहाँ अन्य tweaks कि इसी तरह से यहाँ और वहाँ केवल न्यूनतम दृश्य गिरावट के साथ दाढ़ी होगी, <hr>एस के स्थान पर <table>एस का उपयोग करने की क्षमता भी शामिल है ।
एडम काटज़
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.