Blogbusters864

Mac Windows Linux / Other. TouchOSC Bridge. TouchOSC Bridge is a standalone application that relays MIDI messages sent from TouchOSC to any MIDI capable application on your computer (and vice versa). TouchOSC Bridge is free to download. TouchOSC version 1.8+ is required to use TouchOSC Bridge. MacOS 10.7 or later is required.

Introduction

• Again, the first Macs with Apple’s own silicon will arrive later this year. Rumor has it that the MacBook Pro and a new iMac (perhaps with a new design) will be the first Macs to ship with ARM.
• It's Apple's answer to touch gestures in Windows 10, and it's most useful in professional apps like the Adobe Creative Suite and Apple's Final Cut Pro X, which let you use the Touch Bar to scrub.
• Apple MacBook Pro w/Touch Bar 15″ The best Macbook Pro & the best Apple Laptop for graphic design. Like we said before, laptops from Apple are not for the budget-conscious. The MacBook Pro with Touch Bar is the company’s best available laptop on the market today and that moniker comes with a high price tag. With an included Touch Bar.

Mobile devices such as smartphones and tablets usually have a capacitivetouch-sensitive screen to capture interactions made with the user's fingers. Asthe mobile web evolves to enable increasingly sophisticated applications, webdevelopers need a way to handle these events. For example, nearly anyfast-paced game requires the player to press multiple buttons at once, which,in the context of a touchscreen, implies multi-touch.

Apple introduced their touchevents API in iOS 2.0. Android has been catching up to this de-factostandard and closing the gap. Recently a W3C working group has come together towork on this touchevents specification.

In this article I’ll dive into the touch events API provided by iOS andAndroid devices, as well as desktop Chrome on hardware that supports touch, and explore what sorts of applications you can build, present somebest practices, and cover useful techniques that make it easier to developtouch-enabled applications.

Touch events

Three basic touch events are outlined in the spec and implementedwidely across mobile devices:

• touchstart: a finger is placed on a DOM element.
• touchmove: a finger is dragged along a DOM element.
• touchend: a finger is removed from a DOM element.

Each touch event includes three lists of touches:

• touches: a list of all fingers currently on the screen.
• targetTouches: a list of fingers on the current DOMelement.
• changedTouches: a list of fingers involved in the currentevent. For example, in a touchend event, this will be the finger that was removed.

These lists consist of objects that contain touch information:

• identifier: a number that uniquely identifies the current finger in thetouch session.
• target: the DOM element that was the target of theaction.
• client/page/screen coordinates: where on the screen the actionhappened.
• radius coordinates and rotationAngle: describe the ellipsethat approximates finger shape.

Touch-enabled apps

The touchstart, touchmove, andtouchend events provide a rich enough feature set to supportvirtually any kind of touch-based interaction – including all of the usualmulti-touch gestures like pinch-zoom, rotation, and so on.

This snippet lets you drag a DOM element around using single-fingertouch:

Below is a samplethat displays all current touches on the screen. It’s useful just to get afeeling for the responsiveness of the device.

Demos

A number of interesting multi-touch demos are already in the wild, suchas this canvas-based drawing demoby Paul Irish and others.

And Browser Ninja, a techdemo that is a Fruit Ninja clone using CSS3 transforms and transitions, as well ascanvas:

Best practices

Prevent zooming

Default settings don't work very well for multi-touch, since your swipes andgestures are often associated with browser behavior, such as scrolling andzooming.

To disable zooming, setup your viewport so that it is not user scalable usingthe following meta tag:

Check out this mobile HTML5 article for more information on setting your viewport.

Prevent scrolling

Some mobile devices have default behaviors for touchmove, such as theclassic iOS overscroll effect, which causes the view to bounce back whenscrolling exceeds the bounds of the content. This is confusing in manymulti-touch applications, and can easily be disabled:

Render carefully

If you are writing a multi-touch application that involves complexmulti-finger gestures, be careful how you react to touch events, since you willbe handling so many at once. Consider the sample in the previous section thatdraws all touches on the screen. You could draw as soon as there is a touchinput:

But this technique does not scale with number of fingers on the screen. Instead, you could track all of the fingers, and render in a loop to get farbetter performance:

Tip: setInterval is not great for animations, since it doesn't take intoaccount the browser's own rendering loop. Modern desktop browsers provide requestAnimationFrame,which is a much better option for performance and battery life reasons. Oncesupported in mobile browsers, this will be the preferred way of doingthings.

Make use of targetTouches and changedTouches

Remember that event.touches is an array of ALLfingers in contact with the screen, not just the ones on the DOM element'starget. You might find it much more useful to use event.targetTouches orevent.changedTouches instead.

Finally, since you are developing for mobile, you should be aware of general mobile best practices, which are covered in Eric Bidelman's article, as well as this W3C document.

Device support

Unfortunately, touch event implementations vary greatly in completeness andquality. I wrote a diagnostics script that displays some basic information about the touch APIimplementation, including which events are supported, and touchmove firingresolution. I tested Android 2.3.3 on Nexus One and Nexus S hardware, Android3.0.1 on Xoom, and iOS 4.2 on iPad and iPhone.

In a nutshell, all tested browsers support the touchstart, touchend, and touchmove events.

The spec provides three additional touch events, but no tested browserssupport them:

• touchenter: a moving finger enters a DOM element.
• touchleave: a moving finger leaves a DOM element.
• touchcancel: a touch is interrupted (implementationspecific).

Within each touch list, the tested browsers also provide thetouches, targetTouches andchangedTouches touch lists. However, no tested browserssupport radiusX, radiusY or rotationAngle, which specify the shape of the finger touching the screen.

During a touchmove, events fire at roughly 60 times a second across alltested devices.

Android 2.3.3 (Nexus)

On the Android Gingerbread Browser (tested on Nexus One and Nexus S), thereis no multi-touch support. This is a known issue.

Android 3.0.1 (Xoom)

On Xoom's browser, there is basic multi-touch support, but it only works ona single DOM element. The browser does not correctly respond to twosimultaneous touches on different DOM elements. In other words, the followingwill react to two simultaneous touches:

But the following will not:

iOS 4.x (iPad, iPhone)

iOS devices fully support multi-touch, are capable of tracking quite a fewfingers and provide a very responsive touch experience in the browser.

Developer tools

In mobile development, it's often easier to start prototyping on the desktopand then tackle the mobile-specific parts on the devices you intend to support.Multi-touch is one of those features that's difficult to test on the PC, sincemost PCs don't have touch input.

Having to test on mobile can lengthen your development cycle, since everychange you make needs to be pushed out to a server and then loaded on thedevice. Then, once running, there’s little you can do to debug yourapplication, since tablets and smartphones lack web developer tooling.

A solution to this problem is to simulate touch events on your developmentmachine. For single-touches, touch events can be simulated based on mouseevents. Multi-touch events can be simulated if you have a device with touchinput, such as a modern Apple MacBook.

Single-touch events

If you would like to simulate single-touch events on your desktop, Chrome provides touch event emulation from the developer tools. Open up the Developer tools, then select the Settings gear, then 'Overrides' or 'Emulation', and turn on 'Emulate touch events'.

For other browsers, you may wish to try outPhantom Limb, which simulates touch events on pages and also gives a giant hand to boot.

There's also the TouchablejQuery plugin that unifies touch and mouse events across platforms.

Multi-touch events

To enable your multi-touch web application to work in your browser on yourmulti-touch trackpad (such as a Apple MacBook or MagicPad), I've created the MagicTouch.js polyfill. Itcaptures touch events from your trackpad and turns them intostandard-compatible touch events.

1. Download and install the npTuioClient NPAPI plugin into~/Library/Internet Plug-Ins/.
2. Download the TongSeng TUIO app for Mac’s MagicPad and startthe server.
3. Download MagicTouch.js, a javascript library tosimulate spec-compatible touch events based on npTuioClient callbacks.
4. Include the magictouch.js script and npTuioClient plugin in yourapplication as follows:

You may need to enable the plugin:

A live demo with magictouch.js is available at paulirish.com/demo/multi:

I tested this approach only with Chrome 10, but it should work on othermodern browsers with only minor tweaks.

If your computer does not have multi-touch input, you can simulate touchevents using other TUIO trackers, such as the reacTIVision. Formore information, see the TUIO project page.

Note that your gestures might be identical to OS-level multi-touch gestures.On OS X, you can configure system-wide events by going to the Trackpadpreference pane in System Preferences.

Touch Designer For Mac

As multi-touch features become more widely supported across mobile browsers,I'm very excited to see new web applications take full advantage of this richAPI.

What's Bluetooth?

Bluetooth is a wireless technology that makes short-range connections between devices (like your Mac, and a mouse or keyboard) at distances up to 10 meters (approximately 30 feet).

And with Bluetooth, your iPhone or iPad can create a 'Personal Hotspot' to provide Internet access for your Mac through your wireless service provider. Learn more about creating a Personal Hotspot with your iOS device.

Touch Designer For Mac Desktop

Find out if your Mac has Bluetooth

Most Mac computers come with Bluetooth technology built-in. You can check to see if your computer supports Bluetooth:

• Look for the Bluetooth icon in the menu bar. If the Bluetooth icon is present, your computer has Bluetooth.
• Choose System Preferences from the Apple menu, then click Bluetooth. If the Bluetooth preferences lists options for enabling Bluetooth and making your device discoverable, Bluetooth is installed.
• From theApplemenu, choose About this Mac, then click More Info. Select Bluetooth from the Hardware section. If the Hardware Setting section shows information, your system has Bluetooth installed.
  

About Bluetooth menu bar icons

The Bluetooth menu bar icon in the upper-right of your display gives you information about the status of Bluetooth and connected devices:

Bluetooth is on, but there are no devices connected to your Mac. If you expect a wireless device to be connected, make sure it's turned on.

Bluetooth is on and at least one wireless device is connected.

At least one wireless device has a low battery. Click the Bluetooth icon to identify the affected device, then replace its batteries.

Bluetooth is off. Click the Bluetooth icon using a wired mouse or trackpad or the built-in trackpad on your Mac notebook and select Turn Bluetooth On.
Mac computers without built-in trackpads won’t allow Bluetooth to be turned off unless a USB mouse is connected.

Bluetooth is offline and unavailable. Restart your Mac. If the Bluetooth status doesn’t change, disconnect all USB devices and restart your Mac again. If Bluetooth continues to show as unavailable, you might need to get your Mac serviced.

Pair your Mac with a Bluetooth device

Bluetooth wireless devices are associated with your computer through a process called pairing. After you pair a device, your Mac automatically connects to it anytime it's in range.

If your Mac came with a wireless keyboard, mouse, or trackpad, they were pre-paired at the factory. Turn on the devices and your Mac should automatically connect to them when your computer starts up.

If you purchased your Apple wireless devices separately, learn how to pair them with your Mac.

After you pair a Bluetooth device with your Mac, you should see it listed in Bluetooth preferences:

Remove a Bluetooth device from your Mac

If you want to remove (unpair) a Bluetooth device from your Mac's device list, follow these steps:

1. Choose Apple menu > System Preferences, then click Bluetooth.
2. Hover the pointer over the device you want to remove, then click the button that appears next to the device's name.

After you remove a Bluetooth device, you'll have to repeat the pairing process if you want to use it again.

Touchdesigner On Virtual Machine

Connect to Bluetooth devices after wake or startup

Bluetooth devices are usually available a few moments after your Mac completes its startup process. After waking from sleep, your Mac should find Apple wireless devices right away. Other wireless devices can take up to 5 seconds to be recognized. You might need to click a button on your wireless mouse to wake it up.

Some Bluetooth devices, such as audio headsets, might disconnect to conserve the device's battery power after no audio or data is present for a certain amount of time. When this happens, you might need to push a button on the device to make it active again. Check the documentation that came with your device for more information.

Wake your computer with Bluetooth devices

Touch Designer For Mac Pro

You can click your paired Bluetooth mouse or press a key on your paired Bluetooth keyboard to wake your Mac. You might need to press the space bar on the keyboard.

If clicking the mouse or pressing a key doesn't wake the computer, you might need to allow wireless devices to wake up your computer:

1. Choose Apple menu > System Preferences, then click Bluetooth.
2. Click Advanced.
3. Select the checkbox next to Allow Bluetooth Devices to wake this computer.
   

Connect multiple Bluetooth devices to one computer

The official Bluetooth specifications say seven is the maximum number of Bluetooth devices that can be connected to your Mac at once.

Touch Designer For Mac Keyboard

However, three to four devices is a practical limit, depending on the types of devices used. Some devices require more Bluetooth data, so they're more demanding than other devices.t perform reliably, try turning off devices you aren't using or unpair them from your Mac.

Fix interference from other household devices

Touch Designer For Mac Osx

Bluetooth shares the 2.4 GHz ISM band with other household devices such as cordless telephones, wireless networks, baby monitors, and microwave ovens. If you see issues with your Bluetooth devices that you suspect might be due to frequency congestion, see AirPort and Bluetooth: Potential sources of wireless interference for further information.

Press startup keys on a Bluetooth keyboard

Touch Designer For Mac Os

You can press keys immediately after startup to have your Mac perform functions like selecting a startup disk, using the recovery partition, or resetting NVRAM.

Learn more at Startup key combinations for Mac.