var test, exec, match, search, split, open;
open = function(){
  var popup, cdeRex, cdeOpt, cdeHay;
  
  // save handle, we can use it to reposition the popup
  popup = CDE.popup(
    "Regular Expression Tester",
    CDE.div().css('regexpopup').add(
      // add a stylesheet that turns my text-color to black for all popup content...
      CDE.css('.regexpopup * { color: #000; }'),
      CDE.div().mb(3).add(
        CDE.txt('Enter '),
        CDE.a('regular expression', 'https://developer.mozilla.org/En/Core_JavaScript_1.5_Guide:Regular_Expressions', true).css({cursor: 'help'}),
        CDE.txt(' and flags')
      ),
      CDE.div().add(
        cdeRex = CDE.inp('text').sb('#000').c('#588').w(300).p(0,0,1,2).val('([((aab)|(bab))])(ba)?').on('focus', function(){this.select();}),
        CDE.txt('  '),
        cdeOpt = CDE.inp('text').sb('#000').c('#588').w(50).p(0,0,1,2).tac().val('g').on('focus', function(){this.select();})
      ),
      CDE.br(),
      CDE.div().txt('Enter string to search through'),
      CDE.div().add(
        cdeHay = CDE.inp('text').sb('#000').c('#588').p(0,0,1,2).w(360).val('aabaAbAabaAA').on('focus', function(){this.select();})
      ),
      CDE.br(),
      CDE.div().tac().add(CDE.lnk('clear', function(){ cdeRex.val(''); cdeOpt.val(''); cdeHay.val(''); })),
      CDE.div().tac().add(
        CDE.lnk('RegExp.test', function(){
          popup.hide();
          test(popup, cdeRex.val(), cdeOpt.val(), cdeHay.val());
        }),
        CDE.txt('  '),
        CDE.lnk('RegExp.exec', function(){
          popup.hide();
          exec(popup, cdeRex.val(), cdeOpt.val(), cdeHay.val());
        }),
        CDE.txt('  '),
        CDE.lnk('String.match', function(){
          popup.hide();
          match(popup, cdeRex.val(), cdeOpt.val(), cdeHay.val());
        })
      ),
      CDE.div().tac().add(
        CDE.lnk('String.search', function(){
          popup.hide();
          search(popup, cdeRex.val(), cdeOpt.val(), cdeHay.val());
        }),
        CDE.txt('  '),
        CDE.txt('String.replace').strike(),
        CDE.txt('  '),
        CDE.lnk('String.split', function(){
          popup.hide();
          split(popup, cdeRex.val(), cdeOpt.val(), cdeHay.val());
        })
      ),
      CDE.br()
    ),
    false,
    {strOk: 'Close', boolNoCancel: true}
  );
};
test = function(popup, strRegex, strOptions, strHay){
  CDE.popup(
    "Result",
    CDE.div().css('regexpopup').add(
      CDE.txt('(new RegExp(regex, options)).test(search) = '+(new RegExp(strRegex, strOptions)).test(strHay)),
      CDE.br(2)
    ),
    function(){ popup.show(); },
    {boolNoDisable:true, boolNoCancel:true}
  );
};
exec = function(popup, strRegex, strOptions, strHay){
  // do the first match
  var r = new RegExp(strRegex, strOptions);
  var match = r.exec(strHay);
  // log results
  var i, arrCde = [];
  arrCde.push([
    CDE.div().txt('- regex: '+CDE._htmlEscape(r.toString())),
    CDE.div().txt('- regex.ignoreCase: '+r.ignoreCase),
    CDE.div().txt('- regex.global: '+r.global),
    CDE.div().txt('- regex.multiline: '+r.multiline)
  ]);
  if (match) {
    do {
      arrCde.push(
        CDE.div().txt('match ('+match.index+' ~ '+r.lastIndex+'): '+CDE._htmlEscape(match[0]))
      );
      i = 1;
      while (match[i]) {
        arrCde.push(CDE.div().txt('$'+i+': '+CDE._htmlEscape(match[i])));
        ++i;
      }
    // if global, continue searching (next search starts at lastIndex) while there's a match
    } while (r.global && (match = r.exec(strHay)));
  } else { // !match
    arrCde.push(CDE.txt('No match found'));
  }
  
  CDE.popup(
    "Result",
    CDE.div().css('regexpopup').add(
      CDE.div().css({maxHeight: '500px', maxWidth: '1000px', overflow: 'auto'}).add(arrCde),
      CDE.br()
    ),
    function(){ popup.show(); },
    {boolNoDisable:true, boolNoCancel:true}
  );
};
match = function(popup, strRegex, strOptions, strHay){
  // match can have two results. same as single regex.exec if not global, array if global
  var r = new RegExp(strRegex, strOptions);
  var match = strHay.match(r);
  var arrCde = [
    CDE.div().txt('- regex: '+r),
    CDE.div().txt('- regex.ignoreCase: '+r.ignoreCase),
    CDE.div().txt('- regex.global: '+r.global),
    CDE.div().txt('- regex.multiline: '+r.multiline)
  ];
  if (!match) arrCde.push(CDE.div().txt('No matches found'));
  else if (r.global) { // match is a 1d-array
    for (var i=0; i<match.length; ++i) {
      arrCde.push(CDE.div().txt(i+': '+match[i]));
    }
  } else {
    arrCde.push(CDE.div().txt('result: '+match[0]));
  }
  CDE.popup('Result',
    CDE.div().css('regexpopup').mb(10).add(arrCde),
    function(){ popup.show(); },
    {boolNoDisable:true, boolNoCancel:true}
  );
};
search = function(popup, strRegex, strOptions, strHay){
  CDE.popup("Result",
    CDE.div().css('regexpopup').add(
      CDE.div().txt("hay.search(new RegExp(regex, options))"),
      CDE.div().txt('= &nbsp;'+strHay.search(new RegExp(strRegex, strOptions))).mb(10)
    ),
    function(){ popup.show(); },
    {boolNoDisable: true, boolNoCancel: true}
  );
};
split = function(popup, strRegex, strOptions, strHay){
  CDE.popup("Result",
    CDE.div().css('regexpopup').add(
      CDE.div().txt('[<br />&nbsp;&nbsp;"'+strHay.split(new RegExp(strRegex, strOptions)).join('",<br />&nbsp;&nbsp;"')+'"<br />]').mb(10)
    ),
    function(){ popup.show(); },
    {boolNoDisable: true, boolNoCancel: true}
  );
};