我的天

我们生来不强，但通过后天的努力我们的天空无限宽广。

今天，我学会了用Overture，抄写出了Realeza的乐谱（原作在这里）。抄写，仅仅是抄写而已。要我分开左右手弹，坑坑洼洼还能凑合着，但要我写谱，当下来说，不可能！虽然只是抄，但看着视频截下来的图片抄写也是需要时间和精力的，更何况，在此之前我没有真正上手玩过midi编曲软件。

这就是成果了！（jpg大图1|jpg大图2）

才24个小节，却花费了我近3个小时，但我觉得很高兴，无论是过程还是结果。过程嘛，我从完全不知道怎么折腾那些我压根就不知道神马是神马的音符到拼凑出一首完整的曲子：不知道附点在哪里，不知道连线（居然还分同音高连线和不同音高连线，对我来说，不就是一弧线么）怎么弄，不知道怎么把八分音符和十六分音符连在一起，不知道怎么在十六分音符中加入十六分休止符。至今仍然不知道怎么在以完成的小节中插入音符，所以小节里一旦有错误，我只好整个小节修改。完全不知道音符中有连线和没有连线的效果可以相差那么远。

如果我未曾亲身体验过而只是收集别人的劳动成果我不会懂得那么多。起码，现在我终于明白了弹琴的时候为什么有时和弦跟主旋律的音是在一起的，有时则刚好错开，休止符使之然也！

谢谢软件，先进的软件让我事半功倍。自动的纠错让我这个纯粹“抄”的人明白到主旋律和和弦的“对齐”，也正是这一点让我明白到上面说到同步不同步的问题。

多年以来，音乐课貌似在我需要的时候都渣了，但其实上，虽然从前的音乐知识没有让我在这个尝试上有多大的优势，但可以100%地说，没有前面的铺垫，我走的弯路将更多。

一个下午就从无到有地折腾出了点东西，我很满意。

幸福是什么？幸福就是你设定目标，然后实现了！所以，我今天很幸福～～～

分享快乐：

Overture中文版下载

Realeza (Alberto Del Rio WWE Theme)打包下载（其中包括可编辑的ove、ove导出的mid，乐谱pdf，乐谱大图jpg）

今天是个伟大的日子，今天我做了两件貌似简单但实际上都不容易的事情：一、用电子琴录制了Realeza（WWE Alberto Del Rio Theme 2010）并用WIDI生成了MIDI版本；二、努力奋战、冥思苦想2天后，我终于达到了我的目标，完成了大名鼎鼎YARK系列的P25 PHP小程序。

所以，对我来说，这是划时代的一天，心情大好！

一、音乐部分

几个月前我就已经挖出家里的古董电子琴（小学时期的产物）来折腾Realeza了。一般熟练，但我只会右手，和弦对我来说是浮云，正如听音乐我只能辨别出主旋律一样。我一直在奢望自己能学会哪怕一点点左手，但电子琴的变压器不行，大号电池的电量也快没了，我得在电子琴还有声音之前赶快完成录制。

以下是xrspook极其简陋的两个自创版Realeza，请凑合着欣赏：

Realeza（WWE Alberto Del Rio Theme 2010）电子琴版[mp3]

Realeza（WWE Alberto Del Rio Theme 2010）WIDI转化MIDI版[midi]

说明：mp3就是拿着个mic对着电子琴录制的，没啥好说，请原谅我的古董电子琴没有跟电脑对接输出的玩意，毕竟那是1998年以前的产物啊，还只是386、486时代呢。midi嘛，不是我自己写的，是用WIDI把mp3转出的，因为是毋庸置疑的“独奏”，所以捕捉到的绝大多数音都是我的意图，但有几个高音电脑识别出来时一个变2个，没搞懂原因，但错有错着，恰逢那是高潮部分，出现这些我意想不到的小变动反而让音乐更丰满。

二、PHP程序部分

从有思路到PHP完全成型，我用了2天，超过15个小时！累着并快乐着！我这个喜欢折磨自己的人……这不能算折磨，这应该说是定下目标然后努力实现，I’m proud of myself.

先说说这个YARK – P25的整体思路，昨天已经说过，也就是“用正则提取，table输出，然后直接Excel粘贴保存”。昨天傍晚说到，我被正则难住了，但昨天晚上，我却突然惊醒地想出了正解。在WWE P25层层div的网页里成功提取出我需要的排名部分。用的是这条正则，针对的是我需要提取信息的开头和结尾部分做筛选。

1

preg_match_all('/< div class="row(.|\n)*?<div class="clear">/', $data, $log);

这条规则是很有针对性的，可以把WWE P25页面我需要部分嵌套的div全部提取出来，但对其他嵌套div网页无效。这条规则的重点是“(.|\n)”意思是“除换行符以外的任意字符或者换行符”，也就是全包围了。从前提取img的时候“.*?”也就足够了，但提取div不一样，因为换行是习惯性的，之前我正是在换行这个问题上被卡住，看到某个网页的时候被这句很创意的“(.|\n)”激发，最终，琢磨出我的第一次正则。

筛选出的排名部分网页源代码包括神马呢？以下是详细说明：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

<div class="row none"> /* WWE P25页面里，一个选手的所有信息的开始，这里的class可能是row none、row fire、row ice或row （注意row后的空格）*/
	<div class="info dir-up"> /*这里的class可能是info dir-up、info dir-dn或info dir-nm，升降平，你懂的*/
		<div class="direction"></div> /*配合升降平的一个说明*/
		<div class="thisweek"></div> /*本周排位，我需要的第一个信息点*/
		<div class="lastweek"></div> /*上周排位，如果我把每周排位都收集了，某一周的上周排位对我来说当然没啥意义*/
	</div> /*info dir-up结束*/
	<div class="thumb"> /*小头像部分，这里没有我需要的信息*/
		<a href="***"></a><a href="***" class="imagecache imagecache-98x105_thumb imagecache-linked imagecache-98x105_thumb_linked"><img src="***" alt="" title=""  width="98" height="105" /></a> /*用了两层超链接，没搞懂为什么，外层没有class，内层有class，核心部分是小头像图片img，注意，有些选手是没有超链接的，比如说那些Tag Team*/
	</div> /*thumb结束*/
	<div class="thumb_none"> /*这里可能是thumb_none、thumb_ice、thumb_fire或thumb_，对应头像无特效、冰、火以及无头像状态*/
	</div> /*thumb_none结束*/
	<div class="details"> /*选手信息*/
		<h2 class="double-arrow-title"> /*二级标题开始*/
			<a href="***">***</a> /*选手名字+超链，选手名字是我需要的第二个信息点*/
		</h2> /*二级标题结束*/
		<div class="text">***</div> /*这周发生了神马事，我需要的第三个信息点*/
	</div> /*details结束*/
	<div class="clear"></div> /*纯粹的网页需要清浮处理 */
</div> /*row none结束*/

这段内容重复25次就是一个P25的完整排名信息。

第一次正则只是个开始，是把偌大一个网页的信息进行初步挖掘。其实也不能算一个网页，自从WWE 2011年头改版后，网页构成发生了巨大变化，比如说到处都有“LOAD MORE”的标志，你必须点击才能看更多内容，以P25的页面为例，我们看到的是：

http://us.wwe.com/inside/power25

但实际上，一共需要载入5个页面才能看到全部25个排名：

http://us.wwe.com/inside/power25
http://us.wwe.com/inside/power25?page=1
http://us.wwe.com/inside/power25?page=2
http://us.wwe.com/inside/power25?page=3
http://us.wwe.com/inside/power25?page=4

每个页面只有5个排名。这也就能解释为什么浏览WWE网页的速度会比从前快了，因为一次性加载的信息减少，信息加载随着浏览进程的推进而逐步增加，对于那些纯粹路过的人来说省事多了。

这5个页面的结构是一样的，对我这个需要提取信息的人来说WWE的这个“改进”完全是件坏事！一开始，我是这样提取页面信息的：

1
2
3
4
5
6
7
8
9

$data0 = get_content($_POST['url'])；
$data1 = get_content($_POST['url']).'?page=1'；
$data2 = get_content($_POST['url']).'?page=2'；
$data3 = get_content($_POST['url']).'?page=3'；
$data4 = get_content($_POST['url']).'?page=4'；
 
/*经历N步操作，N步操作的工作量都是×5，我甚至都在考虑要不要来个for语句来减轻修改数字的压力了*/
 
$data = array_merge($data0[0], $data1[0], $data2[0], $data3[0], $data4[0]);

但后来，我发现完全可以这样嘛：

1

$data = get_content($_POST['url']).get_content($_POST['url'].'?page=1').get_content($_POST['url'].'?page=2').get_content($_POST['url'].'?page=3').get_content($_POST['url'].'?page=4');

如此一来，5个页面的信息也就能一次性地聚合到一起，快、准、狠！

我好像扯远了，回到第一次正则提取的内容。我昨天的思路是对其进行XML数组化，但很遗憾，XHTML网页不是XML，当信息传入外包的XML数组化程序时失败告终。于是，我就只能靠自己继续正则了。

上文已经提到，在第一次正则后的内容里，我有3个需要提取的信息点，它们分别是：

1
2
3

<div class="thisweek"></div> /*本周排名*/
<h2 class="double-arrow-title"><a href="***">***</a></h2> /*选手名字*/
<div class="text">***</div> /*发生事件*/

一次正则后选手名字里有超链，头像里也有超链，“h2”本是选手名字的唯一标记，但由于中间多了个超链，万恶，所以，我也很万恶地一句正则把我不喜欢的东西全部干掉。

1

$log[0] = preg_replace('/< a [^>]*>|< \/a>|<img [^/>]*>|\t|\r|\n/', '', $log[0]);

1
2
3

< a [^>]*>|< \/a> /*干掉所有超链*/
<img [^/> /*干掉所有图片*/
\t|\r|\n /*干掉所有制表符、回车和换行符*/

二次正则过后，提取内容变得简洁。

必须提醒：在PHP里正则针对的都是字符串，所以，如果源数据已经是数组的话，请自行拆解。否则会报错，并且会暴露出当前运行脚本的完整路径，这可是安全性的问题啊，详见这里。

然后呢，因为一次正则我只提取到< div class="clear">显然后面仍应该有< /div>< /div>

才能让这个提取内容闭合完整。所以我加了这么一句：

1

$log[0] = str_replace('< div class="clear">', '<div class="clear"></div>< /div>', $log[0]);

到此为止，经过2次正则，1次字符串替换后，那坨东西符合我要求了，我可以进行第3、4、5次正则完成我的最终提取。

1
2
3

preg_match_all('/< div class="thisweek">([^< ]*)/', $log[0][$i], $rank[$i]);
preg_match_all('/<h2[^>]*>([^< ]*)/', $log[0][$i], $name[$i]);
preg_match_all('/< div class="text">([^< ]*)/', $log[0][$i], $text[$i]);

好吧，到此为止，整个分析、剥离过程完满结束，就只剩下按要求的规范化输出。就是把我提取到的东西table化，略。

整个过程的部分源程序如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50

function get_content($url) /*网址转化为网页内容*/
{
	$ch = curl_init();
	curl_setopt ($ch, CURLOPT_URL, $url);
	curl_setopt ($ch, CURLOPT_HEADER, 0);
	ob_start();
	curl_exec ($ch);
	curl_close ($ch);
	$string = ob_get_contents();
	ob_end_clean();
	return $string;
}
 
/*数据传入开始*/
 
$_POST['url'] = str_replace("www.wwe.com", "us.wwe.com", $_POST['url']);
$data = get_content($_POST['url']).get_content($_POST['url'].'?page=1').get_content($_POST['url'].'?page=2').get_content($_POST['url'].'?page=3').get_content($_POST['url'].'?page=4');
 
/*数据传入结束*/
 
/*正则提取及替换开始*/
 
$data = str_replace("&", '&', $data);
preg_match_all('/<div class="row(.|\n)*?<div class="clear">/', $data, $log);
$log[0] = preg_replace('/< a [^>]*>|< \/a>|<img [^/>]*>|\t|\r|\n/', '', $log[0]);
$log[0] = str_replace('< div class="clear">', '<div class="clear"></div></div>', $log[0]);
 
for($i=0;$i < count($log[0]);$i++)
{
	preg_match_all('/<div class="thisweek">([^< ]*)/', $log[0][$i], $rank[$i]);
	preg_match_all('/<h2[^>]*>([^< ]*)/', $log[0][$i], $name[$i]);
	preg_match_all('/<div class="text">([^< ]*)/', $log[0][$i], $text[$i]);
}
 
/*正则提取及替换结束*/
 
/*table格式化开始*/
 
echo '< table>< col>';
for($i=0;$i < count($log[0]);$i++)
{
	echo '<tr>';
	echo '<td>'.$rank[$i][1][0].'</td>';
	echo '<td>'.$name[$i][1][0].'</td>';
	echo '<td>'.$text[$i][1][0].'</td>';
	echo '';
}
echo '';
 
/*table格式化结束*/

截图是必须的

这就是YARK – P25的威力！你或许会问，就那么一大坨东西有神马用呢？呵呵，真正用法需要把它们贴到Excel。

关于复制那一大坨信息的Excel粘贴也有讲究。

首先，打开Excel，然后选择“编辑 – 选择性粘贴”，然后在“方式”里选择“文本”，按“确定”。最后简单调节表格列距以及单元格格式后，你就能得到如下图的效果：

你一定会问，为神马要如此折腾“粘贴”而不用“Ctrl+V”？呵呵，这和我的用途有关，你完全可以在“选择性粘贴”里用默认的“HTML”方式，结果跟直接用“Ctrl+V”一样，所有粘贴数据都全部挤在1个单元格里，这显然不符合我的设想，如果最后得出这样一个结果的话，我之前所做的事情都白费了。

为什么一定要以现在这个各信息分离的Excel形式呈现呢？因为，我做这么多事情的目的就是能更快更直接地提取我需要的信息，做P25的每周统计。

统计！统计是我的目的！！！！

还记得2天前我做的“ADR前46周的WWE P25”？那可花费了我半天的时间打开一个个网页，一段段信息复制粘贴并最终形成图表。如果，我要对WWE所有选手都这般干的话简直是天方夜谭，但我的确想获取那些信息，知道那个趋势，该怎么办呢？所以我有了弄YARK – P25的念头，并付诸行动，最终华丽地成功了！

YARK – P25在此！聪明的你肯定知道怎么用的。

往后，随着icon化的日益加剧，我真的可能不再看WWE的摔角而转投其他联盟，但我会记住WWE的，不单是因为他们把我引入摔角门，更重要的是为了提取信息，我从他们的网页我自学到了很多，他们的网页严谨规范，虽然可能不是最好的，但我已经从中领会到很多，难道这还不够么？！

哇咔咔，今天的blog很技术，有心人，你们会懂的。

Color3，我的第一个原创WP主题！为啥叫Color3？因为颜色是它的重点，你或许觉得太花俏，因为这就是我的意图，颜色我内定的，嘿嘿，不过widget的元素随便拉，当然啦，拉出状况我不负责，因为有些元素自带<ul>和<li>有些则不然，但尽管如此，我还是选择了适应动态化小工具，xrspook是个善变的人，不能接受一成不变的边栏。

Color3也能称作Sidebar3，我用<?php get_sidebar(); ?>调用了3个不同的sidebar！！！它们分别是<?php get_sidebar(); ?>，<?php get_sidebar(‘single’); ?>，<?php get_sidebar(‘page’); ?>，不敢说这是我的独创，但算是个比较鲜活的多sidebar体验吧，而且多sidebar里有些只能调用一次的widget还巧妙地被我使用到多个sidebar中呢，嘿嘿。这还得感谢昨晚看Charles的那篇讨论：关于Sidebar的一些想法的启发呢。人总是神奇的，能激发无限可能。当然，WP也是神奇的，它让我白手做个网站出来。

无论你看出来没有，先放4个截图，代表着Color3这个主题的几个大亮点。

如果你是个IE的用户，尤其是IE8以下的用户，你会很头痛，非常头痛，众所周知的IE双边距BUG就是硬伤，还有很多莫名其妙的东西，都使得你们很痛苦，我也很痛苦，因为我压根就没有IE6，但那却是国人的重灾区，不得不说，不是WP设计者想歧视你们，而是微软不强行让IE6改进升级太罪恶了！！！！

附上2个测试报告，来自http://www.webpagetest.org/

IE7：4.521s的初次载入时间，1.412s的二次载入时间，是非常好的。

IE8：1.878s的初次载入时间，0.820s的二次载入时间，可以说，已经是非常完美了。

全部页面，90分以上的Google Page Speed评分，如果说还不能达到95以上的话，完全是钱的问题（有钱就能CDN）。

问心无愧的一个杰作，无论你认同与否。I’m pround of it!

最后，请订阅的朋友移步一下http://www.xlanda.net/，观摩点评，谢谢。

在第一个自创WP模板上折腾了1天多，雏形出来了，但显然，我对上面的某些颜色很不满意，看来我不喜欢浅紫色哦。还有一些功能，未能实现，但已在完善计划中，遇到了很多问题，也逐一干掉了不少。

今天我才突然发现，原来WP主题最高深莫测的是comment.php和function.php，它们的代码量可以是其他模板的几倍甚至十几倍，而且基于的东西都是我不太懂的php而不是基础的XHTML。不过，结论就是，有些东西，你越是害怕，越是不敢碰，你越是退缩它们就越会欺负你。大胆去探索一下，没什么不可以的。惊讶地发现，从前在WP经典模板comment.php出现的东西现在跑到function.php里面了，具体一点就是<?php wp_list_comments(); ?>的内容物从前是comment.php里的一坨，现在都默认到了function.php受默认参数的管理。WP的好玩之处就在这里，对于这些貌似封装的函数你继续可以折腾，直到你心满意足，一般的BSP是绝对提供不了这般从菜鸟到高手级的服务。嵌套评论不是什么新鲜事，但从没有嵌套评论的模板里对比弄出个嵌套评论却能让人长进很多。知道了很多来龙去脉。既然我是半路杀出来玩WP的，很多之前的变化不知道，通过这些自我折磨就会让人有灵光N闪的感觉。

或许我是那种喜欢自我折腾着并快乐着的人吧。

脱机的日子里靠着xampp单机折腾出人生的第一个wp theme！！！Am I kidding？我也希望，但我真做到了！！！！！

首先是研究相关主题的代码，然后集百家之所长，基础代码来自wp的class模板，那个模板非常简洁，只有7个php文件！！！索引页、文章页和单页用同一个index.php控制！经典就是强。没有修改它的function模板，function模板是一个很深奥的东西，不敢碰。它的function模板里只有一个函数“register_sidebar”，这个模板有widget功能，但我没用到，sidebar是自己写的代码，其实也非常简单<?php wp_list_categories(‘title_li=0’); ?>我只想在那里显示分类，折腾了好久不知道怎么把那个该死的“未分类”隐藏掉，原来就是在括号里来句’title_li=0’就行了，内牛满面~~~~ 虽然目的达到了，但仍不知道自己干了些什么。

其实为什么能在一天之内完成一个theme呢？全赖之前已经花了不知多少个晚上把单位基于table的网站改成基于div的，于是把.css的东西往style.css一贴，再把早就定位好的div搬到各自的模板，放置上合适的<?php?>，不就是一个theme么？以前同事说之所以用asp而不用php做网站首先是因为他不熟php，接着，asp的网站能用DW编辑，显然，如果写php想用DW……如果可以的话请告诉我一声，我都是用代码写的，还有个重要原因，因为那个模板是他“借”回来的……

看来我要把先进的blog编辑器WordPress引入果起了！让大家都用上wp，独立+自由+强大，我们是时候抛弃非IE不可的小东西了。几天前，米果的朋友为IE6举行了葬礼，但我这里还有N多人在用已经被老爸老妈兄弟姐妹抛弃且已经归西了的IE6。把先进传递开去，xrspook的重大使命啊~~~

其实呢，还有一个貌似很神奇，但可以通过一个php实现的非flash的东东还没开始弄。

努力吧，加油吧，神奇小盆友！！！