Нехай 4-й буде з вами!

24

На честь дня Зоряних воєн , напишіть програму для відображення наступного тексту, прокручуючи так, як відкриття сканування "Зоряних війн" :

It  is  a  period  of  civil war.  Rebel
spaceships,   striking  from   a  hidden
base,  have   won  their  first  victory
against the evil Galactic Empire.

During  the battle,  Rebel spies managed
to  steal  secret  plans to the Empire's
ultimate   weapon,  the  Death Star,  an
armored   space  station   with   enough
power to destroy an entire planet.

Pursued by the Empire's sinister agents,
Princess  Leia  races  home  aboard  her
starship,  custodian of the stolen plans
that  can save  her people  and  restore
freedom to the galaxy...

Ви можете виводити анімований GIF або показувати його програмі. Вихід повинен показувати наступне:

  • Текст повинен починатися знизу зображення / дисплея
  • Він повинен прокручуватися вгору, поки не досягне вершини. Щоб 30фрагмент тексту дістався до вершини, потрібно не менше секунд. Анімація повинна тривати, поки весь текст не досягне верху.
  • На цій відстані текст повинен бути меншим, поки він не стане меншим за 1/3розмір (довжина та шрифт)
  • Текст повинен бути нахилений відповідно до цього кута.
  • Текст повинен бути виправданим ліворуч та праворуч. Наведений текст вже виправданий для однобічних шрифтів, проте ви можете видалити зайві пробіли (а не нові рядки) та обґрунтувати їх самостійно.
  • Текст повинен бути жовтим
  • Фон повинен бути чорним

У цьому відео показано відкриття сканування.

Удачі, і нехай четвертий буде з вами !

code-golf  graphical-output  kolmogorov-complexity  animation 
— Джастін
джерело
5
А як щодо "Нехай четвертий буде з тобою"?
— TheDoctor
@TheDoctor Це було, але я виправив помилку. Ви серйозно думаєте, що я повинен піти на подвійний каламбур?
— Джастін
3
Далі важко буде це зробити в.
— Доктор
4
@TheDoctor "Зробити це в Forth, це важко" - Yoda'd це для вас.
— MikeTheLiar
Одне цікаве в цьому питанні: перед публікацією система попередила мене, що це може бути закрито як "занадто суб'єктивне".
— Джастін

Відповіді:

8

HTML, 762

<div><pre>It  is  a  period  of  civil war.  Rebel
spaceships,   striking  from   a  hidden
base,  have   won  their  first  victory
against   the   evil   Galactic  Empire.

During  the battle,  Rebel spies managed
to  steal  secret  plans to the Empire's
ultimate   weapon,  the  Death Star,  an
armored   space  station   with   enough
power   to  destroy  an  entire  planet.

Pursued by the Empire's sinister agents,
Princess  Leia  races  home  aboard  her
starship,  custodian of the stolen plans
that  can save  her people  and  restore
freedom to the galaxy...</pre></div><style>pre{transform:perspective(300px)rotateX(25deg);position:absolute;left:99px;color:yellow;animation:a 30s linear}@keyframes a{100%{font-size:0px}}body{background:black}</style>

Різновид копченого (читати: надзвичайно похмурий: P).

Ось JSFiddle (з -webkit-доданими префіксами постачальника, щоб він працював у Chrome).

— Дверна ручка
джерело
Я щойно зрозумів, що надмірно переживаю своє виправдання. Перші два абзаци не потребують додаткових пробілів в останньому рядку.
— Джастін
1
Також я не знаю про це; повзання ковзає вліво, а не тільки вгору. Я не приймаю цього. Зручність: добре, але ковзання не просто вгору: не гаразд.
— Джастін
3
Це так незначно для вас? Мені це дуже видно. Можливо, він більш помітний у Chrome. Для мене крайній лівий край залишається в тій же лівій частині, навіть із дуже маленьким текстом, тому крайній правий рухається дуже помітно вліво. У цьому випадку я з цим добре. Цікаво, як це насправді виглядає ....
— Джастін
1
Це повинно працювати на firefox?
— П'єр Арло
1
Будь-який шанс ви можете змусити його працювати у Firefox?
— рубін
37

HTML / CSS, 1047

Я міг би набагато більше гольфу, видаливши -webkitпрефікси тощо, але це зробить поки що:

<html><head><style>body{font-family:sans-serif;background:#000;margin:0
auto;height:400px;width:800px;text-align:justify;position:relative;perspective:
150px;-webkit-perspective:150px;}div{font-size:63px;line-height:63px;color:#ee6;
position:absolute;-webkit-transform:rotateX(70deg);transform:rotateX(70deg);}p{
position:relative;-webkit-animation:s 90s linear forwards;animation:s 90s linear
forwards;}@-webkit-keyframes s{from{top:800px;}to{top:-2000px;}}@keyframes
s{from{top:800px;}to{top:-2000px;}}</style><body><div><p>It is a period of civil
war. Rebel spaceships, striking from a hidden base, have won their first victory
against the evil Galactic Empire.</p><p>During the battle, Rebel spies managed to
steal secret plans to the Empire's ultimate weapon, the DEATH STAR, an armored
space station with enough power to destroy an entire planet.</p><p>Pursued by
the Empire's sinister agents, Princess Leia races home aboard her starship,
custodian of the stolen plans that can save her people and restore freedom to
the galaxy...</p></div>

Демонстраційна демонстрація

— грізний косинець
джерело
1
Чи не порушує це правило "однак ви можете видалити зайві пробіли (а не нові рядки) " @Quincunx?
— Дверна ручка
2
@PaulDraper працює для мене (в Chrome)
— Мартін Ендер
1
@ m.buettner, дивно. Chrome 34 на Ubuntu 12.04 . Можливо, я подам помилку в Chrome через це ...
— Пол Дрейпер
6
Не знаю чому, але це не працює у FireFox 29.0 на Ubuntu 13.10 . Не пов’язане з проблемою @ PaulDraper (я просто бачу абсолютно чорний екран, з деякими випадковими мерехтливими та тонкими жовтими смужками посередині екрану)
— IQAndreas
1
-1, що не є правильним HTML-файлом. Якщо ви цілеспрямовано хотіли, щоб це працювало лише з певною версією браузера, тоді вам слід включити ім'я та версію браузера в мовну специфікацію.
— Бакуріу
20

HTML + CSS + SVG 1614 1625

Я хотів також бути візуально правильним. SVG використовується для маскування та анімації. HTML + CSS, що використовується для перетворень. Я не перевірив, чи текст набирає розмір рівно 1/3.

Рекомендований перегляд у Chrome через -webkit-префікс. Потрібні перетворення CSS 3D для роботи; Вам може знадобитися відкрити chrome://flagsта вибрати "Перезапис списку візуалізації програмного забезпечення".

Доданий рахунок включає нові рядки та пробіли.

Оновлення 1: Додавання підтримки для Firefox та інших браузерів, яким не потрібні префікси. Додано 11 байт навіть після подальшої очистки. Очищення було можливим, оскільки браузери, на щастя, інтерпретують SVG, використовуючи парсери HTML-розбиття, на відміну від парсерів-компіляторів XML.

Наживо

<div id=a>                                                                      
<div id=b>                                                                      
<svg width=760 height=1000>                                                     
<g mask=url(#m)>                                                                
<g transform=translate(0,0)>                                                    
<animateTransform attributeName=transform type=translate dur=50 fill=freeze from=0,700 to=0,-450 />
<foreignObject width=760 height=800>                                            
<div style=width:740; >                                                         
<p>It is a period of civil war. Rebel                                           
spaceships, striking from a hidden                                              
base, have won their first victory                                              
against the evil Galactic Empire.</p>                                           
<p>During the battle, Rebel spies managed                                       
to steal secret plans to the Empire's                                           
ultimate weapon, the DEATH STAR, an                                             
armored space station with enough                                               
power to destroy an entire planet.</p>                                          
</div>                                                                          
<p>Pursued by the Empire's sinister agents,                                     
Princess Leia races home aboard her                                             
starship, custodian of the stolen plans                                         
that can save her people and restore                                            
freedom to the galaxy...</p>                                                    
</foreignObject>                                                                
</g>                                                                            
</g>                                                                            
<defs>                                                                          
<linearGradient id=g x1=0 y1=0% x2=0 y2=100%>                                   
<stop offset=0% />                                                              
<stop offset=25% />                                                             
<stop offset=35% stop-color=#fff />                                             
<stop offset=100% stop-color=#fff />                                            
</linearGradient>                                                               
<mask id=m>                                                                     
<rect width=100% height=100% fill=url(#g) />                                    
</mask>                                                                         
</defs>                                                                         
</svg>                                                                          
</div>                                                                          
</div>                                                                          
<style>                                                                         
body {                                                                          
margin: 0;                                                                      
width: 100%; height: 100%;                                                      
perspective: 700px;                                                             
-webkit-perspective: 700px;                                                     
background: url(http://vucica.net/s.php);                                       
}                                                                               
#a {                                                                            
position: absolute;                                                             
width: 100%;                                                                    
height: 700px;                                                                  
bottom: 0;                                                                      
transform-style: preserve-3d;                                                   
}                                                                               
#b {                                                                            
margin: auto auto auto auto;                                                    
width: 760px; height: 100%;                                                     
font-family: Courier; font-weight: bold; text-align: justify; font-size: 24pt;  
color: yellow;                                                                  
overflow: hidden;                                                               
transform: rotateX(45deg);                                                      
-webkit-transform: rotateX(45deg);                                              
}                                                                               
svg {                                                                           
position: absolute;                                                             
width: 760px;                                                                   
height: 100%;                                                                   
}
— Іван Вучиця
джерело
1
Будь-який шанс ви можете змусити його працювати у firefox?
— рубін
Я б припустив, як / -webkit / -moz / зробив би (і поголити ще кілька символів!), Але я погляну.
— Іван Вучиця
Зроблено. (І я навіть не особливо великий фанат "Зоряних воєн ..."
— Іван Вучиця
4

PerlMagick, 661 програма + 547 текстового файлу = 1208

Занадто пізно до ювілею, але ОП сказав "анімований GIF", тож ...

TL; DR: посилання на анімований GIF (5 Мб, 480 * 240, 1360 кадрів) (є помилковий початок кожного разу, коли я спробую це посилання зараз - його немає у файлі, можливо, спробуйте завантажити його спочатку. І незначне мерехтіння ... можливо, я поясню це пізніше, - не шматок пирога, вся ідея IM та GIF;)).

З новими рядками та відступами для читання:

use Image::Magick;
$i=Image::Magick->new(
    depth=>8,
    page=>'480x440+20+0',
    background=>'#000',
    fill=>'#ff0',
    font=>'UbuntuMono-R.ttf',
    pointsize=>22
);
$i->Read('text:-');
$j=$i->Clone;
$i->Extent(y=>-440);
for(1..680){
    ($i->[2*$_]=$j->Clone)->Extent(y=>$_-440);
    ($i->[2*$_-1]=$i->[2*$_]->Clone)
        ->Composite(image=>$i->[2*$_-2],compose=>'Blend',blend=>50)
}
$i->Distort(method=>'Perspective','virtual-pixel'=>'Background',
    points=>[0,0,180,180,480,0,300,180,0,420,0,420,480,420,480,420]);
$i->Extent(geometry=>'480x240+0+200');
$g=Image::Magick->new(size=>'480x150');
$g->Read('gradient:#000-#fff');
$i->Composite(image=>$g,compose=>'Multiply');
$i->Set(delay=>10,loop=>0);
$i->Animate()

Він читає текст із STDIN, але геометрія жорстко закодована, тому, ймовірно, будь-який інший текст не був би гарною ідеєю. Це може бути коротше, але я додав затухання тексту, коли він добирається до вершини, і, просуваючись вгору на один піксель, виникла похмура анімація, тому я зробив деяку інтерполяцію. Він їсть 2,2 Гб оперативної пам’яті та займає 2-3 хвилини на робочому столі 8 років (і, ймовірно, не працюватиме для людей з Windows), тож ось як отримати GIF: замінити (або додати до нього) останній рядок (створює 200+ Мб файл):

$i->Write('out.miff')

А потім біжи 

convert -size 8x1 gradient:black-yellow palette8.png
convert +dither out.miff -remap palette8.png out+.gif
convert +dither out+.gif -layers optimize out++.gif

Компроміси між якістю (розмір палітри тощо) та кінцевим розміром GIF очевидні. Дзвінок$i->Remap з PerlMagick безпосередньо не працюють, ймовірно, помилка, це займає години, як це (я думаю) намагається +remapспочатку. Насправді, розумний (лише трохи більший) розмір GIF можна досягти без глобальної палітри, але за допомогою $i->Quantizeцього зменшується кожна локальна палітра кадру до потрібного розміру. О, і без жодних оптимізацій палітри, тобто збереження GIF з вищезазначеного сценарію "як є", створює близько 9 Мб GIF-файлу.

— користувач2846289
джерело
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.