[BC] 詳細画面 改行可能に

This commit is contained in:
2024-05-03 16:35:14 +09:00
parent 535e44c4e7
commit 506c29a32d
3 changed files with 67 additions and 3 deletions
+44
View File
@@ -0,0 +1,44 @@
export default class
CommonModule
{
static
isWide (chr)
{
return chr.match (/[^\x01-\x7f]/) !== null;
}
static
lenByFull (str)
{
return str.split ('').map (c => this.isWide (c) ? 1 : .5)
.reduce ((a, c) => a + c);
}
static
indexByFToC (str, index)
{
let i = 0;
let work = '';
for (let c of str)
{
work += c;
if (this.lenByFull (work) > index)
break;
i += 1;
}
return i;
}
static
midByFull (str, start, length)
{
const trimmedLeft = str.slice (this.indexByFToC (str, start));
return trimmedLeft.slice (0, this.indexByFToC (trimmedLeft, length));
}
}
+1 -1
View File
@@ -17,7 +17,7 @@
<body> <body>
<canvas id="canvas"></canvas> <canvas id="canvas"></canvas>
<script src="./talk.js?<?= filemtime ('./talk.js') ?>" type="text/javascript"></script> <script src="./talk.js?<?= filemtime ('./talk.js') ?>" type="module"></script>
</body> </body>
</html> </html>
+22 -2
View File
@@ -1,3 +1,6 @@
import CommonModule from './common_module.js';
class class
Talk Talk
{ {
@@ -46,10 +49,27 @@ Canvas
this.putText (0, 0, 15, $ ('#dt').val ()); this.putText (0, 0, 15, $ ('#dt').val ());
this.putImage (this.nizika, 370, 260, 1.1); this.putImage (this.nizika, 370, 260, 1.1);
this.putImage (this.talking, 0, 0, 640 / 1024); this.putImage (this.talking, 0, 0, 640 / 1024);
this.putText (75, 43.75, 20, '> ' + $ ('#chat').val (), this.putText (75, 43.75, 20,
('> ' + ((CommonModule.lenByFull ($ ('#chat').val ()) <= 21)
? $ ('#chat').val ()
: (CommonModule.midByFull ($ ('#chat').val (), 0, 19.5)
+ '...'))),
undefined, undefined, undefined, undefined,
true); true);
this.putText (62.5, 93.75, 31.25, $ ('#answer').val (), 'Nikumaru', '#c00000'); this.putText (62.5, 93.75, 31.25,
((CommonModule.lenByFull ($ ('#answer').val ()) <= 16)
? $ ('#answer').val ()
: CommonModule.midByFull ($ ('#answer').val (), 0, 16)),
'Nikumaru', '#c00000');
if (CommonModule.lenByFull ($ ('#answer').val ()) > 16)
{
this.putText (62.5, 125, 31.25,
((CommonModule.lenByFull ($ ('#answer').val ()) <= 32)
? CommonModule.midByFull ($ ('#answer').val (), 16, 16)
: (CommonModule.midByFull ($ ('#answer').val (), 16, 14.5)
+ '...')),
'Nikumaru', '#c00000');
}
} }
putBG () putBG ()