I recently stumbled across a site that could easily help with your web hosting needs. They are called Web Hosting Search and as the name indicates, they don’t offer hosting, but offer a database of different hosting companies which make it easy to search and compare rates and services. I found my current host and could have actually gotten a deal for the same plan I currently have, which would have saved me a couple dollars a month! They even have a hosting coupon page which displays specials offers they can get you with a number of recommended hosting providers.

We’re merely a guide that tries to shed light on the web hosting business, to sort out the good deals. We rank web hosting services, write reviews and help customers find the right company and the right plan.

They have company profiles for each hosting company and the opportunity for customers to leave a review and rate the host. I think this is a great feature, as it gives an insider’s view of the company. This is a hard thing to find when you don’t have a recommendation from someone you know. When the time comes for me to look for hosting options, I’ll be sure to start with webhostingsearch.com.

A specific use of drag and drop which is a bit more complicated than your average drag & drop needs is a slider. You can use components, but I usually prefer using my own graphics and code, partly because the components tend to bloat the filesize of the swf and partly because that’s just how I am, I like to make it myself. Many projects I’ve worked on require sliders as a form of user input, such as a volume control in my video player, or the inputs for my Voter’s Aide app that let users assign value to issues in the 2008 presidential election. I figured I’d just pull out the code I used with the sliders there, since it was already done. The issue with sliders is we need to restrict the dragging to a certain area, which in itself is a line of code, but I also prefer to allow users to click the actual bar as well for quick selection.

Example

Vertical Slider Steps

The vertical slider here goes from 0 – 100. We need to drag the handle but have it restricted to the slider, so users won’t be confused when they click and drag the handle off the slider and break it. We want to click the background bar of the slider and have the handle snap to that place, and we need to be able to see what value the slider holds (0 – 100). I made this code to be pretty reusable, as long as the slider is set up in similar fashion.

1. Make graphics for slider bg and handle
2. Put the graphics into a slider mc
3. Place them each at 0,0 and center their registration points (for easier control and code later)
4. Assign button mode to handle and bar (for better usability)
5. Add Mouse Down Event Listener for handle and bar and assign press function
6. In bar press function set position of handle according to mouse position, and then call the handle press function
7. In handle press function remove the Mouse Down listeners and add stage mouse event listeners for both mouse Up and Move (Stage listeners emulate onReleaseOutside (from as2) and also provide more accurate results)
8. Define dragging area as a rectangle(x, y, width, height), if you’ve do the set up earlier it should be close to Rectangle(0,0,0,slider.bar.height);
9. Begin dragging handle and apply the drag area limiting rectangle
10. Mouse Move function find value (should simply be the handle’s y position) and updateAfterEvent for smooth animation
11. Mouse Release function remove stage listeners, re-add the listeners to the slider and stop dragging

Actionscript (as3)

Horizontal Slider Steps

Pretty much the same as the vertical slider, but adjust heights and y positions to widths and x positions. Note in this example I have a range of (-100 to 100) and to accomplish the bar I just reused the same on flipping it around, so here we have the handle, the barLeft and the barRight. I use both of these combined to calculate the limiting rectangle area.

Actionscript (as3)

Source

source as3dragdrop-sliders.fla file

This deals with some issues I’m having with the seekbar of a player. The seekbar is the area that displays the video time as a bar that shows your current position/percentage of the video, it can also display the loaded portion of the video among other things as well. Including the video players I’ve made, most player code seems to use bytesLoded / bytesTotal to calculate the amount loaded and display in the loadbar (or whatever you call it), this load bar relates to the filesize as it reads the bytes loaded out of the total. In this same scrub bar area, I like to display the current video time in the playbar as the currentTime / totalTime, notice that this relates to the time and not the file size.

Since video is usually a variable bit rate, the loadbar (size) and the playbar (time) are not representing the same data of the video. Let’s consider an extreme example case video that consists of a first half containing live action with lots of colors and motion while the second half is a still image black and white slideshow. Understandably the first half of the video will be larger in file size than the second half, even though they each represent the same duration or half of a video… So the first half of the loadbar (size) would not correctly represent the first half of the playbar (time). So the user who watching the video load to the half point, and scrubbing to halfway through the video by clicking the load bar will see errors… The player will not be able to play the halfway (time) yet because that time is not yet loaded, even though the file is halfway loaded (size). So if we allow scrubbing through the video by clicking on the loadbar, there is a good chance that the user experience suffers because the loadbar (size) and playbar (time) are not interchangeable
Calculating display bar actionscript code:

Scrub on click actionscript code:

A possible simple solution I’ve thought of is to just display a loading graphic if they click a time which has not yet loaded, but that seems counter intuitive and backwards, since the load bar would display that time as having being loaded.

I have not seen anything in documentation or anywhere online that suggests any other way to display the amount loaded which would represent the amount of TIME loaded rather than SIZE. Is there a way to know what time has loaded in the video and display that in the loadbar rather than display the percent of kb loaded?

Can anyone see something I am missing?

P.S. I already tried a couple forums to no avail: Actionscript.org forum post and gotoandlearn forum post.

Portal website design for StomperNet. Created to give digital access of subscription content: including video, pdf versions of print material (journal). I was responsible for the design of the front end of the site with valid html and css. I also designed the site logo and the graphics on the site. Was able to include some small customized flash elements. Visit public my.stompernet.com site and purchase instant access to StomperNet content inside the my.stompernet.com portal.