BlowBlood

前一段时间是毕业前的疯玩，这一段时间是工作后的疯忙。

不仅要忙快速进入测试人员这个新角色，而且还要认识一大堆的同事，还要填一大堆的表格，装一大堆的软件，同时还要背一大堆的单词来提高的英语水平。

而且门卡没有办下来，进出好麻烦啊，每天都要被保安盘问半天。枉我长得这么帅，保安怎么就记不住呢？

function toggleOneCol() {
  var va = $("one_col")
  var wrap = $("wrap")
  if (va.innerHTML == "Page without sidebar"){
     va.title="Page with sidebar";
     va.innerHTML="Page with sidebar";
     wrap.className="one-column";
  } else {
     va.title="Page without sidebar";
     va.innerHTML="Page without sidebar";
     wrap.className = "";
  }  
}

Netscape's original proposal defined an Expires header that took a
date value in a fixed-length variant format in place of Max-Age:

##########写Cookie ############
cookies = Cookie.SimpleCookie()
cookies['comm_name'] = comment.author 
cookies['comm_name']['path'] = '/'
cookies['comm_name']['max-age'] = 3600*24*365
cookies['comm_email'] = comment.authorEmail  
cookies['comm_email']['path'] = '/'
cookies['comm_email']['max-age'] = 3600*24*365
cookies['comm_url'] = comment.authorWebsite 
cookies['comm_url']['path'] = '/'
cookies['comm_url']['max-age'] = 3600*24*365
output_headers = []
output_headers.append('%s\r\n' % cookies)
for header in output_headers:
  sys.stdout.write(header)  

##########读Cookie ############
 cookies = os.environ.get('HTTP_COOKIE', None)
if cookies is not None:
  user_cookie = Cookie.SimpleCookie()
  user_cookie.load(cookies)
  try:
    comm_name = user_cookie['comm_name'].value
    comm_email = user_cookie['comm_email'].value
    comm_url = user_cookie['comm_url'].value
  except KeyError:
    pass        

try:
  email = request_.get('email')
except ValueError:
  return response_.out.write("email is invalid")
gravatar_url = util.getGravatarUrl(email)
result = urlfetch.fetch(gravatar_url)
if result.status_code == 200:
  response_.headers['Content-Type'] = "image/png"
  response_.out.write(result.content)
else:
  response_.out.write("No Image")

1. 修改了评论的顺序，现在是按照时间倒序排列；
2. 修正了侧边栏的id duplication问题，使得现在可以顺利通过XHTML 1.0 Strict验证；
3. 修正了log中urlencode的error，不过现在url由于被quote所以不可读，期待进一步的改进。。
4. 缓存所有文章，然后根据不同的page，输出不同的文章段，由于每个memcache的内容最大为1M，所以这个需要进一步改进。
5. 缓存具体的数据，而不是query本身，这个是最近看到的。我看了一下我的代码，才发现我之前缓存的都是query。。具体说明见下.

archives = Archive.all().order("-date")
memcache.add(key_, archives, 3600)

archives_ = Archive.all().order("-date")
archives = [x for x in archives_]
memcache.add(key_, archives, 3600)

1. 进一步改进页面的性能，使得主页load时间缩短；
2. 评论的ajax显示，因为恶心的firefox强制的缓存措施，使的评论功能在firefox下显得特别糟糕
3. Rich text editor。。。still in todo list
   

def counter(handler_method):
  def wrapper(self, *args, **kwargs):
    counter = Counter.all().get()
    if counter is None:
        counter = Counter()
        counter.put()
    if not users.is_current_user_admin():
      counter.count += 1
      counter.put()
    return handler_method(self, *args, **kwargs)
  return wrapper

class MainPage(BaseRequestHandler):
  @log.counter
  def get(self):

youdomain.com/2009/5/your-english-title

post = db.Query(Post).filter('permalink =',perm_stem).get()

youdomain.com/post/post_id

    post_id_ = int(post_id)
    post = Post.get_by_id(post_id_)

1. 完成评论的数据库创建，记录评论的作者，内容，作者的邮箱(用于gravatar显示头像)和作者的网址(用来显示在品论列表里)等;
2. 在每篇文章末尾显示评论和添加评论的表单(UI部分参考的iNove)，对于登陆用户会自动填写评论栏的用户名和邮箱(当然是gmail了。。。);
3. 在侧边栏显示最新的评论，最多8条；
4. 给每条评论增加了AJAX请求具体评论的功能；用了AJAX才知道AJAX技术真是简单又实用，真的很强大；
5. 修改admin页面，使得现在可以查看/管理memcache，categories，tags等信息
6. 给页面的绝大部分连接添加nofollow属性，发现google.com搜索我的页面还算比较勤快的，虽然google.com不懂中文。。。
7. 支持gravatar头像显示；
8. 侧边栏的评论现实时，去掉html标签，并且显示字数为50个
9. 增加tags功能，现在侧边栏的tags是真的了:)

1. rich text editor的进一步改进；
2. 增加achieve功能，和categories的效率改进（虽然很简单，但是懒的写了。。）
3. 整体页面的memcache的重新设计，改进某些装在速度，可能使用AJAX装在侧边栏。

在这个博客网站网站的制作过程中，用户所见页我都使用了XHTML 1.0 Strict和CSS3标准验证。
其中css部分由Inove模板的作者完成，XHTML部分则有我自己写好。
写的过程中遇到很多问题，主要是原来没有写过XHTML代码，甚至连HTML都没怎么写过。所以很多尝试都不知道，哈哈。

下面介绍一些我这个新手在这段时间取得的心得：

1. 标签元素要闭合，包括空标签的闭合，比如<br />；
2. url地址中不要使用&,而是采用&amp;这个对于自己的url地址还好说，可以自己生成，主要需要注意google account的login和logout帐户的url地址的转化，其实也很简单，就是用str.replace或者re模块把&转化成&amp;就可以了；
3. img标签需要一个alt属性，用来在图片不能显示的时候，显示alt中的文本；
4. blockquote内部需要一个块级元素，比如是div、p等；
5. 所有的标签和属性都是用小写；
6. 每个标签的属性值都需要使用双引号""括起来；
7. 对于最小化的二值属性，应该使用完成模式，这些属性包括：compact, nowrap, ismap, declare, noshade, checked, disabled, readonly, multiple, selected, noresize, defer。完成属性形式为：checked="checked"；
8. 不要是注释hack XHTML中的javascript代码；
9. 对于元素a, applet, form, frame, iframe, img和map使用id属性来标记这些元素，而不要使用name，实际上，除了form中的input，select，textarea等需要在服务器端获取信息的元素之外，其他的地方尽量避免使用name属性；
10. 主文件需要使用utl-8编码，并且是没有BOM信息的。

<a href="javascript:rteAction('bold')">B</a>

function rteAction(param) {
   document.execCommand(param, false, null);  
};

def InsertPhotoSimple(self, album_or_uri, title, summary, filename_or_handle,
        content_type='image/jpeg', keywords=None)

import gdata.urlfetch
gdata.service.http_request_handler = gdata.urlfetch
#override original http handler
...
filename = self.request.get('imgfile')
filetitle = self.request.get('imgtitle')
file_handle = StringIO.StringIO(filename)#convert string to file-like object
gd_client = gdata.photos.service.PhotosService()
gd_client.email = 'gzguoer@gmail.com'
gd_client.password = bbpsw.getpassword()
gd_client.source = 'blowblood-upload-image'
gd_client.ProgrammaticLogin()    
album_url = '/data/feed/api/user/gzguoer/albumid/5334765855583692065'
try:
  photo = gd_client.InsertPhotoSimple(album_url, 'blogimg',filetitle, 
    file_handle,content_type='image/jpeg')      
  template_values = {
    'imgtitle':'title',
    'img_url':photo.GetMediaURL(),
    'response':'upload_complelted,<a href="javascript:getimgurl()">use it</a>',
  }
  path = os.path.join(os.path.dirname(__file__), '../templates/upload.html')
  self.response.out.write(template.render(path, template_values))      
except gdata.service.RequestError:      
  self.response.out.write(GooglePhotosException)

在google上找了半天，终于发现几个非常不错的XHTML的网页编辑器。

XStandard:

功能强大，稳定，而且历史悠久，兼容性等非常好，但是客户端非常大，而且免费的lite版本用起来限制很多。同时每次在新的机器上使用的时候，都需要安装一下程序。。。

FCKeditor:

非 常好用的编辑器，baidu空间使用的就是这个，支持多国语言，使用方便，去它的网站http://www.fckeditor.net/ 上看的时候发现Oracle和Adobe都是用了该编辑器，呵呵，看来用户还是很多的。但是许可协议比较猛：GPL，LGPL，MPL，三个 Copyleft协议都有，所以我退却了。

TinyMCE:

以LGPL发布，功能非常的强大。网址为：http://tinymce.moxiecode.com/ 而且还可以搭配文件管理和图片管理插件，估计是用起来非常爽。

Free Rich Text Editor:

支持xhtml输出，支持code/edit/preview三种模式之间切换，支持插入图片，支持各种浏览器，估计我将使用这个nb的XHTML的编辑器作为我这个系统的输入工具。。不过发现一个小问题

我记得原来订阅的RSS，怎么现在都交ATOM了呢？到网上查了一下，才发现ATOM是RSS的升级版。。。比RSS简单，而且可以同时支持摘要和全文，虽然我只想要全文。

要支持ATOM的Feed也很简单，首先在首页的head里面加上如下的语句，这样可以让Firefox等浏览器检测到该页含有Feed链接，从而在地址栏或者其他的地方出现一个Feed标志的小图标：

<link rel="alternate" type="application/atom+xml" title="BlowBlood" href="http://www.blowblood.com/atom">

然后制作/atom页面即可。首先在main.py里面添加url的控制语句，使得/atom页面被blog类的相应方法：FeedHandler所控制，然后在FeedHandler方法中构建atom页面需要的内容，主要是每个post的内容，和该次更新的时间，时间可以取最新一篇post的时间(如果没有的话，则取当前时间)，然后把这些数据输出到文件atom.xml中即可。atom.xml的内容如下：

<?xml version="1.0" encoding="utf-8"?>
<feed xmlns="http://www.w3.org/2005/Atom">
    <title><![CDATA[BlowBlood]]></title>
    <id>http://www.blowblood.com-by-gzguoer</id>
    <subtitle>BlowBlood@WestGate</subtitle>
    <link href="http://www.blowblood.com" />
    <link href="http://www.blowblood.com/atom" rel="self" />
    <updated>{{last_updated}}</updated>
    <author>
      <name>blowblood</name>
    </author>
    {%for post in posts%}
  <entry>
      <link href="{{post.full_permalink}}"/>
      <id>{{post.full_permalink}}</id>
      <title><![CDATA[ {{post.title}} ]]></title>
      <content type="html"><![CDATA[ {{post.content}} ]]></content>
      <author>
          <name>{{post.author}}</name>
      </author>
      <updated>{{post.formatted_date}}</updated>
  </entry>
     {%endfor%}
</feed>

然后就行了，哈哈，是不是非常简单呢？

不过有个很普遍的问题，msIE6出生的时候，还没有RSS这玩意，或者没有引起关注，总之IE6还不支持atom，应该有办法可以解决。。

恩，这个编辑器真的不太好用，非常郁闷，在Code和View之间切换的时候，<br />会变成<br>，而且光标所在也不对。。。难道逼我改进吗？或者我直接换一个nb的richtexteditor？

测试一下多管理员模式，哈哈，好像可以用啊！

接下来的任务：

• 增加回复功能
• 增加每篇文章的访问、回复计数功能
• 增加整个网站的点击计数功能
• 激活Archives和Tags cloud功能
• 增加feed功能
• 使用memcached来优化网站系统

这周总的来说没有什么事情，所以抓紧时间把这个blog系统搞起来，之前采用cpedia做的那个各种不爽，索性自己从头来做一遍。

之前已经建立好了关于blog的文章的数据库,具体的model描述如下所示：

class Post(db.Model):
    permalink = db.StringProperty()
    title = db.StringProperty()
    content = db.TextProperty()
    date = db.DateTimeProperty(auto_now_add=True)
    author = db.UserProperty()
    catalog = db.StringProperty()
    private = db.BooleanProperty()    
    hitcount = db.IntegerProperty(default=0)
    commentcount = db.IntegerProperty(default=0)
    lastModifiedDate = db.DateTimeProperty()
    lastModifiedBy = db.UserProperty()
    tags = db.ListProperty(db.Category)
    monthyear = db.StringProperty(multiline=False)

1. 应用WordPress的主题iNove到我这里，哈哈，现在真pp；
2. 修复bug，尤其是google提供的url地址的xhtml化...(实际上就是用&amp;来代替&)；
3. 修改部分代码使得通过xhtml1.1和css3测试；
4. 增加文章删除和修改功能；
5. 文章的分类和tag现在可用了。但是右边的tag cloud还不能用，archives也不能用；

恩，干的不错，加油！马上就要写答辩ppt了，所以时间无多啊。。。