From bbe467fd3766e02bf1a7177a1d39c82eda21aa7e Mon Sep 17 00:00:00 2001
From: Douglas Muth <dmuth@dmuth.org>
Date: Tue, 10 Apr 2018 22:02:03 -0400
Subject: [PATCH] Added in <wbr> tags prior to merging in #12.

---
 src/index.js | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/index.js b/src/index.js
index 8a8f4dc..3cf2ec1 100644
--- a/src/index.js
+++ b/src/index.js
@@ -268,8 +268,18 @@ Diceware.rollDiceHanlderPost = function(rolls, passphrase, num_passwords) {
 	// represent each die.
 	//
 	jQuery(".results_words_value").html(passphrase.join(" "));
-	jQuery(".results_phrase_value").html(passphrase.join(""));
-	jQuery(".results_num_possible_value").html(num_passwords.toLocaleString("en"));
+	//
+	// Separate words in the phrase by "Word Break Opportunity" 
+	// tag so they will wrap properly on a narrow/mobile screen.
+	//
+	jQuery(".results_phrase_value").html(passphrase.join("<wbr>"));
+	//
+	// Convert the number of passwords to something based on the 
+	// locale and then add in <wbr> tags so they too will wrap.
+	//
+	num_passwords_html = num_passwords.toLocaleString("en");
+	num_passwords_html = num_passwords_html.replace(/,/g, ",<wbr>");
+	jQuery(".results_num_possible_value").html(num_passwords_html);
 
 	var rows = new Array();
 	for (var key in rolls) {