Calculated Field in Custom CRM 4.0 Form - dynamics-crm-4

The onload event is firing and I am not getting any erroors, but the calculated field is not refreshing?
It should be doing the calculation from the function FWeightedValue().
Here is the code, any help would be appreciated.
frmOnLoad();
onLoad = false;
}
catch(e)
{ alert(e.message); }
}//End of if condition
}//End of function
/* Declare Variables */
var onLoad = true;
var sGlobalVar = '';
function frmOnLoad()
{ ResizeScreen();
AddLogoToFormTitle(160, "/CRM4Legal/_imgs/reznick_small.gif");
fldMerge('name');
fldMerge('customerid');
fldMerge('rg_officeid');
fldStatus();
fldGSMC();
FWeightedValue();
frmTabs();
frmNav();
frmIFrames();
if ($("rg_gsmc" ) != null) $("rg_gsmc" ).onclick = fldGSMC;
}
function FWeightedValue()
{ with ( crmForm.all )
var EstRev = crmForm.getAttribute("estimatedvalue").getValue();
var RiskWeight = Xrm.Page.getAttribute("cpdc_riskweight").getValue();
var RiskPercent = RiskWeight / 100;
Xrm.Page.data.entity.attributes.get("cpdc_riskweightedvalue").setValue(RiskWeightValue);
sectionDisplay( true, cpdc_riskweightedvalue);
}
FWeightedValue.NullCheck = function (value)
{
if (value == null) {
return 0.0;
} else {
return value;
}
}
}
function fldStatus()
{ with ( crmForm.all )
{ if ( statuscode.SelectedText == 'Won' || statuscode.SelectedText == 'Lost' )
{ crmForm.SetFieldReqLevel("rg_winlossreason", 1);
sectionDisplay( false, rg_winlossreason );
}
else
{ crmForm.SetFieldReqLevel("rg_winlossreason", 0);
rg_winlossreason.DataValue = null;
sectionDisplay( true, rg_winlossreason );
}
}
}
function fldGSMC()
{ with ( crmForm.all )
{ sectionDisplay( !rg_gsmc.DataValue, rg_contractnumber );
crmForm.SetFieldReqLevel("rg_contracttype", ( rg_gsmc.DataValue ? 1 : 0 ));
}
}
function fldMerge(fld)
{ if ( fld == null ) { return; }
var cell = $(fld + '_d');
if ( cell == null ) { return; }
var row = cell.parentNode;
if ( row == null ) { return; }
cell.colSpan = 3;
row.removeChild(cell.nextSibling);
row.removeChild(cell.nextSibling);
}
function frmTabs()
{ tab('Hidden', 'hidden');
}
function frmNav()
{ navHide ('nav_rg_opportunity_rg_opportunitypracticearea');
navHide ('nav_rg_opportunity_rg_opportunityservicearea');
navHide ('nav_rg_opportunity_rg_engagementteam');
navHide ('nav_rg_opportunity_rg_opportunityteam');
navHide ('navProducts');
navHide ('navQuotes');
navHide ('navOrders');
navHide ('navInvoices');
navHide ('navComp');
navHide ('_NA_SFA');}
function frmIFrames()
{ /* Engagement Team */
var n2nPA = new N2NViewer('IFRAME_EngagementTeam');
/* Set the role order - use iedevtoolber for exact parameters */
n2nPA.RoleOrder = 1;
/* assing the relationship name (without the "area" word) */
n2nPA.TabsetId = "rg_opportunity_rg_engagementteam";
n2nPA.Load();
/* Opportunity Team */
var n2nPA = new N2NViewer('IFRAME_OpportunityTeam');
n2nPA.RoleOrder = 1;
n2nPA.TabsetId = "rg_opportunity_rg_opportunityteam";
n2nPA.Load();
/* Practice Areas */
var n2nPA = new N2NViewer('IFRAME_PracticeAreas');
n2nPA.RoleOrder = 1;
n2nPA.TabsetId = "rg_opportunity_rg_opportunitypracticearea";
n2nPA.Load();
/* Service Areas */
var n2nService = new N2NViewer('IFRAME_Services');
n2nService.RoleOrder = 1;
n2nService.TabsetId = "rg_opportunity_rg_opportunityservicearea";
n2nService.Load();
}
function $(name)
{ return document.getElementById(name);
}
function navHide (name)
{ if ($(name) != null) { $(name).style.display = "none"; }
}
function tab ( tabName, tabVisibility )
{ tabVisibility = ( tabVisibility == "visible" ? "" : "none" );
var _tabs = crmForm.getElementsByTagName("li");
for (var i = 0; i < _tabs.length; i++)
{ var _tab = _tabs[i];
if ( _tab.innerText == tabName )
{ _tab.style.display = tabVisibility;
break;
}
}
}
function sectionDisplay(vis, sec)
{ sec.parentElement.parentElement.parentElement.style.display = ((vis) ? 'none' : 'block');
}
function ResizeScreen()
{ var aH = screen.availHeight;
var aW = screen.availWidth;
var top = 0;
var left = 0;
if ( aW >= 1124 && aH >= 800)
{ var aH = (aH > 800 ? 800 : 768);
var aW = 1124;
var top = (screen.availHeight - aH) / 2;
var left = (screen.availWidth - aW) / 2;
}
// aH = (crmForm.FormType == frmType.Create ? 295 : aH);
window.moveTo(left, top);
window.resizeTo(aW, aH);
}
function N2NViewer(iframeId)
{ if (!document.all[iframeId])
{ alert(iframeId + " is missing!");
return;
}
var viewer = this;
var _locAssocObj = null;
viewer.IFRAME = document.all[iframeId];
viewer.RoleOrder;
viewer.TabsetId;
viewer.Load = function()
{ if (crmForm.ObjectId != null)
{ /* Construct a valid N2N IFRAME url */
viewer.IFRAME.src = "areas.aspx?oId=" + crmForm.ObjectId + "&oType=" + crmForm.ObjectTypeCode + "&security=" + crmFormSubmit.crmFormSubmitSecurity.value + "&roleOrd=" + viewer.RoleOrder + "&tabSet=" + viewer.TabsetId;
viewer.IFRAME.onreadystatechange = viewer.StateChanged;
}
else
{ viewer.IFRAME.src = "about:blank";
}
}
viewer.StateChanged = function()
{ if (viewer.IFRAME.readyState != 'complete')
{ return;
}
var iframeDoc = viewer.IFRAME.contentWindow.document;
/* Reomve scrolling space */
iframeDoc.body.scroll = "no";
/* Remove crmGrid Default padding */
iframeDoc.body.childNodes[0].rows[0].cells[0].style.padding = 0;
/* Save MS locAssocObj */
_locAssocObj = locAssocObj;
/* Override MS locAssocObj */
locAssocObj = viewer.locAssocObj;
}
viewer.locAssocObj = function(iType , sSubType, sAssociationName, iRoleOrdinal)
{ /* Open the Dialog */
_locAssocObj(iType , sSubType, sAssociationName, iRoleOrdinal);
/* Refresh only if our iframe contains the correnct tabset name */
if (sAssociationName == viewer.TabsetId)
{ viewer.IFRAME.contentWindow.document.all.crmGrid.Refresh();
}
}
}
function AddLogoToFormTitle(logoWidth, logoUrl)
{ var formTitleTable = null;
var tables = document.getElementsByTagName("table");
for(var i = 0; i < tables.length; i++)
{ var className = tables[i].className;
if (className && className.indexOf("ms-crm-Form-Title") == 0)
{ formTitleTable = tables[i];
break;
}
}
if (formTitleTable)
{ var newCell = formTitleTable.rows[0].insertCell(2);
newCell.width = logoWidth;
newCell.vAlign = "middle";
newCell.innerHTML = '<img src="'+logoUrl+'" border="0" align="right" />';
}
}
function UnUsed()
{
if(false)
{
try
{

You mixed CRM 4.0 and CRM 2011 SDKs. No wonder nothing is working!
Below is what should be written if your target platform is CRM 4.0
function FWeightedValue()
{
var EstRev = crmForm.estimatedvalue.DataValue;
var RiskWeight = crmForm.cpdc_riskweight.DataValue;
var RiskPercent = RiskWeight / 100;
crmForm.cpdc_riskweightedvalue.DataValue = RiskWeightValue;
// second parameter is sec ??? or field
sectionDisplay( true, crmForm.cpdc_riskweightedvalue);
}

Did you try Force Submit?
Xrm.Page.getAttribute(fieldName).setSubmitMode("always");

Related

How to convert formatted text to html tag in Google-apps-script?

I want to convert a formatted text in a cell to html but I don't know how to read the format of the text.
Let's say that I have the following text in a cell:
A text with a bold word.
And I would like to convert it in an other cell to:
A text with a <b>bold</b> word.
How can I do that?
I didn't find anything useful in the Spreadsheet API to read format info...Does anyone have any tips?
Thanks.
EDIT: I've created a feature request. Please vote to have the feature.
My Google Script
/**
* Rich Text to HTML.
* #param {string} qRange Input text.
* #returns {string} Text as HTML.
* #customfunction
*/
function RICHTEXT_TO_HTML(qRange) {
var indexBool = false;
var indexItalic = false;
var indexUnderline = false;
var indexStrikethrough = false;
var sheet = SpreadsheetApp.getActiveSpreadsheet();
var range = sheet.getRange(qRange);
var cell = range;
var cellValue = cell.getRichTextValue();
var txt = String(cell.getDisplayValue());
var styles = cell.getTextStyles();
var result = '';
for (var i = 0; i < txt.length; i++) {
var style = cellValue.getTextStyle(i, i + 1);
if (!indexStrikethrough && style.isStrikethrough()) {
indexStrikethrough = true;
result += '<strike>';
} else if (indexStrikethrough && !style.isStrikethrough()) {
indexStrikethrough = false;
result += '</strike>';
}
if (!indexUnderline && style.isUnderline()) {
indexUnderline = true;
result += '<u>';
} else if (indexUnderline && !style.isUnderline()) {
indexUnderline = false;
result += '</u>';
}
if (!indexBool && style.isBold()) {
indexBool = true;
result += '<b>';
} else if (indexBool && !style.isBold()) {
indexBool = false;
result += '</b>';
}
if (!indexItalic && style.isItalic()) {
indexItalic = true;
result += '<i>';
} else if (indexItalic && !style.isItalic()) {
indexItalic = false;
result += '</i>';
}
result += txt[i];
}
if (indexStrikethrough) {
result += '</strike>';
}
if (indexUnderline) {
result += '</u>';
}
if (indexBool) {
result += '</b>';
}
if (indexItalic) {
result += '</i>';
}
return result;
}
Usage
A1 = "My formatted example!!!"
A2 = =RICHTEXT_TO_HTML("A1")
A2 Result = My <i>formatted</i> <b>example</b>!!!
Working example
https://docs.google.com/spreadsheets/d/1mVvE8AdXYKSnaSIfRBrjfOeXxmTkVZovhguMZ3sc47M/edit?usp=sharing
I went ahead and updated this idea to better reflect how we do this is 2021.
/**
* #Author: Emma Sargent
* Rich Text to HTML.
* #param {Range} Google Sheets Range object
* #returns {string} Text as HTML.
* #customfunction
*/
function richTextToHtml(range) {
const runs = range.getRichTextValue().getRuns();
const formattedRuns = runs.map((run) => {
const attr = {
style: '',
};
const text = run.getText();
const link = run.getLinkUrl();
let parentTag = 'span';
if (link) {
parentTag = 'a';
attr.href = link;
}
const style = run.getTextStyle();
const styles = {
'font-family': `'${style.getFontFamily()}'`,
'font-size': `${style.getFontSize()}px`,
color: style.getForegroundColor(),
};
attr.style = Object.entries(styles)
.map(([key, val]) => `${key}: ${val}`)
.join('; ');
let tags = [];
if (style.isBold()) {
tags.push('b');
}
if (style.isItalic()) {
tags.push('i');
}
if (style.isUnderline()) {
tags.push('u');
}
if (style.isStrikethrough()) {
tags.push('strike');
}
const headTags = tags.length ? `<${tags.join('><')}>` : '';
const closeTags = tags.length ? `</${tags.join('></')}>` : '';
const attrStr = Object.entries(attr)
.map(([key, val]) => `${key}="${val}"`)
.join(' ');
const mainTag = `<${parentTag} ${attrStr}>${headTags}${text}${closeTags}</${parentTag}>`;
const lineBreakFormattedStr = mainTag.replace(/[\r\n]/g, '<br>');
return lineBreakFormattedStr;
});
return formattedRuns.join('');
}
And because someone emailed me and asked, here's a version that can be run as a custom function from the formula bar.
Spreadsheet formula: =richTextToHtml("YourSheetName!A1NotationRange")
function richTextToHtml(rangeStr) {
let [sheetName, rangeName] = rangeStr.split("!");
sheetName = sheetName.replaceAll("'",'');
const range = SpreadsheetApp.getActiveSpreadsheet().getSheetByName(sheetName).getRange(rangeName);
const runs = range.getRichTextValue().getRuns();
const formattedRuns = runs.map((run) => {
const attr = {
style: '',
};
const text = run.getText();
const link = run.getLinkUrl();
let parentTag = 'span';
if (link) {
parentTag = 'a';
attr.href = link;
}
const style = run.getTextStyle();
const styles = {
'font-family': `'${style.getFontFamily()}'`,
'font-size': `${style.getFontSize()}px`,
color: style.getForegroundColor(),
};
attr.style = Object.entries(styles)
.map(([key, val]) => `${key}: ${val}`)
.join('; ');
let tags = [];
if (style.isBold()) {
tags.push('b');
}
if (style.isItalic()) {
tags.push('i');
}
if (style.isUnderline()) {
tags.push('u');
}
if (style.isStrikethrough()) {
tags.push('strike');
}
const headTags = tags.length ? `<${tags.join('><')}>` : '';
const closeTags = tags.length ? `</${tags.join('></')}>` : '';
const attrStr = Object.entries(attr)
.map(([key, val]) => `${key}="${val}"`)
.join(' ');
const mainTag = `<${parentTag} ${attrStr}>${headTags}${text}${closeTags}</${parentTag}>`;
const lineBreakFormattedStr = mainTag.replace(/[\r\n]/g, '<br>');
return lineBreakFormattedStr;
});
return formattedRuns.join('');
}
Demo sheet here: https://docs.google.com/spreadsheets/d/1X8I_lRXwoUXWRKb2hZPztDIPRs2nmXGtOuWmnrKWjAg/edit?usp=sharing
Thank you Eduardo Cuomo for the answer. I wanted to add the code to get down to the bottom line with a little fix.
/**
* #Author: Eduardo Cuomo
* Rich Text to HTML.
* #param {string} qRange Input text.
* #returns {string} Text as HTML.
* #customfunction
*/
function RICHTEXT_TO_HTML(qRange) {
var indexBool = false;
var indexItalic = false;
var indexUnderline = false;
var indexStrikethrough = false;
var sheet = SpreadsheetApp.getActiveSpreadsheet();
var range = sheet.getRange(qRange);
var cell = range;
var cellValue = cell.getRichTextValue();
var txt = String(cell.getDisplayValue());
var styles = cell.getTextStyles();
var result = '';
for (var i = 0; i < txt.length; i++) {
if(txt[i]=="\n"){
result += '<br>';
}else{
var style = cellValue.getTextStyle(i, i + 1);
if (!indexStrikethrough && style.isStrikethrough()) {
indexStrikethrough = true;
result += '<strike>';
} else if (indexStrikethrough && !style.isStrikethrough()) {
indexStrikethrough = false;
result += '</strike>';
}
if (!indexUnderline && style.isUnderline()) {
indexUnderline = true;
result += '<u>';
} else if (indexUnderline && !style.isUnderline()) {
indexUnderline = false;
result += '</u>';
}
if (!indexBool && style.isBold()) {
indexBool = true;
result += '<b>';
} else if (indexBool && !style.isBold()) {
indexBool = false;
result += '</b>';
}
if (!indexItalic && style.isItalic()) {
indexItalic = true;
result += '<i>';
} else if (indexItalic && !style.isItalic()) {
indexItalic = false;
result += '</i>';
}
result += txt[i];
}
}
if (indexStrikethrough) {
result += '</strike>';
}
if (indexUnderline) {
result += '</u>';
}
if (indexBool) {
result += '</b>';
}
if (indexItalic) {
result += '</i>';
}
return result;
}
Here's a version that creates more compact HTML (avoiding lots of spans setting styles):
function richTextToHtml(range) {
let lastFont = null, lastSize = null, lastColor = null, lastLink = null;
let parentClose = '';
return range.getRichTextValue()
.getRuns()
.map(run => {
const text = run.getText().replace(/[\r\n]/g, '<br>');
const style = run.getTextStyle();
const font = style.getFontFamily();
const size = style.getFontSize();
const color = style.getForegroundColor();
const link = run.getLinkUrl();
let mainTag = '';
if (font !== lastFont || size !== lastSize || color !== lastColor || link !== lastLink) {
mainTag += parentClose;
mainTag += link ? `<a href="${link}"` : '<span';
mainTag +=
` style="font-family:'${font}';font-size:${size}px;color:${color}">`;
parentClose = link ? '</a>' : '</span>';
lastFont = font;
lastSize = size;
lastColor = color;
lastLink = link;
}
let closeTags = '';
Object.entries({isBold: 'b', isItalic: 'i', isUnderline: 'u', isStrikethrough: 'strike'})
.filter(([getter, tag]) => style[getter]())
.forEach(([getter, tag]) => {
mainTag += `<${tag}>`;
closeTags = `</${tag}>${closeTags}`;
});
return `${mainTag}${text}${closeTags}`;
})
.join('') + parentClose;
}
You need to use getFontWeight properties of the Range to read these formating values. Example given here: GAS-check-cell-format
Check Rucent88's answer.

Issue with a zero showing after a decimal point

I have a script set up to extract figures from a csv file into a webpage. We have a problem in that a figure that have a 0 after the decimal point is being ignored so whilst the csv file shows 1.094 when teh figure is transferred to the webpage it is 1.94
There is a js script and then an asp script that works the function
function getHTTPObject()
{
var x = null;
if (window.XMLHttpRequest)
{
x = new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
x = new ActiveXObject("Microsoft.XMLHTTP");
if (!x)
{
x = new ActiveXObject("Msxml2.XMLHTTP");
}
}
return x;
}
var gobj = getHTTPObject();
window.onload=update();
function update()
{
var xpath = "ratesxtract.asp";
if (gobj) {
gobj.open("GET", xpath, true);
gobj.onreadystatechange = update_all;
gobj.send(null);
}
else {alert("XMLHTTP access problem. Please exit page and try again" ); }
}
function update_all()
{
if (gobj.readyState == 4) {
if (gobj.status == 200) {
// dobj = document.getElementById("BLastUpdated");
var A = gobj.responseText;
// dobj.innerHTML = A;
if (A == "error") {alert("XMLHTTP access problem. Please exit page and contact us" ); }
else { processfile(A); }
}
}
function processfile(A)
{
var errormess = "none";
var AA = new String(A);
AA = AA.split("$");
var nName = null;
var dobj = null;
var nValue = null;
var i = 0;
for (i = 0; i < AA.length; i++) {
if (AA[i].charAt(0) == "Z") {
nName = AA[i];
dobj = document.getElementById(nName);
}
else { nValue = "";
nValue += AA[i];
dobj.innerHTML = nValue;
}
}
if ( i == 0 ) { errormess = "failed to access exchange rates data, please exit page and try again";
alert(errormess)
}
}
ASP SCRIPT
<%#LANGUAGE='JScript'%>
<%
var sfile = Server.MapPath("forex\\ratefile.csv");
var fs = Server.CreateObject("Scripting.FileSystemObject");
var fsT = fs.OpenTextFile(sfile, 1, 0);
var xline;
var p = 0;
var q = 0;
var d = 0;
var i = 0;
var n = 0;
var t = 0;
var ts = 0;
var mname;
var mprice;
var mtime = "";
var INLine
var LN;
var cresult = "";
while(!fsT.AtEndOfStream) {
INLine = fsT.ReadLine();
xline = String(INLine);
if ( p != 0) {
LN = xline.split(",");
mname = xtrim(LN[0]);
mprice = doamount3(LN[1]);
if (p == 1) { mtime = xtrim(LN[2]); }
if (n > 0){ cresult += "$"; }
n++;
cresult += "Z" + mname + "$" + mprice;
}
p++;
}
cresult += "$ZTIM$" + mtime;
fsT.Close();
Response.Write(cresult);
%>
<%
function xtrim(x)
{
var xd = x.replace(/^\s+|\s+$/gm,'');
return xd;
}
function doamount3(amt)
{
var ZLine = String(amt);
ZLine = xtrim(ZLine);
if (ZLine.indexOf(".") == -1) {
ZLine += ".00";
return(ZLine);
}
var idata = ZLine.split(".");
var xadp = new String(idata[1]);
var xlen = xadp.length;
if (xlen == 1) {
idata[1] = xadp + "00";
ZLine = idata[0] + "." + idata[1];
return(ZLine);
}
if (xlen == 2) {
idata[1] = xadp + "0";
ZLine = idata[0] + "." + idata[1];
return(ZLine);
}
var p4 = xadp.charAt(3);
var p3 = parseInt(xadp.substring(0,3), 10);
if (p4 > 4) { p3 += 0; }
idata[1] = String(p3);
ZLine = idata[0] + "." + idata[1];
return(ZLine);
}
%>
If anyone can help be greatly appreciated

How do I make a drop down menu?

<ul id="MenuBar2" class="MenuBarHorizontal">
<li><a class="MenuBarItemSubmenu" href="#">Item 1</a>
<ul>
<li>Mr</li>
<li>Mrs</li>
<li>Miss</li>
<li>Ms</li>
<li>Master</li>
<li>Prof.</li>
<li>Dr</li>
</ul>
</li>
</ul>
This is the code that I have used on Dreamweaver Cs6. The drop down works however, when I click on one of the titles, it doesn't select it. Could someone explain how to fix this problem please.
Thanks :)
If you are using the default Spry menu provided by Dreamweaver, you have to make sure that in the head section that SpryMenuBar.js and SpryMenuBarHorizontal.css are included.
If so you have also to insert
<script type="text/javascript">
var MenuBar2 = new Spry.Widget.MenuBar("MenuBar2", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
</script>
before </body>
So you end code should look like this
(function() { // BeginSpryComponent
if (typeof Spry == "undefined") window.Spry = {}; if (!Spry.Widget) Spry.Widget = {};
Spry.BrowserSniff = function()
{
var b = navigator.appName.toString();
var up = navigator.platform.toString();
var ua = navigator.userAgent.toString();
this.mozilla = this.ie = this.opera = this.safari = false;
var re_opera = /Opera.([0-9\.]*)/i;
var re_msie = /MSIE.([0-9\.]*)/i;
var re_gecko = /gecko/i;
var re_safari = /(applewebkit|safari)\/([\d\.]*)/i;
var r = false;
if ( (r = ua.match(re_opera))) {
this.opera = true;
this.version = parseFloat(r[1]);
} else if ( (r = ua.match(re_msie))) {
this.ie = true;
this.version = parseFloat(r[1]);
} else if ( (r = ua.match(re_safari))) {
this.safari = true;
this.version = parseFloat(r[2]);
} else if (ua.match(re_gecko)) {
var re_gecko_version = /rv:\s*([0-9\.]+)/i;
r = ua.match(re_gecko_version);
this.mozilla = true;
this.version = parseFloat(r[1]);
}
this.windows = this.mac = this.linux = false;
this.Platform = ua.match(/windows/i) ? "windows" :
(ua.match(/linux/i) ? "linux" :
(ua.match(/mac/i) ? "mac" :
ua.match(/unix/i)? "unix" : "unknown"));
this[this.Platform] = true;
this.v = this.version;
if (this.safari && this.mac && this.mozilla) {
this.mozilla = false;
}
};
Spry.is = new Spry.BrowserSniff();
// Constructor for Menu Bar
// element should be an ID of an unordered list (<ul> tag)
// preloadImage1 and preloadImage2 are images for the rollover state of a menu
Spry.Widget.MenuBar = function(element, opts)
{
this.init(element, opts);
};
Spry.Widget.MenuBar.prototype.init = function(element, opts)
{
this.element = this.getElement(element);
// represents the current (sub)menu we are operating on
this.currMenu = null;
this.showDelay = 250;
this.hideDelay = 600;
if(typeof document.getElementById == 'undefined' || (navigator.vendor == 'Apple Computer, Inc.' && typeof window.XMLHttpRequest == 'undefined') || (Spry.is.ie && typeof document.uniqueID == 'undefined'))
{
// bail on older unsupported browsers
return;
}
// Fix IE6 CSS images flicker
if (Spry.is.ie && Spry.is.version < 7){
try {
document.execCommand("BackgroundImageCache", false, true);
} catch(err) {}
}
this.upKeyCode = Spry.Widget.MenuBar.KEY_UP;
this.downKeyCode = Spry.Widget.MenuBar.KEY_DOWN;
this.leftKeyCode = Spry.Widget.MenuBar.KEY_LEFT;
this.rightKeyCode = Spry.Widget.MenuBar.KEY_RIGHT;
this.escKeyCode = Spry.Widget.MenuBar.KEY_ESC;
this.hoverClass = 'MenuBarItemHover';
this.subHoverClass = 'MenuBarItemSubmenuHover';
this.subVisibleClass ='MenuBarSubmenuVisible';
this.hasSubClass = 'MenuBarItemSubmenu';
this.activeClass = 'MenuBarActive';
this.isieClass = 'MenuBarItemIE';
this.verticalClass = 'MenuBarVertical';
this.horizontalClass = 'MenuBarHorizontal';
this.enableKeyboardNavigation = true;
this.hasFocus = false;
// load hover images now
if(opts)
{
for(var k in opts)
{
if (typeof this[k] == 'undefined')
{
var rollover = new Image;
rollover.src = opts[k];
}
}
Spry.Widget.MenuBar.setOptions(this, opts);
}
// safari doesn't support tabindex
if (Spry.is.safari)
this.enableKeyboardNavigation = false;
if(this.element)
{
this.currMenu = this.element;
var items = this.element.getElementsByTagName('li');
for(var i=0; i<items.length; i++)
{
if (i > 0 && this.enableKeyboardNavigation)
items[i].getElementsByTagName('a')[0].tabIndex='-1';
this.initialize(items[i], element);
if(Spry.is.ie)
{
this.addClassName(items[i], this.isieClass);
items[i].style.position = "static";
}
}
if (this.enableKeyboardNavigation)
{
var self = this;
this.addEventListener(document, 'keydown', function(e){self.keyDown(e); }, false);
}
if(Spry.is.ie)
{
if(this.hasClassName(this.element, this.verticalClass))
{
this.element.style.position = "relative";
}
var linkitems = this.element.getElementsByTagName('a');
for(var i=0; i<linkitems.length; i++)
{
linkitems[i].style.position = "relative";
}
}
}
};
Spry.Widget.MenuBar.KEY_ESC = 27;
Spry.Widget.MenuBar.KEY_UP = 38;
Spry.Widget.MenuBar.KEY_DOWN = 40;
Spry.Widget.MenuBar.KEY_LEFT = 37;
Spry.Widget.MenuBar.KEY_RIGHT = 39;
Spry.Widget.MenuBar.prototype.getElement = function(ele)
{
if (ele && typeof ele == "string")
return document.getElementById(ele);
return ele;
};
Spry.Widget.MenuBar.prototype.hasClassName = function(ele, className)
{
if (!ele || !className || !ele.className || ele.className.search(new RegExp("\\b" + className + "\\b")) == -1)
{
return false;
}
return true;
};
Spry.Widget.MenuBar.prototype.addClassName = function(ele, className)
{
if (!ele || !className || this.hasClassName(ele, className))
return;
ele.className += (ele.className ? " " : "") + className;
};
Spry.Widget.MenuBar.prototype.removeClassName = function(ele, className)
{
if (!ele || !className || !this.hasClassName(ele, className))
return;
ele.className = ele.className.replace(new RegExp("\\s*\\b" + className + "\\b", "g"), "");
};
// addEventListener for Menu Bar
// attach an event to a tag without creating obtrusive HTML code
Spry.Widget.MenuBar.prototype.addEventListener = function(element, eventType, handler, capture)
{
try
{
if (element.addEventListener)
{
element.addEventListener(eventType, handler, capture);
}
else if (element.attachEvent)
{
element.attachEvent('on' + eventType, handler);
}
}
catch (e) {}
};
// createIframeLayer for Menu Bar
// creates an IFRAME underneath a menu so that it will show above form controls and ActiveX
Spry.Widget.MenuBar.prototype.createIframeLayer = function(menu)
{
var layer = document.createElement('iframe');
layer.tabIndex = '-1';
layer.src = 'javascript:""';
layer.frameBorder = '0';
layer.scrolling = 'no';
menu.parentNode.appendChild(layer);
layer.style.left = menu.offsetLeft + 'px';
layer.style.top = menu.offsetTop + 'px';
layer.style.width = menu.offsetWidth + 'px';
layer.style.height = menu.offsetHeight + 'px';
};
// removeIframeLayer for Menu Bar
// removes an IFRAME underneath a menu to reveal any form controls and ActiveX
Spry.Widget.MenuBar.prototype.removeIframeLayer = function(menu)
{
var layers = ((menu == this.element) ? menu : menu.parentNode).getElementsByTagName('iframe');
while(layers.length > 0)
{
layers[0].parentNode.removeChild(layers[0]);
}
};
// clearMenus for Menu Bar
// root is the top level unordered list (<ul> tag)
Spry.Widget.MenuBar.prototype.clearMenus = function(root)
{
var menus = root.getElementsByTagName('ul');
for(var i=0; i<menus.length; i++)
this.hideSubmenu(menus[i]);
this.removeClassName(this.element, this.activeClass);
};
// bubbledTextEvent for Menu Bar
// identify bubbled up text events in Safari so we can ignore them
Spry.Widget.MenuBar.prototype.bubbledTextEvent = function()
{
return Spry.is.safari && (event.target == event.relatedTarget.parentNode || (event.eventPhase == 3 && event.target.parentNode == event.relatedTarget));
};
// showSubmenu for Menu Bar
// set the proper CSS class on this menu to show it
Spry.Widget.MenuBar.prototype.showSubmenu = function(menu)
{
if(this.currMenu)
{
this.clearMenus(this.currMenu);
this.currMenu = null;
}
if(menu)
{
this.addClassName(menu, this.subVisibleClass);
if(typeof document.all != 'undefined' && !Spry.is.opera && navigator.vendor != 'KDE')
{
if(!this.hasClassName(this.element, this.horizontalClass) || menu.parentNode.parentNode != this.element)
{
menu.style.top = menu.parentNode.offsetTop + 'px';
}
}
if(Spry.is.ie && Spry.is.version < 7)
{
this.createIframeLayer(menu);
}
}
this.addClassName(this.element, this.activeClass);
};
// hideSubmenu for Menu Bar
// remove the proper CSS class on this menu to hide it
Spry.Widget.MenuBar.prototype.hideSubmenu = function(menu)
{
if(menu)
{
this.removeClassName(menu, this.subVisibleClass);
if(typeof document.all != 'undefined' && !Spry.is.opera && navigator.vendor != 'KDE')
{
menu.style.top = '';
menu.style.left = '';
}
if(Spry.is.ie && Spry.is.version < 7)
this.removeIframeLayer(menu);
}
};
// initialize for Menu Bar
// create event listeners for the Menu Bar widget so we can properly
// show and hide submenus
Spry.Widget.MenuBar.prototype.initialize = function(listitem, element)
{
var opentime, closetime;
var link = listitem.getElementsByTagName('a')[0];
var submenus = listitem.getElementsByTagName('ul');
var menu = (submenus.length > 0 ? submenus[0] : null);
if(menu)
this.addClassName(link, this.hasSubClass);
if(!Spry.is.ie)
{
// define a simple function that comes standard in IE to determine
// if a node is within another node
listitem.contains = function(testNode)
{
// this refers to the list item
if(testNode == null)
return false;
if(testNode == this)
return true;
else
return this.contains(testNode.parentNode);
};
}
// need to save this for scope further down
var self = this;
this.addEventListener(listitem, 'mouseover', function(e){self.mouseOver(listitem, e);}, false);
this.addEventListener(listitem, 'mouseout', function(e){if (self.enableKeyboardNavigation) self.clearSelection(); self.mouseOut(listitem, e);}, false);
if (this.enableKeyboardNavigation)
{
this.addEventListener(link, 'blur', function(e){self.onBlur(listitem);}, false);
this.addEventListener(link, 'focus', function(e){self.keyFocus(listitem, e);}, false);
}
};
Spry.Widget.MenuBar.prototype.keyFocus = function (listitem, e)
{
this.lastOpen = listitem.getElementsByTagName('a')[0];
this.addClassName(this.lastOpen, listitem.getElementsByTagName('ul').length > 0 ? this.subHoverClass : this.hoverClass);
this.hasFocus = true;
};
Spry.Widget.MenuBar.prototype.onBlur = function (listitem)
{
this.clearSelection(listitem);
};
Spry.Widget.MenuBar.prototype.clearSelection = function(el){
//search any intersection with the current open element
if (!this.lastOpen)
return;
if (el)
{
el = el.getElementsByTagName('a')[0];
// check children
var item = this.lastOpen;
while (item != this.element)
{
var tmp = el;
while (tmp != this.element)
{
if (tmp == item)
return;
try{
tmp = tmp.parentNode;
}catch(err){break;}
}
item = item.parentNode;
}
}
var item = this.lastOpen;
while (item != this.element)
{
this.hideSubmenu(item.parentNode);
var link = item.getElementsByTagName('a')[0];
this.removeClassName(link, this.hoverClass);
this.removeClassName(link, this.subHoverClass);
item = item.parentNode;
}
this.lastOpen = false;
};
Spry.Widget.MenuBar.prototype.keyDown = function (e)
{
if (!this.hasFocus)
return;
if (!this.lastOpen)
{
this.hasFocus = false;
return;
}
var e = e|| event;
var listitem = this.lastOpen.parentNode;
var link = this.lastOpen;
var submenus = listitem.getElementsByTagName('ul');
var menu = (submenus.length > 0 ? submenus[0] : null);
var hasSubMenu = (menu) ? true : false;
var opts = [listitem, menu, null, this.getSibling(listitem, 'previousSibling'), this.getSibling(listitem, 'nextSibling')];
if (!opts[3])
opts[2] = (listitem.parentNode.parentNode.nodeName.toLowerCase() == 'li')?listitem.parentNode.parentNode:null;
var found = 0;
switch (e.keyCode){
case this.upKeyCode:
found = this.getElementForKey(opts, 'y', 1);
break;
case this.downKeyCode:
found = this.getElementForKey(opts, 'y', -1);
break;
case this.leftKeyCode:
found = this.getElementForKey(opts, 'x', 1);
break;
case this.rightKeyCode:
found = this.getElementForKey(opts, 'x', -1);
break;
case this.escKeyCode:
case 9:
this.clearSelection();
this.hasFocus = false;
default: return;
}
switch (found)
{
case 0: return;
case 1:
//subopts
this.mouseOver(listitem, e);
break;
case 2:
//parent
this.mouseOut(opts[2], e);
break;
case 3:
case 4:
// left - right
this.removeClassName(link, hasSubMenu ? this.subHoverClass : this.hoverClass);
break;
}
var link = opts[found].getElementsByTagName('a')[0];
if (opts[found].nodeName.toLowerCase() == 'ul')
opts[found] = opts[found].getElementsByTagName('li')[0];
this.addClassName(link, opts[found].getElementsByTagName('ul').length > 0 ? this.subHoverClass : this.hoverClass);
this.lastOpen = link;
opts[found].getElementsByTagName('a')[0].focus();
//stop further event handling by the browser
return Spry.Widget.MenuBar.stopPropagation(e);
};
Spry.Widget.MenuBar.prototype.mouseOver = function (listitem, e)
{
var link = listitem.getElementsByTagName('a')[0];
var submenus = listitem.getElementsByTagName('ul');
var menu = (submenus.length > 0 ? submenus[0] : null);
var hasSubMenu = (menu) ? true : false;
if (this.enableKeyboardNavigation)
this.clearSelection(listitem);
if(this.bubbledTextEvent())
{
// ignore bubbled text events
return;
}
if (listitem.closetime)
clearTimeout(listitem.closetime);
if(this.currMenu == listitem)
{
this.currMenu = null;
}
// move the focus too
if (this.hasFocus)
link.focus();
// show menu highlighting
this.addClassName(link, hasSubMenu ? this.subHoverClass : this.hoverClass);
this.lastOpen = link;
if(menu && !this.hasClassName(menu, this.subHoverClass))
{
var self = this;
listitem.opentime = window.setTimeout(function(){self.showSubmenu(menu);}, this.showDelay);
}
};
Spry.Widget.MenuBar.prototype.mouseOut = function (listitem, e)
{
var link = listitem.getElementsByTagName('a')[0];
var submenus = listitem.getElementsByTagName('ul');
var menu = (submenus.length > 0 ? submenus[0] : null);
var hasSubMenu = (menu) ? true : false;
if(this.bubbledTextEvent())
{
// ignore bubbled text events
return;
}
var related = (typeof e.relatedTarget != 'undefined' ? e.relatedTarget : e.toElement);
if(!listitem.contains(related))
{
if (listitem.opentime)
clearTimeout(listitem.opentime);
this.currMenu = listitem;
// remove menu highlighting
this.removeClassName(link, hasSubMenu ? this.subHoverClass : this.hoverClass);
if(menu)
{
var self = this;
listitem.closetime = window.setTimeout(function(){self.hideSubmenu(menu);}, this.hideDelay);
}
if (this.hasFocus)
link.blur();
}
};
Spry.Widget.MenuBar.prototype.getSibling = function(element, sibling)
{
var child = element[sibling];
while (child && child.nodeName.toLowerCase() !='li')
child = child[sibling];
return child;
};
Spry.Widget.MenuBar.prototype.getElementForKey = function(els, prop, dir)
{
var found = 0;
var rect = Spry.Widget.MenuBar.getPosition;
var ref = rect(els[found]);
var hideSubmenu = false;
//make the subelement visible to compute the position
if (els[1] && !this.hasClassName(els[1], this.MenuBarSubmenuVisible))
{
els[1].style.visibility = 'hidden';
this.showSubmenu(els[1]);
hideSubmenu = true;
}
var isVert = this.hasClassName(this.element, this.verticalClass);
var hasParent = els[0].parentNode.parentNode.nodeName.toLowerCase() == 'li' ? true : false;
for (var i = 1; i < els.length; i++){
//when navigating on the y axis in vertical menus, ignore children and parents
if(prop=='y' && isVert && (i==1 || i==2))
{
continue;
}
//when navigationg on the x axis in the FIRST LEVEL of horizontal menus, ignore children and parents
if(prop=='x' && !isVert && !hasParent && (i==1 || i==2))
{
continue;
}
if (els[i])
{
var tmp = rect(els[i]);
if ( (dir * tmp[prop]) < (dir * ref[prop]))
{
ref = tmp;
found = i;
}
}
}
// hide back the submenu
if (els[1] && hideSubmenu){
this.hideSubmenu(els[1]);
els[1].style.visibility = '';
}
return found;
};
Spry.Widget.MenuBar.camelize = function(str)
{
if (str.indexOf('-') == -1){
return str;
}
var oStringList = str.split('-');
var isFirstEntry = true;
var camelizedString = '';
for(var i=0; i < oStringList.length; i++)
{
if(oStringList[i].length>0)
{
if(isFirstEntry)
{
camelizedString = oStringList[i];
isFirstEntry = false;
}
else
{
var s = oStringList[i];
camelizedString += s.charAt(0).toUpperCase() + s.substring(1);
}
}
}
return camelizedString;
};
Spry.Widget.MenuBar.getStyleProp = function(element, prop)
{
var value;
try
{
if (element.style)
value = element.style[Spry.Widget.MenuBar.camelize(prop)];
if (!value)
if (document.defaultView && document.defaultView.getComputedStyle)
{
var css = document.defaultView.getComputedStyle(element, null);
value = css ? css.getPropertyValue(prop) : null;
}
else if (element.currentStyle)
{
value = element.currentStyle[Spry.Widget.MenuBar.camelize(prop)];
}
}
catch (e) {}
return value == 'auto' ? null : value;
};
Spry.Widget.MenuBar.getIntProp = function(element, prop)
{
var a = parseInt(Spry.Widget.MenuBar.getStyleProp(element, prop),10);
if (isNaN(a))
return 0;
return a;
};
Spry.Widget.MenuBar.getPosition = function(el, doc)
{
doc = doc || document;
if (typeof(el) == 'string') {
el = doc.getElementById(el);
}
if (!el) {
return false;
}
if (el.parentNode === null || Spry.Widget.MenuBar.getStyleProp(el, 'display') == 'none') {
//element must be visible to have a box
return false;
}
var ret = {x:0, y:0};
var parent = null;
var box;
if (el.getBoundingClientRect) { // IE
box = el.getBoundingClientRect();
var scrollTop = doc.documentElement.scrollTop || doc.body.scrollTop;
var scrollLeft = doc.documentElement.scrollLeft || doc.body.scrollLeft;
ret.x = box.left + scrollLeft;
ret.y = box.top + scrollTop;
} else if (doc.getBoxObjectFor) { // gecko
box = doc.getBoxObjectFor(el);
ret.x = box.x;
ret.y = box.y;
} else { // safari/opera
ret.x = el.offsetLeft;
ret.y = el.offsetTop;
parent = el.offsetParent;
if (parent != el) {
while (parent) {
ret.x += parent.offsetLeft;
ret.y += parent.offsetTop;
parent = parent.offsetParent;
}
}
// opera & (safari absolute) incorrectly account for body offsetTop
if (Spry.is.opera || Spry.is.safari && Spry.Widget.MenuBar.getStyleProp(el, 'position') == 'absolute')
ret.y -= doc.body.offsetTop;
}
if (el.parentNode)
parent = el.parentNode;
else
parent = null;
if (parent.nodeName){
var cas = parent.nodeName.toUpperCase();
while (parent && cas != 'BODY' && cas != 'HTML') {
cas = parent.nodeName.toUpperCase();
ret.x -= parent.scrollLeft;
ret.y -= parent.scrollTop;
if (parent.parentNode)
parent = parent.parentNode;
else
parent = null;
}
}
return ret;
};
Spry.Widget.MenuBar.stopPropagation = function(ev)
{
if (ev.stopPropagation)
ev.stopPropagation();
else
ev.cancelBubble = true;
if (ev.preventDefault)
ev.preventDefault();
else
ev.returnValue = false;
};
Spry.Widget.MenuBar.setOptions = function(obj, optionsObj, ignoreUndefinedProps)
{
if (!optionsObj)
return;
for (var optionName in optionsObj)
{
if (ignoreUndefinedProps && optionsObj[optionName] == undefined)
continue;
obj[optionName] = optionsObj[optionName];
}
};
})(); // EndSpryComponent
var MenuBar2 = new Spry.Widget.MenuBar("MenuBar2", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
ul.MenuBarHorizontal
{
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
cursor: default;
width: auto;
}
ul.MenuBarActive
{
z-index: 1000;
}
ul.MenuBarHorizontal li
{
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
position: relative;
text-align: left;
cursor: pointer;
width: 8em;
float: left;
}
ul.MenuBarHorizontal ul
{
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
z-index: 1020;
cursor: default;
width: 8.2em;
position: absolute;
left: -1000em;
}
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
{
left: auto;
}
ul.MenuBarHorizontal ul li
{
width: 8.2em;
}
ul.MenuBarHorizontal ul ul
{
position: absolute;
margin: -5% 0 0 95%;
}
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
{
left: auto;
top: 0;
}
ul.MenuBarHorizontal ul
{
border: 1px solid #CCC;
}
ul.MenuBarHorizontal a
{
display: block;
cursor: pointer;
background-color: #EEE;
padding: 0.5em 0.75em;
color: #333;
text-decoration: none;
}
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
{
background-color: #33C;
color: #FFF;
}
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
{
background-color: #33C;
color: #FFF;
}
ul.MenuBarHorizontal a.MenuBarItemSubmenu
{
background-image: url(SpryMenuBarDown.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
}
ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
{
background-image: url(SpryMenuBarRight.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
}
ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
{
background-image: url(SpryMenuBarDownHover.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
}
ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
{
background-image: url(SpryMenuBarRightHover.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
}
ul.MenuBarHorizontal iframe
{
position: absolute;
z-index: 1010;
filter:alpha(opacity:0.1);
}
#media screen, projection
{
ul.MenuBarHorizontal li.MenuBarItemIE
{
display: inline;
f\loat: left;
background: #FFF;
}
}
<ul id="MenuBar2" class="MenuBarHorizontal">
<li><a class="MenuBarItemSubmenu" href="#">Item 1</a>
<ul>
<li>Mr</li>
<li>Mrs</li>
<li>Miss</li>
<li>Ms</li>
<li>Master</li>
<li>Prof.</li>
<li>Dr</li>
</ul>
</li>
</ul>
You can include Bootstrap to your website and follow these examples:
Dropdowns
Beautiful Dropdowns
Split button Dropdowns

play audio range in html5

I would like to be able to have buttons that can play certain audio ranges from a larger file. Something like:
<button onclick="playClip('http://blah/source1.mp3', 2.5, 3.0, 1.0)">Play clip 1</button>
<button onclick="playClip('http://blah/source2.mp3', 10.0, 2.0, 0.5)">Play clip 2 slow</button>
where playClip has a pattern like this:
function playClip(src, startOffset, length, rate) {
// What to put here?
}
Or instead of a length, an ending offset.
Can some one point me to code that can do that, or help me write it? The closest I could find is https://gist.github.com/remy/753003/download# but I need different sized clips, from possibly different files, and with a playback rate specified. I'm afraid I've limited experience with Javascript.
I'm trying to replace a Silverlight app that does this.
Thanks.
-John
Either use Media Fragments URI syntax:
var src,
startOffset,
endOffset,
playbackRate,
audio = new Audio(src + '#t=' + startOffset + ',' + endOffset);
audio.onloadedmetadata = function() {
audio.playbackRate = playbackRate;
audio.play();
};
or timeupdate event:
var audio = new Audio( ... ),
startOffset,
endOffset,
playbackRate;
audio.onloadedmetadata = function() {
audio.playbackRate = playbackRate;
audio.currentTime = startOffset;
audio.play();
};
audio.ontimeupdate = function() {
if (audio.currentTime >= endOffset) {
audio.pause();
}
};
References:
Specifying playback range
Jumping to time offsets in HTML5 video
Here's an extract of my current code, which uses both the audio control's events and timeout to make sure the audio stops. There's a reference to a volume slider you might need to trim.
var jt_audioControl;
var jt_audioSource;
var jt_audioFiles;
var jt_audioFileIndex;
var jt_audioFile;
var jt_audioStartTime;
var jt_audioEndTime;
var jt_audioPlaybackRate;
var jt_audioTimeoutHandle;
var jt_audioLink;
var jt_audioMimeType;
var jt_audioMediaType;
var jt_volumeSlider;
function jt_onAudioTimeUpdate() {
if (jt_audioEndTime > 0.0) {
if (jt_audioControl.currentTime >= jt_audioEndTime) {
//alert('stopped: jt_audioControl.currentTime = ' + jt_audioControl.currentTime + ' jt_audioEndTime = ' + jt_audioEndTime);
jt_audioControl.pause();
//jt_audioStartTime = jt_audioEndTime = 0.0;
}
}
}
function jt_onAudioCanPlay() {
jt_audioControl.pause();
jt_audioControl.currentTime = jt_audioStartTime;
jt_audioControl.defaultPlaybackRate = jt_audioPlaybackRate;
jt_audioControl.playbackRate = jt_audioPlaybackRate;
jt_audioControl.play();
jt_audioControl.currentTime = jt_audioStartTime;
jt_volumeSliderChanged(); // Set initial value to slider.
var timeout = (((jt_audioEndTime - jt_audioStartTime)) / jt_audioPlaybackRate) * 1000;
//alert('jt_audioEndTime = ' + jt_audioEndTime + ', timeout = ' + timeout);
if (jt_audioEndTime > 0.0) {
jt_audioTimeoutHandle = setTimeout(jt_onAudioEnded, timeout);
//alert('jt_audioTimeoutHandle = ' + jt_audioTimeoutHandle);
}
else if (jt_audioTimeoutHandle != null) {
clearTimeout(jt_audioTimeoutHandle);
jt_audioTimeoutHandle = null;
}
}
function jt_onAudioEnded() {
//alert('ended called');
if (jt_audioFiles == null)
return;
while (jt_audioControl.position < jt_audioControl.duration)
;
jt_audioFileIndex = jt_audioFileIndex + 1;
if (jt_audioFileIndex < jt_audioFiles.length) {
jt_createAudio(jt_audioFiles[jt_audioFileIndex]);
}
else {
jt_audioControl.pause();
jt_audioFiles = null;
jt_audioFileIndex = 0;
}
}
function jt_onAudioError(e) {
var msg;
switch (e.target.error.code) {
case e.target.error.MEDIA_ERR_ABORTED:
msg = 'You aborted the video playback.';
break;
case e.target.error.MEDIA_ERR_NETWORK:
msg = 'A network error caused the video download to fail part-way.';
break;
case e.target.error.MEDIA_ERR_DECODE:
msg = 'The video playback was aborted due to a corruption problem or because the video used features your browser did not support.';
break;
case e.target.error.MEDIA_ERR_SRC_NOT_SUPPORTED:
msg = 'The video could not be loaded, either because the server or network failed or because the format is not supported.';
break;
default:
msg = 'An unknown error occurred.';
break;
}
alert('Error loading media: ' + msg + ' Media file: ' + jt_audioFile + ' MIME type: ' + jt_audioMimeType);
}
function jt_addSource(url) {
var srcUrl;
var doConvertCheck = false;
var offset = url.lastIndexOf(".");
if (offset == -1) {
if (jt_audioSource == null) {
jt_audioSource = document.createElement('source');
jt_audioControl.appendChild(jt_audioSource);
}
jt_audioMimeType = 'audio/mpeg3';
jt_audioMediaType = 'audio/mpeg3';
jt_audioSource.type = jt_audioMediaType;
jt_audioSource.src = url;
jt_audioControl.load();
return;
}
var base = url.substr(0, offset);
var ext = url.substr(offset).toLowerCase();
var newExt = ext;
if (jt_audioControl.canPlayType('audio/mpeg3')) {
jt_audioMimeType = 'audio/mpeg3';
jt_audioMediaType = 'audio/mpeg3';
if (ext != '.mp3')
newExt = '-aa.mp3';
}
else if (jt_audioControl.canPlayType('audio/mpeg')) {
jt_audioMimeType = 'audio/mpeg3';
jt_audioMediaType = 'audio/mpeg';
if (ext != '.mp3')
newExt = '-aa.mp3';
}
else if (jt_audioControl.canPlayType('audio/mp3')) {
jt_audioMimeType = 'audio/mpeg3';
jt_audioMediaType = 'audio/mp3';
if (ext != '.mp3')
newExt = '-aa.mp3';
}
else if (jt_audioControl.canPlayType('audio/ogg')) {
jt_audioMimeType = 'audio/ogg';
jt_audioMediaType = 'audio/ogg';
if (ext != '.ogg')
newExt = '-aa.ogg';
}
else {
alert('Sorry, can not play file: ' + url);
}
srcUrl = base + newExt;
if (srcUrl.lastIndexOf('~', 0) === 0) {
if (window.location.hostname == '') {
srcUrl = srcUrl.substr(2);
}
else {
var url = 'http://' + window.location.hostname;
if (window.location.port.toString() != '')
url = usrl + ':' + window.location.port.toString()
srcUrl = url + srcUrl.substr(1);
}
}
//alert('srcUrl = ' + srcUrl);
if (jt_audioSource == null) {
jt_audioSource = document.createElement('source');
jt_audioControl.appendChild(jt_audioSource);
}
jt_audioSource.type = jt_audioMediaType;
if (doConvertCheck) {
jt_audioLink = "/ConvertCheck?path=" + srcUrl + "&" + "mimeType=" + jt_audioMimeType
jt_audioSource.src = jt_audioLink;
}
else {
jt_audioSource.src = srcUrl;
}
jt_audioControl.load();
}
function jt_extractTimeRange(url) {
var rangeFieldIndex = url.lastIndexOf("#t");
if (rangeFieldIndex >= 0) {
var rangeString = url.substr(rangeFieldIndex + 2);
var range = rangeString.split(',');
jt_audioStartTime = parseFloat(range[0]);
jt_audioEndTime = parseFloat(range[1]);
}
else {
jt_audioStartTime = 0.0;
jt_audioEndTime = 0.0;
return url;
}
return url.substr(0, rangeFieldIndex);
}
function jt_createAudio(url) {
url = jt_extractTimeRange(url);
if (jt_audioControl == null) {
jt_audioFile = url;
jt_audioControl = new Audio();
// The ontimeupdate handler seems to be called unreliably, so we'll use
// setTimeout as well in the oncanplay handler.
jt_audioControl.ontimeupdate = jt_onAudioTimeUpdate;
jt_audioControl.onloadedmetadata = jt_onAudioCanPlay;
jt_audioControl.onended = jt_onAudioEnded;
jt_audioControl.onerror = jt_onAudioError;
jt_addSource(url);
// We'll let the oncanplay call play once loaded.
}
else if (jt_audioFile != url) {
jt_audioFile = url;
jt_addSource(url);
}
else {
//jt_onAudioLoaded();
jt_audioControl.load();
}
}
function jt_playAudioFile(url) {
jt_audioFiles = null;
jt_audioFileIndex = 0;
jt_audioStartTime = 0.0;
jt_audioEndTime = 0.0;
jt_audioPlaybackRate = 1.0;
jt_createAudio(url);
}
function jt_playSlowAudioFile(url) {
jt_audioFiles = null;
jt_audioFileIndex = 0;
jt_audioStartTime = 0.0;
jt_audioEndTime = 0.0;
jt_audioPlaybackRate = 0.5;
jt_createAudio(url);
}
function jt_playAudioFileList(urls) {
jt_audioFiles = urls;
jt_audioFileIndex = 0;
jt_audioStartTime = 0.0;
jt_audioEndTime = 0.0;
jt_audioPlaybackRate = 1.0;
if ((urls != null) && (urls.length > 0)) {
jt_createAudio(urls[0]);
}
}
function jt_playSlowAudioFileList(urls) {
jt_audioFiles = urls;
jt_audioFileIndex = 0;
jt_audioStartTime = 0.0;
jt_audioEndTime = 0.0;
jt_audioPlaybackRate = 0.5;
if ((urls != null) && (urls.length > 0)) {
jt_createAudio(urls[0]);
}
}
function jt_playAudioFileSegment(url, startTime, endTime) {
jt_audioFiles = null;
jt_audioFileIndex = 0;
url = url + '#t' + startTime.toString() + ',' + endTime.toString();
jt_audioPlaybackRate = 1.0;
jt_createAudio(url);
}
function jt_playSlowAudioFileSegment(url, startTime, endTime) {
jt_audioFiles = null;
jt_audioFileIndex = 0;
url = url + '#t' + startTime.toString() + ',' + endTime.toString();
jt_audioPlaybackRate = 0.5;
jt_createAudio(url);
}
function jt_stopAudio() {
if (jt_audioControl != null)
jt_audioControl.pause();
}
function jt_volumeSliderChanged() {
if (jt_volumeSlider == null) {
jt_volumeSlider = document.getElementById('volumeSlider');
if (jt_volumeSlider == null)
return;
}
var value = jt_volumeSlider.value;
if (jt_audioControl != null)
jt_audioControl.volume = value / 10;
$.ajax({
url: "/Common/SetUserOptionAjax?key=AudioVolume&value=" + value.toString(),
type: "POST"
});
}

Cant stop this Timer

Create button and give name "b".
create dynamic text and give name "tampil".
Run it... Click on b button to run the timer, and click again to stop(but error).
The following script is a piece of my project that I modified.
My question is, how do I stop the timer?
import flash.events.MouseEvent;
var xx:Number = 1;
var waktux:Timer;
var i1:Number = 1;
var ab:Number = 1;
var lantaii:String = "lg";
b.addEventListener(MouseEvent.CLICK, stopp);
function stopp(e:MouseEvent)
{
waktu(0,0,ab);
if (ab==1)
{
ab = 0;
}
else
{
ab = 1;
}
}
function waktu(e, d, cx)
{
var waktux:Timer;
var waktuy:Timer;
function sayHello(f:TimerEvent):void
{
tampil.text = String(e);
e = e + 1;
}
function sayHellow(e:TimerEvent):void
{
tampil.text = String(d);
d = d + 1;
}
function sayHello2(f:TimerEvent):void
{
tampil.text = String(e);
e = e + 1;
}
if (cx==1)
{
if (lantaii == "lg")
{
naek();
}
else
{
waktuy = new Timer(400,10);
waktuy.addEventListener(TimerEvent.TIMER, sayHellow);
waktuy.start();
waktuy.addEventListener(TimerEvent.TIMER_COMPLETE, naek2);
}
function naek()
{
waktux = new Timer(400,10);
waktux.addEventListener(TimerEvent.TIMER, sayHello);
waktux.start();
}
function naek2(s:TimerEvent):void
{
waktux = new Timer(400,10);
waktux.addEventListener(TimerEvent.TIMER, sayHello2);
waktux.start();
}
}
else
{
trace("nih masuk");
waktux.stop();
waktux.reset();
waktuy.reset();
waktux.removeEventListener(TimerEvent.TIMER, sayHello);
waktux.removeEventListener(TimerEvent.TIMER, sayHello2);
waktuy.removeEventListener(TimerEvent.TIMER, sayHellow);
waktuy.removeEventListener(TimerEvent.TIMER_COMPLETE, naek2);
}
}
I think you redefine waktux one in global scope and other in waktu function.
delete one of these lines
import flash.events.MouseEvent;
var xx:Number = 1;
var waktux:Timer; //<--------------------------- HERE
var i1:Number = 1;
var ab:Number = 1;
var lantaii:String = "lg";
function waktu(e, d, cx)
{
var waktux:Timer; //<--------------------------- HERE
var waktuy:Timer;
function sayHello(f:TimerEvent):void
{
tampil.text = String(e);
e = e + 1;
}
function sayHellow(e:TimerEvent):void
{
tampil.text = String(d);
d = d + 1;
}
function sayHello2(f:TimerEvent):void
{
tampil.text = String(e);
e = e + 1;
}
if (cx==1)
{
if (lantaii == "lg")
{
naek();
}
else
{
waktuy = new Timer(400,10);
waktuy.addEventListener(TimerEvent.TIMER, sayHellow);
waktuy.start();
waktuy.addEventListener(TimerEvent.TIMER_COMPLETE, naek2);
}
function naek()
{
waktux = new Timer(400,10);
waktux.addEventListener(TimerEvent.TIMER, sayHello);
waktux.start();
}
function naek2(s:TimerEvent):void
{
waktux = new Timer(400,10);
waktux.addEventListener(TimerEvent.TIMER, sayHello2);
waktux.start();
}
}
else
{
trace("nih masuk");
waktux.stop();
waktux.reset();
waktuy.reset();
waktux.removeEventListener(TimerEvent.TIMER, sayHello);
waktux.removeEventListener(TimerEvent.TIMER, sayHello2);
waktuy.removeEventListener(TimerEvent.TIMER, sayHellow);
waktuy.removeEventListener(TimerEvent.TIMER_COMPLETE, naek2);
}
}
and just for fun
function stopp(e:MouseEvent)
{
waktu(0,0,ab);
ab = !ab;
}