技术大牛谈HTML 5设计原理

Jeremy Keith在 Fronteers 2010 上的主题演讲 下载PPT(PDF) http://adactio.com/extras/slides/designofhtml5.pdf 观看视频 http://fronteers.nl/congres/2010/sessions/the-design-of-html5-jeremy-keith 今天我想跟大家谈一谈HTML 5的设计。主要分两个方面:一方面,当然了,就是HTML 5。我可以站在这儿只讲HTML 5,但我并不打算这样做,因为如果你想了解HTML 5的话,你可以Google,可以看书,甚至可以看规范。 实际上,确实有人会谈到规范的内容。史蒂夫·福克纳(Steve Faulkner)会讲HTML 5与可访问性。而保罗·艾里什(Paul Irish)则会讲HTML 5提供的各种API。因此,我今天站在这里,不会光讲一讲HTML 5就算完事了。 说老实话,在正式开始之前,我想先交待清楚我所说的HTML 5到底是什么意思。这话听起来有点搞笑:这会子你一直在说HTML 5,难道我们还不知道什么是HTML 5吗?大家知道,有一个规范,它的名字叫HTML 5。我所说的HTML 5,指的就是这个规范。但问题是,有些人所说的HTML 5,指的不仅仅是这个规范,还有别的意思。比如说,用HTML 5来代指CSS3就是一种常见的叫法。我可不是这样的。我所说的HTML 5,不包含CSS3,就是HTML 5。 类似的术语问题以前也有过。Ajax本来是一种含义明确的技术,但过了不久,它的含义就变成了“用JavaScript来做一切好玩的东西”。这就是Ajax,对不对?今天,HTML 5也面临同样的问题,它本来指的是一个特定的规范,但如今含义却成了“在Web上做一切好玩的事。”我说的不是这种HTML 5,不是这种涵盖了最近刚刚出现的各种新东东的HTML 5。我说的仅仅是规范本身:HTML 5。 刚才已经说了,我今天想要讲的内容不多,也没有打算介绍HTML 5都包含什么。今天我要讲的是它的另一方面,即HTML 5的设计。换句话说,我要讲的不是规范里都包含什么,而是规范里为什么会包含它们,以及在设计这个规范的时候,设计者们是怎么看待这些东西的。 设计原理 设计原理本质上是一种信念、一种想法、一个概念,是你行动的支柱。不管你是制定规范,还是制造一种有形的物品,或者编写软件,甚至发明编程语言。你都能找到背后的一个或者多个设计原理,多人协作的任何成果都是例证。不仅仅Web开发领域是这样。纵观人类历史,像国家和社会这样大规模的构建活动背后,同样也有设计原理。 就拿美国为例吧,美国的设计原理都写在了《独立宣言》中了。 我们认为这些真理是不言而喻的,人人生而平等,造物主赋予了每个人不可剥夺的权利,包括生存、自由和追求幸福。 这里有一句口号:生存、自由和追求幸福。这是被写进宪法中的核心理念,它关系到我们所有人的一切,也就是我们构建自己社会的原则。 还有一个例子,就是卡尔·马克思(Karl Marx),他的著作在20世纪曾被奉为建设社会主义的圭臬。其基本思想大致可以归结为下面这条设计原理: 各尽所能,各取所需。 这其实就是一种经济体系背后的设计原理。 还有一个例子,比前面两个的历史更久远一些,不过大同小异: 人人为我,我为人人。 这个极为简单的设计原理,是两千年前的拿撒勒犹太人耶稣基督提出来的。而这条原则成为了后来许多宗教的核心教义。原理与实践有时候并不是同步的。 下面是小说中的一个例子。英国小说家乔治·奥威尔(George Orwell)笔下的《动物庄园》,就是在一条设计原理的基础上构建起来的虚拟社会。这条设计原理是: 四条腿的都是好人,两条腿的都是坏蛋! 《动物庄园》中有意思的是,随着社会的变迁——变得越来越坏,这条设计原理也跟着发生了改变,变成了“四条腿的都是好人,两条腿的就更好了。”最关键的是,即使是在虚构的作品里,设计原理都是存在的。 还有一套虚构的作品是以三条设计原理为基础构建起来的,那就是美国著名小说家艾萨克·阿西莫夫(Issac Asimov)的机器人经典系列。阿西莫夫发明了机器人学这个术语,并提出了机器人学三大法则,然后在这三个简单的设计原理基础上创作了一系列经典作品——大约有50本书。无论作品的情节如何变化,实际上都是从不同的角度来阐释这三大设计原理。我想,在座各位对机器人三大法则都不应该陌生。 机器人不得伤害人类,或袖手旁观人类受伤害。 机器人必须服从人类命令,除非命令违反第一法则。 机器人必须自卫,只要不违背第一和第二法则。 这些恐怕是第一次出现在小说中的针对软件的设计原理了。虽然基于这三个设计原理的软件运行在虚构的机器人的“正电子脑”中,但我想这应该是软件设计原理的事实开端。从此以后,我们才看到大量优秀软件背后的设计原理。 蒂姆·伯纳斯-李(Tim Berners-Lee),Web的发明者,在W3C的网站上发表过一份文档,其中有一个URL给出了他自己的一套设计原理。这些设计原理并不那么容易理解,不仅多,而且随着时时间推移,他还会不断补充、修改和删除。不过我还是觉得把自己认同的设计原理写出来放在某个地方真是个不错的主意。 实际上,CSS的发明人之一伯特·波斯(Bert Bos),也在W3C的网站上放着一份文档,其中讲的都是基本的设计原理,比如怎样设计并构建一种格式,无论是CSS还是其他格式。推荐大家看一看。 只要你在W3C的站点中随便找一找,就可以发现非常多的这种设计原理,包括蒂姆·伯纳斯-李个人的。当然,你还会看到他从软件工程学校里借用的一些口号:分权(decentalisation)、容忍(tolerance)、简易(simplicity)、模块化(modularity)。这些都是在他发明新格式的时候,头脑中无时无刻不在想的那些关键词。 在座各位对蒂姆·伯纳斯-李的贡献都是非常熟悉的,因为大家每天都在用。他发明了Web,与罗伯特·卡里奥(Robert Cailliau)共同发明了Web,而且在发明Web的同时,也发明了我们每天都在Web上使用的语言。当然,这门语言就是HTML:超文本标记语言。 HTML HTML最早是从2.0版开始的。从来就没有1.0版。如果有人告诉你说,他最早是从HTML 1.0开始使用HTML的,那他绝对是在忽悠你。从前确实有一个名叫HTML Tags的文档,其中的部分标签一直用到现在,但那个文档并非官方的规范。 使用标签、尖括号、p或h1,等等,并不是蒂姆·伯纳斯-李首创的想法。当时的SGML里就有了这些概念,而且当时的CERN(Conseil Europeen pour la Recherche Nucleaire,欧洲核子研究委员会)也在使用SGML的一个特定的版本。也就是说,即便在那个时代,他也没有白手起家;这一点在HTML后来的发展过程中也体现了出来:继往开来、承前启后,而不是另立门户、从头开始。 换句话说,这篇名为HTML Tags的文档可以算作HTML的第一个版本,但它却不是一个正式的版本。第一个正式版本,HTML 2.0,也不是出自W3C之手。HTML 2.0是由IETF,因特网工程任务组(Internet Engineering Task Force)制定的。在W3C成立之前,IETF已经发布了不少标准。但从第三个版本开始往后,W3C,万维网联盟(World Wide Web Consortium)开始接手,并负责后续版本的制定工作。 20世纪九十年代HTML有过几次快速的发展。众所周知,在那个时代要想构建网站,可是一项十分复杂的工程。浏览器大战曾令人头疼不已。市场竞争的结果就是各家浏览器里都塞满了各种专有的特性,都试图在专有特性上胜人一筹。当时的混乱程度不堪回首,HTML到底还重不重要,或者它作为Web格式的前景如何,谁都说不清楚。 […]

龙生   18 Nov 2011
View Details

分享10个便利的HTML5/CSS3框架

 所有的开发人员都应该注意了,你们绝对应该看看这篇文章,帮助你快速创建HTML5/CSS3的开发框架。可能你也看到过其它的框架,但是你应该看看这些框架,因为你以前可能没用过他们中的大部分。看看最新的实用HTML5和CSS3框架吧!希望你们喜欢! 1.HTML5boilerplate H5BP带给你非常漂亮的文档,一个网站优化的编译脚本,还有一个自定义的boilerplate编译器。除此之外,我们还支持lighttd,Google App Engine和NodeJS以及优化的服务器配置(包括Apache,Nginx,和IIS),并且已经把boilerplate的大小减少了50%。 源码 演示 2.The M project 跨平台的手机开发HTML5 javascript框架。特性包括:MVC HTML5,Javascript-所有的开发周期,离线支持(自动缓存),富客户端UI,本地和远程数据支持并且远程存储,国际化(i18n),开源(MIT license),基于NodeJS的编译工具(叫做Espresso)。 源码 演示 3.Gravity 一个基于SASS的框架用于创建功能强大的,易于管理的HTML5网站。能够帮助你快速的创建你创意的原型,并且能让你的开发更简单。 源码 演示 4.Popcorn.js 一个HTML5视频的事件框架,提供一个简单的API来同步互动和身临其境的内容。Popcorn.js使用本地本地HTMLMediaElement属性,方法和事件。转化成一个简单实用的API,并且提供了一个插件系统用于方便社区开发。 源码 演示 5.Roots 一个基于HTML5 boilerplate开发的wordpress主题,blueprint CSS(或者960.gs)和Starkers,能够帮助你快速在创建博客和文字站点。 源码 演示 6.Baker 2.0 一个HTML5 ebook框架用来在ipad和iphone上使用Web标准来发布内容。 源码 演示 7.CSS3-action-framework CSS3的类库用于收集最好的CSS3效果。现在支持CSS3的浏览器正在增加;CSS3在许多案例都可以像javascript一样使用,提供更好的用户体验 源码 演示 8.52frarmework 第一个用enavu network开发的HTML5/CSS3框架 源码 演示 9.G5 Framework 基于F布局。特性包括:CSS&SEO,PHP active class, HTML5 placeholder fallback,粘合的页脚,HTML5基线,光滑的滚动到顶端和非常干净的组织。 源码 演示 10.Inuit.CSS 由Harry Roberts创建。这个框架用于使用较少的代码实现稍小的屏幕。支持IE6+。 源码 演示 文章出自:gbin1.com

龙生   11 Nov 2011
View Details

判断一个js对象是不是数组

  function isArray(o) {       return Object.prototype.toString.call(o) === '[object Array]';      }     判断更多特殊类型:  var is = {         types : ["Array","RegExp","Date","Number","String","Object","HTMLDocument"]     };     for(var i=0,c;c=is.types[i++];){         is[c] = (function(type){             return function(obj){                 return Object.prototype.toString.call(obj) == “[object "+type+"]“;             }         })(c);     }   

龙生   11 Nov 2011
View Details

关于session超时问题

接管负责了公司的一个项目网站后台管理,客服部要求会话间隔时间能长点,于是在web.config里改了outtime设置,设成了8个小时,一个工作日的时间,可是修改后居然不起作用,依旧是20分钟不操作就得重登录。于是把服务器上的IIS超时设置也改了,会话超时设置成480分钟,但是问题仍然存在(关于outtime的设置,一般web.config的优先级别高于machine.config高于IIS设置。)。仔细查看了代码,是用session保存信息而不是cookie,代码中没有有关超时的设置了。搞了半天问题才解决。 session本来是个不稳定的东西,经常会被丢失,本来用cookie不错,但又不想对程序做改动。查了查资料,找到了下面一段: 由于Asp.net程序是默认配置,所以Web.Config文件中关于Session的设定如下: <sessionState mode="InProc" stateConnectionString="tcpip=127.0.0.1:42424" sqlConnectionString="data   source=127.0.0.1;Trusted_Connection=yes" cookieless="true" timeout="20"/> 我们会发现sessionState标签中有个属性mode,它可以有3种取值:InProc、StateServer、SQLServer(大小写敏感)。默认情况下是InProc,也就是将Session保存在进程内(IIS5是aspnet_wp.exe,而IIS6是W3wp.exe),这个进程不稳定,在某些事件发生时,进程会重起,所以造成了存储在该进程内的Session丢失。 哪些情况下该进程会重起呢?微软的一篇文章告诉了我们: 1、配置文件中processModel标签的memoryLimit属性 2、Global.asax或者Web.config文件被更改 3、Bin文件夹中的Web程序(DLL)被修改 4、杀毒软件扫描了一些.config文件。 更多的信息请参考PRB:   Session   variables   are   lost   intermittently   in   ASP.NET   applications 解决办法: 前面说到的sessionState标签中mode属性可以有三个取值,除了InProc之外,还可以为StateServer、SQLServer。这两种存Session的方法都是进程外的,所以当aspnet_wp.exe重起的时候,不会影响到Session。 现在请将mode设定为StateServer。StateServer是本机的一个服务,可以在系统服务里看到服务名为ASP.NET   State   Service的服务,默认情况是不启动的。当我们设定mode为StateServer之后,请手工将该服务启动。 这样,我们就能利用本机的StateService来存储Session了,除非电脑重启或者StateService崩掉,否则Session是不会丢的(因Session超时被丢弃是正常的)。 除此之外,我们还可以将Session通过其他电脑的StateService来保存。具体的修改是这样的。同样还在sessionState标签中,有个stateConnectionString= "tcpip=127.0.0.1:42424 "属性,其中有个ip地址,默认为本机(127.0.0.1),你可以将其改成你所知的运行了StateService服务的电脑IP,这样就可以实现位于不同电脑上的Asp.net程序互通Session了。 如果你有更高的要求,需要在服务期重启时Session也不丢失,可以考虑将mode设定成SQLServer,同样需要修改sqlConnectionString属性。 在使用StateServer或者SQLServer存储Session时,所有需要保存到Session的对象除了基本数据类型(默认的数据类型,如int、string等)外,都必须序列化。只需将[Serializable]标签放到要序列化的类前就可以了。 如: [Serializable] public   class   MyClass { …… } stateConnectionString和sqlConnectionString是当设置mode的方式是stateServer和sqlServer的时候,必须的选项;但是当mode配置为InProc时,并不是必须的。 转自:http://fus53.blog.163.com/blog/static/735886152008476627520/   以下由【龙生时代】补充:

龙生   07 Nov 2011
View Details

李敖的惊人名言

李敖,1935年生于哈尔滨,1949年到台湾。李氏文笔自成一家,自誉为百年来中国人写白话文翘楚。发表著作上百余种,以评论性文章最脍炙人口。《胡适评传》与《蒋介石研究集》为其代表作。西方传媒更捧为“中国近代最杰出的批评家”。    李氏口无遮拦,常常出语惊人,现整理其“名言”数则,以飨读者。       1、“我骂人的方法就是别人都骂人是王八蛋,可我有一个本领,我能证明你是王八蛋。”       2、除了是知名的作家、有名的政治犯,李敖还是人人皆怕的诉讼大王。除了告过’总统’、五院院长、故宫博物院长、台面上知名的政治人物、媒体负责人,甚至连政府机关,只要被李敖锁定,几乎很难逃过被李敖告的命运。“    “现在台湾不景气,我的被告少了,只剩了十七个人。“       3、“英国人说英国没有永远的朋友,也没有永远的敌人,只有永远的利益。对我李敖来说,我没有永远的朋友,也没有永远的敌人,只有永远的正义。“       4、”你不知道我的性格吧?我一点亏都不吃的。我很像犹太人、以色列人。我反应是立刻的。我们中国人相信说’吃亏占便宜’,我从来没有这样。过去吃亏就是吃亏了,可是现在我要占便宜占回来。我这人就是这样,绝不吃亏!“       5、做弱者,多不得好活;做强者,多不得好死。       6、有时解释是不必要的——敌人不信你的解释,朋友无须你的解释。       7、谈恋爱是以自欺始,欺人终;    搞政治是以欺人始,以自欺终。       8、笨人的可怕不在其笨,而在其自作聪明。笨人做不了最笨的事,最笨的事都是聪明人做的。       9、我不能等最后审判时才收拾所有的小人与敌人,在半道里,我也要随手宰他几个.       10、有人向我挑战,说「你放马过来」。我不回话,只是疾驰而去,然后马后炮打倒他。       11、凡是我不了解的现象,我总是勇敢地迎着它走上去,不让它吓倒。我高高地站在它的上面。人应当认定自己比狮子、老虎、猩猩高一等,比大自然中的万物,甚至比他不能理解的,像是奇迹的东西都高,要不然他就算不得人,只不过是一个见着样样东西都害怕的耗子罢了。       12、大家只看不良少年问题,却忘了看不良老年问题。不良少年的许多问题,其实是不良老年引起来的。古今中外,从来没有像国民党集团这么多的不良老年密集在一起,从来没有!       13、科学怪人固然可怕,玄学怪人更是可怕。牟宗三之流,典型的玄学怪人也。他的文章和演说,都不知所云,可是国民党却还捧他。——只有混蛋才捧混蛋。       14、所有的女人都会偷人,只要有机会! 女人三十岁以前偷情,三十岁以后捉奸。       15、国民党在意淫大陆,手淫台湾。       16、有人以為現代文明取消了牛馬、代替以汽車。殊不知現代人要先做陣牛馬,才能 坐上汽車。       17、孫中山朝人民蓋空中樓閣,蔣介石卻收起房租來。       18、前進的理由只要一個;後退的理由卻要一百個。許多人整天找一百個理由證明 他不是懦夫,卻從不用一個理由證明他是勇士。       19、做烈士不算什么,做战士才聪明。我不只是一般的战士,还是神气活现的战士,快快乐乐的战士,使你哭笑不得的战士!       20、 李敖评日本A片:“日本A片的女人叫床叫的比美国A片的女人好,因为日本女人叫的比较细,有起承转合。“李敖说看美国A片就像在看叁民主义。       21、不做无聊之事,难度有生之涯。       22、因为不了解而结婚,因为了解而离婚。       23、想骂我的人多着呢。要骂请排队,轮到不轮到还难说呢?       24、报仇的最好方法就是要比敌人活得久。

龙生   14 Oct 2011
View Details

DataSet to excel

/// <summary>/// DataSet导出Excel/// </summary>/// <param name="arrTitle">列标题,若为null,则直接取dataset列标题</param>/// <param name="ds">要导出的DataSet</param>/// <param name="fileName">Excel文件名,不需要传入扩展名</param>protected void CreateExcel(string[] arrTitle, DataSet ds, string fileName){StringBuilder strb = new StringBuilder();strb.Append(" <html xmlns:o=\"urn:schemas-microsoft-com:office:office\"");strb.Append("xmlns:x=\"urn:schemas-microsoft-com:office:excel\"");strb.Append("xmlns=\"http://www.w3.org/TR/REC-html40\"");strb.Append(" <head> <meta http-equiv=’Content-Type' content=’text/html; charset=gb2312′>");strb.Append(" <style>");strb.Append(".xl26");strb.Append(" {mso-style-parent:style0;");strb.Append(" font-family:\"Times New Roman\", serif;");strb.Append(" mso-font-charset:0;");strb.Append(" mso-number-format:\"@\";}");strb.Append(" </style>");strb.Append(" <xml>");strb.Append(" <x:ExcelWorkbook>");strb.Append("  <x:ExcelWorksheets>");strb.Append("  <x:ExcelWorksheet>");strb.Append("    <x:Name>Sheet1 </x:Name>");strb.Append("    <x:WorksheetOptions>");strb.Append("    <x:DefaultRowHeight>285 </x:DefaultRowHeight>");strb.Append("    <x:Selected/>");strb.Append("    <x:Panes>");strb.Append("      <x:Pane>");strb.Append("      <x:Number>3 </x:Number>");strb.Append("      <x:ActiveCol>1 </x:ActiveCol>");strb.Append("      </x:Pane>");strb.Append("    </x:Panes>");strb.Append("    <x:ProtectContents>False </x:ProtectContents>");strb.Append("    <x:ProtectObjects>False </x:ProtectObjects>");strb.Append("    <x:ProtectScenarios>False </x:ProtectScenarios>");strb.Append("    </x:WorksheetOptions>");strb.Append("  </x:ExcelWorksheet>");strb.Append("  <x:WindowHeight>6750 </x:WindowHeight>");strb.Append("  <x:WindowWidth>10620 </x:WindowWidth>");strb.Append("  <x:WindowTopX>480 </x:WindowTopX>");strb.Append("  <x:WindowTopY>75 </x:WindowTopY>");strb.Append("  <x:ProtectStructure>False </x:ProtectStructure>");strb.Append("  <x:ProtectWindows>False </x:ProtectWindows>");strb.Append(" </x:ExcelWorkbook>");strb.Append(" </xml>");strb.Append("");strb.Append(" </head> <body> <table align=\"center\" style=’border-collapse:collapse;table-layout:fixed'> <tr>"); if (ds.Tables.Count > 0){//写列标题  if […]

龙生   13 Oct 2011
View Details

dataset to excel

using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Data;using System.Data.OleDb;using System.Xml;using System.Xml.Xsl;using System.IO; namespace Amei.Data{    partial class DataSet    {        #region ExcelHelper         #region 读取Excel        public System.Data.DataSet ReadExcel(string path)        {            System.Data.DataSet ds = new System.Data.DataSet();            string extension = System.IO.Path.GetExtension(path.ToLower());            string connString = string.Empty;            if (extension == ".xls")            {                connString = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + path + ";Extended Properties=\"Excel 8.0;HDR=Yes;IMEX=2\"";            }            else if (extension == ".xlsx")            {                connString = "Provider=Microsoft.ACE.OLEDB.12.0;Data Source=" + path + ";Extended Properties=\"Excel 12.0;HDR=Yes;IMEX=2\"";            }            string query = "SELECT * FROM [Sheet1$]";            try            {                OleDbConnection conn = new OleDbConnection();                OleDbCommand cmd […]

龙生   13 Oct 2011
View Details

repeater控件的ItemCreated事件的代码示例

public   void   repeater1_ItemCreated(object   sender,   RepeaterItemEventArgs   e)     {     DataRowView   row   =   (DataRowView)e.Item.DataItem;     string   url   =   "id="+row["zyid"].ToString();     string   text   =   row["职业名称"].ToString();     string   cat_num   =   row["数量"].ToString();         HyperLink   link   =   new   HyperLink();     link.NavigateUrl   =   "upPage.aspx?"   +   url;     link.Text   =   text;         e.Item.Controls.Add(link);     […]

龙生   09 Oct 2011
View Details

个人最新计划

1.软考 2.成教本科 3.洽谈通 4.自助建站 5.玄学提高 6.国学提高 7.英语提高

龙生   08 Oct 2011
View Details

探讨PHP页面跳转几种实现技巧

PHP被许多程序员用来开发WEB的首选语言。在实际开发中,网站的各项功能都可以通过PHP语言的编写来满足,比如PHP页面跳转这一方法。 探讨PHP变量解析顺序如何获取提交数据 深入解读PHP运行机制 浅析PHP函数extract()应用技巧 为你总结一些PHP信息函数 PHP查询字符串技巧分享   Web系统中,从一个网页跳转到另一个网页,是LAMP项目中最常用的技术之一。页面跳转可能是由于用户单击链接、按钮等引发的,也可能是系统自动产生的。 此处介绍PHP中常用的实现页面自动跳转的方法。 PHP页面跳转一、header()函数 header()函数是PHP中进行页面跳转的一种十分简单的方法。header()函数的主要功能是将HTTP协议标头(header)输出到浏览器。 header()函数的定义如下: void header (string string [,bool replace [,int http_response_code]]) 可选参数replace指明是替换前一条类似标头还是添加一条相同类型的标头,默认为替换。 第二个可选参数http_response_code强制将HTTP相应代码设为指定值。 header函数中Location类型的标头是一种特殊的header调用,常用来实现页面跳转。注意:1.location和“:”号间不能有空格,否则不会跳转。 2.在用header前不能有任何的输出。 3.header后的PHP代码还会被执行。例如,将浏览器重定向到lamp兄弟连官方论坛

PHP页面跳转二、Meta标签 Meta标签是HTML中负责提供文档元信息的标签,在PHP程序中使用该标签,也可以实现页面跳转。 若定义http-equiv为refresh,则打开该页面时将根据content规定的值在一定时间内跳转到相应页面。 若设置content="秒数;url=网址",则定义了经过多长时间后页面跳转到指定的网址。例如,使用meta标签实现疫苗后页面自动跳转到LAMP兄弟连官方论坛。

  例如,以下程序meta.php实现在该页面中停留一秒后页面自动跳转到bbs.lampbrother.net。

PHP页面跳转三、JavaScript 例如,此代码可以放在程序中的任何合法位置。

以上就是我们向大家介绍的三种PHP页面跳转实现方法。

龙生   30 Sep 2011
View Details
1 385 386 387 401