if (!ww.func) ww.func={}
ww.apply(ww.func, {
  getFlashImage: function () {
    if (ww.vars.pbar.performName != 'progress') ww.func.performProgressBar();
    ww.vars.wprog.show();
    ww.flash.fire('popupImage');
  },
  performProgressBar: function () {
    ww.vars.pbar.reset();
    ww.vars.pbar.performName = 'progress';
    ww.vars.pbar.getEl().addClass('custom');
    Ext.fly('prog_text').dom.innerHTML = '<b>Manipulate Image: </b>';
  },
  performLoadingBar: function () {
    ww.vars.pbar.reset();
    ww.vars.pbar.performName = 'loading';
    ww.vars.pbar.getEl().removeClass('custom');
    Ext.fly('prog_text').dom.innerHTML = 'Loading Form...';
    if (!ww.vars.wprog.hidden) ww.vars.pbar.wait({ interval:200, increment:15 });
  },
  domainname: function () {
    var sn = window.location.toString();
    sn = (sn.indexOf('https') > -1)?sn.replace('https://', ''):sn.replace('http://', '');
    sn = sn.substring(0, sn.indexOf('/'));
    return sn;
  },
  replaceEmailSeparator: function (value) {
    var sReturn = value;
    if (typeof(sReturn) == 'string') sReturn = sReturn.replace(/\,/g, ';');
    while (sReturn.indexOf('; ')>0) sReturn = sReturn.replace(/\;\ /g, ';');
    sReturn = sReturn.replace(/\;/g, '; ');
    sReturn = sReturn.replace(/\</g, '[');
    sReturn = sReturn.replace(/\>/g, ']');
    while (sReturn.indexOf('[ ')>0) sReturn = sReturn.replace(/\[\ /g, '[');
    while (sReturn.indexOf(' ]')>0) sReturn = sReturn.replace(/\ \]/g, ']');
    return sReturn;
  }
});

ww.vars = { wprog: null, pbar: null,
  dftMsg: [
    '<FONT face=tahoma><br/><br/><br/></FONT><hr>',
    '<font size="1">',
      'Click ',
        '<a href="http://'+ww.func.domainname()+'/ecards/greeting.asp">here</a>',
      ' to design your personalised Peranakan Museum e-card and send it to your friend.',
    '</font>'
  ]
}

Ext.onReady(function () {
  ww.vars.pbar = new Ext.ProgressBar({
    performName: 'progress',
    id:'pbar', text:'Loading...',
    cls: 'custom', textEl:'p4text'
  });
  
  ww.vars.wprog = new Ext.Window({
    title: 'Current Progress',
    width: 360, height: 105,
    draggable: false, closable: false,
    resizable: false, border: false,
    bodyStyle: {padding: '14px 10px 0px 10px'},
    modal: true,
    html: '<div class="status"><span id="prog_text"><b>Manipulate Image: </b></span><span id="p4text"></span></div>',
    items: ww.vars.pbar
  });
  
  ww.vars.fsHead = new Ext.ww.advFieldSet({
    title: 'Sender/Recipient', border: true, 
    collapsible: true, 
    labelWidth: 55, width: 670, defaults: {baseCls: 'x-plain'}, 
    advItems: [{
      'txtFrom': {label: 'From', value: 'Admin [no-reply@peranakanmuseum.sg]', conf: {width: 580, labelSeparator: '', style: 'margin-top: 1px;', vtype: 'multiemail'}},
      'txtTo': {label: 'To...', value: '', conf: {width: 580, labelSeparator: '', vtype: 'multiemail'}},
      'txtSubject': {label: 'Subject', value: 'Warm wishes from the Peranakan Museum, Singapore!', conf: {width: 580, labelSeparator: ''}}
    }]
  })
  
  ww.vars.fsHead.on('render', function () {
    Ext.getCmp('txtFrom').on('change', function (o, v) {
      o.el.dom.value = ww.func.replaceEmailSeparator(v);
    });
    Ext.getCmp('txtTo').on('change', function (o, v) {
      o.el.dom.value = ww.func.replaceEmailSeparator(v);
    });
  });
  

  // /img/common/spacer.gif ==> /resources/temp/2009021309173312345166534333.jpg
  ww.vars.fsEcard = new Ext.ww.advFieldSet({
    title: 'Preview eCards', border: true, collapsed: true, 
    collapsible: true, width: 670, defaults: {baseCls: 'x-plain'},
    advItems: [{
      'lblEcard': {type: 'label', value: '<img id="img_ecard" src="/img/common/spacer.gif" />', conf: {style: 'padding: 10 0 10 0;', baseCls: 'x-plain'}}
    }]
  })
  
  ww.vars.fsBody = new Ext.form.FieldSet({
    layout: 'table', autoHeight:true,
    title: 'Message', border: true,
    width: 670,
    items: new Ext.Panel({
      layout: 'form', width: 660, frame: false,
      bodyStyle:'padding:5px 5px 0', 
      baseCls: 'x-plain', 
      items: {xtype:'htmleditor',
        id:'txtMsg', hideLabel: true, enableLinks: false,
        width: 640, height: 430, value: ww.vars.dftMsg.join('')
      }
    })
  })
  
  ww.vars.mailform = new Ext.FormPanel({
    baseCls: 'x-plain',
    items: [ww.vars.fsHead, ww.vars.fsEcard, ww.vars.fsBody]
  });
  
  
  ww.vars.win = new Ext.Window({
    title: 'Send eCard', 
    width: 720, height: 750, border: true, 
    draggable: true, modal: true, autoScroll: true, 
    bodyStyle: 'padding: 10px;',
    items: ww.vars.mailform,
    buttons: [{
      text: 'Send',
      handler: function() {
        if(ww.vars.mailform.getForm().isValidElseAlert()){
          ww.vars.mailform.getForm().submit({
            url: '/ecards/ecard_action.asp',
            waitMsg: 'Sending your e-card...',
            params: {imgEcard: ww.vars.imgSrc}, 
            success: function(frm, oAction) {
              if (oAction.result) {
                if (oAction.result.msgCode) {
                  if (oAction.result.msgCode == 'ok') {
                    ww.msgbox.confirm('<table><tr><td>'+ oAction.result.msg +'</td></tr><tr><td>Do you want to send again?</td></tr></table>', 
                      function () { } , function() { 
                        ww.vars.mailform.getForm().reset();
                        ww.vars.win.hide(); 
                      }
                    );
                  } else ww.msgbox.warning(oAction.result.msg);
                } else {
                  ww.msgbox.err('Unexpected error');
                }
              } else {
                ww.msgbox.err('Unexpected error');
              }
            }
          });
        }
      }
    },{
      text: 'Reset',
      handler: function(){ ww.vars.mailform.getForm().reset(); }
    }]
  });
  
  ww.vars.win.on('show', function () {
    if (ww.vars.imgSrc) {
      Ext.fly('img_ecard').dom.src='/resources/temp/'+ww.vars.imgSrc;
      ww.vars.pbar.reset();
      ww.vars.wprog.hide();
    }
    //ww.vars.imgSrc = '2009021309173312345166534333.jpg';
  });
  
  Ext.QuickTips.init();
  //ww.vars.win.show();
});