JSignage:TextTutorial5

Description

Displaying text from a file or server

• Putting text from a data source into the document.
• In this example, we open a raw text file and copy its content into a textArea.
• We introduce the $.get() method to open a local or remote URI.
• Note that we have process the line breaks into tbreaks, for which we simply use the javascript String.split() method.
• Note also that our text source must be utf-8 encoded for accentuated characters to be displayed correctly.

Source code

$.image({ href: 'media/Corbeau.jpg', top: 100, left: 90, width: 464.2, height: 519.2, frame: { softEdge:true, screenColor: 'white' } }).addTo('svg');

var textLayer = $.textArea({
        left: '40%',
        right: '8%',
        textAlign: 'end',
        fontFamily: 'Georgia',
        fontSize: 26,
        lineIncrement: 34
}).addTo( 'svg' );

$.get( 'media/Corbeau.txt', function( text ) {
        var lines = text.split( '\n' );
        var txt = $.tspan();
        for ( var i=0; i<lines.length; i++ )
          txt.tspan( lines[i] ).tbreak();
        textLayer.text( txt );
}, 'text' );