ECmall挂件开发.doc

ECmall挂件开发1、 典型的挂件结构：挂件存放于./external/widgets目录下，其下的每个目录就是一个挂件，每个目录名就是该挂件的唯一标识，创建一个挂件只需在./external/widgets目录下创建一个目录并创建相应的挂件文件即可，典型的挂件包含四个文件：1） .php-挂件描述信息文件（必须）2） main.widget.php-挂件主程序文件（必须）3） widget.html-挂件显示界面文件（必须）4） config.html-挂件配置界面文件（非必须）2、 创建挂件：将这个挂件命名为“best_goods”首先到./external/widgets目录下创建一个名为“best_goods”的目录，然后分别创建四个文本文件：./external/widgets/best_goods/.php./external/widgets/best_goods/main.widget.php./external/widgets/best_goods/widget.html./external/widgets/best_goods/config.html注意：创建的文本文件的编码应以使用的ECMall版本一致，例如，使用的是GBK版本的ECMall，则创建的该文本文件保存时的编码应为“GBK”,“UTF-8”同理。1. 打开.php，写入一下代码： best_goods, /唯一标识，必须与挂件目录名保持一致 display_name = 精品推荐, /显示名称 author = , /作者 website = , /作者网站 version = 1.0, /版本号 desc = 能展示6个有图片和文字的商品，商品数据从推荐类型中取, /描述（显示自定义的html） configurable = true, /可配置，可选值为true / false);?注意：当“configurable”被设置为“false”时，config.html文件就不再需要了，同时该挂件为不可配置的挂件。2. 打开main.widget.php，实现主体代码：每个挂件的主体代码放在main.widget.php中，每个挂件即为一个从基础挂件类派生出来的类，该类必须遵循：1) .命名规则是：“挂件目录名的首字母大写”+“Widget”。则本例中的命名为：“Best_goodsWidget”，其中“Best_goods”为目录名“best_goods”首字母大写写法，“Widget”为必要后缀；2) 该类必须是从“BaseWidget”类直接或间接继承；3) 拥有$_name成员，并且该成员的值必须与.php中所设置的name保持一致。4) 典型挂件类结构：$_name：唯一标识，必须与.php中所设置的name保持一致；_get_data()：获取显示数据的方法，只需重写该方法，在该方法中返回欲在 挂件显示界面中需要的使用数据即可，在该方法中，可以使用 “$this-options”来访问用户配置的数据；get_config_datasrc()：获取配置表单时需要的数据，只需重写该方法，在该方法 中返回欲在配置界面中需要使用的数据即可，可以使用 “$this-options”来访问用户配置的数据；parse_config()：处理配置请求的方法；只需要重写该方法，在该方法中处理用 户填写的配置表单的信息数组，并将处理后的数组返回，系统 会自动处理保存配置项的工作。5） 以下是本例的代码及相关注释：_get_cache_id(); $data = $cache_server-get($key); if($data = false) $recom_mod =& m(recommend); $data = $recom_mod-get_recommended_goods($this-optionsimg_recom_id, $this-_num, true, $this-optionsimg_cate_id); $cache_server-set($key, $data, $this-_ttl); return $data; function get_config_datasrc() / 取得推荐类型 $this-assign(recommends, $this-_get_recommends(); / 取得一级商品分类 $this-assign(gcategories, $this-_get_gcategory_options(1); function parse_config($input) if ($inputimg_recom_id = 0) $inputimg_cate_id = 0; return $input; /将处理过的数组返回，该数组即是要被保存的配置数据，可以将其理解为“该数组要被保存到$this-options中” ?典型的挂件只需要实现三个方法即可完成一个挂件，这三个方法是：1) .function _get_data():获取挂件显示时所需要的数据；2) .function get_config_datasrc():获取配置挂件时配置界面需要的数据；3) .function parse_config($input):处理配置表单提交的配置数据。 其中：$input 为必须的变量，次变量为用户在配置界面填写的表单通过POST提交过来的数据，可以把其理解为$_POST。3. 打开widget.html，实现显示界面：挂件的显示界面即挂件被实际添加到页面中的显示界面。该显示界面通过一个HTML模板文件（与ECMall的模板文件语法一致，支持Smarty模板的语法）来描述。简单来说，只需要简单编写一个HTML文件即可实现该显示界面。值得注意的是：与编写普通HTML文件不同的是，编写挂件的显示界面的HTML文件不需要完整的HTML代码结构，其只是完整HTML中的片段，例如其中可能只包含一个“”。以下是本例中显示界面实现的具体代码： $goods.goods_name|escape$goods.price|price 其中$widget_data是预定义变量，该变量存储着由之前在主体代码中实现的_get_data()方法所返回的数据。使用CSS来控制显示挂件的样式的两种方法：1) .在widget.html页面中编写CSS；2) 针对不同风格编写不同的CSS，将其加到对应的风格CSS文件中。推荐针对不同风格发布相应的CSS，这样可以使挂件在其他风格上也可以正常使用。注意：这里的“风格”是指ECMall的模板风格，一般风格的CSS文件存放于“./themes/mall/模板名称/styles风格名称”目录下面。显示界面中可用的预定义变量：$widget_data：由_get_data()方法所返回的数据；$options:由用户提交的配置数据；$id:挂件在页面中的ID；$name:挂件的唯一标识；$widget_root：挂件所在的HTTP路径，常在显示挂件需要用到图片时用到，其形如：/external/widgets/best_goods4. 打开config.html，实现配置界面：与挂件显示界面类似，只需要编写一个config.html就可以实现配置界面。以下为本例中实现配置界面的代码：var _d = DialogManager.get(config_dialog);_d.setWidth(350); /修改挂件配置窗口的宽度_d.setPosition(center);$(selectname=img_recom_id).change(function() switchRecommend(this.value, img_cate_id););switchRecommend($(selectname=img_recom_id).val(), img_cate_id);function switchRecommend(recomId, selectName) if (recomId = 0) $(selectname= + selectName + ).hide(); else $(selectname= + selectName + ).show(); 推荐类型: 请选择. $recom_name|escape 请选择分类. 配置界面中的预定义变量：$options:配置数据；$id:挂件在页面中的ID；$name:挂件的唯一标识；$widget_root：挂件所在的HTTP路径，常在显