Pdf reader link Library software component .net winforms azure mvc 1489-part1776

if ((gPieces[i].row == cell.row) &&

(gPieces[i].column == cell.column)) {

clickOnPiece(i);

return;

}

clickOnEmptyCell(cell);

}

The next step is to take the

MouseEvent

object and calculate which square on the Halma

board just got clicked. The Halma board takes up the entire canvas, so every click is

somewhere on the board. We just need to figure out where. This is tricky, because

mouse events are implemented differently in just about every browser:

function getCursorPosition(e) {

var x;

var y;

if (e.pageX || e.pageY) {

x = e.pageX;

y = e.pageY;

}

else {

x = e.clientX + document.body.scrollLeft +

document.documentElement.scrollLeft;

y = e.clientY + document.body.scrollTop +

document.documentElement.scrollTop;

}

At this point, we have

and

coordinates that are relative to the document (that is, the

entire HTML page). But we want coordinates relative to the canvas. We can get them

as follows:

x -= gCanvasElement.offsetLeft;

y -= gCanvasElement.offsetTop;

Now we have

and

coordinates that are relative to the canvas (see “Canvas Coordi-

nates” on page 60). That is, if

and

at this point, we know that the user just

clicked the top-left pixel of the canvas.

From here, we can calculate which Halma square the user clicked, and then act

accordingly:

var cell = new Cell(Math.floor(y/kPieceWidth),

Math.floor(x/kPieceHeight));

return cell;

}

Whew! Mouse events are tough. But you can use the same logic (in fact, this exact code)

in all of your own canvas-based applications. Remember: mouse click→document-

relative coordinates→canvas-relative coordinates→application-specific code.

OK, let’s look at the main drawing routine. Because the graphics are so simple, I’ve

chosen to clear and redraw the board in its entirety every time anything changes within

the game. This is not strictly necessary. The canvas drawing context will retain whatever

A Complete Example | 77

Download from Library of Wow! eBook <www.wowebook.com>

Pdf reader link - insert, remove PDF links in C#.net, ASP.NET, MVC, Ajax, WinForms, WPF

Free C# example code is offered for users to edit PDF document hyperlink (url), like inserting and deleting

adding a link to a pdf; adding hyperlinks to pdf documents

Pdf reader link - VB.NET PDF url edit library: insert, remove PDF links in vb.net, ASP.NET, MVC, Ajax, WinForms, WPF

Help to Insert a Hyperlink to Specified PDF Document Page

convert excel to pdf with hyperlinks; add url to pdf

you have previously drawn on it, even if the user scrolls the canvas out of view or

changes to another tab and then comes back later. If you’re developing a canvas-based

application with more complicated graphics (such as an arcade game), you can optimize

performance by tracking which regions of the canvas are “dirty” and redrawing just the

dirty regions. But that is outside the scope of this book. Here’s the board-clearing code:

gDrawingContext.clearRect(0, 0, kPixelWidth, kPixelHeight);

The board-drawing routine should look familiar. It’s very similar to how we drew the

canvas coordinates diagram (see “Canvas Coordinates” on page 60):

gDrawingContext.beginPath();

/* vertical lines */

for (var x = 0; x <= kPixelWidth; x += kPieceWidth) {

gDrawingContext.moveTo(0.5 + x, 0);

gDrawingContext.lineTo(0.5 + x, kPixelHeight);

}

/* horizontal lines */

for (var y = 0; y <= kPixelHeight; y += kPieceHeight) {

gDrawingContext.moveTo(0, 0.5 + y);

gDrawingContext.lineTo(kPixelWidth, 0.5 + y);

}

/* draw it! */

gDrawingContext.strokeStyle = "#ccc";

gDrawingContext.stroke();

The real fun begins when we go to draw each of the individual pieces. A piece is a circle,

something we haven’t drawn before. Furthermore, if the user selects a piece in antici-

pation of moving it, we want to draw that piece as a filled-in circle. Here, the argument

represents a piece, which has

row

and

column

properties that denote the piece’s current

location on the board. We use some in-game constants to translate

(column, row)

into

canvas-relative

(x, y)

coordinates, then draw a circle, then (if the piece is selected) fill

in the circle with a solid color:

function drawPiece(p, selected) {

var column = p.column;

var row = p.row;

var x = (column * kPieceWidth) + (kPieceWidth/2);

var y = (row * kPieceHeight) + (kPieceHeight/2);

var radius = (kPieceWidth/2) - (kPieceWidth/10);

That’s the end of the game-specific logic. Now we have

(x, y)

coordinates, relative to

the canvas, for the center of the circle we want to draw. There is no

circle()

method

in the canvas API, but there is an

arc()

method. And really, what is a circle but an arc

that goes all the way around? Do you remember your basic geometry? The

arc()

method

takes a center point

(x, y)

, a radius, a start and end angle (in radians), and a direction

flag (

false

for clockwise,

true

for counterclockwise). We can use the

Math

module that’s

built into JavaScript to calculate radians:

78 | Chapter 4: Let’s Call It a Draw(ing Surface)

Download from Library of Wow! eBook <www.wowebook.com>

RasterEdge .NET Document Imaging Trial Package Download Link.

Adobe PDF. XDoc.PDF. Scanning. XImage.OCR. Microsoft Office. XDoc.Word. XDoc.Excel. XDoc.PowerPoint. Barcoding. XImage.Barcode Reader. XImage.Barcode Generator.

change link in pdf; active links in pdf

C# PDF Library SDK to view, edit, convert, process PDF file for C#

RasterEdge PDF SDK for .NET package offers robust APIs for editing PDF document hyperlink (url) and quick navigation link in PDF bookmark.

add link to pdf; pdf reader link

gDrawingContext.beginPath();

gDrawingContext.arc(x, y, radius, 0, Math.PI * 2, false);

gDrawingContext.closePath();

But wait! Nothing has been drawn yet. Like

moveTo()

and

lineTo()

, the

arc()

method

is a “pencil” method (see “Paths” on page 61). To actually draw the circle, we need to

set the

strokeStyle

and call

stroke()

to trace it in “ink”:

gDrawingContext.strokeStyle = "#000";

gDrawingContext.stroke();

What if the piece is selected? We can reuse the same path we created to draw the outline

of the piece to fill in the circle with a solid color:

if (selected) {

gDrawingContext.fillStyle = "#000";

gDrawingContext.fill();

}

And that’s...well, that’s pretty much it. The rest of the program is game-specific logic—

distinguishing between valid and invalid moves, keeping track of the number of moves,

detecting whether the game is over. With nine circles, a few straight lines, and an

onclick

handler, we’ve created an entire game in

. Huzzah!

Further Reading | 79

Download from Library of Wow! eBook <www.wowebook.com>

How to C#: Basic SDK Concept of XDoc.PDF for .NET

XDoc.PDF for .NET allows C# developers to edit hyperlink of PDF document, including editing PDF url links and quick navigation link in bookmark/outline.

pdf email link; adding hyperlinks to pdf files

VB.NET PDF: Basic SDK Concept of XDoc.PDF

XDoc.PDF for .NET allows VB.NET developers to edit hyperlink of PDF document, including editing PDF url links and quick navigation link in bookmark/outline.

add hyperlink to pdf; add hyperlink to pdf in preview

Download from Library of Wow! eBook <www.wowebook.com>

C# PDF: PDF Document Viewer & Reader SDK for Windows Forms

create PDF document viewer & reader in ASP.NET web application using C# code. Related C# PDF Imaging Project Tutorials! Please click the following link to see

add hyperlinks pdf file; accessible links in pdf

C# Raster - Raster Conversion & Rendering in C#.NET

pdf hyperlink; pdf hyperlinks

CHAPTER 5

Video on the Web

Diving In

Anyone who has visited YouTube.com in the past four years knows that you can embed

video in a web page. But prior to HTML5, there was no standards-based way to do this.

Virtually all the video you’ve ever watched “on the Web” has been funneled through

a third-party plug-in—maybe QuickTime, maybe RealPlayer, maybe Flash. (YouTube

uses Flash.) These plug-ins integrate with your browser well enough that you may not

even be aware that you’re using them—until you try to watch a video on a platform

that doesn’t support that plug-in, that is.

HTML5 defines a standard way to embed video in a web page, using a

<video>

element.

Support for the

<video>

element is still evolving, which is a polite way of saying it doesn’t

work yet (at least, it doesn’t work everywhere). But don’t despair! There are alternatives

and fallbacks and options galore. Table 5-1 shows which browsers support the

<video>

element at the time of writing.

Table 5-1. <video> element support

IE9

IE8

IE7

Firefox

3.5

Firefox

3.0

Safari 4

Safari 3

Chrome

Opera

✓

Support for the

<video>

element itself is really only a small part of the story. Before we

can talk about HTML5 video, you first need to understand a little about video itself.

(If you know about video already, you can skip ahead to “What Works on the

Web” on page 88.)

Video Containers

You may think of video files as “AVI files” or “MP4 files.” In reality, “AVI” and “MP4”

are just container formats. Just as a ZIP file can contain any sort of file within it, video

Download from Library of Wow! eBook <www.wowebook.com>

VB.NET PDF: Create PDF Document Viewer in C#.NET for Document

reading PDF document in ASP.NET web, .NET Windows Forms and mobile developing applications respectively. For more information on them, just click the link and

chrome pdf from link; change link in pdf file

VB.NET Word: How to Process MS Word in VB.NET Library in .NET

Besides, here is the quick link for how to process Word document within We are dedicated to provide powerful & profession imaging controls, PDF document, image

clickable links in pdf; add hyperlink pdf document

container formats only define how to store things within them, not what kind of data

is stored. (It’s a little more complicated than that, because not all video streams are

compatible with all container formats, but never mind that for now.)

A video file usually contains multiple tracks: a video track (without audio), plus one

or more audio tracks (without video). Tracks are usually interrelated. An audio track

contains markers within it to help synchronize the audio with the video. Individual

tracks can have metadata, such as the aspect ratio of a video track or the language of

an audio track. Containers can also have metadata, such as the title of the video itself,

cover art for the video, episode numbers (for television shows), and so on.

There are lots of video container formats. Some of the most popular include:

MPEG-4

Usually with an .mp4 or .m4v extension. The MPEG-4 container is based on

Apple’s older QuickTime container (.mov). Movie trailers on Apple’s website still

use the older QuickTime container, but movies that you rent from iTunes are de-

livered in an MPEG-4 container.

Flash Video

Usually with an .flv extension. Flash Video is, unsurprisingly, used by Adobe Flash.

Prior to Flash 9.0.60.184 (a.k.a. Flash Player 9 Update 3), this was the only con-

tainer format that Flash supported. More recent versions of Flash also support the

MPEG-4 container.

Ogg

Usually with an .ogv extension. Ogg is an open standard that is open source–

friendly and is unencumbered by any known patents. Firefox 3.5, Chrome 4, and

Opera 10.5 offer native support, without platform-specific plug-ins, for the Ogg

container format, Ogg video (called “Theora”), and Ogg audio (called “Vorbis”).

On the desktop, Ogg is supported out-of-the-box by all major Linux distributions,

and you can use it on Mac and Windows by installing the QuickTime compo

nents or DirectShow filters, respectively. It is also playable with the excellent

VLC on all platforms.

WebM

With a .webm extension. WebM is a new container format that is technically very

similar to another format called Matroska. WebM was announced at Google I/O

2010. It is designed to be used exclusively with the VP8 video codec and the Vorbis

audio codec. (More on these in a minute.) It will be supported natively, without

platform-specific plug-ins, in the next versions of Chromium, Google Chrome,

Mozilla Firefox, and Opera. Adobe has also announced that the next version of

Flash will support WebM video.

Audio Video Interleave

Usually with an .avi extension. The AVI container format was invented by Micro-

soft in a simpler time, when the fact that computers could play video at all was

considered pretty amazing. It does not officially support many of the features of

82 | Chapter 5: Video on the Web

Download from Library of Wow! eBook <www.wowebook.com>

more recent container formats. It does not officially support any sort of video

metadata. It does not even officially support most of the modern video and audio

codecs in use today. Over time, various companies have tried to extend it in gen-

erally incompatible ways to support this or that, and it is still the default container

format for popular encoders such as MEncoder.

Video Codecs

When you talk about “watching a video,” you’re probably talking about a combination

of one video stream and one audio stream. But you don’t have two different files; you

just have “the video.” Maybe it’s an AVI file, or an MP4 file. As described in the pre-

ceding section, these are just container formats, like a ZIP file that contains multiple

kinds of files within it. The container format defines how to store the video and audio

streams in a single file.

When you “watch a video,” your video player is doing several things at once:

• Interpreting the container format to find out which video and audio tracks are

available, and how they are stored within the file so that it can find the data it needs

to decode next

• Decoding the video stream and displaying a series of images on the screen

• Decoding the audio stream and sending the sound to your speakers

A video codec is an algorithm by which a video stream is encoded. That is, it specifies

how to do #2 above. (The word “codec” is a portmanteau, a combination of the words

“coder” and “decoder.”) Your video player decodes the video stream according to the

video codec, then displays a series of images, or “frames,” on the screen. Most modern

video codecs use all sorts of tricks to minimize the amount of information required to

display one frame after the next. For example, instead of storing each individual frame

(like screenshots), they only store the differences between frames. Most videos don’t

actually change all that much from one frame to the next, so this allows for high com-

pression rates, which results in smaller file sizes.

There are lossy and lossless video codecs. Lossless video is much too big to be useful

on the Web, so I’ll concentrate on lossy codecs. With a lossy video codec, information

is irretrievably lost during encoding. Like copying an audio cassette tape, every time

you encode you’re losing information about the source video and degrading the quality.

Instead of the “hiss” of an audio cassette, a re-re-re-encoded video may look blocky,

especially during scenes with a lot of motion. (Actually, this can happen even if you

encode straight from the original source if you choose a poor video codec or pass it the

wrong set of parameters.) On the bright side, lossy video codecs can offer amazing

compression rates, and many offer ways to “cheat” and smooth over that blockiness

during playback to make the loss less noticeable to the human eye.

Video Codecs | 83

Download from Library of Wow! eBook <www.wowebook.com>

There are tons of video codecs. The three most relevant codecs are H.264, Theora, and

VP8.

H.264

H.264 is also known as “MPEG-4 part 10,” a.k.a. “MPEG-4 AVC,” a.k.a. “MPEG-4

Advanced Video Coding.” H.264 was developed by the MPEG group and standardized

in 2003. It aims to provide a single codec for low-bandwidth, low-CPU devices (cell

phones); high-bandwidth, high-CPU devices (modern desktop computers); and every-

thing in between. To accomplish this, the H.264 standard is split into “profiles”, each

defining a set of optional features that trade complexity for file size. Higher profiles use

more optional features, offer better visual quality at smaller file sizes, take longer to

encode, and require more CPU power to decode in real time.

To give you a rough idea of the range of profiles, Apple’s iPhone supports the Baseline

profile, the AppleTV set-top box supports the Baseline and Main profiles, and Adobe

Flash on a desktop PC supports the Baseline, Main, and High profiles. YouTube (owned

by Google, my employer) now uses H.264 to encode high-definition videos playable

through Adobe Flash; YouTube also provides H.264-encoded video to mobile devices,

including Apple’s iPhone and phones running Google’s Android mobile operating

system. Also, H.264 is one of the video codecs mandated by the Blu-ray specification;

Blu-ray discs that use it generally use the High profile.

Most nonPC devices that play H.264 video (including iPhones and standalone Blu-ray

players) actually do the decoding on a dedicated chip, since their main CPUs are no-

where near powerful enough to decode the video in real time. Many desktop graphics

cards also support decoding H.264 in hardware. There are a number of competing

H.264 encoders, including the open source x264 library. The H.264 standard is patent-

encumbered; licensing is brokered through the MPEG LA group. H.264 video can be

embedded in most popular container formats (see “Video Containers” on page 81),

including MP4 (used primarily by Apple’s iTunes Store) and MKV (used primarily by

noncommercial video enthusiasts).

Theora

Theora evolved from the VP3 codec and has subsequently been developed by the

Xiph.org Foundation. Theora is a royalty-free codec and is not encumbered by any known

patents other than the original VP3 patents, which have been licensed royalty-free.

Although the standard has been “frozen” since 2004, the Theora project (which in-

cludes an open source reference encoder and decoder) only released Version 1.0 in

November 2008 and Version 1.1 in September 2009.

Theora video can be embedded in any container format, although it is most often seen

in an Ogg container. All major Linux distributions support Theora out of the box, and

Mozilla Firefox 3.5 includes native support for Theora video in an Ogg container. By

84 | Chapter 5: Video on the Web

Download from Library of Wow! eBook <www.wowebook.com>

“native,” I mean “available on all platforms without platform-specific plug-ins.” You

can also play Theora video on Windows or on Mac OS X after installing Xiph.org’s

open source decoder software.

VP8

VP8 is another video codec from On2, the same company that originally developed

VP3 (later Theora). Technically, it is similar in quality to H.264 Baseline, with lots of

potential for future improvements.

In 2010, Google acquired On2 and published the video codec specification and a sam-

ple encoder and decoder as open source. As part of this, Google also “opened” all the

patents that On2 had filed on VP8 by licensing them royalty-free. (This is the best you

can hope for with patents—you can’t actually “release” them or nullify them once

they’ve been issued. To make them open source–friendly, you license them royalty-

free, and then anyone can use the technologies the patents cover without paying any-

thing or negotiating patent licenses.) As of May 19, 2010, VP8 is a royalty-free, modern

codec and is not encumbered by any known patents, other than the patents that On2

(now Google) has already licensed royalty-free.

Audio Codecs

Unless you’re going to stick to films made before 1927 or so, you’re going to want an

audio track in your video. Like video codecs, audio codecs are encoding algorithms, in

this case used for audio streams. As with video codecs, there are lossy and lossless audio

codecs. And like lossless video, lossless audio is really too big to put on the Web, so

I’ll concentrate on lossy audio codecs.

Actually, we can narrow the focus even further, because there are different categories

of lossy audio codecs. Audio is used in many places where video is not (telephony, for

example), and there is an entire category of audio codecs optimized for encoding

speech. You wouldn’t rip a music CD with these codecs, because the result would sound

like a four-year-old singing into a speakerphone. But you would use them in an

Asterisk PBX, because bandwidth is precious, and these codecs can compress human

speech into a fraction of the size of general-purpose codecs. However, due to lack of

support in both native browsers and third-party plug-ins, speech-optimized audio co-

decs never really took off on the Web. So I’ll concentrate on general-purpose lossy audio

codecs.

As I mentioned in “Video Codecs” on page 83, when you “watch a video,” your com-

puter is doing several things at once:

1.Interpreting the container format

2.Decoding the video stream

3.Decoding the audio stream and sending the sound to your speakers

Audio Codecs | 85

Download from Library of Wow! eBook <www.wowebook.com>

The audio codec specifies how to do #3—decoding the audio stream and turning it into

digital waveforms that your speakers then turn into sound. As with video codecs, there

are all sorts of tricks to minimize the amount of information stored in the audio stream.

And since we’re talking about lossy audio codecs, information is being lost during the

recording→encoding→decoding→listening lifecycle. Different audio codecs throw away

different things, but they all have the same purpose: to trick your ears into not noticing

the parts that are missing.

One concept that audio has that video does not is channels. We’re sending sound to

your speakers, right? Well, how many speakers do you have? If you’re sitting at your

computer, you may only have two: one on the left and one on the right. My desktop

has three: left, right, and one more on the floor. So-called “surround sound” systems

can have six or more speakers, strategically placed around the room. Each speaker is

fed a particular channel of the original recording. The theory is that you can sit in the

middle of the six speakers, literally surrounded by six separate channels of sound, and

your brain synthesizes them and makes you feel like you’re in the middle of the action.

Does it work? A multi-billion-dollar industry seems to think so.

Most general-purpose audio codecs can handle two channels of sound. During record-

ing, the sound is split into left and right channels; during encoding, both channels are

stored in the same audio stream; and during decoding, both channels are decoded and

each is sent to the appropriate speaker. Some audio codecs can handle more than two

channels, and they keep track of which channel is which so your player can send the

right sound to the right speaker.

There are lots of audio codecs. Did I say there were lots of video codecs? Forget that.

There are gobs and gobs of audio codecs, but on the Web, there are really only three

you need to know about: MP3, AAC, and Vorbis.

MPEG-1 Audio Layer 3

MPEG-1 Audio Layer 3 is colloquially known as “MP3.” If you haven’t heard of MP3s,

I don’t know what to do with you. Walmart sells portable music players and calls them

“MP3 players.” Walmart. Anyway...

MP3s can contain up to two channels of sound. They can be encoded at different

bitrates: 64 kbps, 128 kbps, 192 kbps, and a variety of others, from 32 to 320. Higher

bitrates mean larger file sizes and better-quality audio, although the ratio of audio

quality to bitrate is not linear. (128 kbps sounds more than twice as good as 64 kbps,

but 256 kbps doesn’t sound twice as good as 128 kbps.) Furthermore, the MP3 format

(standardized in 1991) allows for variable bitrate encoding, which means that some

parts of the encoded stream are compressed more than others. For example, silence

between notes can be encoded at a very low bitrate, then the bitrate can spike up a

moment later when multiple instruments start playing a complex chord. MP3s can also

be encoded with a constant bitrate, which, unsurprisingly, is called constant bitrate

encoding.

86 | Chapter 5: Video on the Web

Download from Library of Wow! eBook <www.wowebook.com>

Documents you may be interested