Speech bubble tip

[sindresorhus]

Like this: (ignore the color)

[peterblazejewicz]

My take: (a one line closer to left side for horizontal balance with bubbles):

     _-----_
    |       |    .--------------------------.
    |--(o)--|    |     Sindre is a horse    |
   `---------´   '--------------------------'
    ( _´U`_ )   O
    /___A___\  o 
     |  ~  | .   
   __'.___.'__   
 ´   `  |° ´ Y ` 

     _-----_
    |       |    .--------------------------.
    |--(o)--|    | Hello, and welcome to my |
   `---------´   | fantastic generator full |
    ( _´U`_ )   O|   of whimsy and bubble   |
    /___A___\  o |           gum!           |
     |  ~  | .   '--------------------------'
   __'.___.'__   
 ´   `  |° ´ Y ` 

 yo  yosay "Yo! How's it going" --maxLength 4

     _-----_
    |       |    .-------.
    |--(o)--|    |  Yo!  |
   `---------´   | How's |
    ( _´U`_ )   O|   it  |
    /___A___\  o | going |
     |  ~  | .   '-------'
   __'.___.'__   
 ´   `  |° ´ Y ` 

diff --git a/index.js b/index.js
index f56d749..5979790 100644
--- a/index.js
+++ b/index.js
@@ -14,9 +14,9 @@ var defaultGreeting =
   '\n    |       |    ' +
   '\n    |' + chalk.red('--(o)--') + '|    ' +
   '\n   `---------´   ' +
-  '\n    ' + chalk.yellow('(') + ' _' + chalk.yellow('´U`') + '_ ' + chalk.yellow(')') + '    ' +
-  '\n    /___A___\\    ' +
-  '\n     ' + chalk.yellow('|  ~  |') + '     ' +
+  '\n    ' + chalk.yellow('(') + ' _' + chalk.yellow('´U`') + '_ ' + chalk.yellow(')') + '   O' +
+  '\n    /___A___\\  o ' +
+  '\n     ' + chalk.yellow('|  ~  |') + ' .   ' +
   '\n   __' + chalk.yellow('\'.___.\'') + '__   ' +
   '\n ´   ' + chalk.red('`  |') + '° ' + chalk.red('´ Y') + ' ` ';

Let me know about PR!

[sindresorhus]

Circles up to the speech bubble is mostly used for when the character is thinking. While speech is a hard line.

Former is thoughts, latter is speech.

@peterblazejewicz Would you be able to try with a curved line instead?

[peterblazejewicz]

challenge accepted! Thanks!

[sindresorhus]

Awesome! We should probably agree on how it should look before you start implementing it in code.

Could be as simple as, but I feel it's too boring:

    _-----_
   |       |    .--------------------------.
   |--(o)--|    |    Welcome to Yeoman,    |
  `---------´   |   ladies and gentlemen!  |
   ( _´U`_ )    '--------------------------'
   /___A___\   /
    |  ~  |
  __'.___.'__
´   `  |° ´ Y `

[peterblazejewicz]

              .--------------------------.
              |    Welcome to Yeoman,    |
    _-----_   |   ladies and gentlemen!  |
   |       |  '-.   .--------------------'
   |--(o)--|    |  /
  `---------´   | /
   ( _´U`_ )    |/
   /___A___\    .
    |  ~  | 
  __'.___.'_
´   `  |° ´ Y `

If we only figure out how to make it lean to the right a little :angry: Because of multiline message grow direction.

[sindresorhus]

Nice! I think the tip is a bit too long and should be one step closer to the character.

How about this?

              .--------------------------.
              |    Welcome to Yeoman,    |
    _-----_   |   ladies and gentlemen!  |
   |       |  '.  .----------------------'
   |--(o)--|   | /
  `---------´  |/
   ( _´U`_ )   .
   /___A___\
    |  ~  |
  __'.___.'_
´   `  |° ´ Y `

[peterblazejewicz]

:+1: Now let's tackle the bubble speech sizing/multiline problem.

[stephenplusplus]

If it's not too late to vote, I actually liked your simple slash example, @sindresorhus. With the latest design, more vertical space is taken up, which makes the whole thing more obtrusive when it will actually be in someone's terminal.

[sindresorhus]

Been thinking about this and agree with @stephenplusplus. Let's do the minimal tip.

[peterblazejewicz]

The top one is Sindre's single slash with various messages. The other ones are variations.

     _-----_
    |       |    .--------------------------.
    |--(o)--|    |           hello          |
   `---------´   '--------------------------'
    ( _´U`_ )    
    /___A___\   /
     |  ~  |     
   __'.___.'__   
 ´   `  |° ´ Y ` 

     _-----_
    |       |    .--------------------------.
    |--(o)--|    |    Welcome to Yeoman,    |
   `---------´   |   ladies and gentlemen!  |
    ( _´U`_ )    '--------------------------'
    /___A___\   /
     |  ~  |     
   __'.___.'__   
 ´   `  |° ´ Y ` 

     _-----_
    |       |    .--------------------------.
    |--(o)--|    | Hello, and welcome to my |
   `---------´   | fantastic generator full |
    ( _´U`_ )    | of whimsy and bubble gum |
    /___A___\   /'--------------------------'
     |  ~  |     
   __'.___.'__   
 ´   `  |° ´ Y ` 

     _-----_
    |       |    .------------.
    |--(o)--|    | Hello, and |
   `---------´   | welcome to |
    ( _´U`_ )    |     my     |
    /___A___\   /|  fantastic |
     |  ~  |     |  generator |
   __'.___.'__   |   full of  |
 ´   `  |° ´ Y ` | whimsy and |
                 | bubble gum |
                 '------------'

     _-----_
    |       |    .--------------------------.
    |--(o)--|    |    Welcome to Yeoman,    |
   `---------´   |   ladies and gentlemen!  |
    ( _´U`_ )   /'--------------------------'
    /___A___\  / 
     |  ~  |     
   __'.___.'__   
 ´   `  |° ´ Y ` 

     _-----_
    |       |    .--------------------------.
    |--(o)--|    |           hello          |
   `---------´   '--------------------------'
    ( _´U`_ )   /
    /___A___\  / 
     |  ~  |     
   __'.___.'__   
 ´   `  |° ´ Y ` 

    _-----_
    |       |    .--------------------------.
    |--(o)--|    | Hello, and welcome to my |
   `---------´   | fantastic generator full |
    ( _´U`_ )   /| of whimsy and bubble gum |
    /___A___\  / '--------------------------'
     |  ~  |     
   __'.___.'__   
 ´   `  |° ´ Y ` 

     _-----_
    |       |    .------------.
    |--(o)--|    | Hello, and |
   `---------´   | welcome to |
    ( _´U`_ )   /|     my     |
    /___A___\  / |  fantastic |
     |  ~  |     |  generator |
   __'.___.'__   |   full of  |
 ´   `  |° ´ Y ` | whimsy and |
                 | bubble gum |
                 '------------'

     _-----_
    |       |    .--------------------------.
    |--(o)--|    |    Welcome to Yeoman,    |
   `---------´  /|   ladies and gentlemen!  |
    ( _´U`_ )  / '--------------------------'
    /___A___\    
     |  ~  |     
   __'.___.'__   
 ´   `  |° ´ Y ` 

     _-----_
    |       |    .--------------------------.
    |--(o)--|    |           hello          |
   `---------´  /'--------------------------'
    ( _´U`_ )  /
    /___A___\    
     |  ~  |     
   __'.___.'__   
 ´   `  |° ´ Y ` 

    _-----_
    |       |    .--------------------------.
    |--(o)--|    | Hello, and welcome to my |
   `---------´  /| fantastic generator full |
    ( _´U`_ )  / | of whimsy and bubble gum |
    /___A___\    '--------------------------'
     |  ~  |     
   __'.___.'__   
 ´   `  |° ´ Y ` 

     _-----_
    |       |    .------------.
    |--(o)--|    | Hello, and |
   `---------´  /| welcome to |
    ( _´U`_ )  / |     my     |
    /___A___\    |  fantastic |
     |  ~  |     |  generator |
   __'.___.'__   |   full of  |
 ´   `  |° ´ Y ` | whimsy and |
                 | bubble gum |
                 '------------'

[sindresorhus]

I think I prefer the first, but for move the tip one line up when the box is only one line.

[stephenplusplus]

but for move the tip one line up when the box is only one line.

Why not just move the box one line down? The base of the bubble should always be on the same line, with the box extending upwards to fit the content if necessary.

[sindresorhus]

:+1:

[mischah]

Like this right?

     _-----_
    |       |
    |--(o)--|    .--------------------------.
   `---------´   |           Hello          |
    ( _´U`_ )    '--------------------------'
    /___A___\   /
     |  ~  |
   __'.___.'__
 ´   `  |° ´ Y `

     _-----_
    |       |    .--------------------------.
    |--(o)--|    |    Welcome to Yeoman,    |
   `---------´   |   ladies and gentlemen!  |
    ( _´U`_ )    '--------------------------'
    /___A___\   /
     |  ~  |
   __'.___.'__
 ´   `  |° ´ Y `

     _-----_     .--------------------------.
    |       |    | Hello, and welcome to my |
    |--(o)--|    | fantastic generator full |
   `---------´   | of whimsy and bubble gum |
    ( _´U`_ )    '--------------------------'
    /___A___\   /
     |  ~  |
   __'.___.'__
 ´   `  |° ´ Y `

                 .------------.
                 | Hello, and |
                 | welcome to |
                 |     my     |
                 |  fantastic |
                 |  generator |
     _-----_     |   full of  |
    |       |    | whimsy and |
    |--(o)--|    | Hello, and |
   `---------´   | bubble gum |
    ( _´U`_ )    '------------'
    /___A___\   /
     |  ~  |
   __'.___.'__
 ´   `  |° ´ Y `

[sindresorhus]

@mischah Yeah, close, though would be nice to vertically center the bubble when it overflows.

                 .+----------+.
     _+---+_     + Hello, and +
    +       +    | welcome to |
    +-+(o)+-+    |     my     |
   `+-------+´   |  fantastic |
    ( _´U`_ )    |  generator |
    /___A___\   /|   full of  |
     +  ~  +     | whimsy and |
   __'.___.'__   | Hello, and |
 ´   `  +° ´ Y ` + bubble gum +
                 '+----------+'

[mischah]

You’re absolutely right 👌

I’ll try to fix this issue (within a week or so). But I’m not sure if I can because I have no idea how yosay works.

[mischah]

Hej @yeoman team,

could you please give me a hint about how to convert the yosay output to a text fixture?

I digged through old PRs and can’t find a valid solution.

I already tried:

yosay Hi | pbcopy
yosay Hi > test/fixture/foo.json

Both generating:

     _-----_
    |       |    .--------------------------.
    |--(o)--|    |            Hi            |
   `---------´   '--------------------------'
    ( _´U`_ )    
    /___A___\    
     |  ~  |     
   __'.___.'__   
 ´   `  |° ´ Y ` 

Which I post-processed with:

• wrapping with double quotes
• Replacing line breaks with \n

⬇️

#Result:
"\n     _-----_\n    |       |    .--------------------------.\n    |--(o)--|    |            Hi            |\n   `---------´   '--------------------------'\n    ( _´U`_ )    \n    /___A___\    \n     |  ~  |     \n   __'.___.'__   \n ´   `  |° ´ Y ` \n\n"

#Which is still different from the current `correctly-formatted.json` fixture:
"\n     _-----_\n    |       |    .--------------------------.\n    |\u001b[31m--(o)--\u001b[39m|    \u001b[0m|\u001b[0m            \u001b[0mHi\u001b[0m            \u001b[0m|\u001b[0m\n   `---------´   \u001b[0m'--------------------------'\n    \u001b[33m(\u001b[39m _\u001b[33m´U`\u001b[39m_ \u001b[33m)\u001b[39m    \n    /___A___\\    \n     \u001b[33m|  ~  |\u001b[39m     \n   __\u001b[33m'.___.'\u001b[39m__   \n ´   \u001b[31m`  |\u001b[39m° \u001b[31m´ Y\u001b[39m ` \n"

[stephenplusplus]

I think some of my helper functions got linted out. Check out an old revision of our test file: https://github.com/yeoman/yosay/blob/153fb7fec78059e5a5be17cd722c5b71bd056543/test/test.js#L12 - you'll need to re-include this function in the test file: https://github.com/yeoman/yosay/blob/153fb7fec78059e5a5be17cd722c5b71bd056543/test/test.js#L97

[mischah]

This totally makes sense. Thanks 😊

[mischah]

Sorry, for the spam. I did need a few force pushes.

[mischah]

Hej, it took a little longer. But I finished the work and opened a PR #23 :octocat: