旧代码回顾：YUI-ext 代码两侧/XML 数据岛/WSC 组件化
2009-07-20 19:56
211 查看
YUI-ext 代码两侧
旧时，写 yuiext 的代码的时候便学习过这些代码，两侧都是***动画的代码。时间大概是两年前左右（07年初），但心路历程感觉是过了许久 呵呵，真的有天上十天，地下十年的感觉。那时候，靠自学，瞎浑的什么的都不懂，往这几句 script 撞呀撞呀，撞到做出效果为止！这不，一番经历，好歹也认识不少：JS 的道路并不坦，学 ajax 真的要下苦功！言毕，丑汉终需见家翁，呵呵。下是那时稚嫩的代码。
var fade_in_pic = function() {
var pic = Array();
pic[0] = "images//china.gif";
pic[1] = "images//Greece.gif";
pic[2] = "images//Italy.gif";
var img = Array();
for (i in pic) {
img[i] = new Image(); // 这里有一丝不解，为什么Image会在这里成关键字？
img[i].src = pic[i];
}
var loop;
var j = 0;
return { ss: function() {
var animator = new YAHOO.ext.Animator();
var cursor = new YAHOO.ext.Actor('holder', animator);
animator.startCapture();
// pause .5 seconds
animator.pause(4);
cursor.fade(1);
cursor.appear();
animator.play();
$("holder").src = img[j].src
j += 1;
if (j > pic.length - 1) j = 0;
loop = setTimeout("fade_in_pic.ss()", 5000)
}
}
} ();
YAHOO.util.Event.addListener(window, "load", fade_in_pic.ss);var side_show = {
init: function() {
var animator = new YAHOO.ext.Animator();
// start capturing
var effect = new YAHOO.ext.Actor("img1", animator);
var effect_next = new YAHOO.ext.Actor("img2", animator);
animator.startCapture();
effect_next.hide();
animator.beginSync();
effect.pulsate(5);
effect.fade();
animator.endSync();
animator.pause(2); //中断
effect_next.show();
animator.addAsyncCall(function() { alert(); }, 1);
animator.pause(2); //中断
effect.fade();
animator.play(); //play()一定放最后
effect = null;
}
}
YAHOO.util.Event.addListener(window, "load", side_show.init);XML数据岛 with 分页
纯客户端解决方案，呵呵在当年还是蛮实用的技巧，出来的效果也是“无刷新”的加载XML，包括可分页。就是这份小脚本，小弟愚钝，啃了不少的时间。删掉怪可惜，放这儿算是一份纪念帖吧function loadxml() {
var xDoc = null; //Browser Version
if (document.implementation && document.implementation.createDocument) {
xDoc = document.implementation.createDocument("", "", null);
//alert("体验更佳效果,请使用IE浏览器.版本5.0或以上.");
var req = new XMLHttpRequest(); //make a instance for loading XML files(loacl or Remote
req.open("GET", "web_config.xml", false);
req.send(null);
// print the name of the root element or error message
var dom = req.responseXML;
dump(dom.documentElement.nodeName == "parsererror" ? "error while parsing" : dom.documentElement.nodeName);
new Insertion.Bottom('obj_title', dom.getElementsByTagName('title')[0].firstChild.data);
//alert(dom.getElementsByTagName('title')[0].firstChild.data)
return;
} else if (typeof ActiveXObject != "undefined") {
var msXmlAx = null;
try { msXmlAx = new ActiveXObject("Msxml2.DOMDocument"); }
catch (e) { msXmlAx = new ActiveXObject("Msxml.DOMDocument"); }
xDoc = msXmlAx;
}
if (xDoc == null || typeof xDoc.load == "undefined") { xDoc = null; }
xDoc.async = false;
xDoc.load("web_config.xml");
root = xDoc.documentElement;
}
// function loadxml() { //loadxml 1 = it's IE;
// var xDoc=null; //Browser Version
// if (document.implementation && document.implementation.createDocument){
// xDoc=document.implementation.createDocument("","",null);
// alert("体验更佳效果,请使用IE浏览器.版本5.0或以上.");
// // for FF reading XML
//
//var req = new XMLHttpRequest(); //make a instance for loading XML files(loacl or Remote
//req.open("GET", "web_config.xml", false);
//req.send(null);
//// print the name of the root element or error message
//var dom = req.responseXML;
//dump(dom.documentElement.nodeName == "parsererror" ? "error while parsing" : dom.documentElement.nodeName);
//var ddd = dom.getElementsByTagName('title')[0].firstChild.data;
////alert(dom.getElementsByTagName('title')[0].firstChild.data)
// return(loadxml = false;);
// }else if (typeof ActiveXObject != "undefined"){
// var msXmlAx=null;
// try{msXmlAx=new ActiveXObject("Msxml2.DOMDocument");}
// catch (e){msXmlAx=new ActiveXObject("Msxml.DOMDocument");}
// xDoc=msXmlAx;
// }
// if (xDoc==null || typeof xDoc.load=="undefined"){xDoc=null;}
//
// xDoc.async = false;
// xDoc.load("web_config.xml");
// root = xDoc.documentElement;
// return(loadxml = true);
// }
function list(page) {
try {
var loading = $("loading");
loading.style.display = "none";
var bigclass = $("bigclass"); //there's problem :Select alway over the DIV...
bigclass.style.display = "";
var objXML = document.getElementById("Detailsdso");
var rs = objXML.recordset;
rs.pagesize = 4 //new_pagesize(); //获取每页显示条目数量
var dd = objXML.recordset.pagecount;
var rc = rs.RecordCount;
if (page <= dd) {
rs.absolutepage = page;
var str = " ";
var j = 0;
while (!(rs.eof)) {
if (j <= (new_pagesize() - 1)) {
str = str + "<div align=/"left/">";
//str=str+ "<tr><Td align=/"left/">"
str = str + "<img src="/" mce_src="/""images/memo.gif/" border=/"0/" /> ";
str = str + "<a href="/" mce_href="/""page_detail.asp?id=" + rs("id") + "/">" + rs("title") + "</a>";
str = str + "<div styele=/"margin:10px;/"> </div>";
//str=str+ "</td></tr>" str=str+ ("</div>");
}
j = j + 1;
rs.movenext;
}
pagepage.innerHTML = str;
//输出分页导航
var str2 = "";
var onclickk = "<a href="###" mce_href="###" onclick='list('";
for (var i = 1; i <= dd; i++) {
str2 = str2 + "<a href="###" mce_href="###" onclick='list(" + i + ");'>" + i + "</a> ";
}
s_page.innerHTML = str2;
total_page.innerText = dd;
total_page.title = dd; //插入总页数
document.getElementById("pageno").value = page;
var obj_curr_page = document.getElementById("curr_page");
obj_curr_page.innerHTML = page;
var obj_total_record = document.getElementById("total_record");
obj_total_record.innerHTML = rc;
loadxml(); //读取配置文件
var news_pagesize = root.selectSingleNode("//Page/new_pagesize").firstChild.nodeValue;
var obj_news_pagesize = document.getElementById("news_pagesize");
obj_news_pagesize.innerHTML = news_pagesize;
}
else {
alert("数据不够,总共才" + dd + "页");
}
}
catch (e) { list1(1) }
}
function move_last() {
var obj_total_page = document.getElementById("total_page").title;
list1(obj_total_page);
}
function list1(page) { //缓冲区设计 避免LOAD页面时XML数据还没到来
var sss = $("Detailsdso");
//alert(sss.readyState)
if (sss.src == "") { sss.src = xml_file; } //将LOAD文件归入JS控制 以便检测状况
if (sss.readyState == "complete") { list(page); }
else {
var loading = $("loading");
var bigclass = $("bigclass"); //there's problem :Select alway over the DIV...
bigclass.style.display = "none";
loading.style.display = "block";
Effect.Pulsate("loading");
loading.style.left = Math.floor(window.screen.width / 3); //居中
loading.style.top = Math.floor(window.screen.height / 3);
//alert(loading.style)
setTimeout("list(" + page + ")", 1000); //re-loading time 根据网速设置时间不同
}
}
function _goto() {
if (checkNum(document.getElementById("pageno").value))
{ list1(Math.floor(document.getElementById("pageno").value)) }
else { document.getElementById("pageno").value = 1 }
}
function checkNum(str) { return !//D/.test(str) } //检查是否数字组成
function new_pagesize() {
loadxml();
var new_pagesize = root.selectSingleNode("//Page/new_pagesize").firstChild.nodeValue;
//var obj_new_pagesize = document.getElementById("new_pagesize");
//obj_new_pagesize.innerText = new_pagesize;
return new_pagesize = new_pagesize;
//alert(new_pagesize);
}
function ContentSize(size)//文章字体调整
{
var obj = $("main_content");
obj.style.fontSize = size + "px";
}
function ch_dl(selObj, restore) { //reload & RE SQL//alert("s");//出现同步问题 ,可在缓冲区里解决
var objXML3 = document.getElementById("Detailsdso");
objXML3.src = xml_file + "?s1=" + selObj.options[selObj.selectedIndex].value;
list1(1);
if (restore) { selObj.selectedIndex = 0; }
}记得早期把玩 yui-ext 时候，曾经给一个函数折腾得几度想放弃 yui-ext。所说的那个函数就是就是 onReady
/*
* 注册浏览器的DOMContentLoaded事件，@todo 有自我卸载的功能。
* @param { Function } onready [必填]在DOMContentLoaded事件触发时需要执行的函数
*/
function onReady(onready){
var isReady = false;
function doReady(){
if( isReady ) return;
//确保onready只执行一次
isReady = true;
onready();
}
if(window.navigator.isIE8){/*IE*/
(function(){
if ( isReady ) return;
try{
document.documentElement.doScroll("left");
}catch( error ) {
setTimeout( arguments.callee, 0 );
return;
}
doReady();
})();
//window.attachEvent('onload',doReady);
}else if (window.navigator.isWebkit && window.navigator.webkitVersion < 525){/*Webkit*/
(function(){
if(isReady) return;
if (/loaded|complete/.test(document.readyState)){
doReady();
}else{
setTimeout( arguments.callee, 0 );
}
})();
//window.addEventListener('load',doReady,false);
}else{ /*FF Opera 高版webkit 其他*/
document.addEventListener("DOMContentLoaded", doReady, false);
//document.removeEventListener( "DOMContentLoaded", arguments.callee, false );
}
}精简版：
function r(f){/in/.test(document.readyState)?setTimeout('r('+f+')',9):f()}http://js8.in/682.html#0-tsina-1-29606-397232819ff9a47a7b7e80a40613cfe1
http://dustindiaz.com/smallest-domready-ever
跨组件使用WSC组件对象
WSC 组件就是微软平台上脚本的模块化。在笔者的实践过程中，研究出一套灵活传递对象的方法，其实质就是送入 host.eval 函数的引用。见下面的 WSC 组件例子：<?xml version="1.0" encoding="UTF-8"?>
<package>
<component id="deepcms">
<?component error="true" debug="true"?>
<implements type="ASP" id="ASP" />
<registration progid="deepcms" />
<public>
<method name="getEdk" />
<method name="getExtDirect" />
<method name="getDeepBlog" />
<method name="getDeepCMS" />
<method name="domain">
<PARAMETER name="ns" />
</method>
</public>
<script type="text/javascript">
with(new ActiveXObject('package_loader')){
init({
evalFn : eval
,edk_folder : 'd:/projects/edk'
});
_import('core');
_import('asp');
var folder = Application.Contents('edk_root');
var entity = Server.mappath('/app/deepcms/service/entity.js');
_import(null, entity);
var page = Server.mappath('/app/deepcms/service/page.js');
_import(null, page);
var deepcms_config = Server.mappath('/app/app/config/config.js');
_import(null, deepcms_config);
var deepcms_news = Server.mappath('/app/app/news/news.js');
_import(null, deepcms_news);
var deepcms_user = Server.mappath('/app/app/user/user.js');
_import(null, deepcms_user);
}
function getEdk(){
return $;
}
function getExtDirect(){
return Ext.direct;
}
function getDeepBlog(){
return DeepBlog;
}
function domain(ns){
return $.Model.init.call(eval(ns));
}
function getDeepCMS(){
return DeepCMS;
}
</script>
</component>
</package>通过GetObject()调用：// D:/dev/new/news/news.wsc
$$ = GetObject("script:" + Server.mappath('/libs/edk/edk-server/edk.wsc').replace(/\\/g, '/')).getEdk();
附送一个小脚本，有时很有用。
var wshObj = new ActiveXObject("WScript.Shell");
var code = wshObj.run('testServer fileServer.js', 0/* 不显示GUI，后台运行 */, false /*不等待程序，也就是执行之后就好*/);
alert('已启动node服务器！\n运行代码' + code);
close();WScript.Shell 常用命令
WScript = {
/**
* 不显示UI，以后台执行的方式运行程序。
* @param {String} cmd
* @return {Number}
*/
quietRun : function (cmd){
var wshObj = new ActiveXObject("WScript.Shell");
return wshObj.run(cmd, 0/* 不显示GUI，后台运行 */, false /*不等待程序，也就是执行之后就好*/);
}
/**
* 目录选择器。
* @param {String} str
* @return {Shell.Application}
*/
,showFolderPickuper : function (str){
var objFolder = new ActiveXObject("Shell.Application").BrowseForFolder(
0
,str || "请选择一个目录。"
,0
,0x11
);
return objFolder ? objFolder.Self.Path : '';
}
/**
* 在脚本中创建浏览器窗体 适合WSC使用。
*/
,createBrowser : function (){
with(new ActiveXObject("InternetExplorer.Application")){
visible = false;
addressBar = false;
menuBar = false;
statusBar = false;
toolBar = false;
resizable = true;
left = 300;
top = 200;
width = 300;
height = 240;
silent = true;
navigate("http://localhost");
/*
Document.title="VBScript 创建的窗口";
Document.body.bgColor="#ECE9D8";
Document.body.style.overflow="hidden";
Document.body.style.borderWidth="0";
Document.body.innerHtml="hi ";
*/
visible = true;
}
}
/**
* 显示系统变量，包括"Process"、"User"和"System"。
* @return {Object}
*/
,showSystemVars : function (){
var wshObj = new ActiveXObject("WScript.Shell");
var
args = ["Process", "User", "System"]
,result = {}
,item
,e;
for(var i = args.length-1; i >= 0; i--){
result[args[i]] = {};
for(e = new Enumerator(wshObj.Environment(args[i])); !e.atEnd(); e.moveNext()){
var item = e.item().split("=");
result[args[i]][item[0]] = item[1];
}
}
return result;
}
/**
* 添加系统环境变量。
* @param {Sting} key
* @param {String} value
* @return {String}
*/
,addEnvVar : function (key, value){
var wshObj = new ActiveXObject("WScript.Shell");
var oSysEnv = wshObj.Environment("SYSTEM");
if(!oSysEnv(key) && oSysEnv(key).indexOf(value) == -1){
oSysEnv(key) = value;
}else{
alert(value + '已经在了');
}
return oSysEnv(key);
}
/**
* 添加PATH环境变量
* @param {String} v 目录字符串
*/
,addPath : function (v){
var wshObj = new ActiveXObject("WScript.Shell");
var oSysEnv = wshObj.Environment("SYSTEM");
if( oSysEnv("Path").indexOf(v) == -1){
oSysEnv("Path") += ';' + v;
}else{
alert('警告：该条目' + v +'已存在！');
}
return oSysEnv("Path");
}
/**
* 获取系统文件夹。通过字体目录获取的。
* @credit http://hi.baidu.com/ucren/blog/item/689d534e6ece2903b2de050f.html */
,getSpecialFolder: function(type){
var fontPath = shell.SpecialFolders("Fonts");
var winPath = fontPath.slice(0, fontPath.lastIndexOf("\\"));
switch(type){
case "windows":
return winPath;
break;
case "system32":
return winPath + "\\system32";
break;
default:
return shell.SpecialFolders(type);
break;
}
}
};
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- C#代码生成xml文档—C#基础回顾
- ext读取两种结构的xml的代码
- ext读取两种结构的xml的代码
- Ext.data-DataReader/ArrayReader/JsonReader/XmlReader
- essyUI + 一维代码使用
- 记录您的代码使用 XML 注释---转自MSDN
- 一周最新示例代码回顾 (3/26–4/1)
- 【代码片段收集】Python解析AndroidManifest.xml
- Bolt XML和JQBolt Lua代码自动补全插件配置教程
- MQX3.8源代码分析：GPIO（5）驱动安装函数 _io_dev_install_ext()
- java代码读取xml文件信息
- java代码写xml文件
- ext 用三种基本类型的数据（Array, Json, Xml） 创建最简单的表格
- 8个驯服烂代码的原则：bjdp.org第13次编程道场回顾
- android:inputType的XML与Java代码对应关系
- IOS-13-XML解析代码（标准版）_另附XML和JSON均解析为字典数据源代码
- php生成xml简单实例代码
- xml中定义个TextView控件及java代码中调用方法。
- xml写代码
- Animation实现动画（xml实现非代码实现）