├── .gitattributes ├── .gitignore ├── Gruntfile.js ├── LICENSE ├── README.md ├── _config.yml ├── languages ├── default.yml ├── fr-FR.yml ├── zh-CN.yml └── zh-TW.yml ├── layout ├── _partial │ ├── after-footer.ejs │ ├── archive-post.ejs │ ├── archive.ejs │ ├── article.ejs │ ├── block.ejs │ ├── footer.ejs │ ├── google-analytics.ejs │ ├── head.ejs │ ├── header.ejs │ ├── mathjax.ejs │ ├── mobile-nav.ejs │ ├── post │ │ ├── category.ejs │ │ ├── date.ejs │ │ ├── gallery.ejs │ │ ├── nav.ejs │ │ ├── tag.ejs │ │ └── title.ejs │ ├── sidebar.ejs │ ├── swiftype.ejs │ └── totop.ejs ├── _widget │ ├── archive.ejs │ ├── category.ejs │ ├── links.ejs │ ├── recent_posts.ejs │ ├── tag.ejs │ └── tagcloud.ejs ├── archive.ejs ├── category.ejs ├── index.ejs ├── layout.ejs ├── page.ejs ├── post.ejs └── tag.ejs ├── package.json ├── scripts └── fancybox.js └── source ├── css ├── _extend.styl ├── _partial │ ├── archive.styl │ ├── article.styl │ ├── comment.styl │ ├── footer.styl │ ├── header.styl │ ├── highlight.styl │ ├── mobile.styl │ ├── sidebar-aside.styl │ ├── sidebar-bottom.styl │ ├── sidebar.styl │ └── totop.styl ├── _util │ ├── grid.styl │ └── mixin.styl ├── _variables.styl ├── images │ └── banner.jpg └── style.styl ├── fancybox ├── blank.gif ├── fancybox_loading.gif ├── fancybox_loading@2x.gif ├── fancybox_overlay.png ├── fancybox_sprite.png ├── fancybox_sprite@2x.png ├── helpers │ ├── fancybox_buttons.png │ ├── jquery.fancybox-buttons.css │ ├── jquery.fancybox-buttons.js │ ├── jquery.fancybox-media.js │ ├── jquery.fancybox-thumbs.css │ └── jquery.fancybox-thumbs.js ├── jquery.fancybox.css ├── jquery.fancybox.js └── jquery.fancybox.pack.js ├── img ├── black.png └── white.png └── js └── script.js /.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | 4 | # Custom for Visual Studio 5 | *.cs diff=csharp 6 | *.sln merge=union 7 | *.csproj merge=union 8 | *.vbproj merge=union 9 | *.fsproj merge=union 10 | *.dbproj merge=union 11 | 12 | # Standard to msysgit 13 | *.doc diff=astextplain 14 | *.DOC diff=astextplain 15 | *.docx diff=astextplain 16 | *.DOCX diff=astextplain 17 | *.dot diff=astextplain 18 | *.DOT diff=astextplain 19 | *.pdf diff=astextplain 20 | *.PDF diff=astextplain 21 | *.rtf diff=astextplain 22 | *.RTF diff=astextplain 23 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | Thumbs.db 3 | db.json 4 | debug.log 5 | node_modules/ 6 | __MACOSX/ 7 | public/ 8 | .deploy/ 9 | _SYNCAPP 10 | metadata.xml 11 | /.idea 12 | .editorconfig 13 | -------------------------------------------------------------------------------- /Gruntfile.js: -------------------------------------------------------------------------------- 1 | module.exports = function(grunt){ 2 | grunt.initConfig({ 3 | gitclone: { 4 | fontawesome: { 5 | options: { 6 | repository: 'https://github.com/FortAwesome/Font-Awesome.git', 7 | directory: 'tmp/fontawesome' 8 | }, 9 | }, 10 | fancybox: { 11 | options: { 12 | repository: 'https://github.com/fancyapps/fancyBox.git', 13 | directory: 'tmp/fancybox' 14 | } 15 | } 16 | }, 17 | copy: { 18 | fontawesome: { 19 | expand: true, 20 | cwd: 'tmp/fontawesome/fonts/', 21 | src: ['**'], 22 | dest: 'source/css/fonts/' 23 | }, 24 | fancybox: { 25 | expand: true, 26 | cwd: 'tmp/fancybox/source/', 27 | src: ['**'], 28 | dest: 'source/fancybox/' 29 | } 30 | }, 31 | _clean: { 32 | tmp: ['tmp'], 33 | fontawesome: ['source/css/fonts'], 34 | fancybox: ['source/fancybox'] 35 | } 36 | }); 37 | 38 | require('load-grunt-tasks')(grunt); 39 | 40 | grunt.renameTask('clean', '_clean'); 41 | 42 | grunt.registerTask('fontawesome', ['gitclone:fontawesome', 'copy:fontawesome', '_clean:tmp']); 43 | grunt.registerTask('fancybox', ['gitclone:fancybox', 'copy:fancybox', '_clean:tmp']); 44 | grunt.registerTask('default', ['gitclone', 'copy', '_clean:tmp']); 45 | grunt.registerTask('clean', ['_clean']); 46 | }; -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | Copyright (c) 2016 Starsky Wong 2 | 3 | Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: 4 | 5 | The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. 6 | 7 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. 8 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Paperbox 2 | 3 | [**Demo**](https://sun11.me) 4 | 5 | ![](https://www.sun11.me/images/hexo-theme-paperbox/responsive-design.png) 6 | 7 | A theme modified based on [Landscape-plus](https://github.com/xiangming/landscape-plus) theme based on Landscape theme, with some papers and a paperbox. The motivation is for my personal use. Hexo version is 3.1.1, nodejs v4.2.6. 8 | 9 | ### Feature 10 | 11 | * **Paper-like Appearance** - Make you focus on the contents. 12 | * **Responsive Design** - min-width is 320px, ensure the normal display for iPhone 4-5s. 13 | * **Bug fixs** - fixed many bugs, including paginator in archive, share button, mobile nav, etc. 14 | 15 | ### Modifications on Landscape-plus 16 | 17 | * **Integrated Swiftype Search** - You need to specify `swiftype_key` in `_config.yml` to enable it. 18 | * **Removed Bdshare** - There are conflicts between bdshare and swiftype search, for example, the `more` button in bdshare is invalid when swiftype is enabled. 19 | * **Landscape share Enhancement** - Replaced Pinterest with Linkedin, added 4 Chinese SNS share buttons. 20 | * **Support Mathjax** - Requires the [hexo-renderer-kramed](https://github.com/sun11/hexo-renderer-kramed) plugin, and hexo-renderer-marked should be removed. You need to enable it using `mathjax: true` in `_config.yml`. 21 | * **Block Disgusting Browsing inside Weixin** - You can enable it using `wx_block: true` in your `_config.yml`, otherwise Weixin will render your article in a disgusting way! (Unless you have a public weixin account.) 22 | * **Table of Contents (TOC)** - Should config `toc: true` in .md files, serial numbers of titles is not displayed by default. 23 | 24 | ### Browser Support 25 | 26 | * **IE 9+ and the current versions of other browsers** 27 | * **DO NOT support weixin's inside browsing** 28 | 29 | ### People Using Paperbox 30 | 31 | see [Examples](https://github.com/sun11/hexo-theme-paperbox/wiki/Examples) 32 | 33 | --- 34 | 35 | 基于基于Landscape主题的Landscape-Plus主题由本人修改的主题，主要目的是自己使用，Hexo版本是3.1.1，nodejs 4.2.6 36 | 37 | ### 主题特性 38 | 39 | * **纸张外观** - 使你专注于文章内容 40 | * **响应式设计** - 最小宽度为320px，确保了在iPhone 4到5s的320x*分辨率的正常显示 41 | * **诸多bug修复** - 修复了包括archive分页显示，原主题在分享按钮、mobile nav界面、分页条等的诸多细节bug 42 | 43 | ### 对Landscape-Plus的功能修改 44 | 45 | * **增加Swiftype站内搜索** - 需在配置文件中设置`swiftype_key` 46 | * **移除百度分享** - 因为不明原因（可能是全局变量？）与Swiftype冲突，先执行的js功能正常，后执行的js会出问题，如百度分享的`更多`按钮点击无效 47 | * **Landscape原主题分享增强** - 将Pinterest更改为Linkedin，增加四个国内社交网站：微博，人人，QQ空间，微信 48 | * **支持Mathjax** - 需安装[hexo-renderer-kramed](https://github.com/sun11/hexo-renderer-kramed)插件，并移除hexo-renderer-marked。在`_config.yml`配置`mathjax: true`以启用 49 | * **屏蔽微信内置浏览** - 在`_config.yml`中设置`wx_block: true`即可屏蔽微信内置浏览, 否则你的文章会变成一团糊（除非你有认证的微信公众号） 50 | * **增加文章目录（TOC）显示** - 需在文章中设置`toc: true`，默认不显示编号 51 | 52 | ### 浏览器支持 53 | 54 | * **IE9+和目前版本的其它浏览器** 55 | * **不支持微信内置浏览** 56 | 57 | ### Paperbox用户 58 | 59 | 见 [Examples](https://github.com/sun11/hexo-theme-paperbox/wiki/Examples) 60 | -------------------------------------------------------------------------------- /_config.yml: -------------------------------------------------------------------------------- 1 | # Header 2 | menu: 3 | Home: / 4 | Archives: /archives 5 | About: /about 6 | rss: /atom.xml 7 | github: https://github.com/myname 8 | logo_title: MyLogo 9 | blog_title: My Blog 10 | 11 | # Content 12 | excerpt_link: Read More 13 | fancybox: true 14 | mathjax: false 15 | 16 | # Sidebar 17 | sidebar: right 18 | widgets: 19 | - recent_posts 20 | - tag 21 | - archive 22 | 23 | # Miscellaneous 24 | wx_block: false 25 | google_analytics: 26 | favicon: 27 | twitter: 28 | google_plus: 29 | fb_admins: 30 | fb_app_id: 31 | 32 | # Duoshuo 33 | duoshuo_shortname: 34 | 35 | # Swiftype Search 36 | swiftype_key: 37 | -------------------------------------------------------------------------------- /languages/default.yml: -------------------------------------------------------------------------------- 1 | archive: Archives 2 | categories: Categories 3 | recent_posts: Recents 4 | tags: Tags 5 | tagcloud: Tag Cloud 6 | links: Links 7 | excerpt_link: Read More 8 | share: Share 9 | search: Search 10 | prev: Prev 11 | next: Next 12 | comment: Comments 13 | comments: Comments 14 | contents: Contents 15 | page: Page %d 16 | menu: Menu 17 | rss: RSS 18 | showsidebar: Show Sidebar 19 | hidesidebar: Hide Sidebar 20 | updated: Updated 21 | totop: To Top 22 | older: Older 23 | newer: Newer -------------------------------------------------------------------------------- /languages/fr-FR.yml: -------------------------------------------------------------------------------- 1 | home: Accueil 2 | archive: Archives 3 | categories: Catégories 4 | recent_posts: Récents 5 | tags: Tags 6 | tagcloud: Nuage de tags 7 | links: Liens 8 | excerpt_link: Lire plus 9 | share: Partager 10 | search: Rechercher 11 | prev: Précédent 12 | next: Suivant 13 | comment: Commentaire 14 | comments: Commentaires 15 | contents: Contenu 16 | page: Page %d 17 | menu: Menu 18 | rss: RSS 19 | showsidebar: Voir barre latérale 20 | hidesidebar: Cacher barre latérale 21 | updated: Mis à jour 22 | totop: Vers le haut 23 | older: Plus ancien 24 | newer: Plus récent -------------------------------------------------------------------------------- /languages/zh-CN.yml: -------------------------------------------------------------------------------- 1 | archive: 归档 2 | categories: 分类 3 | recent_posts: 近期文章 4 | tags: 标签 5 | tagcloud: 标签云 6 | links: 友情链接 7 | excerpt_link: 阅读全文 8 | share: 分享到 9 | search: 搜索 10 | prev: 上一页 11 | next: 下一页 12 | comment: 文章评论 13 | comments: 评论 14 | contents: 文章目录 15 | page: 第 %d 页 16 | menu: 菜单 17 | rss: RSS 订阅 18 | showsidebar: 显示侧边栏 19 | hidesidebar: 隐藏侧边栏 20 | updated: 更新日期 21 | totop: 返回顶部 22 | older: 上一篇 23 | newer: 下一篇 -------------------------------------------------------------------------------- /languages/zh-TW.yml: -------------------------------------------------------------------------------- 1 | archive: 歸檔 2 | categories: 分類 3 | recent_posts: 近期文章 4 | tags: 標簽 5 | tagcloud: 標簽雲 6 | links: 友情鏈接 7 | excerpt_link: 閱讀全文 8 | share: 分享到 9 | search: 搜索 10 | prev: 上一頁 11 | next: 下一頁 12 | comment: 文章評論 13 | comments: 評論 14 | contents: 文章目錄 15 | page: 第 %d 頁 16 | menu: 菜單 17 | rss: RSS 訂閱 18 | showsidebar: 顯示側邊欄 19 | hidesidebar: 隱藏側邊欄 20 | updated: 更新日期 21 | totop: 返回頂部 22 | older: 上一篇 23 | newer: 下一篇 -------------------------------------------------------------------------------- /layout/_partial/after-footer.ejs: -------------------------------------------------------------------------------- 1 | <% if ((config.mathjax || theme.mathjax)){ %> 2 | <%- partial('mathjax') %> 3 | <% } %> 4 | 5 | 6 | <%- partial('totop') %> 7 | 8 | 9 | 10 | <% if (theme.swiftype_key){ %> 11 | <%- partial('swiftype') %> 12 | <% } %> 13 | 14 | 15 | <% if (config.duoshuo_shortname || theme.duoshuo_shortname){ %> 16 | 17 | 28 | 29 | <% } else if (config.disqus_shortname){ %> 30 | 43 | <% } %> 44 | 45 | 46 | 47 | 48 | 49 | <% if ((config.fancybox || theme.fancybox)){ %> 50 | <%- css('fancybox/jquery.fancybox') %> 51 | <%- js('fancybox/jquery.fancybox.pack') %> 52 | <% } %> 53 | 54 | <%- js('js/script') %> 55 | -------------------------------------------------------------------------------- /layout/_partial/archive-post.ejs: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 | <%- partial('post/date', {class_name: 'archive-article-date', date_format: 'MMM D'}) %> 5 | <%- partial('post/title', {class_name: 'archive-article-title'}) %> 6 |
7 |
8 |
-------------------------------------------------------------------------------- /layout/_partial/archive.ejs: -------------------------------------------------------------------------------- 1 | <% if (pagination == 2){ %> 2 | <% page.posts.each(function(post){ %> 3 | <%- partial('article', {post: post, index: true}) %> 4 | <% }) %> 5 | <% if (page.total > 1){ %> 6 | 12 | <% } %> 13 | <% } else { %> 14 | <% var last; %> 15 | <% page.posts.each(function(post, i){ %> 16 | <% var year = post.date.year(); %> 17 | <% if (last != year){ %> 18 | <% if (last != null){ %> 19 | 20 | <% } %> 21 | <% last = year; %> 22 |
23 |
24 | <%= year %> 25 |
26 |
27 | <% } %> 28 | <%- partial('archive-post', {post: post, even: i % 2 == 0}) %> 29 | <% }) %> 30 | <% if (page.posts.length){ %> 31 |
32 | <% } %> 33 | <% if (page.total > 1){ %> 34 | 40 | <% } %> 41 | <% } %> -------------------------------------------------------------------------------- /layout/_partial/article.ejs: -------------------------------------------------------------------------------- 1 |
2 |
3 | <%- partial('post/date', {class_name: 'article-date', date_format: null}) %> 4 | <%- partial('post/category') %> 5 |
6 |
7 |
8 |
9 | <%- partial('post/gallery') %> 10 | <% if (post.link || post.title){ %> 11 |
12 | <%- partial('post/title', {class_name: 'article-title'}) %> 13 |
14 | <% } %> 15 |
16 | <% if (post.excerpt && index){ %> 17 | <%- post.excerpt %> 18 | <% if (theme.excerpt_link){ %> 19 |

20 | <%= theme.excerpt_link %> 21 |

22 | <% } %> 23 | <% } else { %> 24 | <% if (!index && post.toc){ %> 25 |
26 | <%= __('contents') %> 27 | <%- toc(post.content, {list_number: false}) %> 28 |
29 | <% } %> 30 | <%- post.content %> 31 | <% } %> 32 |
33 | 44 |
45 |
46 |
47 | <% if (!index){ %> 48 | <%- partial('post/nav') %> 49 | <% } %> 50 |
51 | 52 | <% if (!index && post.comments && (config.duoshuo_shortname || theme.duoshuo_shortname)){ %> 53 |
54 |
55 |
56 | <% } else if (!index && post.comments && config.disqus_shortname){ %> 57 |
58 |
59 | 60 |
61 |
62 | <% } %> 63 | -------------------------------------------------------------------------------- /layout/_partial/block.ejs: -------------------------------------------------------------------------------- 1 | <% if (theme.wx_block){ %> 2 | 9 | <% } %> 10 | -------------------------------------------------------------------------------- /layout/_partial/footer.ejs: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /layout/_partial/google-analytics.ejs: -------------------------------------------------------------------------------- 1 | <% if (theme.google_analytics){ %> 2 | 3 | 13 | 14 | <% } %> -------------------------------------------------------------------------------- /layout/_partial/head.ejs: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | <% 7 | var title = page.title; 8 | 9 | if (is_archive()){ 10 | title = 'Archives'; 11 | 12 | if (is_month()){ 13 | title += ': ' + page.year + '/' + page.month; 14 | } else if (is_year()){ 15 | title += ': ' + page.year; 16 | } 17 | } else if (is_category()){ 18 | title = 'Category: ' + page.category; 19 | } else if (is_tag()){ 20 | title = 'Tag: ' + page.tag; 21 | } 22 | %> 23 | <% if (title){ %><%= title %> | <% } %><%= config.title %> 24 | 25 | <%- open_graph({twitter_id: theme.twitter, google_plus: theme.google_plus, fb_admins: theme.fb_admins, fb_app_id: theme.fb_app_id}) %> 26 | <% if (theme.rss){ %> 27 | 28 | <% } %> 29 | <% if (theme.favicon){ %> 30 | 31 | <% } %> 32 | <%- css('css/style') %> 33 | <% if (config.highlight.enable){ %> 34 | 35 | <% } %> 36 | 37 | <%- partial('google-analytics') %> 38 | <%- partial('block') %> 39 | 40 | -------------------------------------------------------------------------------- /layout/_partial/header.ejs: -------------------------------------------------------------------------------- 1 | 40 | -------------------------------------------------------------------------------- /layout/_partial/mathjax.ejs: -------------------------------------------------------------------------------- 1 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /layout/_partial/mobile-nav.ejs: -------------------------------------------------------------------------------- 1 | 7 | -------------------------------------------------------------------------------- /layout/_partial/post/category.ejs: -------------------------------------------------------------------------------- 1 | <% if (post.categories && post.categories.length){ %> 2 |
3 | <%- list_categories(post.categories, { 4 | show_count: false, 5 | class: 'article-category', 6 | style: 'none', 7 | separator: '►' 8 | }) %> 9 |
10 | <% } %> -------------------------------------------------------------------------------- /layout/_partial/post/date.ejs: -------------------------------------------------------------------------------- 1 |

2 | 3 |

-------------------------------------------------------------------------------- /layout/_partial/post/gallery.ejs: -------------------------------------------------------------------------------- 1 | <% if (post.photos && post.photos.length){ %> 2 |
3 |
4 | <% post.photos.forEach(function(photo, i){ %> 5 | 6 | 7 | 8 | <% }) %> 9 |
10 |
11 | <% } %> -------------------------------------------------------------------------------- /layout/_partial/post/nav.ejs: -------------------------------------------------------------------------------- 1 | <% if (post.prev || post.next){ %> 2 | 22 | <% } %> -------------------------------------------------------------------------------- /layout/_partial/post/tag.ejs: -------------------------------------------------------------------------------- 1 | <% if (post.tags && post.tags.length){ %> 2 | <%- list_tags(post.tags, { 3 | show_count: false, 4 | class: 'article-tag' 5 | }) %> 6 | <% } %> -------------------------------------------------------------------------------- /layout/_partial/post/title.ejs: -------------------------------------------------------------------------------- 1 | <% if (post.link){ %> 2 |

3 | 4 |

5 | <% } else if (post.title){ %> 6 | <% if (index){ %> 7 |

8 | <%= post.title %> 9 |

10 | <% } else { %> 11 |

12 | <%= post.title %> 13 |

14 | <% } %> 15 | <% } %> -------------------------------------------------------------------------------- /layout/_partial/sidebar.ejs: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /layout/_partial/swiftype.ejs: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /layout/_partial/totop.ejs: -------------------------------------------------------------------------------- 1 |
2 | 3 |
-------------------------------------------------------------------------------- /layout/_widget/archive.ejs: -------------------------------------------------------------------------------- 1 | <% if (site.posts.length){ %> 2 |
3 |

<%= __('archive') %>

4 |
5 | <%- list_archives() %> 6 |
7 |
8 | <% } %> -------------------------------------------------------------------------------- /layout/_widget/category.ejs: -------------------------------------------------------------------------------- 1 | <% if (site.categories.length){ %> 2 |
3 |

<%= __('categories') %>

4 |
5 | <%- list_categories() %> 6 |
7 |
8 | <% } %> -------------------------------------------------------------------------------- /layout/_widget/links.ejs: -------------------------------------------------------------------------------- 1 | <% if (site.posts.length){ %> 2 |
3 |

<%= __('links') %>

4 |
5 | 12 |
13 |
14 | <% } %> -------------------------------------------------------------------------------- /layout/_widget/recent_posts.ejs: -------------------------------------------------------------------------------- 1 | <% if (site.posts.length){ %> 2 |
3 |

<%= __('recent_posts') %>

4 |
5 | 12 |
13 |
14 | <% } %> -------------------------------------------------------------------------------- /layout/_widget/tag.ejs: -------------------------------------------------------------------------------- 1 | <% if (site.tags.length){ %> 2 |
3 |

<%= __('tags') %>

4 |
5 | <%- list_tags() %> 6 |
7 |
8 | <% } %> -------------------------------------------------------------------------------- /layout/_widget/tagcloud.ejs: -------------------------------------------------------------------------------- 1 | <% if (site.tags.length){ %> 2 |
3 |

<%= __('tagcloud') %>

4 |
5 | <%- tagcloud() %> 6 |
7 |
8 | <% } %> -------------------------------------------------------------------------------- /layout/archive.ejs: -------------------------------------------------------------------------------- 1 | <%- partial('_partial/archive', {pagination: config.archive, index: true}) %> -------------------------------------------------------------------------------- /layout/category.ejs: -------------------------------------------------------------------------------- 1 | <%- partial('_partial/archive', {pagination: config.category, index: true}) %> -------------------------------------------------------------------------------- /layout/index.ejs: -------------------------------------------------------------------------------- 1 | <%- partial('_partial/archive', {pagination: 2, index: true}) %> -------------------------------------------------------------------------------- /layout/layout.ejs: -------------------------------------------------------------------------------- 1 | <% if(page.layout=='page'){ %> 2 | <% if(page.source.match(/\.md$/)){ %> 3 | <%- partial('_partial/head') %> 4 | 5 |
6 |
7 | <%- partial('_partial/header', null, {cache: !config.relative_link}) %> 8 |
9 |
<%- body %>
10 | <% if (theme.sidebar && theme.sidebar !== 'bottom'){ %> 11 | <%- partial('_partial/sidebar', null, {cache: !config.relative_link}) %> 12 | <% } %> 13 |
14 | <%- partial('_partial/footer', null, {cache: !config.relative_link}) %> 15 |
16 | <%- partial('_partial/mobile-nav', null, {cache: !config.relative_link}) %> 17 | <%- partial('_partial/after-footer') %> 18 |
19 | 20 | 21 | <% }else{ %> 22 | <%- page.content %> 23 | <% } %> 24 | <% }else{ %> 25 | <%- partial('_partial/head') %> 26 | 27 |
28 |
29 | <%- partial('_partial/header', null, {cache: !config.relative_link}) %> 30 |
31 |
<%- body %>
32 | <% if (theme.sidebar && theme.sidebar !== 'bottom'){ %> 33 | <%- partial('_partial/sidebar', null, {cache: !config.relative_link}) %> 34 | <% } %> 35 |
36 | <%- partial('_partial/footer', null, {cache: !config.relative_link}) %> 37 |
38 | <%- partial('_partial/mobile-nav', null, {cache: !config.relative_link}) %> 39 | <%- partial('_partial/after-footer') %> 40 |
41 | 42 | 43 | <% } %> -------------------------------------------------------------------------------- /layout/page.ejs: -------------------------------------------------------------------------------- 1 | <%- partial('_partial/article', {post: page, index: false}) %> -------------------------------------------------------------------------------- /layout/post.ejs: -------------------------------------------------------------------------------- 1 | <%- partial('_partial/article', {post: page, index: false}) %> -------------------------------------------------------------------------------- /layout/tag.ejs: -------------------------------------------------------------------------------- 1 | <%- partial('_partial/archive', {pagination: config.tag, index: true}) %> -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "hexo-theme-paperbox", 3 | "version": "0.3.0", 4 | "private": true, 5 | "devDependencies": { 6 | "grunt": "~0.4.2", 7 | "load-grunt-tasks": "~0.2.0", 8 | "grunt-git": "~0.2.2", 9 | "grunt-contrib-clean": "~0.5.0", 10 | "grunt-contrib-copy": "~0.4.1" 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /scripts/fancybox.js: -------------------------------------------------------------------------------- 1 | var rUrl = /((([A-Za-z]{3,9}:(?:\/\/)?)(?:[-;:&=\+\$,\w]+@)?[A-Za-z0-9.-]+|(?:www.|[-;:&=\+\$,\w]+@)[A-Za-z0-9.-]+)((?:\/[\+~%\/.\w-_]*)?\??(?:[-\+=&;%@.\w_]*)#?(?:[.\!\/\\w]*))?)/; 2 | 3 | /** 4 | * Fancybox tag 5 | * 6 | * Syntax: 7 | * {% fancybox /path/to/image [/path/to/thumbnail] [title] %} 8 | */ 9 | 10 | hexo.extend.tag.register('fancybox', function(args){ 11 | var original = args.shift(), 12 | thumbnail = ''; 13 | 14 | if (args.length && rUrl.test(args[0])){ 15 | thumbnail = args.shift(); 16 | } 17 | 18 | var title = args.join(' '); 19 | 20 | return '' + 21 | '' + title + '' 22 | '' + 23 | (title ? '' + title + '' : ''); 24 | }); -------------------------------------------------------------------------------- /source/css/_extend.styl: -------------------------------------------------------------------------------- 1 | $block-caption 2 | text-decoration: none 3 | text-transform: uppercase 4 | letter-spacing: 0 5 | color: color-grey 6 | margin-bottom: 1em 7 | margin-left: 5px 8 | line-height: 1em 9 | text-shadow: 0 1px #fff 10 | font-weight: bold 11 | 12 | $base-style 13 | h1, h2, h3, h4, h5, h6 14 | font-weight: bold; 15 | color: color-default 16 | font-family: font-serif 17 | h1 a, h2 a, h3 a, h4 a, h5 a, h6 a 18 | color: color-default 19 | text-decoration: none 20 | h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover 21 | color: color-link 22 | h2, h3, h4, h5, h6 23 | font-weight: 600; 24 | margin-bottom: 10px 25 | h1 26 | font-size: 2em 27 | h2 28 | font-size: 1.5em 29 | h3 30 | font-size: 1.3em 31 | h4 32 | font-size: 1.2em 33 | h5 34 | font-size: 1em 35 | h6 36 | font-size: 1em 37 | color: color-grey 38 | hr 39 | border: 1px dashed color-border 40 | strong 41 | font-weight: bold 42 | em, cite 43 | font-style: italic 44 | sup, sub 45 | font-size: 0.75em 46 | line-height: 0 47 | position: relative 48 | vertical-align: baseline 49 | sup 50 | top: -0.5em 51 | sub 52 | bottom: -0.2em 53 | small 54 | font-size: 0.85em 55 | acronym, abbr 56 | border-bottom: 1px dotted 57 | ul, ol, dl 58 | margin: 0 20px 59 | line-height: line-height 60 | ul, ol 61 | ul, ol 62 | margin-top: 0 63 | margin-bottom: 0 64 | ul 65 | list-style: disc 66 | ol 67 | list-style: decimal 68 | dt 69 | font-weight: bold -------------------------------------------------------------------------------- /source/css/_partial/archive.styl: -------------------------------------------------------------------------------- 1 | .archives-wrap 2 | margin: block-margin 0 3 | 4 | .archives 5 | clearfix() 6 | 7 | .archive-year-wrap 8 | margin-bottom: 1em 9 | line-height: 1em 10 | 11 | .archive-year 12 | @extend $block-caption 13 | 14 | .archives 15 | column-gap: 10px 16 | @media mq-tablet 17 | column-count: 2 18 | @media mq-normal 19 | column-count: 3 20 | 21 | .archive-article 22 | avoid-column-break() 23 | 24 | .archive-article-inner 25 | background: color-widget-background 26 | box-shadow: 0px 2px 4px -2px color-grey, inset 0 1px 1px rgba(255,255,255,0.97), 0 0 3px -1px rgba(0,0,0,0.8) 27 | padding: 10px 28 | margin-bottom: 15px 29 | 30 | .archive-article-title 31 | text-decoration: none 32 | font-weight: bold 33 | color: color-default 34 | transition: color 0.2s 35 | line-height: line-height 36 | &:hover 37 | color: color-link 38 | 39 | .archive-article-footer 40 | margin-top: 1em 41 | 42 | .archive-article-date 43 | color: color-grey 44 | text-decoration: none 45 | font-size: 0.85em 46 | line-height: 1em 47 | margin-bottom: 0.5em 48 | display: block 49 | 50 | #page-nav 51 | margin: block-margin auto 52 | background: color-widget-background; 53 | box-shadow: 1px 3px 2px #ddd 54 | border-radius: 3px 55 | text-align: center 56 | color: color-grey 57 | overflow: hidden 58 | a, span 59 | padding: 10px 17px 60 | line-height: 1 61 | height: 2ex 62 | a 63 | color: color-grey 64 | text-decoration: none 65 | &:hover 66 | background: color-grey 67 | color: #fff 68 | .prev 69 | float: left 70 | padding: 10px 15px 71 | .next 72 | float: right 73 | padding: 10px 15px 74 | .page-number 75 | display: inline-block 76 | @media mq-mobile 77 | display: none 78 | .current 79 | color: #ddd 80 | background: #555 81 | .space 82 | color: color-border 83 | @media mq-mobile 84 | display: none -------------------------------------------------------------------------------- /source/css/_partial/article.styl: -------------------------------------------------------------------------------- 1 | .article 2 | margin: block-margin 0 3 | 4 | .article-inner 5 | .curve-down 6 | display: inline-block 7 | height: 100% 8 | width:100% 9 | border:1px solid #e0e0e0 10 | border:none 11 | border-top-color:#efefef 12 | border-bottom-color:#ccc 13 | border-radius:100% / 66px 14 | box-shadow:0 16px 6px -10px rgba(0,0,0,.2) 15 | 16 | .fill-content 17 | height: 100% 18 | display: block 19 | border-color: #fff 20 | background: #f6f6f6 21 | background: linear-gradient(top, rgba(249,249,249,1) 65%, rgba(247,247,247,1) 100%) 22 | border-radius:10px 23 | box-shadow:0 -6px 2px rgba(255,255,255,0), inset 0 4px 2px rgba(255,255,255,.97), 0 0 6px -2px rgba(0,0,0,.8) 24 | 25 | .article-meta 26 | clearfix() 27 | 28 | .article-date 29 | @extend $block-caption 30 | float: left 31 | letter-spacing: 0 32 | 33 | .article-category 34 | float: left 35 | line-height: 1em 36 | color: #ccc 37 | text-shadow: 0 1px #fff 38 | margin-left: 8px 39 | &:before 40 | content: "\2022" 41 | 42 | .article-category-link 43 | @extend $block-caption 44 | margin: 0 12px 1em 45 | 46 | .article-header 47 | padding: article-padding article-padding 0 48 | 49 | .article-title 50 | text-decoration: none 51 | font-size: 2em 52 | font-weight: bold 53 | color: color-default 54 | line-height: line-height-title 55 | transition: color 0.2s 56 | a&:hover 57 | color: color-link 58 | 59 | .article-entry 60 | @extend $base-style 61 | clearfix() 62 | color: color-default 63 | padding: 0 article-padding 64 | word-wrap: break-word 65 | overflow-x: auto 66 | p, table 67 | line-height: line-height 68 | margin: line-height 0 69 | font-size: 1.1em 70 | h1, h2, h3, h4, h5, h6 71 | font-weight: bold 72 | h1, h2, h3, h4, h5, h6 73 | line-height: line-height-title 74 | margin: line-height-title 0 75 | a 76 | color: color-link 77 | text-decoration: none 78 | &:hover 79 | text-decoration: underline 80 | ul, ol, dl 81 | margin-top: line-height 82 | margin-bottom: line-height 83 | img, video 84 | max-width: 100% 85 | height: auto 86 | display: block 87 | margin: auto 88 | iframe 89 | border: none 90 | table 91 | max-width: 100% 92 | margin: line-height auto 93 | border-collapse: collapse 94 | border-spacing: 0 95 | th 96 | font-weight: bold 97 | border-bottom: 3px solid color-border 98 | padding: 10px 5px 99 | td 100 | border-bottom: 1px solid color-border 101 | padding: 10px 5px 102 | blockquote 103 | font-family: font-serif 104 | margin: line-height 0 105 | padding: 0 0.8em; 106 | border-left:4px solid #DDD 107 | color: #777 108 | footer 109 | font-size: font-size 110 | margin: line-height 0 111 | font-family: font-sans 112 | cite 113 | &:before 114 | content: "—" 115 | padding: 0 0.5em 116 | .pullquote 117 | text-align: left 118 | width: 45% 119 | margin: 0 120 | &.left 121 | margin-left: 0.5em 122 | margin-right: 1em 123 | &.right 124 | margin-right: 0.5em 125 | margin-left: 1em 126 | .caption 127 | color: color-grey 128 | display: block 129 | font-size: 0.9em 130 | margin-top: 0.5em 131 | position: relative 132 | text-align: center 133 | // http://webdesignerwall.com/tutorials/css-elastic-videos 134 | .video-container 135 | position: relative 136 | padding-top: (9 / 16 * 100)% // 16:9 ratio 137 | height: 0 138 | margin: 1.6em 0 139 | overflow: hidden 140 | iframe, object, embed 141 | position: absolute 142 | top: 0 143 | left: 0 144 | width: 100% 145 | height: 100% 146 | margin-top: 0 147 | .table-container 148 | overflow: auto 149 | th, td 150 | max-width: 100px 151 | .MathJax_Display,.MJXc-display,.MathJax_SVG_Display 152 | overflow-x: auto 153 | .MathJax_Display,.MJXc-display 154 | > span 155 | padding: 0.5em 156 | 157 | .toc-article 158 | background: #f5f5f5 159 | border: 1px dashed #bbb 160 | margin: 1.5em 0 0.3em 1.5em 161 | padding: 1.2em 1em 0 1em 162 | width: 33% 163 | @media mq-mobile 164 | width: 100% 165 | margin: 1.5em 0 1em 0 166 | 167 | .toc-title 168 | font-size: 120% 169 | 170 | #toc 171 | line-height: 1em 172 | font-size: 0.9em 173 | float: right 174 | box-sizing: border-box 175 | .toc 176 | padding: 0 177 | margin: 1em 178 | line-height: 1.8em 179 | li 180 | list-style-type: none 181 | 182 | .toc-child 183 | margin: 0 0 0 1em 184 | 185 | .article-more-link a 186 | display: inline-block 187 | color: #888 188 | background: linear-gradient(to right, #e2e2e2 0%, #eee 30%) 189 | border-top: 1px solid #fff 190 | box-shadow: 0 -11px 9px -6px #f9f9f9, 0 -6px 3px -10px #eee, 0 5px 10px -5px #777, 0 6px 15px -7px #999 191 | border-radius: 25px 192 | line-height: 1em 193 | padding: 6px 15px 194 | font-weight: 300 195 | font-size: font-size 196 | text-shadow: 0 1px 1px #fff 197 | text-align: center 198 | text-indent: 0px 199 | 200 | .article-more-link a:hover 201 | color: #a0a0a0 202 | background: linear-gradient(to right, #eee 0%, #f0f0f0 40%) 203 | border-top: 1px solid #eee 204 | text-decoration: none 205 | box-shadow: 0 -7px 5px -5px #f9f9f9, 0 -2px 5px -3px #eee, 0 2px 5px -2px #777, 0 5px 5px -5px #999 206 | transition: all 0.3s 207 | 208 | .article-more-link a:active 209 | color: #acacac 210 | background: linear-gradient(to right, #f0f0f0 0%, #f5f5f5 50%) 211 | border-top: 1px solid #f0f0f0 212 | border-bottom: 1px solid rgba(240,240,240,0.8) 213 | box-shadow: none 214 | transition: all 0.3s 215 | 216 | .article-footer 217 | padding: 0 article-padding 218 | 219 | .article-footer-content 220 | clearfix() 221 | font-size: 0.85em 222 | line-height: line-height 223 | border-top: 1px solid color-border 224 | padding: 1.6em 10px 225 | a 226 | color: color-grey 227 | text-decoration: none 228 | &:hover 229 | color: color-default 230 | 231 | .article-tag-list 232 | width: 100% 233 | overflow: hidden 234 | margin-bottom: 10px 235 | 236 | 237 | .article-tag-list-item 238 | float: left 239 | margin-right: 10px 240 | 241 | .article-tag-list-link 242 | &:before 243 | content: "#" 244 | 245 | .article-comment-link 246 | float: right 247 | &:before 248 | content: "\f075" 249 | font-family: font-icon 250 | padding-right: 8px 251 | 252 | .article-share-link 253 | cursor: pointer 254 | float: right 255 | margin-left: 20px 256 | &:before 257 | content: "\f064" 258 | font-family: font-icon 259 | padding-right: 6px 260 | 261 | #article-nav 262 | clearfix() 263 | position: relative 264 | @media mq-normal 265 | margin: block-margin 0 266 | &:before 267 | absolute-center(8px) 268 | content: "" 269 | border-radius: 50% 270 | background: color-border 271 | box-shadow: 0 1px 2px #fff 272 | 273 | .article-nav-link-wrap 274 | text-decoration: none 275 | text-shadow: 0 1px #fff 276 | color: color-grey 277 | box-sizing: border-box 278 | margin-top: block-margin 279 | text-align: center 280 | display: block 281 | &:hover 282 | color: color-default 283 | @media mq-normal 284 | width: 50% 285 | margin-top: 0 286 | 287 | #article-nav-newer 288 | @media mq-normal 289 | float: left 290 | text-align: right 291 | padding-right: 20px 292 | 293 | #article-nav-older 294 | @media mq-normal 295 | float: right 296 | text-align: left 297 | padding-left: 20px 298 | 299 | .article-nav-caption 300 | text-transform: uppercase 301 | letter-spacing: 2px 302 | color: color-border 303 | line-height: 1em 304 | font-weight: bold 305 | #article-nav-newer & 306 | margin-right: -2px 307 | 308 | .article-nav-title 309 | font-size: 0.85em 310 | line-height: line-height 311 | margin-top: 0.5em 312 | 313 | .article-share-box 314 | position: absolute 315 | display: none 316 | background: #fff 317 | box-shadow: 1px 2px 10px rgba(0, 0, 0, 0.2) 318 | border-radius: 3px 319 | margin-left: -145px 320 | width: 200px 321 | overflow: hidden 322 | z-index: 1 323 | &.on 324 | display: block 325 | 326 | .article-share-input 327 | width: 100% 328 | background: none 329 | box-sizing: border-box 330 | font: 14px font-sans 331 | padding: 0 15px 332 | color: color-default 333 | outline: none 334 | border: 1px solid color-border 335 | border-radius: 3px 3px 0 0 336 | height: 36px 337 | line-height: 36px 338 | 339 | .article-share-links 340 | clearfix() 341 | background: color-background 342 | 343 | $article-share-link 344 | width: 50px 345 | height: 50px 346 | display: block 347 | float: left 348 | position: relative 349 | color: #999 350 | text-shadow: 0 1px #fff 351 | cursor: pointer; 352 | &:before 353 | font-size: 20px 354 | font-family: font-icon 355 | absolute-center(@font-size) 356 | text-align: center 357 | &:hover 358 | color: #fff 359 | 360 | .article-share-weibo 361 | @extend $article-share-link 362 | &:before 363 | content: "\f18a" 364 | &:hover 365 | background: color-weibo 366 | text-shadow: 0 1px darken(color-weibo, 20%) 367 | 368 | .article-share-weixin 369 | @extend $article-share-link 370 | &:before 371 | content: "\f1d7" 372 | &:hover 373 | background: color-weixin 374 | text-shadow: 0 1px darken(color-weixin, 20%) 375 | 376 | .article-share-qq 377 | @extend $article-share-link 378 | &:before 379 | content: "\f1d6" 380 | &:hover 381 | background: color-qq 382 | text-shadow: 0 1px darken(color-qq, 20%) 383 | 384 | .article-share-renren 385 | @extend $article-share-link 386 | &:before 387 | content: "\f18b" 388 | &:hover 389 | background: color-renren 390 | text-shadow: 0 1px darken(color-renren, 20%) 391 | 392 | .article-share-more 393 | @extend $article-share-link 394 | &:before 395 | content: "\f067" 396 | &:hover 397 | background: color-more 398 | text-shadow: 0 1px darken(color-more, 20%) 399 | 400 | .article-share-twitter 401 | @extend $article-share-link 402 | &:before 403 | content: "\f099" 404 | &:hover 405 | background: color-twitter 406 | text-shadow: 0 1px darken(color-twitter, 20%) 407 | 408 | .article-share-facebook 409 | @extend $article-share-link 410 | &:before 411 | content: "\f09a" 412 | &:hover 413 | background: color-facebook 414 | text-shadow: 0 1px darken(color-facebook, 20%) 415 | 416 | .article-share-pinterest 417 | @extend $article-share-link 418 | &:before 419 | content: "\f0d2" 420 | &:hover 421 | background: color-pinterest 422 | text-shadow: 0 1px darken(color-pinterest, 20%) 423 | 424 | .article-share-google 425 | @extend $article-share-link 426 | &:before 427 | content: "\f0d5" 428 | &:hover 429 | background: color-google 430 | text-shadow: 0 1px darken(color-google, 20%) 431 | 432 | .article-share-linkedin 433 | @extend $article-share-link 434 | &:before 435 | content: "\f0e1" 436 | &:hover 437 | background: color-linkedin 438 | text-shadow: 0 1px darken(color-linkedin, 20%) 439 | 440 | .qrcode 441 | position: absolute 442 | background: #fff 443 | border: 1px solid color-background 444 | z-index: 1 445 | 446 | .article-gallery 447 | background: #000 448 | position: relative 449 | 450 | .article-gallery-photos 451 | position: relative 452 | overflow: hidden 453 | 454 | .article-gallery-img 455 | display: none 456 | max-width: 100% 457 | &:first-child 458 | display: block 459 | &.loaded 460 | position: absolute 461 | display: block 462 | img 463 | display: block 464 | max-width: 100% 465 | margin: 0 auto 466 | /* 467 | $article-gallery-ctrl 468 | position: absolute 469 | top: 0 470 | height: 100% 471 | width: 60px 472 | color: #fff 473 | text-shadow: 0 0 3px rgba(0, 0, 0, 0.3) 474 | opacity: 0.3 475 | transition: opacity 0.2s 476 | cursor: pointer 477 | &:hover 478 | opacity: 0.8 479 | &:before 480 | font-size: 30px 481 | font-family: font-icon 482 | position: absolute 483 | top: 50% 484 | margin-top: @font-size * -0.5 485 | 486 | .article-gallery-prev 487 | @extend $article-gallery-ctrl 488 | left: 0 489 | &:before 490 | content: "\f053" 491 | left: 15px 492 | 493 | .article-gallery-next 494 | @extend $article-gallery-ctrl 495 | right: 0 496 | &:before 497 | content: "\f054" 498 | right: 15px*/ 499 | -------------------------------------------------------------------------------- /source/css/_partial/comment.styl: -------------------------------------------------------------------------------- 1 | #comments 2 | background: color-widget-background 3 | box-shadow: 1px 2px 3px #ddd 4 | padding: article-padding 5 | border-radius: 3px 6 | margin: block-margin 0 7 | a 8 | color: color-link -------------------------------------------------------------------------------- /source/css/_partial/footer.styl: -------------------------------------------------------------------------------- 1 | #footer 2 | background: url("/img/black.png") 3 | padding: 50px 0 4 | border-top: 1px solid color-border 5 | color: color-grey 6 | a 7 | color: color-link 8 | text-decoration: none 9 | &:hover 10 | text-decoration: underline 11 | 12 | #footer-info 13 | line-height: line-height 14 | font-size: 0.85em -------------------------------------------------------------------------------- /source/css/_partial/header.styl: -------------------------------------------------------------------------------- 1 | #header 2 | height: banner-height 3 | position: relative 4 | border-bottom: 1px solid color-widget-background 5 | 6 | #header-outer 7 | height: 100% 8 | position: relative 9 | 10 | #banner 11 | position: absolute 12 | top: 0 13 | left: 0 14 | width: 100% 15 | height: 100% 16 | background: url(banner-url) center color-grey 17 | background-size: cover 18 | z-index: -1 19 | 20 | #upper-nav 21 | overflow: hidden 22 | margin-top: 10px 23 | 24 | #main-nav-toggle 25 | display: none 26 | &:before 27 | content: "\f0c9" 28 | @media mq-mobile 29 | display: block 30 | 31 | .sub-nav 32 | float: right 33 | 34 | #nav-rss-link 35 | &:before 36 | content: "\f09e" 37 | 38 | #nav-github 39 | &:before 40 | content: "\f09b" 41 | 42 | $nav-link 43 | float: left 44 | color: #fff 45 | opacity: 0.6 46 | text-decoration: none 47 | text-shadow: 0 1px rgba(0, 0, 0, 0.2) 48 | transition: opacity 0.2s 49 | display: block 50 | padding: 20px 15px 51 | &:hover 52 | opacity: 1 53 | 54 | .nav-icon 55 | @extend $nav-link 56 | font-family: font-icon 57 | text-align: center 58 | font-size: font-size 59 | width: font-size 60 | height: font-size 61 | line-height: font-size 62 | padding: 20px 15px 63 | position: relative 64 | cursor: pointer 65 | 66 | #header-title 67 | position: relative 68 | overflow: hidden 69 | float: left 70 | bottom: -50px 71 | left: 20px 72 | @media mq-mobile 73 | position: absolute 74 | bottom: 60px 75 | 76 | #blog-title 77 | text-decoration: none 78 | color: #fff 79 | font-size: blog-title-size 80 | font-weight: bold 81 | font-family: 'Times New Roman' 82 | line-height: blog-title-size 83 | padding: 5px 10px 84 | text-shadow: 1px 1px 4px rgba(0,0,0,0.4), 85 | 0px 1px 10px rgba(0,0,0,0.1), 86 | 0px 6px 15px rgba(0,0,0,0.1) 87 | 88 | #main-nav 89 | font-size: 0 90 | position: absolute 91 | overflow: hidden 92 | bottom: 0 93 | left: 20px 94 | 95 | .main-nav-link 96 | cursor: pointer 97 | font-size: 14px 98 | font-weight: bold 99 | line-height: 2.5em 100 | display: inline-block 101 | text-decoration: none 102 | position: relative 103 | width: 7.5em 104 | background: color-background 105 | box-sizing: border-box 106 | color: color-main-nav-link 107 | text-align: center 108 | transition: background 0.3s ease 109 | box-shadow: 6px 12px 25px 2px rgba(68,68,68,0.3) 110 | &:hover 111 | background: color-main-nav-link-hover 112 | color: color-default 113 | &:active 114 | background: color-main-nav-link-active 115 | box-shadow: 9px 12px 25px 2px rgba(68,68,68,0.3) 116 | &:nth-child(1) 117 | z-index: 998 118 | &:nth-child(2) 119 | z-index: 997 120 | &:nth-child(3) 121 | z-index: 996 122 | &:nth-child(4) 123 | z-index: 995 124 | &:nth-child(5) 125 | z-index: 994 126 | &:nth-child(6) 127 | z-index: 993 128 | @media mq-mobile 129 | display: none 130 | 131 | // CSS Animated Cube 132 | #contenedor 133 | @media mq-mobile 134 | display: none 135 | box-sizing: border-box 136 | position: absolute 137 | top: 50% 138 | right: 15%; 139 | margin-top: -50px 140 | margin-left: -50px 141 | width: 100px 142 | height: 100px 143 | perspective: 250px 144 | ul 145 | box-sizing: border-box 146 | cursor: all-scroll 147 | display: block 148 | width: 100% 149 | height: 100% 150 | transform-style: preserve-3d 151 | margin: 0 152 | padding: 0 153 | animation-name: spincube 154 | animation-timing-function: ease 155 | animation-iteration-count: forward 156 | animation-duration: 10s 157 | transform-style: preserve-3d 158 | transform-origin: 50px 50px 0 159 | transform: rotateX(-25deg) rotateY(32deg) 160 | li 161 | box-sizing: border-box 162 | background: rgba(253,254,255,.9) 163 | border: 1px solid #555 164 | display: block 165 | list-style-type: none 166 | position: absolute 167 | width: 100% 168 | height: 100% 169 | font-size: 1.5em 170 | color: rgba(0,0,0,0.5) 171 | letter-spacing: 1px 172 | text-align: center 173 | line-height: 100px 174 | user-select: none 175 | 176 | .cara:nth-child(1) 177 | transform: translateZ(50px) 178 | 179 | .cara:nth-child(2) 180 | transform: rotateX(-90deg) translateZ(50px) 181 | 182 | .cara:nth-child(3) 183 | transform: rotateX(90deg) rotateZ(-90deg) translateZ(50px) 184 | 185 | .cara:nth-child(4) 186 | transform: rotateY(-90deg) translateZ(50px) 187 | 188 | .cara:nth-child(5) 189 | transform: rotateY(90deg) rotateZ(90deg) translateZ(50px) 190 | 191 | .cara:nth-child(6) 192 | transform: rotateY(180deg) translateZ(50px) 193 | 194 | .animar 195 | transition: all 1s 196 | 197 | .noanimar 198 | transition: none 199 | 200 | // @keyframes spincube 201 | // from,to { } 202 | // 16% { transform: rotateX(90deg); } 203 | // 33% { transform: rotateY(-90deg) rotateZ(90deg); } 204 | // 50% { transform: rotateY(90deg); } 205 | // 66% { transform: rotateX(-90deg) rotateZ(-90deg); } 206 | // 83% { transform: rotateY(180deg) ; } 207 | 208 | -------------------------------------------------------------------------------- /source/css/_partial/highlight.styl: -------------------------------------------------------------------------------- 1 | // https://github.com/chriskempson/tomorrow-theme 2 | highlight-background = #272822 3 | highlight-current-line = #3E3D32 4 | highlight-selection = #49483E 5 | highlight-foreground = #F8F8F2 6 | highlight-comment = #75715E 7 | highlight-red = #F92672 8 | highlight-orange = #FD971F 9 | highlight-yellow = #E6DB74 10 | highlight-green = #A6E22E 11 | highlight-aqua = #A1EFE4 12 | highlight-blue = #66D9EF 13 | highlight-purple = #AE81FF 14 | 15 | $code-block 16 | background: highlight-background 17 | margin: 0 article-padding * -1 18 | padding: 15px article-padding 19 | border-style: solid 20 | border-color: color-border 21 | border-width: 1px 0 22 | overflow: auto 23 | color: highlight-foreground 24 | line-height: font-size * line-height 25 | 26 | $line-numbers 27 | color: #666 28 | font-size: 0.85em 29 | 30 | .article-entry 31 | pre, code 32 | font-family: font-mono 33 | code 34 | background: #f0f0f0 35 | text-shadow: 0 1px #fff 36 | font-size: 0.85em 37 | padding: 0 0.3em 38 | border: 1px solid #dcdcdc 39 | border-radius: 3px 40 | pre 41 | @extend $code-block 42 | code 43 | background: none 44 | text-shadow: none 45 | font-size: 1.1em 46 | padding: 0 47 | border: none 48 | .highlight 49 | @extend $code-block 50 | pre 51 | border: none 52 | margin: 0 53 | padding: 0 54 | table 55 | margin: 0 56 | width: auto 57 | td 58 | border: none 59 | padding: 0 60 | figcaption 61 | clearfix() 62 | font-size: 0.85em 63 | color: highlight-comment 64 | line-height: 1em 65 | margin-bottom: 1em 66 | a 67 | float: right 68 | .gutter pre 69 | @extend $line-numbers 70 | text-align: right 71 | padding-right: 20px 72 | .line 73 | height: font-size * line-height 74 | .gist 75 | margin: 0 article-padding * -1 76 | border-style: solid 77 | border-color: color-border 78 | border-width: 1px 0 79 | background: highlight-background 80 | padding: 15px article-padding 15px 0 81 | .gist-file 82 | border: none 83 | font-family: font-mono 84 | margin: 0 85 | .gist-data 86 | background: none 87 | border: none 88 | .line-numbers 89 | @extend $line-numbers 90 | background: none 91 | border: none 92 | padding: 0 20px 0 0 93 | .line-data 94 | padding: 0 !important 95 | .highlight 96 | margin: 0 97 | padding: 0 98 | border: none 99 | .gist-meta 100 | background: highlight-background 101 | color: highlight-comment 102 | font: 0.85em font-sans 103 | text-shadow: 0 0 104 | padding: 0 105 | margin-top: 1em 106 | margin-left: article-padding 107 | a 108 | color: color-link 109 | font-weight: normal 110 | &:hover 111 | text-decoration: underline 112 | 113 | pre 114 | .comment 115 | .preprocessor 116 | color: highlight-comment 117 | .tag 118 | color: highlight-foreground 119 | .title 120 | .variable 121 | .regexp 122 | .ruby .constant 123 | .xml .tag .title 124 | .xml .pi 125 | .xml .doctype 126 | .html .doctype 127 | .css .id 128 | .css .class 129 | .css .pseudo 130 | color: highlight-red 131 | .number 132 | .built_in 133 | .literal 134 | .constant 135 | color: highlight-purple 136 | .params 137 | color: highlight-orange 138 | .class 139 | .ruby .class .title 140 | .css .rules .attribute 141 | .attribute 142 | color: highlight-green 143 | .string 144 | .value 145 | .inheritance 146 | .header 147 | .ruby .symbol 148 | .xml .cdata 149 | color: highlight-yellow 150 | .css .hexcolor 151 | color: highlight-aqua 152 | .function 153 | .python .decorator 154 | .python .title 155 | .ruby .function .title 156 | .ruby .title .keyword 157 | .perl .sub 158 | .javascript .title 159 | .coffeescript .title 160 | color: highlight-blue 161 | .keyword 162 | .javascript .function 163 | color: highlight-blue 164 | -------------------------------------------------------------------------------- /source/css/_partial/mobile.styl: -------------------------------------------------------------------------------- 1 | #mobile-nav 2 | position: absolute 3 | top: 0 4 | left: 0 5 | width: mobile-nav-width 6 | height: 100% 7 | background: color-mobile-nav-background 8 | border-right: 1px solid #fff 9 | 10 | .mobile-nav-link 11 | display: block 12 | color: color-grey 13 | text-decoration: none 14 | padding: 15px 20px 15 | border-bottom: 1px solid color-mobile-nav-border 16 | font-weight: bold 17 | line-height: 1em 18 | &:hover 19 | color: #fff 20 | -------------------------------------------------------------------------------- /source/css/_partial/sidebar-aside.styl: -------------------------------------------------------------------------------- 1 | #sidebar 2 | @media mq-normal 3 | column(sidebar-column) 4 | 5 | .widget-wrap 6 | margin: block-margin 0 7 | 8 | .widget-title 9 | @extend $block-caption 10 | padding: 8px 20px 11 | font-weight: normal 12 | border-bottom: 1px solid color-border -------------------------------------------------------------------------------- /source/css/_partial/sidebar-bottom.styl: -------------------------------------------------------------------------------- 1 | .widget-wrap 2 | margin-bottom: block-margin !important 3 | @media mq-normal 4 | column(sidebar-column) 5 | 6 | .widget-title 7 | color: #ccc 8 | text-transform: uppercase 9 | margin-bottom: 1em 10 | line-height: 1em 11 | font-weight: normal 12 | 13 | .widget 14 | color: color-grey -------------------------------------------------------------------------------- /source/css/_partial/sidebar.styl: -------------------------------------------------------------------------------- 1 | if sidebar is bottom 2 | @import "sidebar-bottom" 3 | else 4 | @import "sidebar-aside" 5 | 6 | .widget 7 | @extend $base-style 8 | color: color-sidebar-text 9 | padding: 0 10 | border-radius: 3px 11 | word-wrap: break-word 12 | line-height: 1.6em 13 | font-size: 0.99em 14 | a 15 | color: color-grey 16 | text-decoration: none 17 | &:hover 18 | text-decoration: underline 19 | color: color-link 20 | ul, ol, dl 21 | ul, ol, dl 22 | margin-left: 15px 23 | list-style: disc 24 | ul 25 | padding: 0px 0px 26 | background-color: color-widget-background 27 | border-radius: 3px 28 | box-shadow: 0px 5px 3px -3px color-grey, inset 0 2px 1px rgba(255,255,255,0.97), 0 0 3px -1px rgba(0,0,0,0.8) 29 | ul li 30 | padding: 7px 30px 31 | transition: color 0.1s 32 | &:hover 33 | background: color-grey 34 | a 35 | color: #fff 36 | &:hover 37 | text-decoration: underline 38 | span 39 | color: #fff 40 | a 41 | color: color-grey 42 | text-decoration: none 43 | &:first-child:hover 44 | border-radius: 3px 3px 0 0 45 | &:last-child:hover 46 | border-radius: 0 0 3px 3px 47 | &:only-child:hover 48 | border-radius: 3px 49 | ul, ol 50 | list-style: none 51 | margin: 0 52 | ul, ol 53 | margin: 0 20px 54 | ul 55 | list-style: disc 56 | ol 57 | list-style: decimal 58 | 59 | .category-list-count 60 | .tag-list-count 61 | .archive-list-count 62 | padding-left: 5px 63 | color: color-grey 64 | font-size: 0.85em 65 | &:before 66 | content: "(" 67 | &:after 68 | content: ")" 69 | 70 | .tagcloud 71 | a 72 | margin-right: 5px 73 | -------------------------------------------------------------------------------- /source/css/_partial/totop.styl: -------------------------------------------------------------------------------- 1 | #totop 2 | position: fixed 3 | display: none 4 | z-index: 9999 5 | bottom: 3em 6 | right: 1em 7 | cursor: pointer 8 | @media tabletmax 9 | display: none !important 10 | a 11 | font-family: FontAwesome 12 | text-align: center 13 | font-size: 50px 14 | width: 50px 15 | height: 50px 16 | line-height: 50px 17 | color: color-default 18 | opacity: 0.8 19 | &:before 20 | content: '\f139' -------------------------------------------------------------------------------- /source/css/_util/grid.styl: -------------------------------------------------------------------------------- 1 | ///////////////// 2 | // Semantic.gs // for Stylus: http://learnboost.github.com/stylus/ 3 | ///////////////// 4 | 5 | // Utility function — you should never need to modify this 6 | // _gridsystem-width = (column-width + gutter-width) * columns 7 | gridsystem-width(_columns = columns) 8 | (column-width + gutter-width) * _columns 9 | 10 | // Set @total-width to 100% for a fluid layout 11 | // total-width = gridsystem-width(columns) 12 | total-width = 100% 13 | 14 | ////////// 15 | // GRID // 16 | ////////// 17 | 18 | body 19 | clearfix() 20 | width: 100% 21 | 22 | row(_columns = columns) 23 | clearfix() 24 | display: block 25 | width: total-width * ((gutter-width + gridsystem-width(_columns)) / gridsystem-width(_columns)) 26 | margin: 0 total-width * (((gutter-width * .5) / gridsystem-width(_columns)) * -1) 27 | 28 | column(x, _columns = columns) 29 | display: inline 30 | float: left 31 | width: total-width * ((((gutter-width + column-width) * x) - gutter-width) / gridsystem-width(_columns)) 32 | margin: 0 total-width * ((gutter-width * .5) / gridsystem-width(_columns)) 33 | 34 | push(offset = 1) 35 | margin-left: total-width * (((gutter-width + column-width) * offset) / gridsystem-width(columns)) 36 | 37 | pull(offset = 1) 38 | margin-right: total-width * (((gutter-width + column-width) * offset) / gridsystem-width(columns)) -------------------------------------------------------------------------------- /source/css/_util/mixin.styl: -------------------------------------------------------------------------------- 1 | // http://www.zeldman.com/2012/03/01/replacing-the-9999px-hack-new-image-replacement/ 2 | hide-text() 3 | text-indent: 100% 4 | white-space: nowrap 5 | overflow: hidden 6 | 7 | // http://codepen.io/shshaw/full/gEiDt 8 | absolute-center(width, height = width) 9 | // margin: auto 10 | // position: absolute 11 | // top: 50% 12 | // top: 0 13 | // left: 0 14 | // bottom: 0 15 | // right: 0 16 | // width: width 17 | // height: height 18 | // overflow: auto 19 | width: width 20 | height: height 21 | position: absolute 22 | top: 50% 23 | left: 50% 24 | margin-top: width * -0.5 25 | margin-left: height * -0.5 26 | 27 | avoid-column-break() 28 | vendor("column-break-inside", avoid, only: webkit) 29 | page-break-inside: avoid // for firefox 30 | overflow: hidden // fix for firefox 31 | break-inside: avoid-column 32 | -------------------------------------------------------------------------------- /source/css/_variables.styl: -------------------------------------------------------------------------------- 1 | // Colors 2 | color-default = #444 3 | color-grey = #888 4 | color-border = #aaa 5 | color-link = #258fb8 6 | color-background = #eee 7 | color-sidebar-text = #777 8 | color-main-nav-link = #727272 9 | color-main-nav-link-hover = #d5d5d5 10 | color-main-nav-link-active = #b1b1b1 11 | color-widget-text = #13bdff 12 | color-widget-background = #fafafa 13 | color-widget-border = #ccc 14 | color-footer-background = #262a30 15 | color-mobile-nav-background = #191919 16 | color-mobile-nav-border = #2b2b2b 17 | color-weibo = #eb192d 18 | color-weixin = #38ad5a 19 | color-qq = #39B2E2 20 | color-renren = #105BA3 21 | color-more = #333 22 | color-twitter = #00aced 23 | color-facebook = #3b5998 24 | color-pinterest = #cb2027 25 | color-google = #dd4b39 26 | color-linkedin = #0d78b7 27 | 28 | // Fonts 29 | font-sans = "Helvetica Neue", "Helvetica", "Hiragino Sans GB", "Microsoft YaHei", "Source Han Sans CN", "WenQuanYi Micro Hei", Arial, sans-serif 30 | font-serif = "Droid Serif", Georgia, Serif 31 | font-mono = "Source Code Pro", Consolas, Monaco, Menlo, Consolas, monospace 32 | font-icon = FontAwesome 33 | font-icon-path = "//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/fonts/fontawesome-webfont" 34 | font-icon-version = "4.2.0" 35 | font-size = 14px 36 | line-height = 1.6em 37 | line-height-title = 1.1em 38 | 39 | // Header 40 | blog-title-size = 2em 41 | banner-height = 300px 42 | banner-url = "images/banner.jpg" 43 | 44 | sidebar = hexo-config("sidebar") 45 | 46 | // Layout 47 | block-margin = 50px 48 | article-padding = 20px 49 | mobile-nav-width = 250px 50 | main-column = 9 51 | sidebar-column = 3 52 | 53 | if sidebar and sidebar isnt bottom 54 | _sidebar-column = sidebar-column 55 | else 56 | _sidebar-column = 0 57 | 58 | // Grids 59 | column-width = 80px 60 | gutter-width = 20px 61 | columns = main-column + _sidebar-column 62 | 63 | // Media queries 64 | mq-mobile = "screen and (max-width: 479px)" 65 | mq-tablet = "screen and (min-width: 480px) and (max-width: 767px)" 66 | mq-normal = "screen and (min-width: 768px)" 67 | -------------------------------------------------------------------------------- /source/css/images/banner.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sun11/hexo-theme-paperbox/167819d3e1f8b0bf3ed499d1e556f4439972ee01/source/css/images/banner.jpg -------------------------------------------------------------------------------- /source/css/style.styl: -------------------------------------------------------------------------------- 1 | @import "nib" 2 | @import "_variables" 3 | @import "_util/mixin" 4 | @import "_util/grid" 5 | 6 | global-reset() 7 | 8 | input, button 9 | margin: 0 10 | padding: 0 11 | &::-moz-focus-inner 12 | border: 0 13 | padding: 0 14 | 15 | @font-face 16 | font-family: FontAwesome 17 | font-style: normal 18 | font-weight: normal 19 | src: url(font-icon-path + ".eot?v=#" + font-icon-version) 20 | src: url(font-icon-path + ".eot?#iefix&v=#" + font-icon-version) format("embedded-opentype"), 21 | url(font-icon-path + ".woff?v=#" + font-icon-version) format("woff"), 22 | url(font-icon-path + ".ttf?v=#" + font-icon-version) format("truetype"), 23 | url(font-icon-path + ".svg#fontawesomeregular?v=#" + font-icon-version) format("svg") 24 | 25 | html, body, #container 26 | height: 100% 27 | 28 | body 29 | min-width: 320px 30 | background: url("/img/white.png") 31 | font: font-size/line-height font-sans 32 | -webkit-text-size-adjust: 100% 33 | 34 | .outer 35 | clearfix() 36 | max-width: (column-width + gutter-width) * columns + gutter-width 37 | margin: 0 auto 38 | padding: 0 gutter-width 39 | 40 | .inner 41 | column(columns) 42 | 43 | .left, .alignleft 44 | float: left 45 | 46 | .right, .alignright 47 | float: right 48 | 49 | .clear 50 | clear: both 51 | 52 | #container 53 | position: relative 54 | 55 | .mobile-nav-on 56 | overflow: hidden 57 | 58 | #wrap 59 | height: 100% 60 | width: 100% 61 | position: absolute 62 | background: url("/img/white.png") 63 | top: 0 64 | left: 0 65 | transition: 0.2s ease-out 66 | z-index: 1 67 | .mobile-nav-on & 68 | left: mobile-nav-width 69 | 70 | if sidebar and sidebar isnt bottom 71 | #main 72 | @media mq-normal 73 | column(main-column) 74 | 75 | if sidebar is left 76 | #main 77 | float: right 78 | 79 | @import "_extend" 80 | @import "_partial/header" 81 | @import "_partial/article" 82 | @import "_partial/comment" 83 | @import "_partial/archive" 84 | @import "_partial/footer" 85 | @import "_partial/highlight" 86 | @import "_partial/mobile" 87 | @import "_partial/totop" 88 | 89 | if sidebar 90 | @import "_partial/sidebar" 91 | -------------------------------------------------------------------------------- /source/fancybox/blank.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sun11/hexo-theme-paperbox/167819d3e1f8b0bf3ed499d1e556f4439972ee01/source/fancybox/blank.gif -------------------------------------------------------------------------------- /source/fancybox/fancybox_loading.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sun11/hexo-theme-paperbox/167819d3e1f8b0bf3ed499d1e556f4439972ee01/source/fancybox/fancybox_loading.gif -------------------------------------------------------------------------------- /source/fancybox/fancybox_loading@2x.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sun11/hexo-theme-paperbox/167819d3e1f8b0bf3ed499d1e556f4439972ee01/source/fancybox/fancybox_loading@2x.gif -------------------------------------------------------------------------------- /source/fancybox/fancybox_overlay.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sun11/hexo-theme-paperbox/167819d3e1f8b0bf3ed499d1e556f4439972ee01/source/fancybox/fancybox_overlay.png -------------------------------------------------------------------------------- /source/fancybox/fancybox_sprite.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sun11/hexo-theme-paperbox/167819d3e1f8b0bf3ed499d1e556f4439972ee01/source/fancybox/fancybox_sprite.png -------------------------------------------------------------------------------- /source/fancybox/fancybox_sprite@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sun11/hexo-theme-paperbox/167819d3e1f8b0bf3ed499d1e556f4439972ee01/source/fancybox/fancybox_sprite@2x.png -------------------------------------------------------------------------------- /source/fancybox/helpers/fancybox_buttons.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sun11/hexo-theme-paperbox/167819d3e1f8b0bf3ed499d1e556f4439972ee01/source/fancybox/helpers/fancybox_buttons.png -------------------------------------------------------------------------------- /source/fancybox/helpers/jquery.fancybox-buttons.css: -------------------------------------------------------------------------------- 1 | #fancybox-buttons { 2 | position: fixed; 3 | left: 0; 4 | width: 100%; 5 | z-index: 8050; 6 | } 7 | 8 | #fancybox-buttons.top { 9 | top: 10px; 10 | } 11 | 12 | #fancybox-buttons.bottom { 13 | bottom: 10px; 14 | } 15 | 16 | #fancybox-buttons ul { 17 | display: block; 18 | width: 166px; 19 | height: 30px; 20 | margin: 0 auto; 21 | padding: 0; 22 | list-style: none; 23 | border: 1px solid #111; 24 | border-radius: 3px; 25 | -webkit-box-shadow: inset 0 0 0 1px rgba(255,255,255,.05); 26 | -moz-box-shadow: inset 0 0 0 1px rgba(255,255,255,.05); 27 | box-shadow: inset 0 0 0 1px rgba(255,255,255,.05); 28 | background: rgb(50,50,50); 29 | background: -moz-linear-gradient(top, rgb(68,68,68) 0%, rgb(52,52,52) 50%, rgb(41,41,41) 50%, rgb(51,51,51) 100%); 30 | background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(68,68,68)), color-stop(50%,rgb(52,52,52)), color-stop(50%,rgb(41,41,41)), color-stop(100%,rgb(51,51,51))); 31 | background: -webkit-linear-gradient(top, rgb(68,68,68) 0%,rgb(52,52,52) 50%,rgb(41,41,41) 50%,rgb(51,51,51) 100%); 32 | background: -o-linear-gradient(top, rgb(68,68,68) 0%,rgb(52,52,52) 50%,rgb(41,41,41) 50%,rgb(51,51,51) 100%); 33 | background: -ms-linear-gradient(top, rgb(68,68,68) 0%,rgb(52,52,52) 50%,rgb(41,41,41) 50%,rgb(51,51,51) 100%); 34 | background: linear-gradient(top, rgb(68,68,68) 0%,rgb(52,52,52) 50%,rgb(41,41,41) 50%,rgb(51,51,51) 100%); 35 | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#444444', endColorstr='#222222',GradientType=0 ); 36 | } 37 | 38 | #fancybox-buttons ul li { 39 | float: left; 40 | margin: 0; 41 | padding: 0; 42 | } 43 | 44 | #fancybox-buttons a { 45 | display: block; 46 | width: 30px; 47 | height: 30px; 48 | text-indent: -9999px; 49 | background-color: transparent; 50 | background-image: url('fancybox_buttons.png'); 51 | background-repeat: no-repeat; 52 | outline: none; 53 | opacity: 0.8; 54 | } 55 | 56 | #fancybox-buttons a:hover { 57 | opacity: 1; 58 | } 59 | 60 | #fancybox-buttons a.btnPrev { 61 | background-position: 5px 0; 62 | } 63 | 64 | #fancybox-buttons a.btnNext { 65 | background-position: -33px 0; 66 | border-right: 1px solid #3e3e3e; 67 | } 68 | 69 | #fancybox-buttons a.btnPlay { 70 | background-position: 0 -30px; 71 | } 72 | 73 | #fancybox-buttons a.btnPlayOn { 74 | background-position: -30px -30px; 75 | } 76 | 77 | #fancybox-buttons a.btnToggle { 78 | background-position: 3px -60px; 79 | border-left: 1px solid #111; 80 | border-right: 1px solid #3e3e3e; 81 | width: 35px 82 | } 83 | 84 | #fancybox-buttons a.btnToggleOn { 85 | background-position: -27px -60px; 86 | } 87 | 88 | #fancybox-buttons a.btnClose { 89 | border-left: 1px solid #111; 90 | width: 35px; 91 | background-position: -56px 0px; 92 | } 93 | 94 | #fancybox-buttons a.btnDisabled { 95 | opacity : 0.4; 96 | cursor: default; 97 | } -------------------------------------------------------------------------------- /source/fancybox/helpers/jquery.fancybox-buttons.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * Buttons helper for fancyBox 3 | * version: 1.0.5 (Mon, 15 Oct 2012) 4 | * @requires fancyBox v2.0 or later 5 | * 6 | * Usage: 7 | * $(".fancybox").fancybox({ 8 | * helpers : { 9 | * buttons: { 10 | * position : 'top' 11 | * } 12 | * } 13 | * }); 14 | * 15 | */ 16 | ;(function ($) { 17 | //Shortcut for fancyBox object 18 | var F = $.fancybox; 19 | 20 | //Add helper object 21 | F.helpers.buttons = { 22 | defaults : { 23 | skipSingle : false, // disables if gallery contains single image 24 | position : 'top', // 'top' or 'bottom' 25 | tpl : '
' 26 | }, 27 | 28 | list : null, 29 | buttons: null, 30 | 31 | beforeLoad: function (opts, obj) { 32 | //Remove self if gallery do not have at least two items 33 | 34 | if (opts.skipSingle && obj.group.length < 2) { 35 | obj.helpers.buttons = false; 36 | obj.closeBtn = true; 37 | 38 | return; 39 | } 40 | 41 | //Increase top margin to give space for buttons 42 | obj.margin[ opts.position === 'bottom' ? 2 : 0 ] += 30; 43 | }, 44 | 45 | onPlayStart: function () { 46 | if (this.buttons) { 47 | this.buttons.play.attr('title', 'Pause slideshow').addClass('btnPlayOn'); 48 | } 49 | }, 50 | 51 | onPlayEnd: function () { 52 | if (this.buttons) { 53 | this.buttons.play.attr('title', 'Start slideshow').removeClass('btnPlayOn'); 54 | } 55 | }, 56 | 57 | afterShow: function (opts, obj) { 58 | var buttons = this.buttons; 59 | 60 | if (!buttons) { 61 | this.list = $(opts.tpl).addClass(opts.position).appendTo('body'); 62 | 63 | buttons = { 64 | prev : this.list.find('.btnPrev').click( F.prev ), 65 | next : this.list.find('.btnNext').click( F.next ), 66 | play : this.list.find('.btnPlay').click( F.play ), 67 | toggle : this.list.find('.btnToggle').click( F.toggle ), 68 | close : this.list.find('.btnClose').click( F.close ) 69 | } 70 | } 71 | 72 | //Prev 73 | if (obj.index > 0 || obj.loop) { 74 | buttons.prev.removeClass('btnDisabled'); 75 | } else { 76 | buttons.prev.addClass('btnDisabled'); 77 | } 78 | 79 | //Next / Play 80 | if (obj.loop || obj.index < obj.group.length - 1) { 81 | buttons.next.removeClass('btnDisabled'); 82 | buttons.play.removeClass('btnDisabled'); 83 | 84 | } else { 85 | buttons.next.addClass('btnDisabled'); 86 | buttons.play.addClass('btnDisabled'); 87 | } 88 | 89 | this.buttons = buttons; 90 | 91 | this.onUpdate(opts, obj); 92 | }, 93 | 94 | onUpdate: function (opts, obj) { 95 | var toggle; 96 | 97 | if (!this.buttons) { 98 | return; 99 | } 100 | 101 | toggle = this.buttons.toggle.removeClass('btnDisabled btnToggleOn'); 102 | 103 | //Size toggle button 104 | if (obj.canShrink) { 105 | toggle.addClass('btnToggleOn'); 106 | 107 | } else if (!obj.canExpand) { 108 | toggle.addClass('btnDisabled'); 109 | } 110 | }, 111 | 112 | beforeClose: function () { 113 | if (this.list) { 114 | this.list.remove(); 115 | } 116 | 117 | this.list = null; 118 | this.buttons = null; 119 | } 120 | }; 121 | 122 | }(jQuery)); 123 | -------------------------------------------------------------------------------- /source/fancybox/helpers/jquery.fancybox-media.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * Media helper for fancyBox 3 | * version: 1.0.6 (Fri, 14 Jun 2013) 4 | * @requires fancyBox v2.0 or later 5 | * 6 | * Usage: 7 | * $(".fancybox").fancybox({ 8 | * helpers : { 9 | * media: true 10 | * } 11 | * }); 12 | * 13 | * Set custom URL parameters: 14 | * $(".fancybox").fancybox({ 15 | * helpers : { 16 | * media: { 17 | * youtube : { 18 | * params : { 19 | * autoplay : 0 20 | * } 21 | * } 22 | * } 23 | * } 24 | * }); 25 | * 26 | * Or: 27 | * $(".fancybox").fancybox({, 28 | * helpers : { 29 | * media: true 30 | * }, 31 | * youtube : { 32 | * autoplay: 0 33 | * } 34 | * }); 35 | * 36 | * Supports: 37 | * 38 | * Youtube 39 | * http://www.youtube.com/watch?v=opj24KnzrWo 40 | * http://www.youtube.com/embed/opj24KnzrWo 41 | * http://youtu.be/opj24KnzrWo 42 | * http://www.youtube-nocookie.com/embed/opj24KnzrWo 43 | * Vimeo 44 | * http://vimeo.com/40648169 45 | * http://vimeo.com/channels/staffpicks/38843628 46 | * http://vimeo.com/groups/surrealism/videos/36516384 47 | * http://player.vimeo.com/video/45074303 48 | * Metacafe 49 | * http://www.metacafe.com/watch/7635964/dr_seuss_the_lorax_movie_trailer/ 50 | * http://www.metacafe.com/watch/7635964/ 51 | * Dailymotion 52 | * http://www.dailymotion.com/video/xoytqh_dr-seuss-the-lorax-premiere_people 53 | * Twitvid 54 | * http://twitvid.com/QY7MD 55 | * Twitpic 56 | * http://twitpic.com/7p93st 57 | * Instagram 58 | * http://instagr.am/p/IejkuUGxQn/ 59 | * http://instagram.com/p/IejkuUGxQn/ 60 | * Google maps 61 | * http://maps.google.com/maps?q=Eiffel+Tower,+Avenue+Gustave+Eiffel,+Paris,+France&t=h&z=17 62 | * http://maps.google.com/?ll=48.857995,2.294297&spn=0.007666,0.021136&t=m&z=16 63 | * http://maps.google.com/?ll=48.859463,2.292626&spn=0.000965,0.002642&t=m&z=19&layer=c&cbll=48.859524,2.292532&panoid=YJ0lq28OOy3VT2IqIuVY0g&cbp=12,151.58,,0,-15.56 64 | */ 65 | ;(function ($) { 66 | "use strict"; 67 | 68 | //Shortcut for fancyBox object 69 | var F = $.fancybox, 70 | format = function( url, rez, params ) { 71 | params = params || ''; 72 | 73 | if ( $.type( params ) === "object" ) { 74 | params = $.param(params, true); 75 | } 76 | 77 | $.each(rez, function(key, value) { 78 | url = url.replace( '$' + key, value || '' ); 79 | }); 80 | 81 | if (params.length) { 82 | url += ( url.indexOf('?') > 0 ? '&' : '?' ) + params; 83 | } 84 | 85 | return url; 86 | }; 87 | 88 | //Add helper object 89 | F.helpers.media = { 90 | defaults : { 91 | youtube : { 92 | matcher : /(youtube\.com|youtu\.be|youtube-nocookie\.com)\/(watch\?v=|v\/|u\/|embed\/?)?(videoseries\?list=(.*)|[\w-]{11}|\?listType=(.*)&list=(.*)).*/i, 93 | params : { 94 | autoplay : 1, 95 | autohide : 1, 96 | fs : 1, 97 | rel : 0, 98 | hd : 1, 99 | wmode : 'opaque', 100 | enablejsapi : 1 101 | }, 102 | type : 'iframe', 103 | url : '//www.youtube.com/embed/$3' 104 | }, 105 | vimeo : { 106 | matcher : /(?:vimeo(?:pro)?.com)\/(?:[^\d]+)?(\d+)(?:.*)/, 107 | params : { 108 | autoplay : 1, 109 | hd : 1, 110 | show_title : 1, 111 | show_byline : 1, 112 | show_portrait : 0, 113 | fullscreen : 1 114 | }, 115 | type : 'iframe', 116 | url : '//player.vimeo.com/video/$1' 117 | }, 118 | metacafe : { 119 | matcher : /metacafe.com\/(?:watch|fplayer)\/([\w\-]{1,10})/, 120 | params : { 121 | autoPlay : 'yes' 122 | }, 123 | type : 'swf', 124 | url : function( rez, params, obj ) { 125 | obj.swf.flashVars = 'playerVars=' + $.param( params, true ); 126 | 127 | return '//www.metacafe.com/fplayer/' + rez[1] + '/.swf'; 128 | } 129 | }, 130 | dailymotion : { 131 | matcher : /dailymotion.com\/video\/(.*)\/?(.*)/, 132 | params : { 133 | additionalInfos : 0, 134 | autoStart : 1 135 | }, 136 | type : 'swf', 137 | url : '//www.dailymotion.com/swf/video/$1' 138 | }, 139 | twitvid : { 140 | matcher : /twitvid\.com\/([a-zA-Z0-9_\-\?\=]+)/i, 141 | params : { 142 | autoplay : 0 143 | }, 144 | type : 'iframe', 145 | url : '//www.twitvid.com/embed.php?guid=$1' 146 | }, 147 | twitpic : { 148 | matcher : /twitpic\.com\/(?!(?:place|photos|events)\/)([a-zA-Z0-9\?\=\-]+)/i, 149 | type : 'image', 150 | url : '//twitpic.com/show/full/$1/' 151 | }, 152 | instagram : { 153 | matcher : /(instagr\.am|instagram\.com)\/p\/([a-zA-Z0-9_\-]+)\/?/i, 154 | type : 'image', 155 | url : '//$1/p/$2/media/?size=l' 156 | }, 157 | google_maps : { 158 | matcher : /maps\.google\.([a-z]{2,3}(\.[a-z]{2})?)\/(\?ll=|maps\?)(.*)/i, 159 | type : 'iframe', 160 | url : function( rez ) { 161 | return '//maps.google.' + rez[1] + '/' + rez[3] + '' + rez[4] + '&output=' + (rez[4].indexOf('layer=c') > 0 ? 'svembed' : 'embed'); 162 | } 163 | } 164 | }, 165 | 166 | beforeLoad : function(opts, obj) { 167 | var url = obj.href || '', 168 | type = false, 169 | what, 170 | item, 171 | rez, 172 | params; 173 | 174 | for (what in opts) { 175 | if (opts.hasOwnProperty(what)) { 176 | item = opts[ what ]; 177 | rez = url.match( item.matcher ); 178 | 179 | if (rez) { 180 | type = item.type; 181 | params = $.extend(true, {}, item.params, obj[ what ] || ($.isPlainObject(opts[ what ]) ? opts[ what ].params : null)); 182 | 183 | url = $.type( item.url ) === "function" ? item.url.call( this, rez, params, obj ) : format( item.url, rez, params ); 184 | 185 | break; 186 | } 187 | } 188 | } 189 | 190 | if (type) { 191 | obj.href = url; 192 | obj.type = type; 193 | 194 | obj.autoHeight = false; 195 | } 196 | } 197 | }; 198 | 199 | }(jQuery)); -------------------------------------------------------------------------------- /source/fancybox/helpers/jquery.fancybox-thumbs.css: -------------------------------------------------------------------------------- 1 | #fancybox-thumbs { 2 | position: fixed; 3 | left: 0; 4 | width: 100%; 5 | overflow: hidden; 6 | z-index: 8050; 7 | } 8 | 9 | #fancybox-thumbs.bottom { 10 | bottom: 2px; 11 | } 12 | 13 | #fancybox-thumbs.top { 14 | top: 2px; 15 | } 16 | 17 | #fancybox-thumbs ul { 18 | position: relative; 19 | list-style: none; 20 | margin: 0; 21 | padding: 0; 22 | } 23 | 24 | #fancybox-thumbs ul li { 25 | float: left; 26 | padding: 1px; 27 | opacity: 0.5; 28 | } 29 | 30 | #fancybox-thumbs ul li.active { 31 | opacity: 0.75; 32 | padding: 0; 33 | border: 1px solid #fff; 34 | } 35 | 36 | #fancybox-thumbs ul li:hover { 37 | opacity: 1; 38 | } 39 | 40 | #fancybox-thumbs ul li a { 41 | display: block; 42 | position: relative; 43 | overflow: hidden; 44 | border: 1px solid #222; 45 | background: #111; 46 | outline: none; 47 | } 48 | 49 | #fancybox-thumbs ul li img { 50 | display: block; 51 | position: relative; 52 | border: 0; 53 | padding: 0; 54 | max-width: none; 55 | } -------------------------------------------------------------------------------- /source/fancybox/helpers/jquery.fancybox-thumbs.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * Thumbnail helper for fancyBox 3 | * version: 1.0.7 (Mon, 01 Oct 2012) 4 | * @requires fancyBox v2.0 or later 5 | * 6 | * Usage: 7 | * $(".fancybox").fancybox({ 8 | * helpers : { 9 | * thumbs: { 10 | * width : 50, 11 | * height : 50 12 | * } 13 | * } 14 | * }); 15 | * 16 | */ 17 | ;(function ($) { 18 | //Shortcut for fancyBox object 19 | var F = $.fancybox; 20 | 21 | //Add helper object 22 | F.helpers.thumbs = { 23 | defaults : { 24 | width : 50, // thumbnail width 25 | height : 50, // thumbnail height 26 | position : 'bottom', // 'top' or 'bottom' 27 | source : function ( item ) { // function to obtain the URL of the thumbnail image 28 | var href; 29 | 30 | if (item.element) { 31 | href = $(item.element).find('img').attr('src'); 32 | } 33 | 34 | if (!href && item.type === 'image' && item.href) { 35 | href = item.href; 36 | } 37 | 38 | return href; 39 | } 40 | }, 41 | 42 | wrap : null, 43 | list : null, 44 | width : 0, 45 | 46 | init: function (opts, obj) { 47 | var that = this, 48 | list, 49 | thumbWidth = opts.width, 50 | thumbHeight = opts.height, 51 | thumbSource = opts.source; 52 | 53 | //Build list structure 54 | list = ''; 55 | 56 | for (var n = 0; n < obj.group.length; n++) { 57 | list += '
    • '; 58 | } 59 | 60 | this.wrap = $('
    ').addClass(opts.position).appendTo('body'); 61 | this.list = $('').appendTo(this.wrap); 62 | 63 | //Load each thumbnail 64 | $.each(obj.group, function (i) { 65 | var el = obj.group[ i ], 66 | href = thumbSource( el ); 67 | 68 | if (!href) { 69 | return; 70 | } 71 | 72 | $("").load(function () { 73 | var width = this.width, 74 | height = this.height, 75 | widthRatio, heightRatio, parent; 76 | 77 | if (!that.list || !width || !height) { 78 | return; 79 | } 80 | 81 | //Calculate thumbnail width/height and center it 82 | widthRatio = width / thumbWidth; 83 | heightRatio = height / thumbHeight; 84 | 85 | parent = that.list.children().eq(i).find('a'); 86 | 87 | if (widthRatio >= 1 && heightRatio >= 1) { 88 | if (widthRatio > heightRatio) { 89 | width = Math.floor(width / heightRatio); 90 | height = thumbHeight; 91 | 92 | } else { 93 | width = thumbWidth; 94 | height = Math.floor(height / widthRatio); 95 | } 96 | } 97 | 98 | $(this).css({ 99 | width : width, 100 | height : height, 101 | top : Math.floor(thumbHeight / 2 - height / 2), 102 | left : Math.floor(thumbWidth / 2 - width / 2) 103 | }); 104 | 105 | parent.width(thumbWidth).height(thumbHeight); 106 | 107 | $(this).hide().appendTo(parent).fadeIn(300); 108 | 109 | }) 110 | .attr('src', href) 111 | .attr('title', el.title); 112 | }); 113 | 114 | //Set initial width 115 | this.width = this.list.children().eq(0).outerWidth(true); 116 | 117 | this.list.width(this.width * (obj.group.length + 1)).css('left', Math.floor($(window).width() * 0.5 - (obj.index * this.width + this.width * 0.5))); 118 | }, 119 | 120 | beforeLoad: function (opts, obj) { 121 | //Remove self if gallery do not have at least two items 122 | if (obj.group.length < 2) { 123 | obj.helpers.thumbs = false; 124 | 125 | return; 126 | } 127 | 128 | //Increase bottom margin to give space for thumbs 129 | obj.margin[ opts.position === 'top' ? 0 : 2 ] += ((opts.height) + 15); 130 | }, 131 | 132 | afterShow: function (opts, obj) { 133 | //Check if exists and create or update list 134 | if (this.list) { 135 | this.onUpdate(opts, obj); 136 | 137 | } else { 138 | this.init(opts, obj); 139 | } 140 | 141 | //Set active element 142 | this.list.children().removeClass('active').eq(obj.index).addClass('active'); 143 | }, 144 | 145 | //Center list 146 | onUpdate: function (opts, obj) { 147 | if (this.list) { 148 | this.list.stop(true).animate({ 149 | 'left': Math.floor($(window).width() * 0.5 - (obj.index * this.width + this.width * 0.5)) 150 | }, 150); 151 | } 152 | }, 153 | 154 | beforeClose: function () { 155 | if (this.wrap) { 156 | this.wrap.remove(); 157 | } 158 | 159 | this.wrap = null; 160 | this.list = null; 161 | this.width = 0; 162 | } 163 | } 164 | 165 | }(jQuery)); -------------------------------------------------------------------------------- /source/fancybox/jquery.fancybox.css: -------------------------------------------------------------------------------- 1 | /*! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license */ 2 | .fancybox-wrap, 3 | .fancybox-skin, 4 | .fancybox-outer, 5 | .fancybox-inner, 6 | .fancybox-image, 7 | .fancybox-wrap iframe, 8 | .fancybox-wrap object, 9 | .fancybox-nav, 10 | .fancybox-nav span, 11 | .fancybox-tmp 12 | { 13 | padding: 0; 14 | margin: 0; 15 | border: 0; 16 | outline: none; 17 | vertical-align: top; 18 | } 19 | 20 | .fancybox-wrap { 21 | position: absolute; 22 | top: 0; 23 | left: 0; 24 | z-index: 8020; 25 | } 26 | 27 | .fancybox-skin { 28 | position: relative; 29 | background: #f9f9f9; 30 | color: #444; 31 | text-shadow: none; 32 | -webkit-border-radius: 4px; 33 | -moz-border-radius: 4px; 34 | border-radius: 4px; 35 | } 36 | 37 | .fancybox-opened { 38 | z-index: 8030; 39 | } 40 | 41 | .fancybox-opened .fancybox-skin { 42 | -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); 43 | -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); 44 | box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); 45 | } 46 | 47 | .fancybox-outer, .fancybox-inner { 48 | position: relative; 49 | } 50 | 51 | .fancybox-inner { 52 | overflow: hidden; 53 | } 54 | 55 | .fancybox-type-iframe .fancybox-inner { 56 | -webkit-overflow-scrolling: touch; 57 | } 58 | 59 | .fancybox-error { 60 | color: #444; 61 | font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; 62 | margin: 0; 63 | padding: 15px; 64 | white-space: nowrap; 65 | } 66 | 67 | .fancybox-image, .fancybox-iframe { 68 | display: block; 69 | width: 100%; 70 | height: 100%; 71 | } 72 | 73 | .fancybox-image { 74 | max-width: 100%; 75 | max-height: 100%; 76 | } 77 | 78 | #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { 79 | background-image: url(fancybox_sprite.png); 80 | } 81 | 82 | #fancybox-loading { 83 | position: fixed; 84 | top: 50%; 85 | left: 50%; 86 | margin-top: -22px; 87 | margin-left: -22px; 88 | background-position: 0 -108px; 89 | opacity: 0.8; 90 | cursor: pointer; 91 | z-index: 8060; 92 | } 93 | 94 | #fancybox-loading div { 95 | width: 44px; 96 | height: 44px; 97 | background: url(fancybox_loading.gif) center center no-repeat; 98 | } 99 | 100 | .fancybox-close { 101 | position: absolute; 102 | top: -18px; 103 | right: -18px; 104 | width: 36px; 105 | height: 36px; 106 | cursor: pointer; 107 | z-index: 8040; 108 | } 109 | 110 | .fancybox-nav { 111 | position: absolute; 112 | top: 0; 113 | width: 40%; 114 | height: 100%; 115 | cursor: pointer; 116 | text-decoration: none; 117 | background: transparent url(blank.gif); /* helps IE */ 118 | -webkit-tap-highlight-color: rgba(0,0,0,0); 119 | z-index: 8040; 120 | } 121 | 122 | .fancybox-prev { 123 | left: 0; 124 | } 125 | 126 | .fancybox-next { 127 | right: 0; 128 | } 129 | 130 | .fancybox-nav span { 131 | position: absolute; 132 | top: 50%; 133 | width: 36px; 134 | height: 34px; 135 | margin-top: -18px; 136 | cursor: pointer; 137 | z-index: 8040; 138 | visibility: hidden; 139 | } 140 | 141 | .fancybox-prev span { 142 | left: 10px; 143 | background-position: 0 -36px; 144 | } 145 | 146 | .fancybox-next span { 147 | right: 10px; 148 | background-position: 0 -72px; 149 | } 150 | 151 | .fancybox-nav:hover span { 152 | visibility: visible; 153 | } 154 | 155 | .fancybox-tmp { 156 | position: absolute; 157 | top: -99999px; 158 | left: -99999px; 159 | max-width: 99999px; 160 | max-height: 99999px; 161 | overflow: visible !important; 162 | } 163 | 164 | /* Overlay helper */ 165 | 166 | .fancybox-lock { 167 | overflow: visible !important; 168 | width: auto; 169 | } 170 | 171 | .fancybox-lock body { 172 | overflow: hidden !important; 173 | } 174 | 175 | .fancybox-lock-test { 176 | overflow-y: hidden !important; 177 | } 178 | 179 | .fancybox-overlay { 180 | position: absolute; 181 | top: 0; 182 | left: 0; 183 | overflow: hidden; 184 | display: none; 185 | z-index: 8010; 186 | background: url(fancybox_overlay.png); 187 | } 188 | 189 | .fancybox-overlay-fixed { 190 | position: fixed; 191 | bottom: 0; 192 | right: 0; 193 | } 194 | 195 | .fancybox-lock .fancybox-overlay { 196 | overflow: auto; 197 | overflow-y: scroll; 198 | } 199 | 200 | /* Title helper */ 201 | 202 | .fancybox-title { 203 | visibility: hidden; 204 | font: normal 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; 205 | position: relative; 206 | text-shadow: none; 207 | z-index: 8050; 208 | } 209 | 210 | .fancybox-opened .fancybox-title { 211 | visibility: visible; 212 | } 213 | 214 | .fancybox-title-float-wrap { 215 | position: absolute; 216 | bottom: 0; 217 | right: 50%; 218 | margin-bottom: -35px; 219 | z-index: 8050; 220 | text-align: center; 221 | } 222 | 223 | .fancybox-title-float-wrap .child { 224 | display: inline-block; 225 | margin-right: -100%; 226 | padding: 2px 20px; 227 | background: transparent; /* Fallback for web browsers that doesn't support RGBa */ 228 | background: rgba(0, 0, 0, 0.8); 229 | -webkit-border-radius: 15px; 230 | -moz-border-radius: 15px; 231 | border-radius: 15px; 232 | text-shadow: 0 1px 2px #222; 233 | color: #FFF; 234 | font-weight: bold; 235 | line-height: 24px; 236 | white-space: nowrap; 237 | } 238 | 239 | .fancybox-title-outside-wrap { 240 | position: relative; 241 | margin-top: 10px; 242 | color: #fff; 243 | } 244 | 245 | .fancybox-title-inside-wrap { 246 | padding-top: 10px; 247 | } 248 | 249 | .fancybox-title-over-wrap { 250 | position: absolute; 251 | bottom: 0; 252 | left: 0; 253 | color: #fff; 254 | padding: 10px; 255 | background: #000; 256 | background: rgba(0, 0, 0, .8); 257 | } 258 | 259 | /*Retina graphics!*/ 260 | @media only screen and (-webkit-min-device-pixel-ratio: 1.5), 261 | only screen and (min--moz-device-pixel-ratio: 1.5), 262 | only screen and (min-device-pixel-ratio: 1.5){ 263 | 264 | #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { 265 | background-image: url(fancybox_sprite@2x.png); 266 | background-size: 44px 152px; /*The size of the normal image, half the size of the hi-res image*/ 267 | } 268 | 269 | #fancybox-loading div { 270 | background-image: url(fancybox_loading@2x.gif); 271 | background-size: 24px 24px; /*The size of the normal image, half the size of the hi-res image*/ 272 | } 273 | } 274 | -------------------------------------------------------------------------------- /source/fancybox/jquery.fancybox.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * fancyBox - jQuery Plugin 3 | * version: 2.1.5 (Fri, 14 Jun 2013) 4 | * requires jQuery v1.6 or later 5 | * 6 | * Examples at http://fancyapps.com/fancybox/ 7 | * License: www.fancyapps.com/fancybox/#license 8 | * 9 | * Copyright 2012 Janis Skarnelis - janis@fancyapps.com 10 | * 11 | */ 12 | 13 | ;(function (window, document, $, undefined) { 14 | "use strict"; 15 | 16 | var H = $("html"), 17 | W = $(window), 18 | D = $(document), 19 | F = $.fancybox = function () { 20 | F.open.apply( this, arguments ); 21 | }, 22 | IE = navigator.userAgent.match(/msie/i), 23 | didUpdate = null, 24 | isTouch = document.createTouch !== undefined, 25 | 26 | isQuery = function(obj) { 27 | return obj && obj.hasOwnProperty && obj instanceof $; 28 | }, 29 | isString = function(str) { 30 | return str && $.type(str) === "string"; 31 | }, 32 | isPercentage = function(str) { 33 | return isString(str) && str.indexOf('%') > 0; 34 | }, 35 | isScrollable = function(el) { 36 | return (el && !(el.style.overflow && el.style.overflow === 'hidden') && ((el.clientWidth && el.scrollWidth > el.clientWidth) || (el.clientHeight && el.scrollHeight > el.clientHeight))); 37 | }, 38 | getScalar = function(orig, dim) { 39 | var value = parseInt(orig, 10) || 0; 40 | 41 | if (dim && isPercentage(orig)) { 42 | value = F.getViewport()[ dim ] / 100 * value; 43 | } 44 | 45 | return Math.ceil(value); 46 | }, 47 | getValue = function(value, dim) { 48 | return getScalar(value, dim) + 'px'; 49 | }; 50 | 51 | $.extend(F, { 52 | // The current version of fancyBox 53 | version: '2.1.5', 54 | 55 | defaults: { 56 | padding : 15, 57 | margin : 20, 58 | 59 | width : 800, 60 | height : 600, 61 | minWidth : 100, 62 | minHeight : 100, 63 | maxWidth : 9999, 64 | maxHeight : 9999, 65 | pixelRatio: 1, // Set to 2 for retina display support 66 | 67 | autoSize : true, 68 | autoHeight : false, 69 | autoWidth : false, 70 | 71 | autoResize : true, 72 | autoCenter : !isTouch, 73 | fitToView : true, 74 | aspectRatio : false, 75 | topRatio : 0.5, 76 | leftRatio : 0.5, 77 | 78 | scrolling : 'auto', // 'auto', 'yes' or 'no' 79 | wrapCSS : '', 80 | 81 | arrows : true, 82 | closeBtn : true, 83 | closeClick : false, 84 | nextClick : false, 85 | mouseWheel : true, 86 | autoPlay : false, 87 | playSpeed : 3000, 88 | preload : 3, 89 | modal : false, 90 | loop : true, 91 | 92 | ajax : { 93 | dataType : 'html', 94 | headers : { 'X-fancyBox': true } 95 | }, 96 | iframe : { 97 | scrolling : 'auto', 98 | preload : true 99 | }, 100 | swf : { 101 | wmode: 'transparent', 102 | allowfullscreen : 'true', 103 | allowscriptaccess : 'always' 104 | }, 105 | 106 | keys : { 107 | next : { 108 | 13 : 'left', // enter 109 | 34 : 'up', // page down 110 | 39 : 'left', // right arrow 111 | 40 : 'up' // down arrow 112 | }, 113 | prev : { 114 | 8 : 'right', // backspace 115 | 33 : 'down', // page up 116 | 37 : 'right', // left arrow 117 | 38 : 'down' // up arrow 118 | }, 119 | close : [27], // escape key 120 | play : [32], // space - start/stop slideshow 121 | toggle : [70] // letter "f" - toggle fullscreen 122 | }, 123 | 124 | direction : { 125 | next : 'left', 126 | prev : 'right' 127 | }, 128 | 129 | scrollOutside : true, 130 | 131 | // Override some properties 132 | index : 0, 133 | type : null, 134 | href : null, 135 | content : null, 136 | title : null, 137 | 138 | // HTML templates 139 | tpl: { 140 | wrap : '
    ', 141 | image : '', 142 | iframe : '', 143 | error : '

    The requested content cannot be loaded.
    Please try again later.

    ', 144 | closeBtn : '', 145 | next : '', 146 | prev : '' 147 | }, 148 | 149 | // Properties for each animation type 150 | // Opening fancyBox 151 | openEffect : 'fade', // 'elastic', 'fade' or 'none' 152 | openSpeed : 250, 153 | openEasing : 'swing', 154 | openOpacity : true, 155 | openMethod : 'zoomIn', 156 | 157 | // Closing fancyBox 158 | closeEffect : 'fade', // 'elastic', 'fade' or 'none' 159 | closeSpeed : 250, 160 | closeEasing : 'swing', 161 | closeOpacity : true, 162 | closeMethod : 'zoomOut', 163 | 164 | // Changing next gallery item 165 | nextEffect : 'elastic', // 'elastic', 'fade' or 'none' 166 | nextSpeed : 250, 167 | nextEasing : 'swing', 168 | nextMethod : 'changeIn', 169 | 170 | // Changing previous gallery item 171 | prevEffect : 'elastic', // 'elastic', 'fade' or 'none' 172 | prevSpeed : 250, 173 | prevEasing : 'swing', 174 | prevMethod : 'changeOut', 175 | 176 | // Enable default helpers 177 | helpers : { 178 | overlay : true, 179 | title : true 180 | }, 181 | 182 | // Callbacks 183 | onCancel : $.noop, // If canceling 184 | beforeLoad : $.noop, // Before loading 185 | afterLoad : $.noop, // After loading 186 | beforeShow : $.noop, // Before changing in current item 187 | afterShow : $.noop, // After opening 188 | beforeChange : $.noop, // Before changing gallery item 189 | beforeClose : $.noop, // Before closing 190 | afterClose : $.noop // After closing 191 | }, 192 | 193 | //Current state 194 | group : {}, // Selected group 195 | opts : {}, // Group options 196 | previous : null, // Previous element 197 | coming : null, // Element being loaded 198 | current : null, // Currently loaded element 199 | isActive : false, // Is activated 200 | isOpen : false, // Is currently open 201 | isOpened : false, // Have been fully opened at least once 202 | 203 | wrap : null, 204 | skin : null, 205 | outer : null, 206 | inner : null, 207 | 208 | player : { 209 | timer : null, 210 | isActive : false 211 | }, 212 | 213 | // Loaders 214 | ajaxLoad : null, 215 | imgPreload : null, 216 | 217 | // Some collections 218 | transitions : {}, 219 | helpers : {}, 220 | 221 | /* 222 | * Static methods 223 | */ 224 | 225 | open: function (group, opts) { 226 | if (!group) { 227 | return; 228 | } 229 | 230 | if (!$.isPlainObject(opts)) { 231 | opts = {}; 232 | } 233 | 234 | // Close if already active 235 | if (false === F.close(true)) { 236 | return; 237 | } 238 | 239 | // Normalize group 240 | if (!$.isArray(group)) { 241 | group = isQuery(group) ? $(group).get() : [group]; 242 | } 243 | 244 | // Recheck if the type of each element is `object` and set content type (image, ajax, etc) 245 | $.each(group, function(i, element) { 246 | var obj = {}, 247 | href, 248 | title, 249 | content, 250 | type, 251 | rez, 252 | hrefParts, 253 | selector; 254 | 255 | if ($.type(element) === "object") { 256 | // Check if is DOM element 257 | if (element.nodeType) { 258 | element = $(element); 259 | } 260 | 261 | if (isQuery(element)) { 262 | obj = { 263 | href : element.data('fancybox-href') || element.attr('href'), 264 | title : $('
    ').text( element.data('fancybox-title') || element.attr('title') ).html(), 265 | isDom : true, 266 | element : element 267 | }; 268 | 269 | if ($.metadata) { 270 | $.extend(true, obj, element.metadata()); 271 | } 272 | 273 | } else { 274 | obj = element; 275 | } 276 | } 277 | 278 | href = opts.href || obj.href || (isString(element) ? element : null); 279 | title = opts.title !== undefined ? opts.title : obj.title || ''; 280 | 281 | content = opts.content || obj.content; 282 | type = content ? 'html' : (opts.type || obj.type); 283 | 284 | if (!type && obj.isDom) { 285 | type = element.data('fancybox-type'); 286 | 287 | if (!type) { 288 | rez = element.prop('class').match(/fancybox\.(\w+)/); 289 | type = rez ? rez[1] : null; 290 | } 291 | } 292 | 293 | if (isString(href)) { 294 | // Try to guess the content type 295 | if (!type) { 296 | if (F.isImage(href)) { 297 | type = 'image'; 298 | 299 | } else if (F.isSWF(href)) { 300 | type = 'swf'; 301 | 302 | } else if (href.charAt(0) === '#') { 303 | type = 'inline'; 304 | 305 | } else if (isString(element)) { 306 | type = 'html'; 307 | content = element; 308 | } 309 | } 310 | 311 | // Split url into two pieces with source url and content selector, e.g, 312 | // "/mypage.html #my_id" will load "/mypage.html" and display element having id "my_id" 313 | if (type === 'ajax') { 314 | hrefParts = href.split(/\s+/, 2); 315 | href = hrefParts.shift(); 316 | selector = hrefParts.shift(); 317 | } 318 | } 319 | 320 | if (!content) { 321 | if (type === 'inline') { 322 | if (href) { 323 | content = $( isString(href) ? href.replace(/.*(?=#[^\s]+$)/, '') : href ); //strip for ie7 324 | 325 | } else if (obj.isDom) { 326 | content = element; 327 | } 328 | 329 | } else if (type === 'html') { 330 | content = href; 331 | 332 | } else if (!type && !href && obj.isDom) { 333 | type = 'inline'; 334 | content = element; 335 | } 336 | } 337 | 338 | $.extend(obj, { 339 | href : href, 340 | type : type, 341 | content : content, 342 | title : title, 343 | selector : selector 344 | }); 345 | 346 | group[ i ] = obj; 347 | }); 348 | 349 | // Extend the defaults 350 | F.opts = $.extend(true, {}, F.defaults, opts); 351 | 352 | // All options are merged recursive except keys 353 | if (opts.keys !== undefined) { 354 | F.opts.keys = opts.keys ? $.extend({}, F.defaults.keys, opts.keys) : false; 355 | } 356 | 357 | F.group = group; 358 | 359 | return F._start(F.opts.index); 360 | }, 361 | 362 | // Cancel image loading or abort ajax request 363 | cancel: function () { 364 | var coming = F.coming; 365 | 366 | if (coming && false === F.trigger('onCancel')) { 367 | return; 368 | } 369 | 370 | F.hideLoading(); 371 | 372 | if (!coming) { 373 | return; 374 | } 375 | 376 | if (F.ajaxLoad) { 377 | F.ajaxLoad.abort(); 378 | } 379 | 380 | F.ajaxLoad = null; 381 | 382 | if (F.imgPreload) { 383 | F.imgPreload.onload = F.imgPreload.onerror = null; 384 | } 385 | 386 | if (coming.wrap) { 387 | coming.wrap.stop(true, true).trigger('onReset').remove(); 388 | } 389 | 390 | F.coming = null; 391 | 392 | // If the first item has been canceled, then clear everything 393 | if (!F.current) { 394 | F._afterZoomOut( coming ); 395 | } 396 | }, 397 | 398 | // Start closing animation if is open; remove immediately if opening/closing 399 | close: function (event) { 400 | F.cancel(); 401 | 402 | if (false === F.trigger('beforeClose')) { 403 | return; 404 | } 405 | 406 | F.unbindEvents(); 407 | 408 | if (!F.isActive) { 409 | return; 410 | } 411 | 412 | if (!F.isOpen || event === true) { 413 | $('.fancybox-wrap').stop(true).trigger('onReset').remove(); 414 | 415 | F._afterZoomOut(); 416 | 417 | } else { 418 | F.isOpen = F.isOpened = false; 419 | F.isClosing = true; 420 | 421 | $('.fancybox-item, .fancybox-nav').remove(); 422 | 423 | F.wrap.stop(true, true).removeClass('fancybox-opened'); 424 | 425 | F.transitions[ F.current.closeMethod ](); 426 | } 427 | }, 428 | 429 | // Manage slideshow: 430 | // $.fancybox.play(); - toggle slideshow 431 | // $.fancybox.play( true ); - start 432 | // $.fancybox.play( false ); - stop 433 | play: function ( action ) { 434 | var clear = function () { 435 | clearTimeout(F.player.timer); 436 | }, 437 | set = function () { 438 | clear(); 439 | 440 | if (F.current && F.player.isActive) { 441 | F.player.timer = setTimeout(F.next, F.current.playSpeed); 442 | } 443 | }, 444 | stop = function () { 445 | clear(); 446 | 447 | D.unbind('.player'); 448 | 449 | F.player.isActive = false; 450 | 451 | F.trigger('onPlayEnd'); 452 | }, 453 | start = function () { 454 | if (F.current && (F.current.loop || F.current.index < F.group.length - 1)) { 455 | F.player.isActive = true; 456 | 457 | D.bind({ 458 | 'onCancel.player beforeClose.player' : stop, 459 | 'onUpdate.player' : set, 460 | 'beforeLoad.player' : clear 461 | }); 462 | 463 | set(); 464 | 465 | F.trigger('onPlayStart'); 466 | } 467 | }; 468 | 469 | if (action === true || (!F.player.isActive && action !== false)) { 470 | start(); 471 | } else { 472 | stop(); 473 | } 474 | }, 475 | 476 | // Navigate to next gallery item 477 | next: function ( direction ) { 478 | var current = F.current; 479 | 480 | if (current) { 481 | if (!isString(direction)) { 482 | direction = current.direction.next; 483 | } 484 | 485 | F.jumpto(current.index + 1, direction, 'next'); 486 | } 487 | }, 488 | 489 | // Navigate to previous gallery item 490 | prev: function ( direction ) { 491 | var current = F.current; 492 | 493 | if (current) { 494 | if (!isString(direction)) { 495 | direction = current.direction.prev; 496 | } 497 | 498 | F.jumpto(current.index - 1, direction, 'prev'); 499 | } 500 | }, 501 | 502 | // Navigate to gallery item by index 503 | jumpto: function ( index, direction, router ) { 504 | var current = F.current; 505 | 506 | if (!current) { 507 | return; 508 | } 509 | 510 | index = getScalar(index); 511 | 512 | F.direction = direction || current.direction[ (index >= current.index ? 'next' : 'prev') ]; 513 | F.router = router || 'jumpto'; 514 | 515 | if (current.loop) { 516 | if (index < 0) { 517 | index = current.group.length + (index % current.group.length); 518 | } 519 | 520 | index = index % current.group.length; 521 | } 522 | 523 | if (current.group[ index ] !== undefined) { 524 | F.cancel(); 525 | 526 | F._start(index); 527 | } 528 | }, 529 | 530 | // Center inside viewport and toggle position type to fixed or absolute if needed 531 | reposition: function (e, onlyAbsolute) { 532 | var current = F.current, 533 | wrap = current ? current.wrap : null, 534 | pos; 535 | 536 | if (wrap) { 537 | pos = F._getPosition(onlyAbsolute); 538 | 539 | if (e && e.type === 'scroll') { 540 | delete pos.position; 541 | 542 | wrap.stop(true, true).animate(pos, 200); 543 | 544 | } else { 545 | wrap.css(pos); 546 | 547 | current.pos = $.extend({}, current.dim, pos); 548 | } 549 | } 550 | }, 551 | 552 | update: function (e) { 553 | var type = (e && e.originalEvent && e.originalEvent.type), 554 | anyway = !type || type === 'orientationchange'; 555 | 556 | if (anyway) { 557 | clearTimeout(didUpdate); 558 | 559 | didUpdate = null; 560 | } 561 | 562 | if (!F.isOpen || didUpdate) { 563 | return; 564 | } 565 | 566 | didUpdate = setTimeout(function() { 567 | var current = F.current; 568 | 569 | if (!current || F.isClosing) { 570 | return; 571 | } 572 | 573 | F.wrap.removeClass('fancybox-tmp'); 574 | 575 | if (anyway || type === 'load' || (type === 'resize' && current.autoResize)) { 576 | F._setDimension(); 577 | } 578 | 579 | if (!(type === 'scroll' && current.canShrink)) { 580 | F.reposition(e); 581 | } 582 | 583 | F.trigger('onUpdate'); 584 | 585 | didUpdate = null; 586 | 587 | }, (anyway && !isTouch ? 0 : 300)); 588 | }, 589 | 590 | // Shrink content to fit inside viewport or restore if resized 591 | toggle: function ( action ) { 592 | if (F.isOpen) { 593 | F.current.fitToView = $.type(action) === "boolean" ? action : !F.current.fitToView; 594 | 595 | // Help browser to restore document dimensions 596 | if (isTouch) { 597 | F.wrap.removeAttr('style').addClass('fancybox-tmp'); 598 | 599 | F.trigger('onUpdate'); 600 | } 601 | 602 | F.update(); 603 | } 604 | }, 605 | 606 | hideLoading: function () { 607 | D.unbind('.loading'); 608 | 609 | $('#fancybox-loading').remove(); 610 | }, 611 | 612 | showLoading: function () { 613 | var el, viewport; 614 | 615 | F.hideLoading(); 616 | 617 | el = $('
    ').click(F.cancel).appendTo('body'); 618 | 619 | // If user will press the escape-button, the request will be canceled 620 | D.bind('keydown.loading', function(e) { 621 | if ((e.which || e.keyCode) === 27) { 622 | e.preventDefault(); 623 | 624 | F.cancel(); 625 | } 626 | }); 627 | 628 | if (!F.defaults.fixed) { 629 | viewport = F.getViewport(); 630 | 631 | el.css({ 632 | position : 'absolute', 633 | top : (viewport.h * 0.5) + viewport.y, 634 | left : (viewport.w * 0.5) + viewport.x 635 | }); 636 | } 637 | 638 | F.trigger('onLoading'); 639 | }, 640 | 641 | getViewport: function () { 642 | var locked = (F.current && F.current.locked) || false, 643 | rez = { 644 | x: W.scrollLeft(), 645 | y: W.scrollTop() 646 | }; 647 | 648 | if (locked && locked.length) { 649 | rez.w = locked[0].clientWidth; 650 | rez.h = locked[0].clientHeight; 651 | 652 | } else { 653 | // See http://bugs.jquery.com/ticket/6724 654 | rez.w = isTouch && window.innerWidth ? window.innerWidth : W.width(); 655 | rez.h = isTouch && window.innerHeight ? window.innerHeight : W.height(); 656 | } 657 | 658 | return rez; 659 | }, 660 | 661 | // Unbind the keyboard / clicking actions 662 | unbindEvents: function () { 663 | if (F.wrap && isQuery(F.wrap)) { 664 | F.wrap.unbind('.fb'); 665 | } 666 | 667 | D.unbind('.fb'); 668 | W.unbind('.fb'); 669 | }, 670 | 671 | bindEvents: function () { 672 | var current = F.current, 673 | keys; 674 | 675 | if (!current) { 676 | return; 677 | } 678 | 679 | // Changing document height on iOS devices triggers a 'resize' event, 680 | // that can change document height... repeating infinitely 681 | W.bind('orientationchange.fb' + (isTouch ? '' : ' resize.fb') + (current.autoCenter && !current.locked ? ' scroll.fb' : ''), F.update); 682 | 683 | keys = current.keys; 684 | 685 | if (keys) { 686 | D.bind('keydown.fb', function (e) { 687 | var code = e.which || e.keyCode, 688 | target = e.target || e.srcElement; 689 | 690 | // Skip esc key if loading, because showLoading will cancel preloading 691 | if (code === 27 && F.coming) { 692 | return false; 693 | } 694 | 695 | // Ignore key combinations and key events within form elements 696 | if (!e.ctrlKey && !e.altKey && !e.shiftKey && !e.metaKey && !(target && (target.type || $(target).is('[contenteditable]')))) { 697 | $.each(keys, function(i, val) { 698 | if (current.group.length > 1 && val[ code ] !== undefined) { 699 | F[ i ]( val[ code ] ); 700 | 701 | e.preventDefault(); 702 | return false; 703 | } 704 | 705 | if ($.inArray(code, val) > -1) { 706 | F[ i ] (); 707 | 708 | e.preventDefault(); 709 | return false; 710 | } 711 | }); 712 | } 713 | }); 714 | } 715 | 716 | if ($.fn.mousewheel && current.mouseWheel) { 717 | F.wrap.bind('mousewheel.fb', function (e, delta, deltaX, deltaY) { 718 | var target = e.target || null, 719 | parent = $(target), 720 | canScroll = false; 721 | 722 | while (parent.length) { 723 | if (canScroll || parent.is('.fancybox-skin') || parent.is('.fancybox-wrap')) { 724 | break; 725 | } 726 | 727 | canScroll = isScrollable( parent[0] ); 728 | parent = $(parent).parent(); 729 | } 730 | 731 | if (delta !== 0 && !canScroll) { 732 | if (F.group.length > 1 && !current.canShrink) { 733 | if (deltaY > 0 || deltaX > 0) { 734 | F.prev( deltaY > 0 ? 'down' : 'left' ); 735 | 736 | } else if (deltaY < 0 || deltaX < 0) { 737 | F.next( deltaY < 0 ? 'up' : 'right' ); 738 | } 739 | 740 | e.preventDefault(); 741 | } 742 | } 743 | }); 744 | } 745 | }, 746 | 747 | trigger: function (event, o) { 748 | var ret, obj = o || F.coming || F.current; 749 | 750 | if (obj) { 751 | if ($.isFunction( obj[event] )) { 752 | ret = obj[event].apply(obj, Array.prototype.slice.call(arguments, 1)); 753 | } 754 | 755 | if (ret === false) { 756 | return false; 757 | } 758 | 759 | if (obj.helpers) { 760 | $.each(obj.helpers, function (helper, opts) { 761 | if (opts && F.helpers[helper] && $.isFunction(F.helpers[helper][event])) { 762 | F.helpers[helper][event]($.extend(true, {}, F.helpers[helper].defaults, opts), obj); 763 | } 764 | }); 765 | } 766 | } 767 | 768 | D.trigger(event); 769 | }, 770 | 771 | isImage: function (str) { 772 | return isString(str) && str.match(/(^data:image\/.*,)|(\.(jp(e|g|eg)|gif|png|bmp|webp|svg)((\?|#).*)?$)/i); 773 | }, 774 | 775 | isSWF: function (str) { 776 | return isString(str) && str.match(/\.(swf)((\?|#).*)?$/i); 777 | }, 778 | 779 | _start: function (index) { 780 | var coming = {}, 781 | obj, 782 | href, 783 | type, 784 | margin, 785 | padding; 786 | 787 | index = getScalar( index ); 788 | obj = F.group[ index ] || null; 789 | 790 | if (!obj) { 791 | return false; 792 | } 793 | 794 | coming = $.extend(true, {}, F.opts, obj); 795 | 796 | // Convert margin and padding properties to array - top, right, bottom, left 797 | margin = coming.margin; 798 | padding = coming.padding; 799 | 800 | if ($.type(margin) === 'number') { 801 | coming.margin = [margin, margin, margin, margin]; 802 | } 803 | 804 | if ($.type(padding) === 'number') { 805 | coming.padding = [padding, padding, padding, padding]; 806 | } 807 | 808 | // 'modal' propery is just a shortcut 809 | if (coming.modal) { 810 | $.extend(true, coming, { 811 | closeBtn : false, 812 | closeClick : false, 813 | nextClick : false, 814 | arrows : false, 815 | mouseWheel : false, 816 | keys : null, 817 | helpers: { 818 | overlay : { 819 | closeClick : false 820 | } 821 | } 822 | }); 823 | } 824 | 825 | // 'autoSize' property is a shortcut, too 826 | if (coming.autoSize) { 827 | coming.autoWidth = coming.autoHeight = true; 828 | } 829 | 830 | if (coming.width === 'auto') { 831 | coming.autoWidth = true; 832 | } 833 | 834 | if (coming.height === 'auto') { 835 | coming.autoHeight = true; 836 | } 837 | 838 | /* 839 | * Add reference to the group, so it`s possible to access from callbacks, example: 840 | * afterLoad : function() { 841 | * this.title = 'Image ' + (this.index + 1) + ' of ' + this.group.length + (this.title ? ' - ' + this.title : ''); 842 | * } 843 | */ 844 | 845 | coming.group = F.group; 846 | coming.index = index; 847 | 848 | // Give a chance for callback or helpers to update coming item (type, title, etc) 849 | F.coming = coming; 850 | 851 | if (false === F.trigger('beforeLoad')) { 852 | F.coming = null; 853 | 854 | return; 855 | } 856 | 857 | type = coming.type; 858 | href = coming.href; 859 | 860 | if (!type) { 861 | F.coming = null; 862 | 863 | //If we can not determine content type then drop silently or display next/prev item if looping through gallery 864 | if (F.current && F.router && F.router !== 'jumpto') { 865 | F.current.index = index; 866 | 867 | return F[ F.router ]( F.direction ); 868 | } 869 | 870 | return false; 871 | } 872 | 873 | F.isActive = true; 874 | 875 | if (type === 'image' || type === 'swf') { 876 | coming.autoHeight = coming.autoWidth = false; 877 | coming.scrolling = 'visible'; 878 | } 879 | 880 | if (type === 'image') { 881 | coming.aspectRatio = true; 882 | } 883 | 884 | if (type === 'iframe' && isTouch) { 885 | coming.scrolling = 'scroll'; 886 | } 887 | 888 | // Build the neccessary markup 889 | coming.wrap = $(coming.tpl.wrap).addClass('fancybox-' + (isTouch ? 'mobile' : 'desktop') + ' fancybox-type-' + type + ' fancybox-tmp ' + coming.wrapCSS).appendTo( coming.parent || 'body' ); 890 | 891 | $.extend(coming, { 892 | skin : $('.fancybox-skin', coming.wrap), 893 | outer : $('.fancybox-outer', coming.wrap), 894 | inner : $('.fancybox-inner', coming.wrap) 895 | }); 896 | 897 | $.each(["Top", "Right", "Bottom", "Left"], function(i, v) { 898 | coming.skin.css('padding' + v, getValue(coming.padding[ i ])); 899 | }); 900 | 901 | F.trigger('onReady'); 902 | 903 | // Check before try to load; 'inline' and 'html' types need content, others - href 904 | if (type === 'inline' || type === 'html') { 905 | if (!coming.content || !coming.content.length) { 906 | return F._error( 'content' ); 907 | } 908 | 909 | } else if (!href) { 910 | return F._error( 'href' ); 911 | } 912 | 913 | if (type === 'image') { 914 | F._loadImage(); 915 | 916 | } else if (type === 'ajax') { 917 | F._loadAjax(); 918 | 919 | } else if (type === 'iframe') { 920 | F._loadIframe(); 921 | 922 | } else { 923 | F._afterLoad(); 924 | } 925 | }, 926 | 927 | _error: function ( type ) { 928 | $.extend(F.coming, { 929 | type : 'html', 930 | autoWidth : true, 931 | autoHeight : true, 932 | minWidth : 0, 933 | minHeight : 0, 934 | scrolling : 'no', 935 | hasError : type, 936 | content : F.coming.tpl.error 937 | }); 938 | 939 | F._afterLoad(); 940 | }, 941 | 942 | _loadImage: function () { 943 | // Reset preload image so it is later possible to check "complete" property 944 | var img = F.imgPreload = new Image(); 945 | 946 | img.onload = function () { 947 | this.onload = this.onerror = null; 948 | 949 | F.coming.width = this.width / F.opts.pixelRatio; 950 | F.coming.height = this.height / F.opts.pixelRatio; 951 | 952 | F._afterLoad(); 953 | }; 954 | 955 | img.onerror = function () { 956 | this.onload = this.onerror = null; 957 | 958 | F._error( 'image' ); 959 | }; 960 | 961 | img.src = F.coming.href; 962 | 963 | if (img.complete !== true) { 964 | F.showLoading(); 965 | } 966 | }, 967 | 968 | _loadAjax: function () { 969 | var coming = F.coming; 970 | 971 | F.showLoading(); 972 | 973 | F.ajaxLoad = $.ajax($.extend({}, coming.ajax, { 974 | url: coming.href, 975 | error: function (jqXHR, textStatus) { 976 | if (F.coming && textStatus !== 'abort') { 977 | F._error( 'ajax', jqXHR ); 978 | 979 | } else { 980 | F.hideLoading(); 981 | } 982 | }, 983 | success: function (data, textStatus) { 984 | if (textStatus === 'success') { 985 | coming.content = data; 986 | 987 | F._afterLoad(); 988 | } 989 | } 990 | })); 991 | }, 992 | 993 | _loadIframe: function() { 994 | var coming = F.coming, 995 | iframe = $(coming.tpl.iframe.replace(/\{rnd\}/g, new Date().getTime())) 996 | .attr('scrolling', isTouch ? 'auto' : coming.iframe.scrolling) 997 | .attr('src', coming.href); 998 | 999 | // This helps IE 1000 | $(coming.wrap).bind('onReset', function () { 1001 | try { 1002 | $(this).find('iframe').hide().attr('src', '//about:blank').end().empty(); 1003 | } catch (e) {} 1004 | }); 1005 | 1006 | if (coming.iframe.preload) { 1007 | F.showLoading(); 1008 | 1009 | iframe.one('load', function() { 1010 | $(this).data('ready', 1); 1011 | 1012 | // iOS will lose scrolling if we resize 1013 | if (!isTouch) { 1014 | $(this).bind('load.fb', F.update); 1015 | } 1016 | 1017 | // Without this trick: 1018 | // - iframe won't scroll on iOS devices 1019 | // - IE7 sometimes displays empty iframe 1020 | $(this).parents('.fancybox-wrap').width('100%').removeClass('fancybox-tmp').show(); 1021 | 1022 | F._afterLoad(); 1023 | }); 1024 | } 1025 | 1026 | coming.content = iframe.appendTo( coming.inner ); 1027 | 1028 | if (!coming.iframe.preload) { 1029 | F._afterLoad(); 1030 | } 1031 | }, 1032 | 1033 | _preloadImages: function() { 1034 | var group = F.group, 1035 | current = F.current, 1036 | len = group.length, 1037 | cnt = current.preload ? Math.min(current.preload, len - 1) : 0, 1038 | item, 1039 | i; 1040 | 1041 | for (i = 1; i <= cnt; i += 1) { 1042 | item = group[ (current.index + i ) % len ]; 1043 | 1044 | if (item.type === 'image' && item.href) { 1045 | new Image().src = item.href; 1046 | } 1047 | } 1048 | }, 1049 | 1050 | _afterLoad: function () { 1051 | var coming = F.coming, 1052 | previous = F.current, 1053 | placeholder = 'fancybox-placeholder', 1054 | current, 1055 | content, 1056 | type, 1057 | scrolling, 1058 | href, 1059 | embed; 1060 | 1061 | F.hideLoading(); 1062 | 1063 | if (!coming || F.isActive === false) { 1064 | return; 1065 | } 1066 | 1067 | if (false === F.trigger('afterLoad', coming, previous)) { 1068 | coming.wrap.stop(true).trigger('onReset').remove(); 1069 | 1070 | F.coming = null; 1071 | 1072 | return; 1073 | } 1074 | 1075 | if (previous) { 1076 | F.trigger('beforeChange', previous); 1077 | 1078 | previous.wrap.stop(true).removeClass('fancybox-opened') 1079 | .find('.fancybox-item, .fancybox-nav') 1080 | .remove(); 1081 | } 1082 | 1083 | F.unbindEvents(); 1084 | 1085 | current = coming; 1086 | content = coming.content; 1087 | type = coming.type; 1088 | scrolling = coming.scrolling; 1089 | 1090 | $.extend(F, { 1091 | wrap : current.wrap, 1092 | skin : current.skin, 1093 | outer : current.outer, 1094 | inner : current.inner, 1095 | current : current, 1096 | previous : previous 1097 | }); 1098 | 1099 | href = current.href; 1100 | 1101 | switch (type) { 1102 | case 'inline': 1103 | case 'ajax': 1104 | case 'html': 1105 | if (current.selector) { 1106 | content = $('
    ').html(content).find(current.selector); 1107 | 1108 | } else if (isQuery(content)) { 1109 | if (!content.data(placeholder)) { 1110 | content.data(placeholder, $('
    ').insertAfter( content ).hide() ); 1111 | } 1112 | 1113 | content = content.show().detach(); 1114 | 1115 | current.wrap.bind('onReset', function () { 1116 | if ($(this).find(content).length) { 1117 | content.hide().replaceAll( content.data(placeholder) ).data(placeholder, false); 1118 | } 1119 | }); 1120 | } 1121 | break; 1122 | 1123 | case 'image': 1124 | content = current.tpl.image.replace(/\{href\}/g, href); 1125 | break; 1126 | 1127 | case 'swf': 1128 | content = ''; 1129 | embed = ''; 1130 | 1131 | $.each(current.swf, function(name, val) { 1132 | content += ''; 1133 | embed += ' ' + name + '="' + val + '"'; 1134 | }); 1135 | 1136 | content += ''; 1137 | break; 1138 | } 1139 | 1140 | if (!(isQuery(content) && content.parent().is(current.inner))) { 1141 | current.inner.append( content ); 1142 | } 1143 | 1144 | // Give a chance for helpers or callbacks to update elements 1145 | F.trigger('beforeShow'); 1146 | 1147 | // Set scrolling before calculating dimensions 1148 | current.inner.css('overflow', scrolling === 'yes' ? 'scroll' : (scrolling === 'no' ? 'hidden' : scrolling)); 1149 | 1150 | // Set initial dimensions and start position 1151 | F._setDimension(); 1152 | 1153 | F.reposition(); 1154 | 1155 | F.isOpen = false; 1156 | F.coming = null; 1157 | 1158 | F.bindEvents(); 1159 | 1160 | if (!F.isOpened) { 1161 | $('.fancybox-wrap').not( current.wrap ).stop(true).trigger('onReset').remove(); 1162 | 1163 | } else if (previous.prevMethod) { 1164 | F.transitions[ previous.prevMethod ](); 1165 | } 1166 | 1167 | F.transitions[ F.isOpened ? current.nextMethod : current.openMethod ](); 1168 | 1169 | F._preloadImages(); 1170 | }, 1171 | 1172 | _setDimension: function () { 1173 | var viewport = F.getViewport(), 1174 | steps = 0, 1175 | canShrink = false, 1176 | canExpand = false, 1177 | wrap = F.wrap, 1178 | skin = F.skin, 1179 | inner = F.inner, 1180 | current = F.current, 1181 | width = current.width, 1182 | height = current.height, 1183 | minWidth = current.minWidth, 1184 | minHeight = current.minHeight, 1185 | maxWidth = current.maxWidth, 1186 | maxHeight = current.maxHeight, 1187 | scrolling = current.scrolling, 1188 | scrollOut = current.scrollOutside ? current.scrollbarWidth : 0, 1189 | margin = current.margin, 1190 | wMargin = getScalar(margin[1] + margin[3]), 1191 | hMargin = getScalar(margin[0] + margin[2]), 1192 | wPadding, 1193 | hPadding, 1194 | wSpace, 1195 | hSpace, 1196 | origWidth, 1197 | origHeight, 1198 | origMaxWidth, 1199 | origMaxHeight, 1200 | ratio, 1201 | width_, 1202 | height_, 1203 | maxWidth_, 1204 | maxHeight_, 1205 | iframe, 1206 | body; 1207 | 1208 | // Reset dimensions so we could re-check actual size 1209 | wrap.add(skin).add(inner).width('auto').height('auto').removeClass('fancybox-tmp'); 1210 | 1211 | wPadding = getScalar(skin.outerWidth(true) - skin.width()); 1212 | hPadding = getScalar(skin.outerHeight(true) - skin.height()); 1213 | 1214 | // Any space between content and viewport (margin, padding, border, title) 1215 | wSpace = wMargin + wPadding; 1216 | hSpace = hMargin + hPadding; 1217 | 1218 | origWidth = isPercentage(width) ? (viewport.w - wSpace) * getScalar(width) / 100 : width; 1219 | origHeight = isPercentage(height) ? (viewport.h - hSpace) * getScalar(height) / 100 : height; 1220 | 1221 | if (current.type === 'iframe') { 1222 | iframe = current.content; 1223 | 1224 | if (current.autoHeight && iframe.data('ready') === 1) { 1225 | try { 1226 | if (iframe[0].contentWindow.document.location) { 1227 | inner.width( origWidth ).height(9999); 1228 | 1229 | body = iframe.contents().find('body'); 1230 | 1231 | if (scrollOut) { 1232 | body.css('overflow-x', 'hidden'); 1233 | } 1234 | 1235 | origHeight = body.outerHeight(true); 1236 | } 1237 | 1238 | } catch (e) {} 1239 | } 1240 | 1241 | } else if (current.autoWidth || current.autoHeight) { 1242 | inner.addClass( 'fancybox-tmp' ); 1243 | 1244 | // Set width or height in case we need to calculate only one dimension 1245 | if (!current.autoWidth) { 1246 | inner.width( origWidth ); 1247 | } 1248 | 1249 | if (!current.autoHeight) { 1250 | inner.height( origHeight ); 1251 | } 1252 | 1253 | if (current.autoWidth) { 1254 | origWidth = inner.width(); 1255 | } 1256 | 1257 | if (current.autoHeight) { 1258 | origHeight = inner.height(); 1259 | } 1260 | 1261 | inner.removeClass( 'fancybox-tmp' ); 1262 | } 1263 | 1264 | width = getScalar( origWidth ); 1265 | height = getScalar( origHeight ); 1266 | 1267 | ratio = origWidth / origHeight; 1268 | 1269 | // Calculations for the content 1270 | minWidth = getScalar(isPercentage(minWidth) ? getScalar(minWidth, 'w') - wSpace : minWidth); 1271 | maxWidth = getScalar(isPercentage(maxWidth) ? getScalar(maxWidth, 'w') - wSpace : maxWidth); 1272 | 1273 | minHeight = getScalar(isPercentage(minHeight) ? getScalar(minHeight, 'h') - hSpace : minHeight); 1274 | maxHeight = getScalar(isPercentage(maxHeight) ? getScalar(maxHeight, 'h') - hSpace : maxHeight); 1275 | 1276 | // These will be used to determine if wrap can fit in the viewport 1277 | origMaxWidth = maxWidth; 1278 | origMaxHeight = maxHeight; 1279 | 1280 | if (current.fitToView) { 1281 | maxWidth = Math.min(viewport.w - wSpace, maxWidth); 1282 | maxHeight = Math.min(viewport.h - hSpace, maxHeight); 1283 | } 1284 | 1285 | maxWidth_ = viewport.w - wMargin; 1286 | maxHeight_ = viewport.h - hMargin; 1287 | 1288 | if (current.aspectRatio) { 1289 | if (width > maxWidth) { 1290 | width = maxWidth; 1291 | height = getScalar(width / ratio); 1292 | } 1293 | 1294 | if (height > maxHeight) { 1295 | height = maxHeight; 1296 | width = getScalar(height * ratio); 1297 | } 1298 | 1299 | if (width < minWidth) { 1300 | width = minWidth; 1301 | height = getScalar(width / ratio); 1302 | } 1303 | 1304 | if (height < minHeight) { 1305 | height = minHeight; 1306 | width = getScalar(height * ratio); 1307 | } 1308 | 1309 | } else { 1310 | width = Math.max(minWidth, Math.min(width, maxWidth)); 1311 | 1312 | if (current.autoHeight && current.type !== 'iframe') { 1313 | inner.width( width ); 1314 | 1315 | height = inner.height(); 1316 | } 1317 | 1318 | height = Math.max(minHeight, Math.min(height, maxHeight)); 1319 | } 1320 | 1321 | // Try to fit inside viewport (including the title) 1322 | if (current.fitToView) { 1323 | inner.width( width ).height( height ); 1324 | 1325 | wrap.width( width + wPadding ); 1326 | 1327 | // Real wrap dimensions 1328 | width_ = wrap.width(); 1329 | height_ = wrap.height(); 1330 | 1331 | if (current.aspectRatio) { 1332 | while ((width_ > maxWidth_ || height_ > maxHeight_) && width > minWidth && height > minHeight) { 1333 | if (steps++ > 19) { 1334 | break; 1335 | } 1336 | 1337 | height = Math.max(minHeight, Math.min(maxHeight, height - 10)); 1338 | width = getScalar(height * ratio); 1339 | 1340 | if (width < minWidth) { 1341 | width = minWidth; 1342 | height = getScalar(width / ratio); 1343 | } 1344 | 1345 | if (width > maxWidth) { 1346 | width = maxWidth; 1347 | height = getScalar(width / ratio); 1348 | } 1349 | 1350 | inner.width( width ).height( height ); 1351 | 1352 | wrap.width( width + wPadding ); 1353 | 1354 | width_ = wrap.width(); 1355 | height_ = wrap.height(); 1356 | } 1357 | 1358 | } else { 1359 | width = Math.max(minWidth, Math.min(width, width - (width_ - maxWidth_))); 1360 | height = Math.max(minHeight, Math.min(height, height - (height_ - maxHeight_))); 1361 | } 1362 | } 1363 | 1364 | if (scrollOut && scrolling === 'auto' && height < origHeight && (width + wPadding + scrollOut) < maxWidth_) { 1365 | width += scrollOut; 1366 | } 1367 | 1368 | inner.width( width ).height( height ); 1369 | 1370 | wrap.width( width + wPadding ); 1371 | 1372 | width_ = wrap.width(); 1373 | height_ = wrap.height(); 1374 | 1375 | canShrink = (width_ > maxWidth_ || height_ > maxHeight_) && width > minWidth && height > minHeight; 1376 | canExpand = current.aspectRatio ? (width < origMaxWidth && height < origMaxHeight && width < origWidth && height < origHeight) : ((width < origMaxWidth || height < origMaxHeight) && (width < origWidth || height < origHeight)); 1377 | 1378 | $.extend(current, { 1379 | dim : { 1380 | width : getValue( width_ ), 1381 | height : getValue( height_ ) 1382 | }, 1383 | origWidth : origWidth, 1384 | origHeight : origHeight, 1385 | canShrink : canShrink, 1386 | canExpand : canExpand, 1387 | wPadding : wPadding, 1388 | hPadding : hPadding, 1389 | wrapSpace : height_ - skin.outerHeight(true), 1390 | skinSpace : skin.height() - height 1391 | }); 1392 | 1393 | if (!iframe && current.autoHeight && height > minHeight && height < maxHeight && !canExpand) { 1394 | inner.height('auto'); 1395 | } 1396 | }, 1397 | 1398 | _getPosition: function (onlyAbsolute) { 1399 | var current = F.current, 1400 | viewport = F.getViewport(), 1401 | margin = current.margin, 1402 | width = F.wrap.width() + margin[1] + margin[3], 1403 | height = F.wrap.height() + margin[0] + margin[2], 1404 | rez = { 1405 | position: 'absolute', 1406 | top : margin[0], 1407 | left : margin[3] 1408 | }; 1409 | 1410 | if (current.autoCenter && current.fixed && !onlyAbsolute && height <= viewport.h && width <= viewport.w) { 1411 | rez.position = 'fixed'; 1412 | 1413 | } else if (!current.locked) { 1414 | rez.top += viewport.y; 1415 | rez.left += viewport.x; 1416 | } 1417 | 1418 | rez.top = getValue(Math.max(rez.top, rez.top + ((viewport.h - height) * current.topRatio))); 1419 | rez.left = getValue(Math.max(rez.left, rez.left + ((viewport.w - width) * current.leftRatio))); 1420 | 1421 | return rez; 1422 | }, 1423 | 1424 | _afterZoomIn: function () { 1425 | var current = F.current; 1426 | 1427 | if (!current) { 1428 | return; 1429 | } 1430 | 1431 | F.isOpen = F.isOpened = true; 1432 | 1433 | F.wrap.css('overflow', 'visible').addClass('fancybox-opened').hide().show(0); 1434 | 1435 | F.update(); 1436 | 1437 | // Assign a click event 1438 | if ( current.closeClick || (current.nextClick && F.group.length > 1) ) { 1439 | F.inner.css('cursor', 'pointer').bind('click.fb', function(e) { 1440 | if (!$(e.target).is('a') && !$(e.target).parent().is('a')) { 1441 | e.preventDefault(); 1442 | 1443 | F[ current.closeClick ? 'close' : 'next' ](); 1444 | } 1445 | }); 1446 | } 1447 | 1448 | // Create a close button 1449 | if (current.closeBtn) { 1450 | $(current.tpl.closeBtn).appendTo(F.skin).bind('click.fb', function(e) { 1451 | e.preventDefault(); 1452 | 1453 | F.close(); 1454 | }); 1455 | } 1456 | 1457 | // Create navigation arrows 1458 | if (current.arrows && F.group.length > 1) { 1459 | if (current.loop || current.index > 0) { 1460 | $(current.tpl.prev).appendTo(F.outer).bind('click.fb', F.prev); 1461 | } 1462 | 1463 | if (current.loop || current.index < F.group.length - 1) { 1464 | $(current.tpl.next).appendTo(F.outer).bind('click.fb', F.next); 1465 | } 1466 | } 1467 | 1468 | F.trigger('afterShow'); 1469 | 1470 | // Stop the slideshow if this is the last item 1471 | if (!current.loop && current.index === current.group.length - 1) { 1472 | 1473 | F.play( false ); 1474 | 1475 | } else if (F.opts.autoPlay && !F.player.isActive) { 1476 | F.opts.autoPlay = false; 1477 | 1478 | F.play(true); 1479 | } 1480 | }, 1481 | 1482 | _afterZoomOut: function ( obj ) { 1483 | obj = obj || F.current; 1484 | 1485 | $('.fancybox-wrap').trigger('onReset').remove(); 1486 | 1487 | $.extend(F, { 1488 | group : {}, 1489 | opts : {}, 1490 | router : false, 1491 | current : null, 1492 | isActive : false, 1493 | isOpened : false, 1494 | isOpen : false, 1495 | isClosing : false, 1496 | wrap : null, 1497 | skin : null, 1498 | outer : null, 1499 | inner : null 1500 | }); 1501 | 1502 | F.trigger('afterClose', obj); 1503 | } 1504 | }); 1505 | 1506 | /* 1507 | * Default transitions 1508 | */ 1509 | 1510 | F.transitions = { 1511 | getOrigPosition: function () { 1512 | var current = F.current, 1513 | element = current.element, 1514 | orig = current.orig, 1515 | pos = {}, 1516 | width = 50, 1517 | height = 50, 1518 | hPadding = current.hPadding, 1519 | wPadding = current.wPadding, 1520 | viewport = F.getViewport(); 1521 | 1522 | if (!orig && current.isDom && element.is(':visible')) { 1523 | orig = element.find('img:first'); 1524 | 1525 | if (!orig.length) { 1526 | orig = element; 1527 | } 1528 | } 1529 | 1530 | if (isQuery(orig)) { 1531 | pos = orig.offset(); 1532 | 1533 | if (orig.is('img')) { 1534 | width = orig.outerWidth(); 1535 | height = orig.outerHeight(); 1536 | } 1537 | 1538 | } else { 1539 | pos.top = viewport.y + (viewport.h - height) * current.topRatio; 1540 | pos.left = viewport.x + (viewport.w - width) * current.leftRatio; 1541 | } 1542 | 1543 | if (F.wrap.css('position') === 'fixed' || current.locked) { 1544 | pos.top -= viewport.y; 1545 | pos.left -= viewport.x; 1546 | } 1547 | 1548 | pos = { 1549 | top : getValue(pos.top - hPadding * current.topRatio), 1550 | left : getValue(pos.left - wPadding * current.leftRatio), 1551 | width : getValue(width + wPadding), 1552 | height : getValue(height + hPadding) 1553 | }; 1554 | 1555 | return pos; 1556 | }, 1557 | 1558 | step: function (now, fx) { 1559 | var ratio, 1560 | padding, 1561 | value, 1562 | prop = fx.prop, 1563 | current = F.current, 1564 | wrapSpace = current.wrapSpace, 1565 | skinSpace = current.skinSpace; 1566 | 1567 | if (prop === 'width' || prop === 'height') { 1568 | ratio = fx.end === fx.start ? 1 : (now - fx.start) / (fx.end - fx.start); 1569 | 1570 | if (F.isClosing) { 1571 | ratio = 1 - ratio; 1572 | } 1573 | 1574 | padding = prop === 'width' ? current.wPadding : current.hPadding; 1575 | value = now - padding; 1576 | 1577 | F.skin[ prop ]( getScalar( prop === 'width' ? value : value - (wrapSpace * ratio) ) ); 1578 | F.inner[ prop ]( getScalar( prop === 'width' ? value : value - (wrapSpace * ratio) - (skinSpace * ratio) ) ); 1579 | } 1580 | }, 1581 | 1582 | zoomIn: function () { 1583 | var current = F.current, 1584 | startPos = current.pos, 1585 | effect = current.openEffect, 1586 | elastic = effect === 'elastic', 1587 | endPos = $.extend({opacity : 1}, startPos); 1588 | 1589 | // Remove "position" property that breaks older IE 1590 | delete endPos.position; 1591 | 1592 | if (elastic) { 1593 | startPos = this.getOrigPosition(); 1594 | 1595 | if (current.openOpacity) { 1596 | startPos.opacity = 0.1; 1597 | } 1598 | 1599 | } else if (effect === 'fade') { 1600 | startPos.opacity = 0.1; 1601 | } 1602 | 1603 | F.wrap.css(startPos).animate(endPos, { 1604 | duration : effect === 'none' ? 0 : current.openSpeed, 1605 | easing : current.openEasing, 1606 | step : elastic ? this.step : null, 1607 | complete : F._afterZoomIn 1608 | }); 1609 | }, 1610 | 1611 | zoomOut: function () { 1612 | var current = F.current, 1613 | effect = current.closeEffect, 1614 | elastic = effect === 'elastic', 1615 | endPos = {opacity : 0.1}; 1616 | 1617 | if (elastic) { 1618 | endPos = this.getOrigPosition(); 1619 | 1620 | if (current.closeOpacity) { 1621 | endPos.opacity = 0.1; 1622 | } 1623 | } 1624 | 1625 | F.wrap.animate(endPos, { 1626 | duration : effect === 'none' ? 0 : current.closeSpeed, 1627 | easing : current.closeEasing, 1628 | step : elastic ? this.step : null, 1629 | complete : F._afterZoomOut 1630 | }); 1631 | }, 1632 | 1633 | changeIn: function () { 1634 | var current = F.current, 1635 | effect = current.nextEffect, 1636 | startPos = current.pos, 1637 | endPos = { opacity : 1 }, 1638 | direction = F.direction, 1639 | distance = 200, 1640 | field; 1641 | 1642 | startPos.opacity = 0.1; 1643 | 1644 | if (effect === 'elastic') { 1645 | field = direction === 'down' || direction === 'up' ? 'top' : 'left'; 1646 | 1647 | if (direction === 'down' || direction === 'right') { 1648 | startPos[ field ] = getValue(getScalar(startPos[ field ]) - distance); 1649 | endPos[ field ] = '+=' + distance + 'px'; 1650 | 1651 | } else { 1652 | startPos[ field ] = getValue(getScalar(startPos[ field ]) + distance); 1653 | endPos[ field ] = '-=' + distance + 'px'; 1654 | } 1655 | } 1656 | 1657 | // Workaround for http://bugs.jquery.com/ticket/12273 1658 | if (effect === 'none') { 1659 | F._afterZoomIn(); 1660 | 1661 | } else { 1662 | F.wrap.css(startPos).animate(endPos, { 1663 | duration : current.nextSpeed, 1664 | easing : current.nextEasing, 1665 | complete : F._afterZoomIn 1666 | }); 1667 | } 1668 | }, 1669 | 1670 | changeOut: function () { 1671 | var previous = F.previous, 1672 | effect = previous.prevEffect, 1673 | endPos = { opacity : 0.1 }, 1674 | direction = F.direction, 1675 | distance = 200; 1676 | 1677 | if (effect === 'elastic') { 1678 | endPos[ direction === 'down' || direction === 'up' ? 'top' : 'left' ] = ( direction === 'up' || direction === 'left' ? '-' : '+' ) + '=' + distance + 'px'; 1679 | } 1680 | 1681 | previous.wrap.animate(endPos, { 1682 | duration : effect === 'none' ? 0 : previous.prevSpeed, 1683 | easing : previous.prevEasing, 1684 | complete : function () { 1685 | $(this).trigger('onReset').remove(); 1686 | } 1687 | }); 1688 | } 1689 | }; 1690 | 1691 | /* 1692 | * Overlay helper 1693 | */ 1694 | 1695 | F.helpers.overlay = { 1696 | defaults : { 1697 | closeClick : true, // if true, fancyBox will be closed when user clicks on the overlay 1698 | speedOut : 200, // duration of fadeOut animation 1699 | showEarly : true, // indicates if should be opened immediately or wait until the content is ready 1700 | css : {}, // custom CSS properties 1701 | locked : !isTouch, // if true, the content will be locked into overlay 1702 | fixed : true // if false, the overlay CSS position property will not be set to "fixed" 1703 | }, 1704 | 1705 | overlay : null, // current handle 1706 | fixed : false, // indicates if the overlay has position "fixed" 1707 | el : $('html'), // element that contains "the lock" 1708 | 1709 | // Public methods 1710 | create : function(opts) { 1711 | var parent; 1712 | 1713 | opts = $.extend({}, this.defaults, opts); 1714 | 1715 | if (this.overlay) { 1716 | this.close(); 1717 | } 1718 | 1719 | parent = F.coming ? F.coming.parent : opts.parent; 1720 | 1721 | this.overlay = $('
    ').appendTo( parent && parent.lenth ? parent : 'body' ); 1722 | this.fixed = false; 1723 | 1724 | if (opts.fixed && F.defaults.fixed) { 1725 | this.overlay.addClass('fancybox-overlay-fixed'); 1726 | 1727 | this.fixed = true; 1728 | } 1729 | }, 1730 | 1731 | open : function(opts) { 1732 | var that = this; 1733 | 1734 | opts = $.extend({}, this.defaults, opts); 1735 | 1736 | if (this.overlay) { 1737 | this.overlay.unbind('.overlay').width('auto').height('auto'); 1738 | 1739 | } else { 1740 | this.create(opts); 1741 | } 1742 | 1743 | if (!this.fixed) { 1744 | W.bind('resize.overlay', $.proxy( this.update, this) ); 1745 | 1746 | this.update(); 1747 | } 1748 | 1749 | if (opts.closeClick) { 1750 | this.overlay.bind('click.overlay', function(e) { 1751 | if ($(e.target).hasClass('fancybox-overlay')) { 1752 | if (F.isActive) { 1753 | F.close(); 1754 | } else { 1755 | that.close(); 1756 | } 1757 | 1758 | return false; 1759 | } 1760 | }); 1761 | } 1762 | 1763 | this.overlay.css( opts.css ).show(); 1764 | }, 1765 | 1766 | close : function() { 1767 | W.unbind('resize.overlay'); 1768 | 1769 | if (this.el.hasClass('fancybox-lock')) { 1770 | $('.fancybox-margin').removeClass('fancybox-margin'); 1771 | 1772 | this.el.removeClass('fancybox-lock'); 1773 | 1774 | W.scrollTop( this.scrollV ).scrollLeft( this.scrollH ); 1775 | } 1776 | 1777 | $('.fancybox-overlay').remove().hide(); 1778 | 1779 | $.extend(this, { 1780 | overlay : null, 1781 | fixed : false 1782 | }); 1783 | }, 1784 | 1785 | // Private, callbacks 1786 | 1787 | update : function () { 1788 | var width = '100%', offsetWidth; 1789 | 1790 | // Reset width/height so it will not mess 1791 | this.overlay.width(width).height('100%'); 1792 | 1793 | // jQuery does not return reliable result for IE 1794 | if (IE) { 1795 | offsetWidth = Math.max(document.documentElement.offsetWidth, document.body.offsetWidth); 1796 | 1797 | if (D.width() > offsetWidth) { 1798 | width = D.width(); 1799 | } 1800 | 1801 | } else if (D.width() > W.width()) { 1802 | width = D.width(); 1803 | } 1804 | 1805 | this.overlay.width(width).height(D.height()); 1806 | }, 1807 | 1808 | // This is where we can manipulate DOM, because later it would cause iframes to reload 1809 | onReady : function (opts, obj) { 1810 | var overlay = this.overlay; 1811 | 1812 | $('.fancybox-overlay').stop(true, true); 1813 | 1814 | if (!overlay) { 1815 | this.create(opts); 1816 | } 1817 | 1818 | if (opts.locked && this.fixed && obj.fixed) { 1819 | obj.locked = this.overlay.append( obj.wrap ); 1820 | obj.fixed = false; 1821 | } 1822 | 1823 | if (opts.showEarly === true) { 1824 | this.beforeShow.apply(this, arguments); 1825 | } 1826 | }, 1827 | 1828 | beforeShow : function(opts, obj) { 1829 | if (obj.locked && !this.el.hasClass('fancybox-lock')) { 1830 | if (this.fixPosition !== false) { 1831 | $('*').filter(function(){ 1832 | return ($(this).css('position') === 'fixed' && !$(this).hasClass("fancybox-overlay") && !$(this).hasClass("fancybox-wrap") ); 1833 | }).addClass('fancybox-margin'); 1834 | } 1835 | 1836 | this.el.addClass('fancybox-margin'); 1837 | 1838 | this.scrollV = W.scrollTop(); 1839 | this.scrollH = W.scrollLeft(); 1840 | 1841 | this.el.addClass('fancybox-lock'); 1842 | 1843 | W.scrollTop( this.scrollV ).scrollLeft( this.scrollH ); 1844 | } 1845 | 1846 | this.open(opts); 1847 | }, 1848 | 1849 | onUpdate : function() { 1850 | if (!this.fixed) { 1851 | this.update(); 1852 | } 1853 | }, 1854 | 1855 | afterClose: function (opts) { 1856 | // Remove overlay if exists and fancyBox is not opening 1857 | // (e.g., it is not being open using afterClose callback) 1858 | if (this.overlay && !F.coming) { 1859 | this.overlay.fadeOut(opts.speedOut, $.proxy( this.close, this )); 1860 | } 1861 | } 1862 | }; 1863 | 1864 | /* 1865 | * Title helper 1866 | */ 1867 | 1868 | F.helpers.title = { 1869 | defaults : { 1870 | type : 'float', // 'float', 'inside', 'outside' or 'over', 1871 | position : 'bottom' // 'top' or 'bottom' 1872 | }, 1873 | 1874 | beforeShow: function (opts) { 1875 | var current = F.current, 1876 | text = current.title, 1877 | type = opts.type, 1878 | title, 1879 | target; 1880 | 1881 | if ($.isFunction(text)) { 1882 | text = text.call(current.element, current); 1883 | } 1884 | 1885 | if (!isString(text) || $.trim(text) === '') { 1886 | return; 1887 | } 1888 | 1889 | title = $('
    ' + text + '
    '); 1890 | 1891 | switch (type) { 1892 | case 'inside': 1893 | target = F.skin; 1894 | break; 1895 | 1896 | case 'outside': 1897 | target = F.wrap; 1898 | break; 1899 | 1900 | case 'over': 1901 | target = F.inner; 1902 | break; 1903 | 1904 | default: // 'float' 1905 | target = F.skin; 1906 | 1907 | title.appendTo('body'); 1908 | 1909 | if (IE) { 1910 | title.width( title.width() ); 1911 | } 1912 | 1913 | title.wrapInner(''); 1914 | 1915 | //Increase bottom margin so this title will also fit into viewport 1916 | F.current.margin[2] += Math.abs( getScalar(title.css('margin-bottom')) ); 1917 | break; 1918 | } 1919 | 1920 | title[ (opts.position === 'top' ? 'prependTo' : 'appendTo') ](target); 1921 | } 1922 | }; 1923 | 1924 | // jQuery plugin initialization 1925 | $.fn.fancybox = function (options) { 1926 | var index, 1927 | that = $(this), 1928 | selector = this.selector || '', 1929 | run = function(e) { 1930 | var what = $(this).blur(), idx = index, relType, relVal; 1931 | 1932 | if (!(e.ctrlKey || e.altKey || e.shiftKey || e.metaKey) && !what.is('.fancybox-wrap')) { 1933 | relType = options.groupAttr || 'data-fancybox-group'; 1934 | relVal = what.attr(relType); 1935 | 1936 | if (!relVal) { 1937 | relType = 'rel'; 1938 | relVal = what.get(0)[ relType ]; 1939 | } 1940 | 1941 | if (relVal && relVal !== '' && relVal !== 'nofollow') { 1942 | what = selector.length ? $(selector) : that; 1943 | what = what.filter('[' + relType + '="' + relVal + '"]'); 1944 | idx = what.index(this); 1945 | } 1946 | 1947 | options.index = idx; 1948 | 1949 | // Stop an event from bubbling if everything is fine 1950 | if (F.open(what, options) !== false) { 1951 | e.preventDefault(); 1952 | } 1953 | } 1954 | }; 1955 | 1956 | options = options || {}; 1957 | index = options.index || 0; 1958 | 1959 | if (!selector || options.live === false) { 1960 | that.unbind('click.fb-start').bind('click.fb-start', run); 1961 | 1962 | } else { 1963 | D.undelegate(selector, 'click.fb-start').delegate(selector + ":not('.fancybox-item, .fancybox-nav')", 'click.fb-start', run); 1964 | } 1965 | 1966 | this.filter('[data-fancybox-start=1]').trigger('click'); 1967 | 1968 | return this; 1969 | }; 1970 | 1971 | // Tests that need a body at doc ready 1972 | D.ready(function() { 1973 | var w1, w2; 1974 | 1975 | if ( $.scrollbarWidth === undefined ) { 1976 | // http://benalman.com/projects/jquery-misc-plugins/#scrollbarwidth 1977 | $.scrollbarWidth = function() { 1978 | var parent = $('
    ').appendTo('body'), 1979 | child = parent.children(), 1980 | width = child.innerWidth() - child.height( 99 ).innerWidth(); 1981 | 1982 | parent.remove(); 1983 | 1984 | return width; 1985 | }; 1986 | } 1987 | 1988 | if ( $.support.fixedPosition === undefined ) { 1989 | $.support.fixedPosition = (function() { 1990 | var elem = $('
    ').appendTo('body'), 1991 | fixed = ( elem[0].offsetTop === 20 || elem[0].offsetTop === 15 ); 1992 | 1993 | elem.remove(); 1994 | 1995 | return fixed; 1996 | }()); 1997 | } 1998 | 1999 | $.extend(F.defaults, { 2000 | scrollbarWidth : $.scrollbarWidth(), 2001 | fixed : $.support.fixedPosition, 2002 | parent : $('body') 2003 | }); 2004 | 2005 | //Get real width of page scroll-bar 2006 | w1 = $(window).width(); 2007 | 2008 | H.addClass('fancybox-lock-test'); 2009 | 2010 | w2 = $(window).width(); 2011 | 2012 | H.removeClass('fancybox-lock-test'); 2013 | 2014 | $("").appendTo("head"); 2015 | }); 2016 | 2017 | }(window, document, jQuery)); -------------------------------------------------------------------------------- /source/fancybox/jquery.fancybox.pack.js: -------------------------------------------------------------------------------- 1 | /*! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license */ 2 | (function(s,H,f,w){var K=f("html"),q=f(s),p=f(H),b=f.fancybox=function(){b.open.apply(this,arguments)},J=navigator.userAgent.match(/msie/i),C=null,t=H.createTouch!==w,u=function(a){return a&&a.hasOwnProperty&&a instanceof f},r=function(a){return a&&"string"===f.type(a)},F=function(a){return r(a)&&0
    ',image:'',iframe:'",error:'

    The requested content cannot be loaded.
    Please try again later.

    ',closeBtn:'',next:'',prev:''},openEffect:"fade",openSpeed:250,openEasing:"swing",openOpacity:!0, 6 | openMethod:"zoomIn",closeEffect:"fade",closeSpeed:250,closeEasing:"swing",closeOpacity:!0,closeMethod:"zoomOut",nextEffect:"elastic",nextSpeed:250,nextEasing:"swing",nextMethod:"changeIn",prevEffect:"elastic",prevSpeed:250,prevEasing:"swing",prevMethod:"changeOut",helpers:{overlay:!0,title:!0},onCancel:f.noop,beforeLoad:f.noop,afterLoad:f.noop,beforeShow:f.noop,afterShow:f.noop,beforeChange:f.noop,beforeClose:f.noop,afterClose:f.noop},group:{},opts:{},previous:null,coming:null,current:null,isActive:!1, 7 | isOpen:!1,isOpened:!1,wrap:null,skin:null,outer:null,inner:null,player:{timer:null,isActive:!1},ajaxLoad:null,imgPreload:null,transitions:{},helpers:{},open:function(a,d){if(a&&(f.isPlainObject(d)||(d={}),!1!==b.close(!0)))return f.isArray(a)||(a=u(a)?f(a).get():[a]),f.each(a,function(e,c){var l={},g,h,k,n,m;"object"===f.type(c)&&(c.nodeType&&(c=f(c)),u(c)?(l={href:c.data("fancybox-href")||c.attr("href"),title:f("
    ").text(c.data("fancybox-title")||c.attr("title")).html(),isDom:!0,element:c}, 8 | f.metadata&&f.extend(!0,l,c.metadata())):l=c);g=d.href||l.href||(r(c)?c:null);h=d.title!==w?d.title:l.title||"";n=(k=d.content||l.content)?"html":d.type||l.type;!n&&l.isDom&&(n=c.data("fancybox-type"),n||(n=(n=c.prop("class").match(/fancybox\.(\w+)/))?n[1]:null));r(g)&&(n||(b.isImage(g)?n="image":b.isSWF(g)?n="swf":"#"===g.charAt(0)?n="inline":r(c)&&(n="html",k=c)),"ajax"===n&&(m=g.split(/\s+/,2),g=m.shift(),m=m.shift()));k||("inline"===n?g?k=f(r(g)?g.replace(/.*(?=#[^\s]+$)/,""):g):l.isDom&&(k=c): 9 | "html"===n?k=g:n||g||!l.isDom||(n="inline",k=c));f.extend(l,{href:g,type:n,content:k,title:h,selector:m});a[e]=l}),b.opts=f.extend(!0,{},b.defaults,d),d.keys!==w&&(b.opts.keys=d.keys?f.extend({},b.defaults.keys,d.keys):!1),b.group=a,b._start(b.opts.index)},cancel:function(){var a=b.coming;a&&!1===b.trigger("onCancel")||(b.hideLoading(),a&&(b.ajaxLoad&&b.ajaxLoad.abort(),b.ajaxLoad=null,b.imgPreload&&(b.imgPreload.onload=b.imgPreload.onerror=null),a.wrap&&a.wrap.stop(!0,!0).trigger("onReset").remove(), 10 | b.coming=null,b.current||b._afterZoomOut(a)))},close:function(a){b.cancel();!1!==b.trigger("beforeClose")&&(b.unbindEvents(),b.isActive&&(b.isOpen&&!0!==a?(b.isOpen=b.isOpened=!1,b.isClosing=!0,f(".fancybox-item, .fancybox-nav").remove(),b.wrap.stop(!0,!0).removeClass("fancybox-opened"),b.transitions[b.current.closeMethod]()):(f(".fancybox-wrap").stop(!0).trigger("onReset").remove(),b._afterZoomOut())))},play:function(a){var d=function(){clearTimeout(b.player.timer)},e=function(){d();b.current&&b.player.isActive&& 11 | (b.player.timer=setTimeout(b.next,b.current.playSpeed))},c=function(){d();p.unbind(".player");b.player.isActive=!1;b.trigger("onPlayEnd")};!0===a||!b.player.isActive&&!1!==a?b.current&&(b.current.loop||b.current.index=c.index?"next":"prev"],b.router=e||"jumpto",c.loop&&(0>a&&(a=c.group.length+a%c.group.length),a%=c.group.length),c.group[a]!==w&&(b.cancel(),b._start(a)))},reposition:function(a,d){var e=b.current,c=e?e.wrap:null,l;c&&(l=b._getPosition(d),a&&"scroll"===a.type?(delete l.position,c.stop(!0,!0).animate(l,200)):(c.css(l),e.pos=f.extend({},e.dim,l)))}, 13 | update:function(a){var d=a&&a.originalEvent&&a.originalEvent.type,e=!d||"orientationchange"===d;e&&(clearTimeout(C),C=null);b.isOpen&&!C&&(C=setTimeout(function(){var c=b.current;c&&!b.isClosing&&(b.wrap.removeClass("fancybox-tmp"),(e||"load"===d||"resize"===d&&c.autoResize)&&b._setDimension(),"scroll"===d&&c.canShrink||b.reposition(a),b.trigger("onUpdate"),C=null)},e&&!t?0:300))},toggle:function(a){b.isOpen&&(b.current.fitToView="boolean"===f.type(a)?a:!b.current.fitToView,t&&(b.wrap.removeAttr("style").addClass("fancybox-tmp"), 14 | b.trigger("onUpdate")),b.update())},hideLoading:function(){p.unbind(".loading");f("#fancybox-loading").remove()},showLoading:function(){var a,d;b.hideLoading();a=f('
    ').click(b.cancel).appendTo("body");p.bind("keydown.loading",function(a){27===(a.which||a.keyCode)&&(a.preventDefault(),b.cancel())});b.defaults.fixed||(d=b.getViewport(),a.css({position:"absolute",top:0.5*d.h+d.y,left:0.5*d.w+d.x}));b.trigger("onLoading")},getViewport:function(){var a=b.current&& 15 | b.current.locked||!1,d={x:q.scrollLeft(),y:q.scrollTop()};a&&a.length?(d.w=a[0].clientWidth,d.h=a[0].clientHeight):(d.w=t&&s.innerWidth?s.innerWidth:q.width(),d.h=t&&s.innerHeight?s.innerHeight:q.height());return d},unbindEvents:function(){b.wrap&&u(b.wrap)&&b.wrap.unbind(".fb");p.unbind(".fb");q.unbind(".fb")},bindEvents:function(){var a=b.current,d;a&&(q.bind("orientationchange.fb"+(t?"":" resize.fb")+(a.autoCenter&&!a.locked?" scroll.fb":""),b.update),(d=a.keys)&&p.bind("keydown.fb",function(e){var c= 16 | e.which||e.keyCode,l=e.target||e.srcElement;if(27===c&&b.coming)return!1;e.ctrlKey||e.altKey||e.shiftKey||e.metaKey||l&&(l.type||f(l).is("[contenteditable]"))||f.each(d,function(d,l){if(1h[0].clientWidth||h[0].clientHeight&&h[0].scrollHeight>h[0].clientHeight),h=f(h).parent();0!==c&&!k&&1g||0>l)&&b.next(0>g?"up":"right"),d.preventDefault())}))},trigger:function(a,d){var e,c=d||b.coming||b.current;if(c){f.isFunction(c[a])&&(e=c[a].apply(c,Array.prototype.slice.call(arguments,1)));if(!1===e)return!1;c.helpers&&f.each(c.helpers,function(d,e){if(e&& 18 | b.helpers[d]&&f.isFunction(b.helpers[d][a]))b.helpers[d][a](f.extend(!0,{},b.helpers[d].defaults,e),c)})}p.trigger(a)},isImage:function(a){return r(a)&&a.match(/(^data:image\/.*,)|(\.(jp(e|g|eg)|gif|png|bmp|webp|svg)((\?|#).*)?$)/i)},isSWF:function(a){return r(a)&&a.match(/\.(swf)((\?|#).*)?$/i)},_start:function(a){var d={},e,c;a=m(a);e=b.group[a]||null;if(!e)return!1;d=f.extend(!0,{},b.opts,e);e=d.margin;c=d.padding;"number"===f.type(e)&&(d.margin=[e,e,e,e]);"number"===f.type(c)&&(d.padding=[c,c, 19 | c,c]);d.modal&&f.extend(!0,d,{closeBtn:!1,closeClick:!1,nextClick:!1,arrows:!1,mouseWheel:!1,keys:null,helpers:{overlay:{closeClick:!1}}});d.autoSize&&(d.autoWidth=d.autoHeight=!0);"auto"===d.width&&(d.autoWidth=!0);"auto"===d.height&&(d.autoHeight=!0);d.group=b.group;d.index=a;b.coming=d;if(!1===b.trigger("beforeLoad"))b.coming=null;else{c=d.type;e=d.href;if(!c)return b.coming=null,b.current&&b.router&&"jumpto"!==b.router?(b.current.index=a,b[b.router](b.direction)):!1;b.isActive=!0;if("image"=== 20 | c||"swf"===c)d.autoHeight=d.autoWidth=!1,d.scrolling="visible";"image"===c&&(d.aspectRatio=!0);"iframe"===c&&t&&(d.scrolling="scroll");d.wrap=f(d.tpl.wrap).addClass("fancybox-"+(t?"mobile":"desktop")+" fancybox-type-"+c+" fancybox-tmp "+d.wrapCSS).appendTo(d.parent||"body");f.extend(d,{skin:f(".fancybox-skin",d.wrap),outer:f(".fancybox-outer",d.wrap),inner:f(".fancybox-inner",d.wrap)});f.each(["Top","Right","Bottom","Left"],function(a,b){d.skin.css("padding"+b,x(d.padding[a]))});b.trigger("onReady"); 21 | if("inline"===c||"html"===c){if(!d.content||!d.content.length)return b._error("content")}else if(!e)return b._error("href");"image"===c?b._loadImage():"ajax"===c?b._loadAjax():"iframe"===c?b._loadIframe():b._afterLoad()}},_error:function(a){f.extend(b.coming,{type:"html",autoWidth:!0,autoHeight:!0,minWidth:0,minHeight:0,scrolling:"no",hasError:a,content:b.coming.tpl.error});b._afterLoad()},_loadImage:function(){var a=b.imgPreload=new Image;a.onload=function(){this.onload=this.onerror=null;b.coming.width= 22 | this.width/b.opts.pixelRatio;b.coming.height=this.height/b.opts.pixelRatio;b._afterLoad()};a.onerror=function(){this.onload=this.onerror=null;b._error("image")};a.src=b.coming.href;!0!==a.complete&&b.showLoading()},_loadAjax:function(){var a=b.coming;b.showLoading();b.ajaxLoad=f.ajax(f.extend({},a.ajax,{url:a.href,error:function(a,e){b.coming&&"abort"!==e?b._error("ajax",a):b.hideLoading()},success:function(d,e){"success"===e&&(a.content=d,b._afterLoad())}}))},_loadIframe:function(){var a=b.coming, 23 | d=f(a.tpl.iframe.replace(/\{rnd\}/g,(new Date).getTime())).attr("scrolling",t?"auto":a.iframe.scrolling).attr("src",a.href);f(a.wrap).bind("onReset",function(){try{f(this).find("iframe").hide().attr("src","//about:blank").end().empty()}catch(a){}});a.iframe.preload&&(b.showLoading(),d.one("load",function(){f(this).data("ready",1);t||f(this).bind("load.fb",b.update);f(this).parents(".fancybox-wrap").width("100%").removeClass("fancybox-tmp").show();b._afterLoad()}));a.content=d.appendTo(a.inner);a.iframe.preload|| 24 | b._afterLoad()},_preloadImages:function(){var a=b.group,d=b.current,e=a.length,c=d.preload?Math.min(d.preload,e-1):0,f,g;for(g=1;g<=c;g+=1)f=a[(d.index+g)%e],"image"===f.type&&f.href&&((new Image).src=f.href)},_afterLoad:function(){var a=b.coming,d=b.current,e,c,l,g,h;b.hideLoading();if(a&&!1!==b.isActive)if(!1===b.trigger("afterLoad",a,d))a.wrap.stop(!0).trigger("onReset").remove(),b.coming=null;else{d&&(b.trigger("beforeChange",d),d.wrap.stop(!0).removeClass("fancybox-opened").find(".fancybox-item, .fancybox-nav").remove()); 25 | b.unbindEvents();e=a.content;c=a.type;l=a.scrolling;f.extend(b,{wrap:a.wrap,skin:a.skin,outer:a.outer,inner:a.inner,current:a,previous:d});g=a.href;switch(c){case "inline":case "ajax":case "html":a.selector?e=f("
    ").html(e).find(a.selector):u(e)&&(e.data("fancybox-placeholder")||e.data("fancybox-placeholder",f('
    ').insertAfter(e).hide()),e=e.show().detach(),a.wrap.bind("onReset",function(){f(this).find(e).length&&e.hide().replaceAll(e.data("fancybox-placeholder")).data("fancybox-placeholder", 26 | !1)}));break;case "image":e=a.tpl.image.replace(/\{href\}/g,g);break;case "swf":e='',h="",f.each(a.swf,function(a,b){e+='';h+=" "+a+'="'+b+'"'}),e+='"}u(e)&&e.parent().is(a.inner)||a.inner.append(e);b.trigger("beforeShow"); 27 | a.inner.css("overflow","yes"===l?"scroll":"no"===l?"hidden":l);b._setDimension();b.reposition();b.isOpen=!1;b.coming=null;b.bindEvents();if(!b.isOpened)f(".fancybox-wrap").not(a.wrap).stop(!0).trigger("onReset").remove();else if(d.prevMethod)b.transitions[d.prevMethod]();b.transitions[b.isOpened?a.nextMethod:a.openMethod]();b._preloadImages()}},_setDimension:function(){var a=b.getViewport(),d=0,e=!1,c=!1,e=b.wrap,l=b.skin,g=b.inner,h=b.current,c=h.width,k=h.height,n=h.minWidth,v=h.minHeight,p=h.maxWidth, 28 | q=h.maxHeight,t=h.scrolling,r=h.scrollOutside?h.scrollbarWidth:0,y=h.margin,z=m(y[1]+y[3]),s=m(y[0]+y[2]),w,A,u,D,B,G,C,E,I;e.add(l).add(g).width("auto").height("auto").removeClass("fancybox-tmp");y=m(l.outerWidth(!0)-l.width());w=m(l.outerHeight(!0)-l.height());A=z+y;u=s+w;D=F(c)?(a.w-A)*m(c)/100:c;B=F(k)?(a.h-u)*m(k)/100:k;if("iframe"===h.type){if(I=h.content,h.autoHeight&&1===I.data("ready"))try{I[0].contentWindow.document.location&&(g.width(D).height(9999),G=I.contents().find("body"),r&&G.css("overflow-x", 29 | "hidden"),B=G.outerHeight(!0))}catch(H){}}else if(h.autoWidth||h.autoHeight)g.addClass("fancybox-tmp"),h.autoWidth||g.width(D),h.autoHeight||g.height(B),h.autoWidth&&(D=g.width()),h.autoHeight&&(B=g.height()),g.removeClass("fancybox-tmp");c=m(D);k=m(B);E=D/B;n=m(F(n)?m(n,"w")-A:n);p=m(F(p)?m(p,"w")-A:p);v=m(F(v)?m(v,"h")-u:v);q=m(F(q)?m(q,"h")-u:q);G=p;C=q;h.fitToView&&(p=Math.min(a.w-A,p),q=Math.min(a.h-u,q));A=a.w-z;s=a.h-s;h.aspectRatio?(c>p&&(c=p,k=m(c/E)),k>q&&(k=q,c=m(k*E)),cA||z>s)&&c>n&&k>v&&!(19p&&(c=p,k=m(c/E)),g.width(c).height(k),e.width(c+y),a=e.width(),z=e.height();else c=Math.max(n,Math.min(c,c-(a-A))),k=Math.max(v,Math.min(k,k-(z-s)));r&&"auto"===t&&kA||z>s)&&c>n&&k>v;c=h.aspectRatio?cv&&k
    ').appendTo(d&&d.lenth?d:"body");this.fixed=!1;a.fixed&&b.defaults.fixed&&(this.overlay.addClass("fancybox-overlay-fixed"),this.fixed=!0)},open:function(a){var d=this;a=f.extend({},this.defaults,a);this.overlay?this.overlay.unbind(".overlay").width("auto").height("auto"):this.create(a);this.fixed||(q.bind("resize.overlay",f.proxy(this.update,this)),this.update());a.closeClick&&this.overlay.bind("click.overlay", 40 | function(a){if(f(a.target).hasClass("fancybox-overlay"))return b.isActive?b.close():d.close(),!1});this.overlay.css(a.css).show()},close:function(){q.unbind("resize.overlay");this.el.hasClass("fancybox-lock")&&(f(".fancybox-margin").removeClass("fancybox-margin"),this.el.removeClass("fancybox-lock"),q.scrollTop(this.scrollV).scrollLeft(this.scrollH));f(".fancybox-overlay").remove().hide();f.extend(this,{overlay:null,fixed:!1})},update:function(){var a="100%",b;this.overlay.width(a).height("100%"); 41 | J?(b=Math.max(H.documentElement.offsetWidth,H.body.offsetWidth),p.width()>b&&(a=p.width())):p.width()>q.width()&&(a=p.width());this.overlay.width(a).height(p.height())},onReady:function(a,b){var e=this.overlay;f(".fancybox-overlay").stop(!0,!0);e||this.create(a);a.locked&&this.fixed&&b.fixed&&(b.locked=this.overlay.append(b.wrap),b.fixed=!1);!0===a.showEarly&&this.beforeShow.apply(this,arguments)},beforeShow:function(a,b){b.locked&&!this.el.hasClass("fancybox-lock")&&(!1!==this.fixPosition&&f("*").filter(function(){return"fixed"=== 42 | f(this).css("position")&&!f(this).hasClass("fancybox-overlay")&&!f(this).hasClass("fancybox-wrap")}).addClass("fancybox-margin"),this.el.addClass("fancybox-margin"),this.scrollV=q.scrollTop(),this.scrollH=q.scrollLeft(),this.el.addClass("fancybox-lock"),q.scrollTop(this.scrollV).scrollLeft(this.scrollH));this.open(a)},onUpdate:function(){this.fixed||this.update()},afterClose:function(a){this.overlay&&!b.coming&&this.overlay.fadeOut(a.speedOut,f.proxy(this.close,this))}};b.helpers.title={defaults:{type:"float", 43 | position:"bottom"},beforeShow:function(a){var d=b.current,e=d.title,c=a.type;f.isFunction(e)&&(e=e.call(d.element,d));if(r(e)&&""!==f.trim(e)){d=f('
    '+e+"
    ");switch(c){case "inside":c=b.skin;break;case "outside":c=b.wrap;break;case "over":c=b.inner;break;default:c=b.skin,d.appendTo("body"),J&&d.width(d.width()),d.wrapInner(''),b.current.margin[2]+=Math.abs(m(d.css("margin-bottom")))}d["top"===a.position?"prependTo": 44 | "appendTo"](c)}}};f.fn.fancybox=function(a){var d,e=f(this),c=this.selector||"",l=function(g){var h=f(this).blur(),k=d,l,m;g.ctrlKey||g.altKey||g.shiftKey||g.metaKey||h.is(".fancybox-wrap")||(l=a.groupAttr||"data-fancybox-group",m=h.attr(l),m||(l="rel",m=h.get(0)[l]),m&&""!==m&&"nofollow"!==m&&(h=c.length?f(c):e,h=h.filter("["+l+'="'+m+'"]'),k=h.index(this)),a.index=k,!1!==b.open(h,a)&&g.preventDefault())};a=a||{};d=a.index||0;c&&!1!==a.live?p.undelegate(c,"click.fb-start").delegate(c+":not('.fancybox-item, .fancybox-nav')", 45 | "click.fb-start",l):e.unbind("click.fb-start").bind("click.fb-start",l);this.filter("[data-fancybox-start=1]").trigger("click");return this};p.ready(function(){var a,d;f.scrollbarWidth===w&&(f.scrollbarWidth=function(){var a=f('
    ').appendTo("body"),b=a.children(),b=b.innerWidth()-b.height(99).innerWidth();a.remove();return b});f.support.fixedPosition===w&&(f.support.fixedPosition=function(){var a=f('
    ').appendTo("body"), 46 | b=20===a[0].offsetTop||15===a[0].offsetTop;a.remove();return b}());f.extend(b.defaults,{scrollbarWidth:f.scrollbarWidth(),fixed:f.support.fixedPosition,parent:f("body")});a=f(s).width();K.addClass("fancybox-lock-test");d=f(s).width();K.removeClass("fancybox-lock-test");f("").appendTo("head")})})(window,document,jQuery); -------------------------------------------------------------------------------- /source/img/black.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sun11/hexo-theme-paperbox/167819d3e1f8b0bf3ed499d1e556f4439972ee01/source/img/black.png -------------------------------------------------------------------------------- /source/img/white.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/sun11/hexo-theme-paperbox/167819d3e1f8b0bf3ed499d1e556f4439972ee01/source/img/white.png -------------------------------------------------------------------------------- /source/js/script.js: -------------------------------------------------------------------------------- 1 | (function($){ 2 | /*toTop start*/ 3 | // When to show the scroll link 4 | // higher number = scroll link appears further down the page 5 | var upperLimit = 1000; 6 | // Our scroll link element 7 | var scrollElem = $('#totop'); 8 | // Scroll to top speed 9 | var scrollSpeed = 500; 10 | // Show and hide the scroll to top link based on scroll position 11 | $(window).scroll(function() { 12 | var scrollTop = $(document).scrollTop(); 13 | if (scrollTop > upperLimit) { 14 | $(scrollElem).stop().fadeTo(300, 1); // fade back in 15 | } else { 16 | $(scrollElem).stop().fadeTo(300, 0); // fade out 17 | } 18 | }); 19 | 20 | // Scroll to top animation on click 21 | $(scrollElem).click(function() { 22 | $('html, body').animate({ 23 | scrollTop: 0 24 | }, scrollSpeed); 25 | return false; 26 | }); 27 | /*toTop end*/ 28 | 29 | /*cubeRotate start*/ 30 | var isIE = function(){ 31 | return ("ActiveXObject" in window); 32 | }; 33 | if( isIE() ) { 34 | $('#contenedor').hide(); 35 | } else { 36 | var cube = $('.cube'), 37 | offset = $('#contenedor').offset(), 38 | offsetleft = (offset.left + 50), 39 | offsettop = (offset.top + 50); 40 | 41 | cube.on({ 42 | mousemove: function(e) { 43 | $(this).css('transform','rotateX(' + (e.pageY - offsettop) + 'deg) rotateY(' + (e.pageX - offsetleft) + 'deg)'); 44 | $(this).addClass('noanimar').removeClass('animar'); 45 | }, 46 | mouseout: function() { 47 | $(this).css('transform','rotateX(-25deg) rotateY(32deg)'); 48 | $(this).addClass('animar').removeClass('noanimar'); 49 | } 50 | }); 51 | // console.log('x=' + offsetleft + ', y=' + offsettop); 52 | } 53 | /* cubeRotate end*/ 54 | 55 | // Share 56 | $('body').on('click', function(){ 57 | $('.article-share-box.on').removeClass('on'); 58 | $('.qrcode').hide(); 59 | }).on('click', '.article-share-link', function(e){ 60 | e.stopPropagation(); 61 | 62 | var $this = $(this), 63 | type = $this.attr('data-share'), 64 | offset = $this.offset(); 65 | 66 | var url = $this.attr('data-url'), 67 | encodedUrl = encodeURIComponent(url), 68 | id = 'article-share-box-' + $this.attr('data-id'); 69 | 70 | if ($('#' + id).length){ 71 | var box = $('#' + id); 72 | 73 | if (box.hasClass('on')){ 74 | box.removeClass('on'); 75 | return; 76 | } 77 | } else { 78 | var html = [ 79 | '
    ', 80 | '', 81 | '
    ', 82 | '', 83 | '', 84 | '', 85 | '', 86 | '', 87 | '', 88 | '', 89 | '', 90 | '
    ', 91 | '
    ' 92 | ].join(''); 93 | 94 | var box = $(html); 95 | 96 | $('body').append(box); 97 | } 98 | 99 | box.css({ 100 | top: offset.top + 25, 101 | left: offset.left 102 | }).addClass('on'); 103 | 104 | $('.article-share-weixin').click(function(){ 105 | var e_qrcode = $(this).parents('.article-share-box').next('.qrcode'); 106 | if (e_qrcode.length){ 107 | e_qrcode.show(); 108 | } else { 109 | $(this).parents('.article-share-box').after('
    '); 110 | e_qrcode = $(this).parents('.article-share-box').next('.qrcode'); 111 | e_qrcode.qrcode({ 112 | "render": "div", 113 | "size": 180, 114 | "text": encodeURI(url) 115 | }); 116 | e_qrcode.css({ 117 | top: offset.top + 20, 118 | left: offset.left -150, 119 | }); 120 | } 121 | }); 122 | 123 | }).on('click', '.article-share-box', function(e){ 124 | e.stopPropagation(); 125 | }).on('click', '.article-share-box-input', function(){ 126 | $(this).select(); 127 | }).on('click', '.article-share-box-link', function(e){ 128 | e.preventDefault(); 129 | e.stopPropagation(); 130 | 131 | window.open(this.href, 'article-share-box-window-' + Date.now(), 'width=500,height=450'); 132 | }); 133 | 134 | // Caption 135 | $('.article-entry').each(function(i){ 136 | $(this).find('img').each(function(){ 137 | if ($(this).parent().hasClass('fancybox')) return; 138 | 139 | var alt = this.alt; 140 | 141 | if (alt) $(this).after('' + alt + ''); 142 | 143 | $(this).wrap(''); 144 | }); 145 | 146 | $(this).find('.fancybox').each(function(){ 147 | $(this).attr('rel', 'article' + i); 148 | }); 149 | }); 150 | 151 | if ($.fancybox){ 152 | $('.fancybox').fancybox(); 153 | } 154 | 155 | // Mobile nav 156 | var $container = $('#container'), 157 | isMobileNavAnim = false, 158 | mobileNavAnimDuration = 200; 159 | 160 | var startMobileNavAnim = function(){ 161 | isMobileNavAnim = true; 162 | }; 163 | 164 | var stopMobileNavAnim = function(){ 165 | setTimeout(function(){ 166 | isMobileNavAnim = false; 167 | }, mobileNavAnimDuration); 168 | } 169 | 170 | $('#main-nav-toggle').on('click', function(){ 171 | if (isMobileNavAnim) return; 172 | 173 | startMobileNavAnim(); 174 | $container.toggleClass('mobile-nav-on'); 175 | stopMobileNavAnim(); 176 | }); 177 | 178 | $('#wrap').on('click', function(){ 179 | if (isMobileNavAnim || !$container.hasClass('mobile-nav-on')) return; 180 | 181 | $container.removeClass('mobile-nav-on'); 182 | }); 183 | })(jQuery); 184 | --------------------------------------------------------------------------------