convert pdf to image c# free : How to save pdf form data in reader control Library platform web page .net web browser fulton_fulton66-part580

Creating the chat functionality
Now that we have established a connection to ElectroServer and joined a zone and a
room, the chat application can start.
First, let’s talk a bit about a few more variables we have created in our canvasApp()
function, which we must scope to the rest of the chat application. The statusMessag
es array will hold a set of messages that we want to keep about the connection to
ElectroServer. We will display these in a box on the right side of the canvas. The
chatMessages array holds all the messages users have sent into the chat room. The
username variable holds the name of the user who is running the Canvas application,
and _room is a reference to the room object that user has joined:
var statusMessages = new Array();
var chatMessages = new Array();
var username;
var _room;
The HTML page holds a <form> that we will use to collect the chat messages from the
user. It contains a text box for the user to type into (the id of textBox), and a button
with the id of sendChat. This is the same form that was invisible until we received the
JoinRoomEvent event:
<input id="textBox" placeholder="your text" />
<input type="button" id ="sendChat" value="Send"/>
In canvasApp(), we set up an event listener for when the user clicks the sendChat button.
When a click event occurs, the function sendMessage handles the event:
var formElement = document.getElementById("sendChat");
The sendMessage() function is one of the most important functions in this application.
This is where we create a couple very critical objects for communicating with Electro‐
Server. The first is a PublicMessageRequest, which is one of several types we can make
to the ElectroServer socket server. Others include a PrivateMessageRequest and a
PluginMessageRequest. A PublicMessageRequest is a message that will be sent to ev‐
eryone in the room. We send that data using an EsObject, which is native to the Elec‐
troServer API. It allows you to create and access ad hoc data elements for any type of
information you want to send to other users in the same room.
For a full discussion of EsObject and ElectroServer events, see the
ElectroServer documentation. It is  installed with  the server on your
local  machine  in [your install folder]//documentation/html/
index.html *.
Multiplayer Applications with ElectroServer 5  |  639
How to save pdf form data in reader - extract form data from PDF in, ASP.NET, MVC, Ajax, WPF
Help to Read and Extract Field Data from PDF with a Convenient C# Solution
save data in pdf form reader; edit pdf form in reader
How to save pdf form data in reader - VB.NET PDF Form Data Read library: extract form data from PDF in, ASP.NET, MVC, Ajax, WPF
Convenient VB.NET Solution to Read and Extract Field Data from PDF
pdf data extractor; save pdf forms in reader
For this simple chat example, we want to send the chat message the user typed and
submitted. To do this, we will use the setString() method of EsObject. This method
takes two parameters: the text you want to send, and an identifier you can use to access
the text. We also set another element named type, which will tell us what kind of message
we are sending. We do this because, in a more complicated application, you might send
all sorts of messages and need a way to identify what they are so that you can process
After we have configured our PublicMessageEvent with the roomId, the zoneId, and
the EsObject, we call es.engine.send(pmr) to send it to the rest of the room:
function sendMessage(event) {
var formElement = document.getElementById("textBox");
var pmr = new PublicMessageRequest();
pmr.message = "";
pmr.roomId =;
pmr.zoneId = _room.zoneId;
var esob = new ElectroServer.EsObject();
pmr.esObject = esob;
statusMessages.push("message sent");
Notice that we did not print the user’s chat message to the canvas when it was submitted.
Instead, we will wait for the PublicMessageEvent to return from ElectroServer and
then handle it like all the other chats. This keeps the interface clean, while preserving a
create event/handle event processing model across the entire application.
After the socket server processes the chat message, it is broadcast out to all the users in
the room. All the users must create an event handler for a PublicMessageEvent so that
they can receive and process  the  message; we have created the onPublicMessageE
vent handler for this purpose. This function is very simple. It checks the type EsOb
ject variable we set to see whether it is a chatmessage. If so, it pushes a string that
includes the user who submitted the message (event.userName) and the message itself
(esob.getString("message")) into the chatMessages array. This is what will be dis‐
played on the canvas:
function onPublicMessageEvent(event) {
var esob = event.esObject;
statusMessages.push("message received");
if (esob.getString("type"== "chatmessage") {
chatMessages.push(event.userName + ":" + esob.getString("message"));
640  |  Chapter 11: Further Explorations
C# PDF File Merge Library: Merge, append PDF files in, ASP.
Merge Microsoft Office Word, Excel and PowerPoint data to PDF form. Append one PDF file to the end of another and save to a single PDF file.
using pdf forms to collect data; fill in pdf form reader
VB.NET PDF File Merge Library: Merge, append PDF files in
Merge Microsoft Office Word, Excel and PowerPoint data to PDF form. to merge two or more PDF document into one and then save as another PDF document using
how to make a pdf form fillable in reader; extracting data from pdf forms
Now all that remains is to display the messages that we have collected. We do this (where
else?) in drawScreen(). For both the statusMessages and chatMessages arrays, we
need to display the “current” 22 messages (if we have 22) and start them at the y position
of 15 pixels. We display only the last 22 messages so that both the chat and the status
messages will appear to scroll up the screen as more chatting and status messages are
var starty = 15;
var maxMessages = 22;
If the array is larger than maxMessages, we display only the latest 22. To find those
messages, we set a new variable named starti to the length of the statusMessages
array, subtracted by the value in maxMessages. This gives us the index into the array of
the first message we want to display. We do the exact same thing for the chatMessag
es array:
//status box
context.strokeStyle = '#000000';
context.strokeRect(345,  10, 145, 285);
var starti = 0;
if (statusMessages.length > maxMessages) {
starti = (statusMessages.length- maxMessages;
for (var i = starti;i< statusMessages.length;i++) {
context.fillText  (statusMessages[i], 350, starty );
//chat box
context.strokeStyle = '#000000';
context.strokeRect(10,  10, 335, 285);
starti = 0;
lastMessage = chatMessages.length-1;
if (chatMessages.length > maxMessages) {
starti = (chatMessages.length) - maxMessages;
starty = 15;
for (var i = starti;i< chatMessages.length;i++) {
context.fillText  (chatMessages[i], 10, starty );
That’s it! We’ve finished developing our multiuser chat application.
Testing the Application in Google Chrome
To test the current ElectroServer JavaScript API, you need to start Google Chrome with
web security disabled. The method of doing this varies by operating system, but on Mac
Multiplayer Applications with ElectroServer 5  |  641
VB.NET PDF Page Delete Library: remove PDF pages in, ASP.
this RasterEdge XDoc.PDF SDK, you can simply delete a single page from a PDF document using VB.NET or remove any page from a PDF document and save to local
extract data from pdf into excel; c# read pdf form fields
C# PDF Convert to Word SDK: Convert PDF to Word library in
key. Quick to remove watermark and save PDF text, image, table, hyperlink and bookmark to Word without losing format. Powerful components
how to save pdf form data in reader; vb extract data from pdf
OS X, you can open a Terminal session and execute the following command (which will
open Chrome if you have it in your Applications folder):
Chrome --disable-web-security
On a Windows-based PC, input a command similar to this from a command prompt
or from a .bat file:
"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe"
Obviously this is not a workable solution for a production application.
As Electrotank (and other companies who make similar products) con‐
tinue to improve the functionality of their APIs and add support for
HTML5 WebSockets, this limitation should disappear.
The best way to test a multiplayer application on your own development machine is to
open two web browsers or two web browser windows at the same time. When you look
at CH11EX2.html in Google Chrome using this method, you should see something that
looks like Figure 11-5.
Figure 11-5. ElectroServer chat demo on the canvas with JavaScript API
Further Explorations with ElectroServer
Displaying text on HTML5 Canvas is interesting, but as we have shown you in this book,
you can do much more. Let’s add some graphics to the previous demo. We have added
642  |  Chapter 11: Further Explorations
C# PDF Convert to Tiff SDK: Convert PDF to tiff images in
Description: Convert to DOCX/TIFF with specified zoom value and save it into stream. Parameters: zoomValue, The magnification of the original PDF page size.
pdf data extraction; pdf form save with reader
C# Create PDF from Tiff Library to convert tif images to PDF in C#
Description: Convert to PDF and save it on the disk. Parameters: Name, Description, Valid Value. Description: Convert to PDF and save it into stream. Parameters:
how to extract data from pdf file using java; filling out pdf forms with reader
a second application for you to peruse, named CH11EX3.html. This application adds
the bouncing ball demo app from Chapter 5 to the chat application we just created. It
allows chatters to “send” bouncing balls to each other by clicking on the Canvas.
The heart of the app is simply another use of the EsObject instance from the chat
application, which is created when the user clicks on the canvas. This EsObject instance
adds information about a ball that one user created for the others in the room:
function eventMouseUp(event) {
var mouseX;
var mouseY;
if (event.layerX ||  event.layerX == 0) { // Firefox
mouseX = event.layerX ;
mouseY = event.layerY;
else if (event.offsetX || event.offsetX == 0) { // Opera
mouseX = event.offsetX;
mouseY = event.offsetY;
var maxSize = 8;
var minSize = 5;
var maxSpeed = maxSize+5;
var tempRadius = Math.floor(Math.random()*maxSize)+minSize;
var tempX = mouseX;
var tempY = mouseY;
var tempSpeed = maxSpeed-tempRadius;
var tempAngle = Math.floor(Math.random()*360);
var tempRadians = tempAngle * Math.PI/ 180;
var tempvelocityx = Math.cos(tempRadians* tempSpeed;
var tempvelocityy = Math.sin(tempRadians* tempSpeed;
var pmr = new PublicMessageRequest();
pmr.message = "";
pmr.roomId =;
pmr.zoneId = _room.zoneId;
var esob = new ElectroServer.EsObject();
esob.setFloat("tempX",tempX );
esob.setFloat("tempY",tempY );
esob.setFloat("tempRadius",tempRadius );
esob.setFloat("tempSpeed",tempSpeed );
esob.setFloat("tempAngle",tempAngle );
esob.setFloat("velocityx",tempvelocityx );
esob.setFloat("velocityy",tempvelocityy );
esob.setString("usercolor",usercolor );
pmr.esObject = esob;
statusMessages.push("send ball");
Multiplayer Applications with ElectroServer 5  |  643
C# PDF Page Extract Library: copy, paste, cut PDF pages in
to extract single or multiple pages from adobe PDF file and save into a The portable document format, known as PDF document, is a widely-used form of file
flatten pdf form in reader; how to save fillable pdf form in reader
C# Create PDF from PowerPoint Library to convert pptx, ppt to PDF
Description: Convert to PDF/TIFF and save it on the disk. Parameters: Description: Convert to PDF/TIFF and save it into stream. Parameters:
extract data from pdf file to excel; online form pdf output
When a user connected in the same room receives this public message, we handle the
newball event in a similar manner to how we handled the chat text, by using the
onPublicMessageEvent() function. When the function sees an event with the type
newball, it calls createNetBall(). The createNetBall() function creates ball objects
to bounce around the canvas, much like the ones we created in Chapter 5:
function onPublicMessageEvent(event) {
statusMessages.push("message received");
var esob = event.esObject;
if (esob.getString("type"== "chatmessage") {
chatMessages.push(event.userName + ":" + esob.getString("message"));
else if (esob.getString("type"== "newball") {
statusMessages.push("create ball")
esob.getString("ballname") );
function createNetBall(tempX,tempY,tempSpeed,tempAngle,tempRadius,tempvelocityx,
tempvelocityyuserusercolor, ballname) {
tempBall = {x:tempX,y:tempY,radius:tempRadiusspeed:tempSpeed,
Figure 11-6 shows what this demo looks like when users click the mouse button to send
balls to other users. The colors of the balls are assigned randomly. You can see the full
set of code for this example in CH11EX3.html.
644  |  Chapter 11: Further Explorations
C# Create PDF from Excel Library to convert xlsx, xls to PDF in C#
Description: Convert to PDF/TIFF and save it on the disk. Parameters: Description: Convert to PDF/TIFF and save it into stream. Parameters:
how to fill pdf form in reader; extract pdf data into excel
C# Create PDF from Word Library to convert docx, doc to PDF in C#.
Description: Convert to PDF/TIFF and save it on the disk. Parameters: Description: Convert to PDF/TIFF and save it into stream. Parameters:
extract data from pdf form to excel; extracting data from pdf into excel
Figure 11-6. ElectroServer chat ball demo
This Is Just the Tip of the Iceberg
There is much more you can do with ElectroServer than what we showed you in this
chapter. Sending and receiving PublicMessage events can get you only so far when
designing multiuser/multiplayer applications.
To start designing multiplayer applications seriously, you will need to delve into the
extension and plug-in architecture of ElectroServer, as well as explore plug-in events,
which are used to communicate to the server portion of an application. We suggest you
check out for more information about the socket
server. You can also read ActionScript for Multiplayer Games and Virtual Worlds by
Jobe Makar (New Riders). Even though it centers on Flash and an earlier version of
ElectroServer, the architectural information about designing apps for a socket server is
well worth your time. You can check out the current ElectroServer JavaScript Client API.
At the same time, ElectroServer can be used with technologies other than Canvas (such
as Flash, iOS, and so on), so Canvas will be able to communicate with other socket
servers via JavaScript and WebSockets. We chose to base this example on ElectroServer
because it allowed us to create a full application for you to test and work through. Other
libraries and tools are bound to appear very soon that can work with Canvas—for ex‐
ample, the SmartFox server, which now supports WebSockets and JavaScript without
Multiplayer Applications with ElectroServer 5  |  645
Creating a Simple Object Framework for the Canvas
As you have seen throughout this book, you can easily create a lot of code when working
with the HTML5 Canvas. The fact is, large applications can get out of hand very easily
if you put all of your JavaScript into the main .html file. However, to become efficient
when developing applications  for  the  HTML5 Canvas,  you will need  to  develop  a
framework for your applications. There are many freely available frameworks that exist
right now for you to use (for example, Impact.js, Easel.js), but we are going to focus on
creating our own small framework for Canvas application development.
In this section, we will create a drag-and drop-application. You will click on colored
“bulbs” and decorate a Christmas tree, shown in Figure 11-7. This might seem like a
simple application, but it will require us to create a system that recognizes mouse clicks,
dragging items, and keeping track of an infinite number of objects.
Figure 11-7. Drag-and-drop application example
Creating the Drag-and-Drop Application
When creating our drag-and-drop application, we need to accomplish the following:
• We will create objects that can be clicked on to decorate a Christmas tree and can
be dragged, dropped, and dragged again.
• We need to make the Canvas think it works in “retained mode” so that we can keep
track of multiple objects. To do this, we need to create a “display list” of objects.
• We need to add the ability for these Canvas objects to listen to “events,” and we need
to have a way for mouse events to be “broadcast” events to objects that need to
“hear” them.
• We want to change the mouse pointer to a hand cursor when it is over objects that
can be clicked to make the application act like it might in Flash or Silverlight.
646  |  Chapter 11: Further Explorations
• The application will actually be a “click and stick” version of drag and drop. This
means that when you click on an item, it sticks to the mouse until you click the
mouse again.
Application Design
To create our framework, we will be creating objects and resource files that will help us
design our application. Here is a brief run-down of what we will be creating:
The base class for objects that need to broadcast events to other objects
A class that represents the draggable objects in the application
A class that represents the “retained mode” that we will simulate for our application
A recourse file filled with nifty functions that we can reuse
The main application class
The HTML file that pulls all of our code together
You can find these files in the Chapter 11 /draganddrop folder in the code distribution.
The first thing we need to do is to create a way for our JavaScript object to subscribe to
and dispatch events. Standard DOM objects can have event listeners to listen for events
—for example:
However, Canvas images and drawing paths cannot create events because they are not
kept in a retained mode. Our task is to create an event dispatcher object in JavaScript
that we can use as the base class for other objects. We will use the EventDispatcher
object as the base class for our Ornament class, so when an ornament is clicked, we can
dispatch an event and the subscriber to that event can take some action.
EventDispatcher.js needs the following three methods:
Allows us to add a listener (subscriber) for a particular event
Creating a Simple Object Framework for the Canvas  |  647
Allows us to send events to listeners
Allows us to remove a listener when it is no longer needed
By defining all the preceding methods as properties of the EventDispatcher prototype
(EventDispatcher.prototype.addEventListener()), another class will be able to use
this class as a base class and inherit all of them.
//Adapted from code Copyright (c) 2010 Nicholas C. Zakas. All rights reserved.
//MIT License
function EventDispatcher(){
this._listeners = {};
EventDispatcher.prototype.addEventListener = function(typelistener){
if (typeof this._listeners[type] == "undefined"){
this._listeners[type= [];
EventDispatcher.prototype.dispatch = function(event){
if (typeof event == "string"){
event = { type: event };
if (!{ = this;
if (!event.type){  //false
throw new Error("Event object missing 'type' property.");
if (this._listeners[event.type] instanceof Array){
var listeners = this._listeners[event.type];
for (var i=0len=listeners.lengthi < len; i++){
EventDispatcher.prototype.removeEve ntListener = function(typelistener){
if (this._listeners[type] instanceof Array){
var listeners = this._listeners[type];
for (var i=0len=listeners.length;
i < leni++){
if (listeners[i] === listener){
648  |  Chapter 11: Further Explorations
Documents you may be interested
Documents you may be interested