Javascript乱弹设计模式系列(5) － 命令模式(Command)

4. 既然有“主菜单”，“子菜单”，那么就需要有个“导航条”来“挂接”它们了，这里我添加了一个MenuBar对象，它作为一个初始化菜单显示和所有命令按钮行为实现方法的“容器”，代码如下：

varMenuBar={
　　list:newArray(),
　　add:function(component){
　　　　this.list.push(component);
　　},
　　show:function(container){
　　　　varulElement=document.createElement("ul");
　　　　ulElement.className="Menu";
　　　　for(vari=0,len=this.list.length;i<len;i++){
　　　　　　ulElement.appendChild(this.list[i].getElement());
　　　　}
　　　　document.getElementById(container).appendChild(ulElement);
　　}
}

通过show方法进行初始化菜单显示和所有命令按钮行为的实现方法；

5. 现在利用命令模式来进行在线编辑器的实现，新建HTML页面，在window.onload方法中实现：

varfile_menu=newMenu("文件","文件","#");
file_menu.add(newMenuItem("新建","新建","#",newonNewCommand()));
file_menu.add(newMenuItem("导出","导出","#",newonExportCommand()));
file_menu.add(newMenuItem("退出","退出","#",newonExitCommand()));
varedit_menu=newMenu("编辑","编辑","#");
edit_menu.add(newMenuItem("剪切","剪切","#",newonCutCommand()));
edit_menu.add(newMenuItem("复制","复制","#",newonCopyCommand()));
edit_menu.add(newMenuItem("粘贴","粘贴","#",newonPasteCommand()));
edit_menu.add(newMenuItem("删除","删除","#",newonDeleteCommand()));
varformat_menu=newMenu("格式","格式","#");
format_menu.add(newMenuItem("字体","字体","#",newonFontFaceCommand()));
format_menu.add(newMenuItem("字号","字号","#",newonFontSizeCommand()));
format_menu.add(newMenuItem("加粗","加粗","#",newonBoldCommand()));
format_menu.add(newMenuItem("斜体","斜体","#",newonItalicCommand()));
format_menu.add(newMenuItem("下划线","下划线","#",newonUnderlineCommand()));
varformat_menu_1=newMenu("位置","位置","#");
format_menu_1.add(newMenuItem("居左对齐","居左对齐","#",newonLeftCommand()));
format_menu_1.add(newMenuItem("居中对齐","居中对齐","#",newonCenterCommand()));
format_menu_1.add(newMenuItem("居右对齐","居右对齐","#",newonRightCommand()));
format_menu_1.add(newMenuItem("减少缩进","减少缩进","#",newonOutdentCommand()));
format_menu_1.add(newMenuItem("增加缩进","增加缩进","#",newonIndentCommand()));
format_menu.add(format_menu_1);
varformat_menu_2=newMenu("编号","编号","#");
format_menu_2.add(newMenuItem("数字编号","数字编号","#",newonOrderedCommand()));
format_menu_2.add(newMenuItem("项目编号","项目编号","#",newonUnorderedCommand()));
format_menu.add(format_menu_2);
varformat_menu_3=newMenu("字体颜色","字体颜色","#");
format_menu_3.add(newMenuItem("前景颜色","前景颜色","#",newonForeColorCommand()));
format_menu_3.add(newMenuItem("背景颜色","背景颜色","#",newonBackColorCommand()));
format_menu.add(format_menu_3);
varinsert_menu=newMenu("插入","插入","#");
insert_menu.add(newMenuItem("插入链接","插入链接","#",newonLinkCommand()));
insert_menu.add(newMenuItem("插入图片","插入图片","#",newonImageCommand()));
varopr_menu=newMenu("操作","操作","#");
opr_menu.add(newMenuItem("撤销","撤销","#",newonUndoCommand()));
opr_menu.add(newMenuItem("重做","重做","#",newonRedoCommand()));
opr_menu.add(newMenuItem("切换HTML","切换HTML","#",newonToHtmlCommand()));
varcustom_menu=newMenu("自定义格式","自定义格式","#");
custom_menu.add(newMenuItem("格式1","加粗＋斜体＋下划线","#",newonMacro1Command(newonBoldCommand(),newonItalicCommand(),newonUnderlineCommand())));
varhelp_menu=newMenu("帮助","帮助","#");
help_menu.add(newMenuItem("关于作者","关于作者","#",newonAuthorCommand()));
MenuBar.add(file_menu);
MenuBar.add(edit_menu);
MenuBar.add(format_menu);
MenuBar.add(insert_menu);
MenuBar.add(opr_menu);
MenuBar.add(custom_menu);
MenuBar.add(help_menu);
MenuBar.show("main_container");