AppleSauce Fader

11

В свое время все 1337 детей использовали текстовые фейдеры в чатах. Я не знаю о вас, ребята, но я хочу чувствовать себя круто, как они. Единственная проблема заключается в том, что их старые скрипты и приложения были тесно связаны с программным обеспечением, для которого они были созданы, поэтому я не могу просто использовать эту удивительную функциональность там, где я хочу. Я также хочу, чтобы решение было легко переносимым, поэтому вам нужно сделать код как можно меньшего размера, чтобы он поместился на моей дискете (я бы предпочел нести только одну дискету, но если ваш исходный код слишком велик) Я могу нести больше одного : P ).

вход

  • Список цветов (rgb, hex, имена и т. Д.)
  • Текст для форматирования

Ваша программа должна ожидать, что список цветов будет содержать как минимум 2 цвета.
Текст для форматирования может быть любой длины больше нуля, и символы будут ограничены для печати ascii. (Совет: при более длинном вводе текста может потребоваться повторное использование промежуточных цветов для последовательных символов)

Выход

Выходной текст не должен отличаться от входного текста ни в коем случае, кроме шрифта и / или разметки / стиля (Примечание: если ваш вывод содержит html-разметку, вам потребуется html-кодирование ввода). Вы можете выводить текст с разметкой / стилями (теги стиля html, цвета консоли и т. Д.) Или изображением блеклого текста. Все цветные гексы должны присутствовать в выходных данных, если входные данные не содержат достаточно символов для удовлетворения этого требования. Если это так, то обратитесь к правилам приоритета, чтобы определить, какие цветные гексы должны присутствовать в ваших выходных данных. Порядок или эти цвета в вашем выводе все еще должны быть порядком ввода.

Правила приоритета цвета

  1. В случае, если введен один символ, будет использован первый цвет
  2. В случае, если есть только два символа, будет использован первый и последний цвет
  3. В случае, если имеется более трех цветов и больше цветов, чем символов, первый и последний цвета должны иметь приоритет, а затем остальные цвета в порядке их ввода.
  4. Если символов больше, чем цветов, символы должны переходить от одного цвета к другому, используя промежуточные цвета

Примеры (правила приоритета 1-3 соответственно):
# Цвета | Цвет 0 | ... | Цвет п | Текст
3 ff0000 0000ff ffff00 M-> -> ->только первый
3 ff0000 0000ff ffff00 hiигнорировать 2-й
4 ff0000 0000ff ffff00 0fff00 supигнорировать 3-й

Чтобы быть понятным, цвет текста должен исчезнуть из одного цветового гексагона в другой. Исчезновение не обязательно должно быть абсолютно равномерным, но оно не должно быть резким изменением цвета, если не хватает символов, чтобы красиво исчезнуть. Обычно это затухание достигается путем выбора промежуточных цветов для каждого из символов путем увеличения / уменьшения значений rgb на некоторый интервал, определяемый количеством символов, с которым вы должны работать, и разницей между цветами. Например, если нам нужен один цвет между красный(# ff0000) и черный(# 000000), мы можем выбрать, # 800000как он расположен прямо посередине. Оптимальный результат будет выглядеть довольно красиво.

Пример (правило приоритета 4):
3 ff0000 ff7f00 f0ff00 To be or not to be, that is the question...-> быть или нет
-OR-

<span style="color:#ff0000;">T</span><span style="color:#ff0600;">o</span><span style="color:#ff0c00;"> </span><span style="color:#ff1200;">b</span><span style="color:#ff1800;">e</span><span style="color:#ff1e00;"> </span><span style="color:#ff2400;">o</span><span style="color:#ff2a00;">r</span><span style="color:#ff3000;"> </span><span style="color:#ff3600;">n</span><span style="color:#ff3c00;">o</span><span style="color:#ff4300;">t</span><span style="color:#ff4900;"> </span><span style="color:#ff4f00;">t</span><span style="color:#ff5500;">o</span><span style="color:#ff5b00;"> </span><span style="color:#ff6100;">b</span><span style="color:#ff6700;">e</span><span style="color:#ff6d00;">,</span><span style="color:#ff7300;"> </span><span style="color:#ff7900;">t</span><span style="color:#ff7f00;">h</span><span style="color:#fe8500;">a</span><span style="color:#fe8b00;">t</span><span style="color:#fd9100;"> </span><span style="color:#fc9700;">i</span><span style="color:#fb9d00;">s</span><span style="color:#fba400;"> </span><span style="color:#faaa00;">t</span><span style="color:#f9b000;">h</span><span style="color:#f9b600;">e</span><span style="color:#f8bc00;"> </span><span style="color:#f7c200;">q</span><span style="color:#f6c800;">u</span><span style="color:#f6ce00;">e</span><span style="color:#f5d400;">s</span><span style="color:#f4da00;">t</span><span style="color:#f4e100;">i</span><span style="color:#f3e700;">o</span><span style="color:#f2ed00;">n</span><span style="color:#f1f300;">.</span><span style="color:#f1f900;">.</span><span style="color:#f0ff00;">.</span> 

В своем ответе укажите, как должен отображаться ваш вывод (в виде html, в консоли, как изображение и т. Д.).

* Все черные фоны предназначены только для выделения цвета и не обязательны

счет

Это , поэтому выигрывает самый короткий ответ (в байтах).
Если вам удастся добавить затухание для отдельных персонажей, то я всегда буду думать, что вы крутые (но без бонуса, так как это не будет справедливым для некоторых лангов)

совать
источник
В среднем #000000и #ff0000нет#800000 .
Утренняя монахиня
@LeakyNun В пространстве RGB оно достаточно близко, другой вариант - # 7f0000.
Нил
На самом деле, нет. Попробуйте усреднить красный и зеленый таким образом и посмотрите, не желтеете ли вы. Чтобы сделать это правильно, возьмите среднеквадратичное значение вместо прямого среднего.
Дрянная Монахиня
Среднее значение 000000и ff0000должно быть b40000( 255*sqrt((0+1)/2))
Leaky Nun
1
@ LeakyNun Я никогда не говорил, что вам нужно усреднить цвета. Я описал простой метод замирания, который иногда используется для подобных задач. В этом случае мы усреднили красные цвета двух (и округленные). Я также отметил в вызове, что исчезновение не должно быть абсолютно равномерным. Это зависит от вас, как вы хотите реализовать это исчезновение.
Ткните

Ответы:

3

JavaScript (ES6), 290 байт

h=a=>f(a,a.shift());f=
(a,w)=>[...w].map((c,i)=>{l=w.length-1;m=a.length-1;s=o.appendChild(document.createElement('span'));s.textContent=c;s.style.color=`#${i?i-l?a[r=l%m,n=l/m|0,i<r*n+r?++n:i-=r,k=i/n|0,k++].replace(/./g,(c,d)=>((parseInt(c,16)*(n-i%n)+i%n*parseInt(a[k][d],16))/n|0).toString(16)):a[m]:a[0]}`;})
<textarea rows=10 cols=40 oninput="o.textContent='';h(this.value.split`\n`)">Type the text here and the colours on subsequent lines.
FF0000
00FF00
0000FF</textarea><div id=o>

Нил
источник
1
Здорово видеть, как это происходит в реальном времени с фрагментом кода. : D
AdmBorkBork
1

Pyth, 126 байтов

Обязательное среднеквадратичное среднее вместо прямого среднего арифметического.

L%"<span style=\"color:#%s\">%s</span>",smt.H+256s*255@d2ebhbMm+hG*-eGhGcdHH=Q^RL2Q+smsyMC,hdCgRlhdCedC,ctlQPzC,QtQy,ez?tlzeQh

Попробуйте онлайн!

Пример вывода:

образец

Дрянная Монахиня
источник
1

Java, 702 662 символа

Две функции игры в гольф:

import java.awt.*;String f(Color C,char c){return"<span style=\"color:#"+Integer.toHexString(C.getRGB()).substring(2)+";\">"+c+"</span>";}String c(String t,String[]h){String r="";int l=h.length,e=t.length(),i=0,s=0,g=1,c=-1,p,q,u;double d,m=0,v;char[]T=t.toCharArray();Color C[]=new Color[l],H[],a,b;for(;i<l;)C[i]=Color.decode(h[i++]);if(l>e){H=java.util.Arrays.copyOfRange(C,0,e);H[e-1]=C[l-1];H[0]=C[0];C=H;l=e;}d=--e/(l-1.);for(;++c<e;){a=C[s];b=C[g];p=b.getRed()-a.getRed();q=b.getGreen()-a.getGreen();u=b.getBlue()-a.getBlue();v=m/d;r+=f(new Color(a.getRGB()+((int)(v*p)<<16|(int)(v*q)<<8|(int)(v*u))),T[c]);if(++m>d){m-=d;s=g++;}}return r+f(C[l-1],T[e]);}

Так как никто не может прочитать это: здесь есть обе функции в отличной версии в классе:

import java.awt.*;

public class Q80554 {

    static String format(Color color, char character) {
        return "<span style=\"color:#" + Integer.toHexString(color.getRGB()).substring(2) + ";\">" + character + "</span>";
    }

    static String colorizeB(String text, String[] hexColors) {
        String result = "";
        int colorsLength = hexColors.length, textLength = text.length(), i, currentStartColorPos = 0, currentGoalColorPos = 1, currentCharPos = -1, diffColorRed, diffColorGreen, diffColorBlue;
        double difference, goneDifference = 0, relativeChange;
        char[] textArray = text.toCharArray();
        Color colors[] = new Color[colorsLength], changer[], currentStartColor, currentGoalColor;

        for (i = 0; i < colorsLength;)
            colors[i] = Color.decode(hexColors[i++]);

        if (colorsLength > textLength) {
            changer = Arrays.copyOfRange(colors, 0, textLength);
            changer[textLength - 1] = colors[colorsLength - 1];
            changer[0] = colors[0];

            colors = changer;
            colorsLength = textLength;
        }

        // fade
        difference = --textLength / (colorsLength - 1.); // space between colors    

        for (; ++currentCharPos < textLength;) {
            currentStartColor = colors[currentStartColorPos];
            currentGoalColor = colors[currentGoalColorPos];

            diffColorRed = currentGoalColor.getRed() - currentStartColor.getRed();
            diffColorGreen = currentGoalColor.getGreen() - currentStartColor.getGreen();
            diffColorBlue = currentGoalColor.getBlue() - currentStartColor.getBlue();

            relativeChange = goneDifference / difference;

            result += format(new Color(currentStartColor.getRGB() + ((int) (relativeChange * diffColorRed) << 16 | (int) (relativeChange * diffColorGreen) << 8 | (int) (relativeChange * diffColorBlue))), textArray[currentCharPos]);

            if (++goneDifference > difference) {
                goneDifference -= difference;
                currentStartColorPos = currentGoalColorPos++;                   
            }
        }

        // last character always has last color
        return result + format(colors[colorsLength - 1], textArray[textLength]);
    }
}

Здесь у вас есть верхняя граница для вашего собственного кода. Использование осуществляется путем вызова colorize(или c в версии для гольфа) и передачи текста и массива шестнадцатеричных цветовых кодов. Функция вернет строку с HTML-тегами, как это сделал OP, поэтому вам нужен какой-то способ визуализации HTML.

Алгоритм проще, как выглядит вопрос. Первый персонаж всегда получает первый цвет, последний всегда последний. Если в тексте больше цветов, чем символов, мы просто перебираем текст и цвета и применяем их.Самое интересное - это то, что исчезает: я начал с определения расстояния цветов в тексте. Я в основном вычисляю разницу красного, зеленого и синего между двумя заданными цветами, а затем добавляю часть этой разницы к первому цвету, в зависимости от того, где находится символ между цветами. Если он выходит из интервала двух цветов, мы начинаем с нового со следующими двумя цветами. Это повторяется для всех, кроме последнего символа, который, как мы знаем, всегда является последним цветом. Это дает очень красивое угасание.

Этот вопрос был очень веселым! Благодаря!

Обновления

Сейчас я не занимаюсь всеми делами специально. Вместо этого я обрезаю цвета, если их много, и применяю функцию fade для каждой строки. Если цветов было больше, чем текста, то цвета будут обрезаны, а функция затухания будет работать точно как простое отображение.

Frozn
источник