Pixel-art, episodio 1: mostra Super Mario


47

sono io!

Il compito di oggi è semplice: scrivere un programma o una funzione che visualizzi lo sprite di Mario inattivo, da Super Mario Bros, su NES, su uno sfondo blu.

Qualsiasi tipo di voce è valida purché mostri quei pixel 12 * 16 ovunque sullo schermo / finestra / browser.

(MODIFICA: l'immagine visualizzata può essere ingrandita se la tua lingua non è in grado di eseguire pixel art. Puoi anche generare grafica ASCII o HTML, ma usando i colori giusti.)

Immagine (ingrandita 400%):

È necessario utilizzare i seguenti colori:

  • blu: # 6B8CFF
  • rosso: # B13425
  • verde / marrone: # 6A6B04
  • arancione: # E39D25

Il programma più breve (in numero di caratteri) vince!

Si applicano scappatoie standard (in particolare, nessuna connessione di rete consentita), ma è consentita la codifica e la visualizzazione di un file di immagine nel programma. (le voci che usano questo trucco verranno classificate separatamente)

Eccoci qui!


Classifica attuale

Risposta più breve utilizzando solo il codice:

Risposta più breve usando una specie di immagine hardcoded:


2
Inoltre, la creazione di un file non è consentita? Deve essere visualizzato?
Martin Ender,

1
Non vedo alcun motivo in quell'immagine. Quindi tutto si riduce alla migliore compressione che si può usare in una lingua.
Ottimizzatore

20
Nitpicking: questo è Mario, non Super Mario.
Dennis,

5
Che idea divertente ... Ecco un'idea per una sfida sequel: prendi l'immagine di Mario (qualsiasi formato) e trasformala in un'immagine di Luigi!
Zibbobz,

3
Possiamo fare un programma piet che gli assomiglia?
Conor O'Brien,

Risposte:


36

HTML / JS, 206 158 153 102


102

Trucco utilizzato: salva il file GIF compresso come file HTML e aggiungi <img src = #> alla fine

Grazie a questa voce: https://codegolf.stackexchange.com/a/39926/10732 di @NiettheDarkAbsol

GIF87a  ¡ kŒÿã%jk±4%,       6„‡héj„Af-ÕdÎy\%    …R˜0”ŒÈJ­³I©±²û“ú=ª$±p%i¸•¤ <img src=#>

Demo: http://meuziere.free.fr/mario/gif.html


Versioni precedenti:

153

Trucco utilizzato: salva il file PNG compresso come file HTML e aggiungi <img src = #> alla fine

‰PNG


IHDR         _v”   PLTEjkkŒÿ±4%ã%ó’V   IIDAT×c[ʵj%C€ÍUŸ?|ìíœÿ02„ÿÿÊÐÊàÐÄÈÀ°ŠáÓë~†«ö3üZµž!jÚR‡P x( s6ïåÇ<img src=#>


158

Trucco usato: impostare i dati tagliatiURI di un PNG compresso come SRC di un tag IMG e impacchettare il tutto in caratteri Unicode.


Eseguilo nella tua console JS:

document.write(unescape(escape('🁩𫑧𘁳𬡣👤𨑴𨐺𪑭𨑧𩐻𨡡𬱥𝠴𛁩𥡂𣱒𭰰𢱇𩱯𠑁𠑁𣡓𥑨𡑕𩱁𠑁𠑷𠑁𠑁𤑁𩱍𠑁𠑂𩡄𜱡𥑁𠑁𠑄𡡂𣑖𡑖𬑡𭱒𬡪𤀫𮁎𠱘𪡮𤱘𮡫𩱨𥱁𠑁𠑓𥑬𡑑𥡑𢐱𜡍𢑗𮁘𢱅𣁖𬑊𥑏𠑺𥡕𡱮𮠹𛱇𦁺𬰷𤡭𨰯𮡁𮑨𤀯𛱹𪁄𤑅𣑲𩰰𣑔𢑷𣁃𢱧𩑈𥀶𜰶𡱦𝡶𜡍𛱸𨑴𦠴𪁡𭁰𤱂𫱤𤑯𢁧𫱁𭰾').replace(/uD./g,'')))


206

Senza imballaggio (206b):

<img src=data:image;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAQAgMAAABfD3aUAAAADFBMVEVqawRrjP+xNCXjnSXzkghWAAAASUlEQVQI12MIWxXKELVqJUOAzVUGnz9/GXzs7Rmc/zAyhP//yhDQEMrg0MTIwLCKgeHT636Gf6v2M/xatZ4hatpSBodQoHgoAw>

dimostrazione


Strumenti utilizzati:


Non hai bisogno dei tag. Usa semplicemente l'uri di dati di Chrome e inseriscilo nella barra degli indirizzi. 200 caratteri
Ottimizzatore

Hm ... Ho considerato che dataURI non è un "programma" valido. Ma hai ragione. Tutti i browser consentono datiURI nella barra degli indirizzi.
xem,

Ora stai usando una scappatoia come OP;). Stai scaricando tutto il lavoro sulla compressione esterna / incorporata del formato GIF. Se va bene, dovremmo andare tutti a caccia di formati di immagini oscure con il miglior tasso di compressione ora, e avrei potuto risparmiarmi molto lavoro scrivendo la mia compressione. ;)
Martin Ender,

2
@xem Bene, la tua sfida, la tua chiamata. Ma sembra un po 'inutile se ora stiamo solo cercando il formato di file esistente più compresso. ;)
Martin Ender,

1
Sembra che il link rawgit sia morto.
Addison Crump,

27

Mathematica, 412 292 252 212 163 148 143 141 caratteri

f=FromDigits[ToCharacterCode@#,2^16]~IntegerDigits~#2&;Image@Partition[f["넴╫賿橫ӣ鴥",256][[3#+1;;3#+3]]/256&/@"吀啐^A媾핮﻽溿뽫ﺩ埿⩕樨ꦪª⿼?ཐᐅ橕ꦪ喪"~f~4,12]

Questo utilizza la notazione ^Acon il cursore per il carattere di controllo nel punto di codice 1. In Mathematica, posso effettivamente incorporare il personaggio letteralmente, anche se questo porta a tutti i tipi di bruttezza quando si copiano le cose. Ad ogni modo, quanto sopra è più corto di 2 caratteri rispetto alla mia versione precedente, e li ho ottenuti usando i caratteri base-4 anziché base-5 per codificare gli indici della tavolozza dei colori. In questo momento non posso essere disturbato a correggere la spiegazione e lo screenshot qui sotto, quindi ti lascio qui con la versione base-5 originale della mia risposta:


f=FromDigits[ToCharacterCode@#,2^16]~IntegerDigits~#2&;Image@Partition[f["넴╫賿橫ӣ鴥",256][[3#-2;;3#]]/256&/@"ᯱ曎㌟뱮䚻륏Σ襺ﺦ您汜豈塘ᙉ雬儥衰ꐰꃾ纔ㆯ쭴뫋澖ᕿ蓉"~f~5,12]

Sto codificando i pixel in caratteri Unicode (yay per il conteggio per caratteri!).

Ecco come appare in Mathematica:

inserisci qui la descrizione dell'immagine

Ecco come funziona:

Per prima cosa definiamo una funzione fche trasforma le stringhe Unicode (passate come primo argomento #) in liste di numeri interi. Per prima cosa otteniamo i codici dei caratteri. Quelle possono essere interpretate come cifre di un numero di base 65536. E poi convertiamo quel numero in un'altra base, passato come secondo argomento #2.

Ora facciamolo per la stringa Unicode più lunga. ToCharacterCoderestituisce questo elenco:

{7153, 26318, 13087, 48238, 18107, 47439, 931, 35194, 62191, 65190, \
 24744, 57782, 27740, 35912, 22616, 5705, 38636, 20773, 34928, 42032, \
 41214, 32404, 12719, 52084, 47819, 28566, 5503, 33993}

Considerando questo come base 65536:

7933607912575313477287527915733176998797205587959732019781370103381...
4831246938139171755469819519515972565671101475553962564506286523593

E convertendo in base 5:

{2, 2, 2, 1, 1, 1, 1, 1, 2, 2, 2, 2, 2, 2, 1, 1, 1, 1, 1, 1, 1, 1, 1, \
 2, 2, 2, 3, 3, 3, 4, 4, 3, 4, 2, 2, 2, 2, 3, 4, 3, 4, 4, 4, 3, 4, 4, \
 4, 2, 2, 3, 4, 3, 3, 4, 4, 4, 3, 4, 4, 4, 2, 3, 3, 4, 4, 4, 4, 3, 3, \
 3, 3, 2, 2, 2, 2, 4, 4, 4, 4, 4, 4, 4, 2, 2, 2, 2, 3, 3, 1, 3, 3, 3, \
 2, 2, 2, 2, 2, 3, 3, 3, 1, 3, 3, 1, 3, 3, 3, 2, 3, 3, 3, 3, 1, 1, 1, \
 1, 3, 3, 3, 3, 4, 4, 3, 1, 4, 1, 1, 4, 1, 3, 4, 4, 4, 4, 4, 1, 1, 1, \
 1, 1, 1, 4, 4, 4, 4, 4, 1, 1, 1, 1, 1, 1, 1, 1, 4, 4, 2, 2, 1, 1, 1, \
 2, 2, 1, 1, 1, 2, 2, 2, 3, 3, 3, 2, 2, 2, 2, 3, 3, 3, 2, 3, 3, 3, 3, \
 2, 2, 2, 2, 3, 3, 3, 3}

Questi sono gli indici di colore dei pixel, nell'ordine blu, rosso, verde, arancione. Usiamo quelli per indicizzare quell'elenco di numeri, che è la tavolozza dei colori.

Ora per la tavolozza dei colori. Questo è "넴╫賿橫ӣ鴥". Usiamo gli indici sopra per selezionare la stringa corretta. Quindi applichiamo di nuovo la nostra funzione, ma usando la base 256. Ciò produce un elenco di 12 numeri interi:

{177, 52, 37, 107, 140, 255, 106, 107, 4, 227, 157, 37}

Usiamo l' ;;indicizzazione dell'intervallo per estrarre la sezione pertinente per il colore corrente.

Infine, usiamo solo Partitionper dividere questo in file di 12e alimentarlo Image. Ecco!

Modifica: Con il pacchetto Unicode il RLE non valeva più la pena. Rimuovendolo è stato salvato 50 caratteri.

Modifica: Naturalmente, senza RLE, non è nemmeno necessario andare alla base 16.

Modifica: E mentre ci siamo, perché non anche Unicode-pack la tavolozza dei colori? (Ho la sensazione che posso risparmiare un po 'di più rendendo l'intera tavolozza dei colori anche una singola stringa e usando Partitionanche lì. Ci proverò più tardi.)

Modifica: Sì, che si è rasato altri 5 byte.


1
ti dispiacerebbe aggiungere uno screenshot del risultato? (non che non mi fidi del tuo codice, ma curioso di come viene visualizzato: in una finestra? un browser? altro?)
xem

@xem Will. È un ambiente REPL capace di input e output grafici.
Martin Ender,

Non sono sicuro, ma stai rispecchiando la parte inferiore dell'immagine?
Ottimizzatore

1
@Optimizer No, dubito che sarei in grado di farlo con meno personaggi di quanti ne avrei salvati.
Martin Ender,

Quando guardo nella documentazione di Mathematica non vedo alcun utilizzo su tilde ma qui sembra che lo stai usando per alimentare il risultato di una funzione in un'altra e quindi applicare un argomento aggiuntivo a quella seconda funzione (IntegerDigits)? Inoltre, la tavolozza dei colori: guardando l'immagine, sembra che ci siano solo quattro colori, ma la tua tavolozza dei colori sembra includere più di questo: {177, 52, 37, 107, 140, 255, 106, 107, 4, 227 , 157, 37}. Guardando la documentazione per Image, sembra che stampi in scala di grigi a meno che non vengano fornite opzioni aggiuntive come ColorScale -> RGB.
CryptoCommander,

20

Java: 398 377

void s(){new java.awt.Frame(){public void paint(java.awt.Graphics g){int i=0,x,m[]={12226,44085194,467839834,0x5abea55a,0x5bbd5d50,0x5ffe9540,0x5ffe9540,0x5aee5d50,531408218,334277466,333492170,0xc02fc2},c[]={7048447,0xB13425,6974212,0xE39D25};for(setSize(99,99);i<192;g.setColor(new java.awt.Color(c[m[x]&3])),m[x]/=4,g.drawLine(x+40,60-i%16,x+40,60-i++%16))x=i/16;}}.show();}

Disegna semplicemente lo sprite decomprimendo un int per ogni colonna. Mostrato in un programma completo:

class P{
    public static void main(String[]a){
        new P().s();
    }

    void s(){
        new java.awt.Frame(){           
            public void paint(java.awt.Graphics g){
                int i=0,x,m[]={12226,44085194,467839834,0x5abea55a,0x5bbd5d50,0x5ffe9540,
                               0x5ffe9540,0x5aee5d50,531408218,334277466,333492170,0xc02fc2},
                          c[]={7048447,0xB13425,6974212,0xE39D25};
                for(setSize(99,99);i<192;
                    g.setColor(new java.awt.Color(c[m[x]&3])),m[x]/=4,
                    g.drawLine(x+40,60-i%16,x+40,60-i++%16)
                )x=i/16;
            }
        }.show();
    }
}

Schermata obbligatoria:

sono io, Mario


1
È possibile salvare 9 byte utilizzando un import java.awt.*.
Kevin Cruijssen,

15

Codice macchina x86, 102 byte

Come funziona: l'immagine viene archiviata come immagine a 2 bit usando una tavolozza. Ogni riga dell'immagine è memorizzata come 3 byte, seguita da un 1 byte della tavolozza dei colori. Ciò consente di caricare i dati come un singolo DWORD. I dodici pixel vengono emessi mascherando i 2 bit più bassi del valore, scrivendoli nella memoria video e spostando a destra l'intero valore di due bit. Una volta emessi i pixel per la riga, il byte della tavolozza viene scritto nella tavolozza VGA. Al termine del disegno dell'immagine, il programma entra in un ciclo infinito.

Codice assembly per generare il file binario:

org 100h
mov al,13h
int 10h
les ax,[bx]

mov si,image_data
draw:
add di,320-12
lodsd
xchg eax,ebx
mov cl,12
row:
mov ax,bx
and al,3
stosb
shr ebx,2
loop row
xchg ax,bx
mov dx,0x3c9
out dx,al
test al,al
jnz draw

image_data: db 21,0,85,0xb1/4, \
5,0,64,0x34/4,            \
165,190,87,0x25/4,        \
185,191,127,0x6b/4,       \
185,254,254,0x8c/4,       \
233,191,106,0xff/4,       \
213,255,95,0x6a/4,        \
165,168,85,0x6b/4,        \
169,40,106,0x4/4,         \
170,0,170,0xe3/4,         \
47,195,248,0x9d/4,        \
63,0,252,0x25/4,          \
15,0,240,111,             \
5,20,80,111,              \
169,85,106,111,           \  
170,85,170 

Binario con codifica Base 64, salvarlo come Mario.com per eseguirlo: sBPNEMQHvigBgcc0AWatZpOxDInYJAOqZsHrAuL1k7rJA + 6EwHXiwxUAVSwFAEANpb8Qqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqxqqxqxqq

Uscita campione: inserisci qui la descrizione dell'immagine


10

GIF - 93 byte

L'hardcoding dell'immagine ora sembra a posto, quindi ... yay? : D

GIF87a  ¡ kŒÿã%jk±4%,       6„‡héj„Af-ÕdÎy\%    …R˜0”ŒÈJ­³I©±²û“ú=ª$±p%i¸•¤  ;

Come visto in Notepad ++

screenshot in NP ++

Come PHP - 131 byte

<? header("Content-Type:image/gif");?>GIF87a  ¡ kŒÿã%jk±4%,       6„‡héj„Af-ÕdÎy\%  …R˜0”ŒÈJ­³I©±²û“ú=ª$±p%i¸•¤  ;

1
puoi per favore caricare il tuo GIF da qualche parte (ctrlv.in per esempio)? Vorrei usarlo nella mia voce invece di PNG :)
xem


@NiettheDarkAbsol Non sono sicuro di come tu abbia contato la dimensione, ma conto 150 byte. Indipendentemente da ciò, il punteggio è di personaggi e sembra essere di 114 caratteri.
Martin Ender,

2
Sì, lo snippet di PHP va bene per me (anche se potresti rimuovere gli ultimi 2 byte). Ma lo snippet gif non è un programma.
xem,

1
@xem: se il browser è considerato un "interprete" per HTML / javascript / etc e l'alimentazione dello snippet gif grezzo tramite lo stesso meccanismo produce l'output desiderato ... la differenza diventa piccola
Mooing Duck,

10

Bash + ImageMagick: 350 331 321 caratteri

(Palette spudoratamente rubato da Martin Büttner 's risposta .)

p=(B13425 6B8CFF 6A6B04 E39D25)
for c in 21 0 85 5 0 64 165 190 87 1{85,91,27,85} 254{,} 233 191 106 213 255 95 165 168 85 169 40 106 170 0 170 47 195 248 63 0 252 15 0 240 5 20 80 169 85 106 170 85 170;{
for j in 0 2 4 6;{
d+=(-fill \#${p[c>>j&3]} -draw point\ $[i%12],$[i++/12])
}
}
convert -size 12x16 xc: "${d[@]}" x:

Uscita campione:

Mario

Per ispezionare facilmente aggiungere -scale 120ai convertparametri 's per ottenere una versione in scala 10x:

Mario ridimensionato 10


2
s/185 191 127 185 254 254/1{85,91,27,85} 254{,}/; s/do/{/; s/done/}/
Grawity,

Doh. Ho anche upvoted DigitalTrauma correlate s' punta , ma io continuo a dimenticare che {.. }. Grazie @grawity.
arte

8

Octo / XO-Chip , 70 byte

Octo è un linguaggio di assemblaggio di alto livello che si compila in istruzioni codificate per la macchina virtuale CHIP-8 . Octo fornisce alcune estensioni personalizzate chiamate "XO-Chip" al bytecode CHIP-8 di base, inclusa la possibilità di disegnare bitmap a 4 colori tramite bitplane sovrapposti.

I byte compilati sono i seguenti:

0xA2 0x08 0xF3 0x01 0xD0 0x00 0x1F 0x00 0x3F 0xC0 0x39 0x00 0x51 0x00 0x58 0x80
0x21 0xE0 0x00 0x00 0x3F 0x00 0x7F 0xE0 0xFF 0xF0 0x36 0xC0 0x1F 0x80 0x3F 0xC0
0x39 0xC0 0x70 0xE0 0xF0 0xF0 0x00 0x00 0x00 0x00 0x3F 0x80 0x7F 0xE0 0x7F 0xF0
0x3F 0xE0 0x1F 0xC0 0x37 0x00 0x76 0xE0 0xF0 0xF0 0xE9 0x70 0xE0 0x70 0xC0 0x30
0x00 0x00 0x70 0xE0 0xF0 0xF0

Mario

Eseguilo qui nel tuo browser: http://johnearnest.github.io/Octo/index.html?gist=33aa37d4717a425ccd4f

È probabilmente più illuminante vedere il linguaggio assembly di Octo che produce quel bytecode:

: main
    i := mario
    plane 3
    sprite v0 v0 0

: mario
    0x1F 0x00 0x3F 0xC0 0x39 0x00 0x51 0x00 
    0x58 0x80 0x21 0xE0 0x00 0x00 0x3F 0x00 
    0x7F 0xE0 0xFF 0xF0 0x36 0xC0 0x1F 0x80 
    0x3F 0xC0 0x39 0xC0 0x70 0xE0 0xF0 0xF0 
    0x00 0x00 0x00 0x00 0x3F 0x80 0x7F 0xE0 
    0x7F 0xF0 0x3F 0xE0 0x1F 0xC0 0x37 0x00 
    0x76 0xE0 0xF0 0xF0 0xE9 0x70 0xE0 0x70 
    0xC0 0x30 0x00 0x00 0x70 0xE0 0xF0 0xF0 

Il programma principale è composto da tre istruzioni a due byte. Impostare il registro dell'indice di memoria iall'inizio del segmento di dati, selezionare il piano di disegno 3 (3 è una maschera di bit; questo indica che si desidera disegnare in modalità 4 colori con entrambi i bitplane) e quindi disegnare uno sprite in una posizione xey data da registro v0(inizializzato su zero). Lo 0 finale fornisce la dimensione dello sprite, che nei set di istruzioni SuperChip e XO-Chip disegnerà uno sprite 16x16. In modalità 4 colori, una bitmap per il primo piano è immediatamente seguita da una bitmap per il secondo piano.

Per vedere come funzionano gli aerei, considera questo programma modificato che fa scorrere un piano verso destra dopo aver disegnato mario:

mario2

: main
    i := mario
    plane 3
    sprite v0 v0 0
    plane 2
    scroll-right
    scroll-right
    scroll-right
    scroll-right

: mario
    0x1F 0x00 0x3F 0xC0 0x39 0x00 0x51 0x00 
    0x58 0x80 0x21 0xE0 0x00 0x00 0x3F 0x00 
    0x7F 0xE0 0xFF 0xF0 0x36 0xC0 0x1F 0x80 
    0x3F 0xC0 0x39 0xC0 0x70 0xE0 0xF0 0xF0 
    0x00 0x00 0x00 0x00 0x3F 0x80 0x7F 0xE0 
    0x7F 0xF0 0x3F 0xE0 0x1F 0xC0 0x37 0x00 
    0x76 0xE0 0xF0 0xF0 0xE9 0x70 0xE0 0x70 
    0xC0 0x30 0x00 0x00 0x70 0xE0 0xF0 0xF0 

Se ti piace questo, ti potrebbe piacere una delle mie altre soluzioni scritte con Octo. In realtà c'è un blocco del gioco in corso per il mese di ottobre basato su questo strumento.


6

Groovy 417 386

Divertente da morire, ma con un terribile conteggio dei caratteri. GroovyFX necessario

m=[b:'6B8CFF',r:'B13425',g:'6A6B04',o:'E39D25'];groovyx.javafx.GroovyFX.start{stage(visible:!0){scene(width:60,height:80){flowPane{"3b5r4b2b9r1b2b3g2o1g1o3b1b1g1o1g3o1g3o1b1b1g1o2g3o1g3o1b2g4o4g1b3b7o2b2b2g1r3g4b1b3g1r2g1r3g1b4g4r4g2o1g1r1o2r1o1r1g2o3o6r3o2o8r2o2b3r2b3r2b1b3g4b3g1b4g4b4g".toList().collate 2 each{l->(l[0]as int).times{rectangle(width:5,height:5,fill:"#"+m[l[1]])}}}}}}

ungolfed:

m=[b:'6B8CFF',
   r:'B13425',
   g:'6A6B04',
   o:'E39D25']           

s=5

groovyx.javafx.GroovyFX.start {bd->
  stage(visible: !0) {
    scene(width:s*12, height:s*16) {
      flowPane {
        "3b5r4b 2b9r1b 2b3g2o1g1o3b 1b1g1o1g3o1g3o1b 1b1g1o2g3o1g3o 1b2g4o4g1b 3b7o2b 2b2g1r3g4b 1b3g1r2g1r3g1b 4g4r4g 2o1g1r1o2r1o1r1g2o 3o6r3o 2o8r2o 2b3r2b3r2b 1b3g4b3g1b 4g4b4g"
          .replaceAll(" ", "")
          .toList()
          .collate(2) 
          .each { l->
            t=l[0] as int
            cr=m[l[1]]
            t.times {
              rectangle(width:s, height:s, fill:"#"+cr) 
            }
          }
      }
    }
  }
}

inserisci qui la descrizione dell'immagine


grep()anzichétoList()
cfrick,

5

HTML / JS, 427 408 264 256 239 226 caratteri

Obfuscatweet, 271 270 264 256 239 226 caratteri

Usando obfuscatweet, sono riuscito a ridurlo a <250: D

document.write(unescape(escape('🁳𨱲𪑰𭀾𨰽𦰢𝡂𞁃𡡆𘠬𘡂𜐳𝀲𝐢𛀢𝡁𝡂𜀴𘠬𘡅𜰹𡀲𝐢𧐻𨐽𙰰𜐵𝐰𜀰𝐵𝐵𝀰𠑂𡑃𜀲𡑆𡑆𠰲𡑂𡡂𡠲𠡆𡑁𞀰𜱆𡡆𜀰𠐶𠐰𜀲𠐶𞑁𞁁𠐵𝑁𠑆𞑄𝰶𡡆𡀵𝐷𡡆𝐵𝐵𡠰𝐴𜐵𜀲𠐰𜁁𞁁𠐰𜁁𠐧𞱷𪑴𪀨𩁯𨱵𫑥𫡴𚑦𫱲𚁩🐰𞱩🀹𝠻𭱲𪑴𩐨𙰼𨡲🠧𚐩𮱨🐨𙰰𜀰𙰫𬁡𬡳𩑉𫡴𚁡𛡳𫁩𨱥𚁩𛁩𚰽𝠩𛀱𝠩𛡴𫱓𭁲𪑮𩰨𝀩𚐮𬱬𪑣𩐨𛐱𜠩𞱦𫱲𚁪🐰𞱪🀱𜠻𭱲𪑴𩐨𙰼𬡰𘁳𭁹𫁥🐢𬁡𩁤𪑮𩰺𜐠𞀻𨡡𨱫𩱲𫱵𫡤𞠣𙰫𨱛𪁛𪠫𚱝𧐫𙰢🠼𛱲𬀾𙰩𚐻𯐼𛱳𨱲𪑰𭀾').replace(/uD./g,'')))

Il codice seguente è ciò in cui consiste.

Trucco usato: immagine convertita in Stringa di tessere di colore base4, convertita in Stringa esadecimale. L'indice della base 4 indica il colore (0 = blu, 1 = ROSSO, ecc.) Il CSS con una p in linea è usato perché i div hanno bisogno di contenuti per espandersi (anche p è più breve). Poiché il CSS deve iniziare con una lettera, "A" viene anteposto prima dei tag CSS.

Il riempimento dal CSS fornisce pixel. Niente di tutto ciò usa caratteri Unicode, che comunque non conosco troppo bene, anche se probabilmente andrebbe sotto i 300 in quel caso. Il vantaggio relativo dell'uso dell'imbottitura è che puoi, come in questo caso, far esplodere l'immagine a qualunque dimensione desideri che ciascun pixel sia. Ho usato 9 pixel, ma se spendi un carattere in più, puoi ottenere fino a 99 pixel per pixel rappresentato.


CSS, 127 119 118 114 100 13 0 caratteri

Passare da pa rprimuove la necessità di display:inline, costo +1 carattere, -15! caratteri!

Rimosso tutti i colori e inserito in un array nei caratteri JS -87. Quindi ho rimosso tutti i CSS

JS, 300 289 280 275 329 325 caratteri

c=["6B8CFF","B13425","6A6B04","E39D25"];a='0155000555540ABEC02EFEFC2EBFBF2BFEA803FFF00A6A002A69A8AA55AAF9D76FFD557FF5555F0541502A00A8AA00AA';with(document)for(i=0;i<96;write('<br>')){h=('000'+parseInt(a.slice(i,i+=6),16).toString(4)).slice(-12);for(j=0;j<12;write('<rp style="padding:1 8;background:#'+c[h[j++]]+'"></rp>'));}

Ho provato a tagliare il più possibile da questo semplice JS elaborando una stringa esadecimale, ma dato che è il mio primo tentativo, questo è quanto ho ottenuto usando solo quello che so. La scrittura HTML è stata abbreviata da una funzione che aggiunge tag e le classi utilizzano il valore di base 4 per determinare il colore da visualizzare.

Usando un accorciamento aggiuntivo, sostituisci il carattere con parentesi [], rimuovi la classe A0 e imposta il blu come colore predefinito per p, salvando altri 10 caratteri. Il costo aggiuntivo per l'uso dei rptag è compensato da un'enorme perdita di CSS.

Offset aggiuntivo dalla rimozione del pad del ciclo while all'aggiunta di '000' per il caso d'uso e al taglio di -12 da esso.

Aggiunto JS aggiuntivo per i colori, quindi inserire l'imbottitura. Notato un bug con l'imbottitura che richiede 2 caratteri extra da correggere. Compattato un mucchio di anelli

File HTML, 430 429 419 399 366 342 caratteri

dimostrazione

<script>c=["6B8CFF","B13425","6A6B04","E39D25"];a='0155000555540ABEC02EFEFC2EBFBF2BFEA803FFF00A6A002A69A8AA55AAF9D76FFD557FF5555F0541502A00A8AA00AA';with(document)for(i=0;i<96;write('<br>')){h=('000'+parseInt(a.slice(i,i+=6),16).toString(4)).slice(-12);for(j=0;j<12;write('<rp style="padding:1 8;background:#'+c[h[j++]]+'"></rp>'));}</script>

Bello! Ti consiglierei di rimuovere tutte le interruzioni di riga nel tuo codice e di fornire un link per una demo ( c99.nl ). Come bonus, puoi inserire la tua voce in caratteri Unicode usando xem.github.io/obfuscatweet . Ciò migliorerà il tuo punteggio.
xem,

inoltre, puoi rimuovere i tag & lt; html>, posizionare il tag & lt; style> alla fine e rimuovere lo stile / e il "}" finale dell'ultima regola CSS.
xem,

@xem OK Ho tagliato tutte le linee e schiacciato tutto. Proverò a trovare un modo ottimale per dividere JS per obfuscatweet.
Bussola

1
obfuscatweet accetta qualsiasi codice js (quindi puoi inserire i tuoi 289 caratteri js lì) o qualsiasi codice html (in modo da poter copiare qui il tuo file html). L'output di obfuscatweet può essere eseguito nella console di un browser o in un file HTML utilizzando il meta tag charset corretto.
xem,

psst, hai dimenticato di rimuovere l'ultimo "}" della parte CSS. Funziona senza di essa.
xem,

5

MATLAB, 194 193 byte

Il codice:

imagesc(dec2base(base2dec(reshape('5FVQL5VVVT50A4L4HA594GAHA45A015DAL551G2L41GO101VO0A7FMAANVVAAVVVQ5VLVL40L8100L80',5,[])',32),4)-48);colormap([106 107 4;107 140 255;227 157 37;177 52 37]/255)

E l'output:

Mario

Fondamentalmente ho convertito l'immagine di Mario in modo che ogni pixel sia un numero di 2 bit. Ho quindi codificato quello nella base 32 che è la stringa mostrata nel codice. Questa stringa viene prima rimodellata per essere 5 x 16 (ogni riga (12px) di numeri a 2 bit è stata codificata in base 32), quindi riconvertita in base 10. Il risultato viene nuovamente convertito, questa volta in base 4 producendo un array 12x16 di Numeri a 2 bit. Questi numeri sono tracciati usando imagesc(). Quindi i colori vengono assegnati usando colormap()una mappa colori personalizzata dei valori esadecimali richiesti.

In modo divertente, un terzo del numero di byte utilizzati è solo per ottenere MATLAB per impostare i colori corretti dopo che è stato tracciato. Il codice colore è quasi lo stesso numero di byte dell'intera stringa base32 !.

Senza correggere il colore (rimuovere la colormap()chiamata), è di 135 byte e questo è l'output per la mappa dei colori predefinita su MATLAB R2013a:

Mario, nessuna mappatura


4

JavaScript / CSS / HTML 446 430 407 353 328 316

Ho giocato a golf il più possibile e ho finito con un po 'di HTML / JS sporco, ma qualunque cosa ... funziona.

Modifica : eccolo ... Ho finito.

Modifica Fatto seriamente questa volta.

JavaScript

for(i=0;i<192;)document.body.innerHTML+=(i%12?"":"<br>")+"<font color=#"+["6B8CFF","B13425","6A6B04","E39D25"]["000111110000001111111110002223323000023233323330023223332333022333322220000333333300002212220000022212212220222211112222332131131233333111111333331111111133001110011100022200002220222200002222"[i++]]+">█"

JSFiddle


Il JSFiddle collegato non contiene la stessa versione pubblicata qui e non funziona (almeno non per me in Firefox). A proposito, per un risultato migliore *{line-height:1}sarebbe di aiuto.
arte

@manatwork Riprova.
SomeShinyMonica,

Bello. Ma perché il div? Solo per mia curiosità, ho provato una versione di ECMAScript. Hai 372 personaggi: jsfiddle.net/768h7brb
manatwork,

perché <div></div>è più corto di document.createElement('div'). E JSFiddle non piacedocument.write
SomeShinyMonica

1
Invertire le condizioni del operatore ternario per sbarazzarsi di destra di confronto: i%12?"":"<br>".
arte

4

Matlab - 449/326 305 byte

compressione parziale + Utilizzo della simmetria dell'immagine inferiore:

a=[0,0];b=[2,2];c=[3,3];d=[a,0];f=[b,2];g=[c,3];h=[b,b];i=[a,a];k=[1,1];l=[0,f,1,2;h,k;c,2,1,3,1;g,k,1;c,k,k;a,k,1,0;0,f,a;h,a];imshow(uint8([d,k,1,k,i;a,k,k,k,k,1,0;a,f,c,2,3,d;0,2,3,2,g,2,g,0;0,2,3,b,g,2,g;0,b,c,c,h,0;d,g,g,3,a;a,b,1,f,i;[l fliplr(l)]]),[107 140 255;177 52 37;106 107 4;227 157 37]/255)

- Versione parzialmente compressa (332 byte):

a=[0,0]
b=[2,2]
c=[3,3]
d=[a,0]
e=[1,1,1]
f=[b,2]
g=[c,3]
h=[b,b]
i=[a,a]
imshow(uint8([d,e,1,1,i;a,e,e,e,0;a,f,c,2,3,d;0,2,3,2,g,2,g,0;0,2,3,b,g,2,g;0,b,c,c,h,0;d,g,g,3,a;a,b,1,f,i;0,f,1,b,1,f,0;h,e,1,h;c,2,1,3,1,1,3,1,2,c;g,e,e,g;c,e,e,1,1,c;a,e,a,e,a;0,b,2,i,f,0;h,i,h]),[107 140 255;177 52 37;106 107 4;227 157 37]/255)

Versione completamente non compressa (449 byte):

imshow(uint8([0,0,0,1,1,1,1,1,0,0,0,0;0,0,1,1,1,1,1,1,1,1,1,0;0,0,2,2,2,3,3,2,3,0,0,0;0,2,3,2,3,3,3,2,3,3,3,0;0,2,3,2,2,3,3,3,2,3,3,3;0,2,2,3,3,3,3,2,2,2,2,0;0,0,0,3,3,3,3,3,3,3,0,0;0,0,2,2,1,2,2,2,0,0,0,0;0,2,2,2,1,2,2,1,2,2,2,0;2,2,2,2,1,1,1,1,2,2,2,2;3,3,2,1,3,1,1,3,1,2,3,3;3,3,3,1,1,1,1,1,1,3,3,3;3,3,1,1,1,1,1,1,1,1,3,3;0,0,1,1,1,0,0,1,1,1,0,0;0,2,2,2,0,0,0,0,2,2,2,0;2,2,2,2,0,0,0,0,2,2,2,2]),[107 140 255;177 52 37;106 107 4;227 157 37]/255)

Uscita in entrambi i casi (ingrandito sullo schermo ovviamente, quello reale è 12x16 pixel):
MarioMagnified


Ehi, mi chiedevo se qualcuno avrebbe sfruttato la simmetria in qualche modo. Non sono riuscito a trovare un modo con il metodo con cui finalmente sono andato.
Bumpy

4

C, 4999 byte

Questo non può assolutamente competere con alcune delle risposte qui, ma ho pensato di dare una risposta in C. Il codice è una singola linea lunga, quindi ecco un link pastebin. Se preferisci, ecco una codifica base64 del codice gzipped:

H4sICAzFGFYCA21hcmlvLmMA3Zc9DsIwDIXv0qndUqchkXwUurAgdYiFEEyIu4NYaZBI7PzNT3Lsz4mf408bjdPjct3odh6HVeujdgg4K4vzohCM8esdjHOpkrVoALUtIrBX8y1R04DKNCGZmTp85CVdAHifYuxO3mElIlju6xaRICOgCo4pD64PoiTzHnkZcHYnRhAYcEEpFznxB1mXP4TdS/KeVGYPZbmVaQHlnRVZFi65OkhoGodq+RHrby4xsTj8i6RmapXrPvfa0Q8ZWZY1/UPbSiC7Z2bYA7r0zla57Xmo8sOEzxdNYIXFhxMAAA==

Notevole in quanto non richiede l'esecuzione di librerie esterne.

Richiede un terminale xterm, Konsole o GNOME, poiché utilizza l'espansione RGB ai codici di escape del colore ANSI per produrre i colori corretti (ANSI non definisce l'arancione). Per ovvie ragioni, ideone non funzionerà. Può essere eseguito in Windows sotto Cygwin, che utilizza xterm (in effetti, è così che l'ho testato). MSYS potrebbe funzionare; Non ne sono sicuro.

Uscita sulla mia macchina (xterm):

sono io, Mario!


2
-1 non è un multiplo di 10
Conor O'Brien,

Siamo spiacenti, era in riferimento al punteggio
Conor O'Brien,

4

Excel VBA, 310 307 295 byte

Anonimo VBE Immediatamente Funzione Window che genera un oggetto Mario nell'oggetto Foglio attivo nelle celle A1:L16

o=2465251:Cells.RowHeight=48:a[A1:L16],-29589:a[C4:K5,D3:I7,J7,L5,A11:L13],o:a[C3:E3,H3:H4,B4:B6,C6,D4:D5,E5,I5,H6:K6,C8:H8,B9:K10,A10:L10,C11,J11,B15:D16,A16,I15:K16,L16],289642:a[D1:H1,C2:K2,E8:E10,F10:H10,H9,D11:I13,C13:E14,H13:J14],2438321:a[E11,H11],o

Helper Subdi routine un

Sub a(r,c):r.Interior.Color=c:End Sub

Versione Ungolfed

Public Sub b()
    o = 2465251
    Cells.RowHeight = 48
    a [A1:L16], -29589
    a [C4:K5,D3:I7,J7,L5,A11:L13], o
    a [C3:E3,H3:H4,B4:B6,C6,D4:D5,E5,I5,H6:K6,C8:H8,B9:K10,A10:L10,C11,J11,B15:D16,A16,I15:K16,L16], 289642
    a [D1:H1,C2:K2,E8:E10,F10:H10,H9,D11:I13,C13:E14,H13:J14], 2438321
    a [E11,H11], o
End Sub


Private Sub a(ByRef r As Range, ByVal c As Integer)
    r.Interior.Color = c
End Sub

-3 byte per la rimozione di spazi bianchi -12 byte per l'utilizzo della [...]notazione sulla Range(...)notazione; passando da colori esadecimali a colori int

Produzione

Sono io


3

Bash 346

bash puro con sequenze di escape come VT100 (scusate l'arancia in quella palette)

C="  "
B="\033[44m$C"
R="\033[41m$C"
G="\033[42m$C"
O="\033[43m$C"
N="\033[00m\n"
A="BBBRRRRRBBBBNBBRRRRRRRRRBNBBGGGOOGOBBBNBGOGOOOGOOOBNBGOGGOOOGOOONBGGOOOOGGGGBNBBBOOOOOOOBBNBBGGRGGGBBBBNBGGGRGGRGGGBNGGGGRRRRGGGGNOOGRORRORGOONOOORRRRRROOONOORRRRRRRROONBBRRRBBRRRBBNBGGGBBBBGGGBNGGGGBBBBGGGGN"
while read -n1 v
do
  printf "${!v}"
done <<< "$A"

1
È possibile ridurlo utilizzando una matrice per la tavolozza anziché caratteri separati. Poiché la dichiarazione di matrici associative è lunga, è meglio ricodificarla in numeri interi. Una versione di 295 caratteri del tuo codice: pastebin.com/d0LW0HM1
manatwork,

3

Pyth, 83 byte

Disclaimer: questo non è un candidato vincente, perché alcune delle funzionalità della lingua sono state create dopo aver pubblicato la domanda.

.wc16@Lc4CM"±4%kÿjkã%"jC"T\0UP\0Z¾Õnþýn¿¿kþ©WÿõZ*Uj(©ª\0ªøÃ/ü\0?ð\0PjU©ªUª"4

Ecco una discarica esadecimale:

00000000   2E 77 63 31  36 40 4C 63  34 43 4D 22  B1 34 25 6B  .wc16@Lc4CM".4%k
00000010   8C FF 6A 6B  04 E3 9D 25  22 6A 43 22  54 5C 30 55  ..jk...%"jC"T\0U
00000020   50 5C 30 01  5A BE D5 6E  FE FD 6E BF  BF 6B FE A9  P\0.Z..n..n..k..
00000030   57 FF F5 5A  2A 55 6A 28  A9 AA 5C 30  AA F8 C3 2F  W..Z*Uj(..\0.../
00000040   FC 5C 30 3F  F0 5C 30 0F  50 14 05 6A  55 A9 AA 55  .\0?.\0.P..jU..U
00000050   AA 22 34                                            ."4

Puoi anche scaricare il programma qui ed eseguirlo

python3 pyth.py mario.pyth

Questo crea un file o.png:

Mario

Spiegazione:

Ci sono solo 4 colori diversi, quindi ho solo bisogno di 2 bit per salvare il colore di ogni pixel.

.wc16@Lc4CM"..."jC"..."4
                  "..."   the colors of the image, 2 bit per pixel
                 C        convert these bytes to a number
                j      4  and convert it to base 4 (extracting the colors)
           "..."          the hexcodes of the 4 colors (3 byte per color)
         CM               convert each byte into its number
       c4                 split into 4 lists
     @L                   for each pixel, pick the correct list of color-list
  c16                     split into 16 rows
.w                        save it as "o.png"

Funziona nell'ultima versione di Pyth prima che la sfida fosse pubblicata?
lirtosiast,

@ThomasKwa Sì, dimenticato. Modificherò un'informazione.
Jakube,

2

Elaborazione di 2-359 caratteri

Ho visto questa sfida e ho subito pensato alla funzione pixel [] di Processing. Speravo che fosse più breve, ma sono ancora abbastanza soddisfatto del risultato considerando che questo è il mio primo tentativo di giocare a golf.

int i,l;i=l=0;size(12,16);loadPixels();for(char c:"3b5r6b9r3b3g2o1g1o4b1g1o1g3o1g3o2b1g1o2g3o1g3o1b2g4o4g4b7o4b2g1r3g5b3g1r2g1r3g1b4g4r4g2o1g1r1o2r1o1r1g5o6r5o8r2o2b3r2b3r3b3g4b3g1b4g4b4g".toCharArray()){while(l>0){pixels[i]=#6B8CFF;if(c=='r')pixels[i]=#B13425;if(c=='g')pixels[i]=#6A6B04;if(c=='o')pixels[i]=#E39D25;i++;l--;}if(c<58){l=c-48;}}updatePixels();

ungolfed:

int i,l;i=l=0;
size(12,16);
loadPixels();
for(char c:"3b5r6b9r3b3g2o1g1o4b1g1o1g3o1g3o2b1g1o2g3o1g3o1b2g4o4g4b7o4b2g1r3g5b3g1r2g1r3g1b4g4r4g2o1g1r1o2r1o1r1g5o6r5o8r2o2b3r2b3r3b3g4b3g1b4g4b4g".toCharArray())
{
    while(l>0)
    {
        pixels[i]=#6B8CFF;
        if(c=='r')pixels[i]=#B13425;
        if(c=='g')pixels[i]=#6A6B04;
        if(c=='o')pixels[i]=#E39D25;
        i++;
        l--;
    }
    if(c<58){l=c-48;}
}
updatePixels();

puoi scaricare l'elaborazione qui


2

Javascript 515

str='';
"000111110000|001111111110|002223323000|023233323330|023223332333|022333322220|000333333300|002212220000|022212212220|222211112222|332131131233|333111111333|331111111133|001110011100|022200002220|222200002222"
.split("|").forEach(function(ov, ok) {
str += '<div>'
    ov.split("").forEach(function(iv, ik) {
    str += '<div style="width:1px;height:1px;background-color:' + ['#6B8CFF','#B13425','#6A6B04','#E39D25'][iv] + ';display:inline-block"></div>';
    });
    str+= '</div>';
});
document.write(str);

ho appena funzionato, devo ancora andare a giocare a golf


1
Puoi sostituire le divs che compongono le righe con un tag che è in linea per impostazione predefinita. Non l'ho provato, ma l'utilizzo adovrebbe funzionare. Puoi anche usare al backgroundposto di background-color.
NinjaBearMonkey,

2

Perl - Ungolfed 927

Dovrò giocare a golf più tardi. Prima volta provando Image::Magick.

#!/usr/local/bin/perl
use Image::Magick;
use strict;
use warnings;

my @p = (
[0,0,0,1,1,1,1,1,0,0,0,0],
[0,0,1,1,1,1,1,1,1,1,1,0],
[0,0,2,2,2,3,3,2,3,0,0,0],
[0,2,3,2,3,3,3,2,3,3,3,0],
[0,2,3,2,2,3,3,3,2,3,3,3],
[0,2,2,3,3,3,3,2,2,2,2,0],
[0,0,0,3,3,3,3,3,3,3,0,0],
[0,0,2,2,1,2,2,2,0,0,0,0],
[0,2,2,2,1,2,2,1,2,2,2,0],
[2,2,2,2,1,1,1,1,2,2,2,2],
[3,3,2,1,3,1,1,3,1,2,3,3],
[3,3,3,1,1,1,1,1,1,3,3,3],
[3,3,1,1,1,1,1,1,1,1,3,3],
[0,0,1,1,1,0,0,1,1,1,0,0],
[0,2,2,2,0,0,0,0,2,2,2,0],
[2,2,2,2,0,0,0,0,2,2,2,2],
);
my $image = Image::Magick->new;
$image->Set(size=>'12x16');
$image->ReadImage('canvas:white');
for my $i (0..$#p) {
    for (0..(@{$p[$i]} - 1)) {
        my $color;
        $color = ($p[$i][$_] < 1 ? "#6B8CFF" : $p[$i][$_] < 2 ? "#B13425" : $p[$i][$_] < 3 ? "#6A6B04" : "#E39D25");
        print "$i : $_ : $color \n";
       $image->Set("pixel[$_,$i]"=> $color);
    }
}
#$image->Write("mario.png");
$image->Display();

Sono sicuro che ne abbiamo molti, ma ecco il mio: Mario!


2

Stampa stampabile: 179 158 byte

Ispirato dalla risposta dell'utente2485710 .

È necessario sintonizzare il terminale per abbinare esattamente i colori.

eval "$(base64 -d<<</AD/8AAD9Wm/2amr2Wpq1qlX/qqv9RX/1RRXVQBVpIIaqAAqoAAK8DwP1f9XVf9V|xxd -b -c3 -g0|cut -c10-33|sed $'s/../\e[4$[2#&+1]m \e[0m/g;s/^/echo /')"

questo è quello che vedo . sto facendo qualcosa di sbagliato?
Ardnew,

2
@ardnew: BSD base64 usi -Dper decodificare e -dper il debug .
Dennis,

2

Tcl 298

package require base64
set d [base64::decode AVUABVVUCr7ALv78Lr+/K/6oA//wCmoAKmmoqlWq+ddv/VV/9VVfBUFQKgCoqgCq]
binary scan $d B* z
set i 0
foreach {a b} [split $z ""] {
if {$i % 12 == 0} {puts "\033\[0m"}
puts -nonewline "\033\[4[string map {00 4 01 1 10 2 11 3} $a$b];m  "
incr i
}
puts "\033\[0m"

È un'immagine a 2 bit per pixel nella base 64. I pixel sono mappati su codici di escape ansi.

inserisci qui la descrizione dell'immagine


Senza nemmeno provarci, il tuo codice sembra un po 'giocabile: tio.run/…
sergiol

2

JavaScript - 256 caratteri (161 obfusc-a-tweeted)

d=v=>{for(i=v&15;i--;)O.innerHTML+=`<i style="color:#${'6B8CFF6A6B04B13425E39D25'.substr(x%4*6,6)}">█</i>`+(++f%12?'':'<br>');x++},f=x=0,[..."fhilsswsssuss££cgÓdcddc¤g£stcucds³c¹cefefcc¤c§"].map(v=>(d(v=v.charCodeAt(0)-99),d(v>>4)))
<p id=O>

inserisci qui la descrizione dell'immagine

Metodo:

  1. Utilizzando il bitmasking, una stringa 63x8-bit fornisce un array di valori 126x4-bit costituito da numeri nell'intervallo 0-9. (Frustrantemente ... ha salvato 63 caratteri andando a 4 bit, ma ha speso 50 caratteri spacchettandoli di nuovo lol. Ancora, 13 caratteri sono 13 caratteri! :-)
  2. I 4 colori della vernice vengono ciclati nell'ordine: B, G, R, O. Ad ogni iterazione, vengono visualizzati 0-9 div per il colore corrente (con una interruzione di riga ogni 12)

Per determinare l'ordine ottimale per il ciclo di colore, ho eseguito l'algoritmo di compressione con i dati grezzi per ognuna delle 24 permutazioni di [R, G, B, O] e ho selezionato quello che produceva l'output più breve (126 era il migliore, il meno ottimale era circa 150-qualcosa)

ETA lo ha scoperto solo dopo aver letto le altre risposte usando obfusca-tweet ...

eval(unescape(escape`𩀽𭠽🡻𩡯𬠨𪐽𭠦𜐵𞱩𛐭𞰩𣰮𪑮𫡥𬡈𥁍𣀫👠🁩𘁳𭁹𫁥🐢𨱯𫁯𬠺𘰤𮰧𝡂𞁃𡡆𝡁𝡂𜀴𠠱𜰴𜠵𡐳𞑄𜠵𙰮𬱵𨡳𭁲𚁸𙐴𚠶𛀶𚑽𘠾ﶈ�𛱩🡠𚰨𚰫𩠥𜐲🰧𙰺𙰼𨡲🠧𚐻𮀫𚱽𛁦👸🐰𛁛𛠮𛠢𩡨𪑬𬱳𭱳𬱳𭑳𬲣𸱣𩳓𩁣𩁤𨲤𩲣𬱴𨱵𨱤𬲳𨲹𨱥𩡥𩡣𨲤𨲧𘡝𛡭𨑰𚁶🐾𚁤𚁶👶𛡣𪁡𬡃𫱤𩑁𭀨𜀩𛐹𞐩𛁤𚁶🠾𝀩𚐩𒠼𬀠`.replace(/u../g,'')))

Ulteriori idee. - Prova l'intervallo di dati a 3 bit 0-6, con il raro 7,8,9 che guadagna 4 extra ciascuno: 60000N. - controllare le permutazioni del ciclo di colore in tutte le direzioni e velocità diverse da quelle orizzontali di un pixel alla volta. - prova più passaggi di rendering in modo che i colori possano essere stratificati.


D'altronde è appena emerso che si tratta di caratteri non di ciao, quindi probabilmente avrebbero dimezzato i dati usando i caratteri a 16 bit.
Bumpy,

1

Javascript, 253 240 238 236

Fonte di Obfuscatweet - 253 240 238 236

document.write(unescape(escape('🁳𨱲𪑰𭀾𘠵𫐲𫰹𫑨𜰰𞐷𫁯𩰹𜐰𜑰𪰹𮡰𝱵𞑶𭁸𭰹𜱱𭐸𞐸𝡷𭰹𭑯𩱫𞐳𨱳𬁨𞐶𪡭𪡥𞐶𬁬𫡵𞐶𭠷𮐲𞑭𝐸𜀹𭁨𮡯𞐳𨡥𨰵𘠮𬱰𫁩𭀨𞐩𛡦𫱲𡑡𨱨𚁦𭑮𨱴𪑯𫠨𨰩𮱤👤𫱣𭑭𩑮𭀻𨰽𬁡𬡳𩑉𫡴𚁣𛀳𝠩𛡴𫱓𭁲𪑮𩰨𝀩𞱷𪁩𫁥𚁣𛡬𩑮𩱴𪀼𜐲𚑣🐢𜀢𚱣𞱣𛡳𬁬𪑴𚀢𘠩𛡦𫱲𡑡𨱨𚁦𭑮𨱴𪑯𫠨𭠩𮱤𛡷𬡩𭁥𚀢🁰𘁳𭁹𫁥🐧𩁩𬱰𫁡𮐺𪑮𫁩𫡥𞱰𨑤𩁩𫡧𞠹𞱢𨑣𪱧𬡯𭑮𩀺𘰢𚱛𘠶𠠸𠱆𡠢𛀢𝡁𝡂𜀴𘠬𘡅𜰹𡀲𝐢𛀢𠠱𜰴𜠵𘡝𦰫𭡝𚰢𙰾🀯𬀾𘠩𯐩𞱤𛡷𬡩𭁥𚀢🁢𬠾𘠩𯐩🀯𬱣𬡩𬁴🠠').replace(/uD./g,'')))

Non filtrato - 395 370 365 361

<script>"5m2o9mh3097log9101pk9zp7u9vtxw93qu8986ww9uogk93csph96jmje96plnu96v7y29m5809thzo93bec5".split(9).forEach(function(c){d=document;c=parseInt(c,36).toString(4);while(c.length<12)c="0"+c;c.split("").forEach(function(v){d.write("<p style='display:inline;padding:9;background:#"+["6B8CFF","6A6B04","E39D25","B13425"][+v]+"'></p>")});d.write("<br>")})</script>

Grazie a @compass per i <p>trucchi tag e @xem per 2 (5) caratteri.

dimostrazione

Converte i dati dalla base 36 e li converte in base 4.


Non riesco a provarlo, ma non credo che padding:9fa nulla senza un'unità dopo. È inoltre possibile utilizzare un elemento a lettera singola come ao qche è implicitamente in linea, anziché p.
NinjaBearMonkey,

@hsl Ho aggiornato il link demo e funziona bene almeno su Chrome, Firefox e Safari su Mac.
Spuntino

-2 byte: sostituisci "|" di 9 nella stringa e nella divisione. Inoltre, usi "document.write" 3 volte, dovresti metterlo in un var per salvare, come, 24b)
xem

@xem Grazie per avermi ricordato il trucco per la divisione dei numeri. E poiché non possiamo assegnare document.writealla variabile (dovremmo usare document.write.bind(document)), il mio meglio era assegnare documentalla variabile.
Spuntino il

oppure, puoi farlo la prima volta: (d = document) [w = "write"] (/ * cose da scrivere * /), e basta farlo dopo: d [w] ("Hi")
xem

1

JavaScript ES6 (HTML + CSS), 199307 3195 3630

Usando Obfusc-a-tweet :

eval(unescape(escape('𬰽𦱝𒠧𜰹𮡲𬀳𝁤𩡬𜱪𩱴𜐴𨡷𭐵𝁢𪱣𩠴𝱰𜡨𜱦𫁹𭀳𪑮𪀱𝀵𝀸𞐶𫑳𫱡𞑰𩡥𝰹𭁺𝑲𞑤𝁢𜰳𝁨𩁸𝀵𩀴𞐶𫠹𩱱𙰮𫑡𭁣𪀨𛰮𮰵𯐯𩰩𛡦𫱲𡑡𨱨𚀨𫠬𪐩🐾𦰮𛠮𬁡𬡳𩑉𫡴𚁮𛀳𝠩𛡴𫱓𭁲𪑮𩰨𝀩𧐮𩡯𬡅𨑣𪀨𚁭𛁪𚐽🡳𛡰𭑳𪀨𪠫𜐫𙱰𮀠𙰫𚀫𪐫𜐩𚰧𬁸𘀣𙰫𦰧𠠱𜰴𜠵𙰬𙰶𠠸𠱆𡠧𛀧𝡁𝡂𜀴𙰬𙱅𜰹𡀲𝐧𧑛𚱭𧐩𚐩𒡤𫱣𭑭𩑮𭀮𭱲𪑴𩐨𙰼𬀠𬱴𮑬𩐽𘡷𪑤𭁨𞠱𬁸𞱨𩑩𩱨𭀺𜑰𮀻𨡯𮀭𬱨𨑤𫱷𞠧𚱳𚰧𘠧𚐠').replace(/uD./g,'')))

Questo visualizza lo sprite senza usare immagini o elementi multipli; utilizza semplicemente la box-shadowproprietà CSS per creare ogni pixel. Provalo su http://jsbin.com/pozohiyezo/ . Questa versione non offuscata è di 307 caratteri :

s=[]
'39zrp34dfl3jgt14bwu54bkcf47p2h3flyt3inh1454896msoa9pfe79tz5r9d4b334hdx45d496n9gq'.match(/.{5}/g).some((n,i)=>[...parseInt(n,36).toString(4)].forEach((m,j)=>s.push(j+1+'px '+(+i+1)+'px #'+['B13425','6B8CFF','6A6B04','E39D25'][+m])))
document.write('<p style="width:1px;height:1px;box-shadow:'+s+'"')

Questa è la versione HTML originale e semplice. Guardalo in azione su http://jsfiddle.net/gfeLn1ey/1/ .

<p style="width:1px;height:1px;box-shadow:4px 1px 0 #B13425,5px 1px 0 #B13425,6px 1px 0 #B13425,7px 1px 0 #B13425,8px 1px 0 #B13425,12px 1px 0 #6B8CFF,3px 2px 0 #B13425,4px 2px 0 #B13425,5px 2px 0 #B13425,6px 2px 0 #B13425,7px 2px 0 #B13425,8px 2px 0 #B13425,9px 2px 0 #B13425,10px 2px 0 #B13425,11px 2px 0 #B13425,12px 2px 0 #6B8CFF,3px 3px 0 #6A6B04,4px 3px 0 #6A6B04,5px 3px 0 #6A6B04,6px 3px 0 #E39D25,7px 3px 0 #E39D25,8px 3px 0 #6A6B04,9px 3px 0 #E39D25,12px 3px 0 #6B8CFF,2px 4px 0 #6A6B04,3px 4px 0 #E39D25,4px 4px 0 #6A6B04,5px 4px 0 #E39D25,6px 4px 0 #E39D25,7px 4px 0 #E39D25,8px 4px 0 #6A6B04,9px 4px 0 #E39D25,10px 4px 0 #E39D25,11px 4px 0 #E39D25,12px 4px 0 #6B8CFF,2px 5px 0 #6A6B04,3px 5px 0 #E39D25,4px 5px 0 #6A6B04,5px 5px 0 #6A6B04,6px 5px 0 #E39D25,7px 5px 0 #E39D25,8px 5px 0 #E39D25,9px 5px 0 #6A6B04,10px 5px 0 #E39D25,11px 5px 0 #E39D25,12px 5px 0 #E39D25,2px 6px 0 #6A6B04,3px 6px 0 #6A6B04,4px 6px 0 #E39D25,5px 6px 0 #E39D25,6px 6px 0 #E39D25,7px 6px 0 #E39D25,8px 6px 0 #6A6B04,9px 6px 0 #6A6B04,10px 6px 0 #6A6B04,11px 6px 0 #6A6B04,12px 6px 0 #6B8CFF,4px 7px 0 #E39D25,5px 7px 0 #E39D25,6px 7px 0 #E39D25,7px 7px 0 #E39D25,8px 7px 0 #E39D25,9px 7px 0 #E39D25,10px 7px 0 #E39D25,12px 7px 0 #6B8CFF,3px 8px 0 #6A6B04,4px 8px 0 #6A6B04,5px 8px 0 #B13425,6px 8px 0 #6A6B04,7px 8px 0 #6A6B04,8px 8px 0 #6A6B04,12px 8px 0 #6B8CFF,2px 9px 0 #6A6B04,3px 9px 0 #6A6B04,4px 9px 0 #6A6B04,5px 9px 0 #B13425,6px 9px 0 #6A6B04,7px 9px 0 #6A6B04,8px 9px 0 #B13425,9px 9px 0 #6A6B04,10px 9px 0 #6A6B04,11px 9px 0 #6A6B04,12px 9px 0 #6B8CFF,1px 10px 0 #6A6B04,2px 10px 0 #6A6B04,3px 10px 0 #6A6B04,4px 10px 0 #6A6B04,5px 10px 0 #B13425,6px 10px 0 #B13425,7px 10px 0 #B13425,8px 10px 0 #B13425,9px 10px 0 #6A6B04,10px 10px 0 #6A6B04,11px 10px 0 #6A6B04,12px 10px 0 #6A6B04,1px 11px 0 #E39D25,2px 11px 0 #E39D25,3px 11px 0 #6A6B04,4px 11px 0 #B13425,5px 11px 0 #E39D25,6px 11px 0 #B13425,7px 11px 0 #B13425,8px 11px 0 #E39D25,9px 11px 0 #B13425,10px 11px 0 #6A6B04,11px 11px 0 #E39D25,12px 11px 0 #E39D25,1px 12px 0 #E39D25,2px 12px 0 #E39D25,3px 12px 0 #E39D25,4px 12px 0 #B13425,5px 12px 0 #B13425,6px 12px 0 #B13425,7px 12px 0 #B13425,8px 12px 0 #B13425,9px 12px 0 #B13425,10px 12px 0 #E39D25,11px 12px 0 #E39D25,12px 12px 0 #E39D25,1px 13px 0 #E39D25,2px 13px 0 #E39D25,3px 13px 0 #B13425,4px 13px 0 #B13425,5px 13px 0 #B13425,6px 13px 0 #B13425,7px 13px 0 #B13425,8px 13px 0 #B13425,9px 13px 0 #B13425,10px 13px 0 #B13425,11px 13px 0 #E39D25,12px 13px 0 #E39D25,1px 14px 0 #6B8CFF,2px 14px 0 #6B8CFF,3px 14px 0 #B13425,4px 14px 0 #B13425,5px 14px 0 #B13425,6px 14px 0 #6B8CFF,7px 14px 0 #6B8CFF,8px 14px 0 #B13425,9px 14px 0 #B13425,10px 14px 0 #B13425,11px 14px 0 #6B8CFF,12px 14px 0 #6B8CFF,1px 15px 0 #6B8CFF,2px 15px 0 #6A6B04,3px 15px 0 #6A6B04,4px 15px 0 #6A6B04,5px 15px 0 #6B8CFF,6px 15px 0 #6B8CFF,7px 15px 0 #6B8CFF,8px 15px 0 #6B8CFF,9px 15px 0 #6A6B04,10px 15px 0 #6A6B04,11px 15px 0 #6A6B04,12px 15px 0 #6B8CFF,1px 16px 0 #6A6B04,2px 16px 0 #6A6B04,3px 16px 0 #6A6B04,4px 16px 0 #6A6B04,5px 16px 0 #6B8CFF,6px 16px 0 #6B8CFF,7px 16px 0 #6B8CFF,8px 16px 0 #6B8CFF,9px 16px 0 #6A6B04,10px 16px 0 #6A6B04,11px 16px 0 #6A6B04,12px 16px 0 #6A6B04,6px 6px 0 5px #6B8CFF"

TIL, non puoi chiudere un tag <p :)
xem

questo codice può avere un'ottima compressione in uno strumento come regpack. Ecco un esempio in 729b (JS è usato per scrivere l'HTML, però): goo.gl/7fF7kx
xem

@xem In realtà non avevo nemmeno preso in considerazione l'idea di generare il codice con JS, ma sono stato in grado di fare acquisti molto più brevi seguendo lo schema del codice.
NinjaBearMonkey,

1

Javascript, 256 o 245 252 o 241

256

document.write("k6n56kcraqlaqasasjaqbsasibtdlstlb2cmc2b2cid5dra2q3q2au7u55rj4j4kclcidld".replace(/./g,function(x){return new Array((x=parseInt(x,36))&7).join("<li style=padding:4%;float:left;background:#"+['B13425','6A6B04','6B8CFF','E39D25'][x>>3]+">")}))

È triste sovrascrivere 256, ma 245 è possibile se si utilizzano caratteri non stampabili:

document.write(btoa(">§ç©­ª¥j¦¬jÈÚ©»²&ív[-½ÍÙÈåÚÚÚ­êÙ«»»køÉ\\Ù]").replace(/./g,function(x){return new Array((x=parseInt(x,36))&7).join("<li style=padding:4%;float:left;background:#"+["B13425","6A6B04","6B8CFF","E39D25"][x>>3]+">")}))

Si è verificato un problema con l'invio della soluzione con caratteri non stampabili. L'argomento di btoadeve essere il risultato di atob("ij6n56kcraqlaqasasjaqbsasibtdlstlb2cmc2b2cid5dra2q3q2au7u55rj4j4kclcidld")con 1 simbolo di lunghezza aggiunto per evitare la barra rovesciata.

Accorcia le due soluzioni con 4 simboli: non abbiamo bisogno di novità per la creazione di array.

252

document.write("k6n56kcraqlaqasasjaqbsasibtdlstlb2cmc2b2cid5dra2q3q2au7u55rj4j4kclcidld".replace(/./g,function(x){return Array((x=parseInt(x,36))&7).join("<li style=padding:4%;float:left;background:#"+['B13425','6A6B04','6B8CFF','E39D25'][x>>3]+">")}))

241

document.write(btoa("©ùêG+j©Z©«²6ªnƬ»]Ëeog&sför'yv¶¶«z¶jîîçãâ>$rVÚÙ]").replace(/./g,function(x){return Array((x=parseInt(x,36))&7).join("<li style=padding:4%;float:left;background:#"+['B13425','6A6B04','6B8CFF','E39D25'][x>>3]+">")}))

Non è necessario scappare in questa versione. L btoa'argomento è il risultato diatob("k6n56kcraqlaqasasjaqbsasibtdlstlb2cmc2b2cid5dra2q3q2au7u55rj4j4kclbaidld")


Ho notato il problema non stampabile su questo e anche la mia ultima sfida. Ho pensato che fossero solo i caratteri 8, 9 e 13 se questo aiuta (anche se potrei facilmente sbagliarmi)
Bumpy

1

Perl, 266 260 257 249 245 byte

$_="444111114444441111111114442223323444423233323334423223332333422333322224444333333344442212224444422212212224222211112222332131131233333111111333331111111133441114411144422244442224222244442222";s/\d/\033[4$&m  /g;s/.{84}/$&\033[00m\n/g;print

Utilizza un approccio simile alla soluzione bash di user2485710 per scrivere un output in stile VT100. Elimina la N esplicita per la nuova riga inserendo una nuova riga ogni 12 "vt100 pixel", 12 * 7 = 84.


1

SmileBASIC, 147 136 caratteri

P$="xxxxxxxx
FOR I=0TO 191C=ASC("xxxxxxxxxxxxxxxxxxxxxxxx"[I/8])>>I MOD 8*2AND 3GPSET I/16,15AND I,ASC(P$[C*2])<<16OR ASC(P$[C*2+1])NEXT

Uscita (ritagliata): immagine dello schermo

Ho sostituito tutti i caratteri nelle stringhe di dati con x's, ecco i codici dei caratteri (in UCS-2):
P$(Tavolozza): FF6B,8CFF,FFB1,3425,FF6A,6B04,FFE3,D925
Dati immagine:0000,83F8,0A80,A3FA,8BE4,A5EA,BEA5,A55A,7EE5,0575,BFF5,0156,BFF5,0156,BBA5,0575,3AF4,A55A,3BC4,A5EA,0BC4,A3FA,0300,83F8

La palette è memorizzata in una stringa, ogni colore (32 bit) è memorizzato in due caratteri (16 bit ciascuno). I dati di immagine (2 bit per pixel) sono memorizzati in un'altra stringa (8 pixel per carattere)
Fortunatamente, la sfida è segnata in caratteri, poiché questo file è significativamente più grande se salvato in UTF-8.


1

05AB1E , 87 byte (non concorrenti)

•8,vkJíÝ1¢tt6,9XÂck$XSãõO©Ú"›qf®¸Ì#}„K0ÝCìxý}É~ð_áú•4BSvy•3«WKyÛòèz*Ðeb•16B6ôè'#ì})12ô»

Provalo online!

Uscite:

#B13425 #B13425 #B13425 #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #B13425 #B13425 #B13425 #B13425
#B13425 #B13425 #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #B13425
#B13425 #B13425 #6A6B04 #6A6B04 #6A6B04 #E39D25 #E39D25 #6A6B04 #E39D25 #B13425 #B13425 #B13425
#B13425 #6A6B04 #E39D25 #6A6B04 #E39D25 #E39D25 #E39D25 #6A6B04 #E39D25 #E39D25 #E39D25 #B13425
#B13425 #6A6B04 #E39D25 #6A6B04 #6A6B04 #E39D25 #E39D25 #E39D25 #6A6B04 #E39D25 #E39D25 #E39D25
#B13425 #6A6B04 #6A6B04 #E39D25 #E39D25 #E39D25 #E39D25 #6A6B04 #6A6B04 #6A6B04 #6A6B04 #B13425
#B13425 #B13425 #B13425 #E39D25 #E39D25 #E39D25 #E39D25 #E39D25 #E39D25 #E39D25 #B13425 #B13425
#B13425 #B13425 #6A6B04 #6A6B04 #6B8CFF #6A6B04 #6A6B04 #6A6B04 #B13425 #B13425 #B13425 #B13425
#B13425 #6A6B04 #6A6B04 #6A6B04 #6B8CFF #6A6B04 #6A6B04 #6B8CFF #6A6B04 #6A6B04 #6A6B04 #B13425
#6A6B04 #6A6B04 #6A6B04 #6A6B04 #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6A6B04 #6A6B04 #6A6B04 #6A6B04
#E39D25 #E39D25 #6A6B04 #6B8CFF #E39D25 #6B8CFF #6B8CFF #E39D25 #6B8CFF #6A6B04 #E39D25 #E39D25
#6A6B04 #6A6B04 #6A6B04 #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6A6B04 #6A6B04 #6A6B04
#6A6B04 #6A6B04 #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6B8CFF #6A6B04 #6A6B04
#B13425 #B13425 #6B8CFF #6B8CFF #6B8CFF #B13425 #B13425 #6B8CFF #6B8CFF #6B8CFF #B13425 #B13425
#B13425 #6A6B04 #6A6B04 #6A6B04 #B13425 #B13425 #B13425 #B13425 #6A6B04 #6A6B04 #6A6B04 #B13425
#6A6B04 #6A6B04 #6A6B04 #6A6B04 #B13425 #B13425 #B13425 #B13425 #6A6B04 #6A6B04 #6A6B04 #6A6B04

Perché 05AB1E non può fare colori o grafica di alcun tipo ... Se questo non è accettabile, lo cancellerò.


Potresti scrivere un wrapper Bash e dire che la tua soluzione èBash + 05AB1E
Pavel

1
@Pavel Stavo pensando di farlo, immagino che andrò ad accoppiare questa soluzione con qualcun altro; P.
Magic Octopus Urn

Non posso dire che "vince" ma per favore tienilo, dato che è un ottimo punteggio di compressione :)
xem

0

Sinclair BASIC - 573 byte

OK, quindi lo spettro non può mostrare i colori RGB come specificato, quindi ho usato il più vicino possibile.

10 let x=0:let y=0:let i=0
20 let a$="1c2e1f2i1c4c6b461d4646c46c1b464b6c46c14b6d4d1d6g1d4b24c1e4c24b24c14d2d4d6b4262b6246e2f6e2c1b2c6b1b2c1b2c1c4c1d4c14d1d4d"
30 let l=len a$
40 let i=i+1:let c=1:let p=0:let k=val a$(i)
50 if a$(i+1)>="a" then let c=code a$(i+1)-96:let i=i+1
60 print at y,x;ink k;"\::":let p=p+1:let x=x+1:if x=12 then let x=0:let y=y+1
70 if p<c then goto 60
80 if i<l then goto 40

La stringa è il colore (1 = blu, 2 = rosso ecc.) Seguito da una lettera per rappresentare quante volte quel blocco si ripete (prendendo il valore ASCII meno 96 per diventare 1,2,3 ecc.). Un numero senza una lettera dopo che disegna solo un blocco.

"\::"nella riga 60 è come inserire la grafica in un editor di testo prima di trasformarla in un file TAP da caricare nell'emulatore Fuse. (Mostra come un'immagine a blocchi solidi sullo schermo).

Ogni parola chiave è un byte in Sinclair BASIC, dopo che è stato generato un conteggio da un comando PEEK.

È un Mario


0

Perl - 399 171 byte

use MIME::Base64;$_='R0lGODdhDAAQAKEEAGuM/+OdJWprBLE0JSwAAAAADAAQAAACNoSHaAvpaoQMQQRmLdUXZM55XCUJDIVSmDCUjMhKrQSzSamxAbKP+5P6PQaqBiSxcCVpuJWkAAA7';
print decode_base64($_)

Scrive il file gif su stdout.

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.