Optional Buttons
As of FCPlayer V1.1.8, the loop button, the fullscreen button, and the pop-out button are optional. In order to enable/disable them, open FCPlayer/config/FCPlayerConfig.js with a text editor. Find the section that says:
//Optional Buttons
use_loop_button:true,
use_full_screen_button:true,
use_popout_button:true,
Set to true or false accordingly.
Sliding controls vs fixed
As of FCPlayer V1.1.8, the player controls can be either fixed in place, or set to slide in and out of view as needed. In order to toggle between these two modes of operation, open FCPlayer/config/FCPlayerConfig.js with a text editor. Find the section that says:
//Controls are fixed or sliding?
slide_controls:true,
Set to true or false accordingly.
Styling the player controls
The streamline adustable skin (pro_adjustable.swf) that comes with FCPlayer V1.1.8, allows one to completely specify the colors, transparencies (alphas), and gradient effects applied to the player controls. ( See Also: Changing the player's skin) Please note that the default skin (default.swf) is not adjustable in this way. In order to adjust the style parameters, open FCPlayer/config/FCPlayerConfig.js with a text editor. Find the section that says:
//(style changes can only be applied to adjustable skins)
controls:{
Beneath this, you will see a variety of options for setting the style of the background, button, progress, timekeeper, and volume elements.
All the options are enclosed in double quotes. If nothing is specified between the double quotes of an option, the default style is applied. Example 1 Changing the background color and alpha value (transparency):
background:{
color:"eeeeee",
alpha:"1"
},
Here, we have set the background color to a light gray value, and, with an alpha of 1, the conrols will be opaque.
In general, color options expect a hexadecimal rgb value (like "a8a8a8"), and alpha options expect a value between 0 and 1 (like ".7"). Zero is complete transparency, and 1 is complete opacity.
Example 2 Changing the color gradient of the volume level bar:
volume:{
track:{
colors:["",""],
alphas:["",""]
},
level_bar:{
colors:["000000","ffffff"],
alphas:["",""]
}
Here, we have set the gradient of the level_bar to transition beween black (000000) and white (ffffff).
If you set the two gradient colors to equal values, it will have the same effect as if no gradient was applied.
Example 3 Changing the color of the button icons:
//Global button styles
buttons:{
up:{
icon:{
color:"000000",
alpha:""
},
button_pad:{
colors:["",""],
alphas:["",""]
}
},
over:{
icon:{
color:"000000",
alpha:""
},
border:{
color:"",
alpha:""
},
button_pad:{
colors:["",""],
alphas:["",""]
}
},
down:{
icon:{
color:"000000",
alpha:""
},
border:{
color:"",
alpha:""
},
button_pad:{
colors:["",""],
alphas:["",""]
}
}
Here, we have set the color of all the button icons to black (000000).
As you can see, the buttons have three states: up, over (when you hover over the button) and down (when you press the button). The style changes must be applied seperately to each state. ( Note: Not all states are expressed for every button. For instance, the play button only recognizes the up and over states.)
Example 4 Changing the progress bar inner glow parameters:
progress_bar:{
colors:["",""],
alphas:["",""],
inner_glow:{
color:"ff0000",
blur:"3",
strength:"1.5"
}
The progress bar is the control that allows you to scrub through the movie's timeline. Here, we have set the inner glow of the progress bar to a redish color (ff0000). The blur value specifies the spread of the glow and, for best results, should be a value between 1-10. The strength parameter specifies the strength of the glow and is best set to a value between 1 and 2.
Styling the player controls cont. (Styling individual buttons.)
In the previous section, we demonstrated how to apply a style change to all the player buttons at once. It is also posible to apply style changes to individual buttons. The options for styling individual buttons, however, were not included in the configuration file, in order to save space. You will need to cut and paste the following excerpts into FCPlayerConfig.js in order utilize these options. You need only use the options for the buttons you want to style.
Paste some or all of these button options immediately after the volume object, like this:
Example:
volume:{
track:{
colors:["",""],
alphas:["",""]
},
level_bar:{
colors:["",""],
alphas:["",""]
}
rewind_button:{
up:{
icon:{
color:"",
alpha:""
},
button_pad:{
colors:["",""],
alphas:["",""]
}
},
over:{
icon:{
color:"",
alpha:""
},
border:{
color:"",
alpha:""
},
button_pad:{
colors:["",""],
alphas:["",""]
}
},
down:{
icon:{
color:"",
alpha:""
},
border:{
color:"",
alpha:""
},
button_pad:{
colors:["",""],
alphas:["",""]
}
}
As you can see above, you need to append a comma to the volume object, before pasting in the new options.
These options are written in Javascript object literal notation. You need to make sure that each button object is followed by a comma, except for the last one in the group. Failure to observe the correct formating will result in a Javascript error, which may cause the player to fail. Always make a backup of the configuration file before making major changes to it.
|
