新主题

2018-06-06 17:33:48 +08:00
parent de8e1887a6
commit c77caf259f
106 changed files with 28656 additions and 7 deletions
@@ -0,0 +1,95 @@
+function init() {
+    var width, height, largeHeader, canvas, ctx, circles, target, animateHeader = true;
+
+    // Main
+    initHeader();
+    addListeners();
+
+    function initHeader() {
+        width = window.innerWidth;
+        height = window.innerHeight;
+        target = {x: 0, y: height};
+
+        largeHeader = document.getElementById('container');
+        largeHeader.style.height = height+'px';
+
+        canvas = document.getElementById('anm-canvas');
+        canvas.width = width;
+        canvas.height = height;
+        ctx = canvas.getContext('2d');
+
+        // create particles
+        circles = [];
+        for(var x = 0; x < width*0.5; x++) {
+            var c = new Circle();
+            circles.push(c);
+        }
+        animate();
+    }
+
+    // Event handling
+    function addListeners() {
+        window.addEventListener('scroll', scrollCheck);
+        window.addEventListener('resize', resize);
+    }
+
+    function scrollCheck() {
+        if(document.body.scrollTop > height) animateHeader = false;
+        else animateHeader = true;
+    }
+
+    function resize() {
+        width = window.innerWidth;
+        height = window.innerHeight;
+        largeHeader.style.height = height+'px';
+        canvas.width = width;
+        canvas.height = height;
+    }
+
+    function animate() {
+        if(animateHeader) {
+            ctx.clearRect(0,0,width,height);
+            for(var i in circles) {
+                circles[i].draw();
+            }
+        }
+        requestAnimationFrame(animate);
+    }
+
+    // Canvas manipulation
+    function Circle() {
+        var _this = this;
+
+        // constructor
+        (function() {
+            _this.pos = {};
+            init();
+            //console.log(_this);
+        })();
+
+        function init() {
+            _this.pos.x = Math.random()*width;
+            _this.pos.y = height+Math.random()*100;
+            _this.alpha = 0.1+Math.random()*0.3;
+            _this.scale = 0.1+Math.random()*0.3;
+            _this.velocity = Math.random();
+        }
+
+        this.draw = function() {
+            if(_this.alpha <= 0) {
+                init();
+            }
+            _this.pos.y -= _this.velocity;
+            _this.alpha -= 0.0005;
+            ctx.beginPath();
+            ctx.arc(_this.pos.x, _this.pos.y, _this.scale*10, 0, 2 * Math.PI, false);
+            ctx.fillStyle = 'rgba(255,255,255,'+ _this.alpha+')';
+            ctx.fill();
+        };
+    }
+}
+
+
+module.exports = {
+    init: init
+}
@@ -0,0 +1,47 @@
+var backTop = function (domE, ctn, distance) {
+    if (!domE) return;
+    var timer = null;
+    var _onscroll = window.onscroll,
+        _onclick = domE.onclick;
+    (ctn || window).onscroll = throttle(function () {
+        typeof _onscroll === 'function' && _onscroll.apply(this, arguments);
+        toggleDomE();
+    }, 100);
+    domE.onclick = function () {
+        typeof _onclick === 'function' && _onclick.apply(this, arguments);
+        var baseCt = ctn.scrollTop || document.documentElement.scrollTop || document.body.scrollTop;
+        timer = setInterval(function () { //设置一个计时器
+            var ct = ctn.scrollTop || document.documentElement.scrollTop || document.body.scrollTop; //获取距离顶部的距离
+            var diff = Math.max(10, ct / 6);
+            ct -= diff;
+            if (ct > 0) {//如果与顶部的距离大于零
+                ctn.scrollTop = ctn.scrollTop - diff;
+                window.scrollTo(0, ct);//向上移动10px
+            } else {//如果距离小于等于零
+                ctn.scrollTop = 0;
+                window.scrollTo(0, 0);//移动到顶部
+                clearInterval(timer);//清除计时器
+            }
+        }, 10);//隔10ms执行一次前面的function，展现一种平滑滑动效果
+    };
+
+    function toggleDomE() {
+        domE.style.display = (ctn.scrollTop || document.documentElement.scrollTop || document.body.scrollTop) > (distance || 500) ? 'block' : 'none';
+    }
+    function throttle(func, wait) {
+        var timer = null;
+        return function () {
+            var self = this, args = arguments;
+            if (timer) clearTimeout(timer);
+            timer = setTimeout(function () {
+                return typeof func === 'function' && func.apply(self, args);
+            }, wait);
+        }
+    }
+};
+
+function init() {
+    backTop(document.getElementById('js-jump-container'), document.getElementById('container'));
+}
+
+export default { init }
@@ -0,0 +1,20 @@
+var browser = {
+    versions: function() {
+        var u = window.navigator.userAgent;
+        return {
+            trident: u.indexOf('Trident') > -1, //IE内核
+            presto: u.indexOf('Presto') > -1, //opera内核
+            webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
+            gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
+            mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端
+            ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
+            android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或者uc浏览器
+            iPhone: u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1, //是否为iPhone或者安卓QQ浏览器
+            iPad: u.indexOf('iPad') > -1, //是否为iPad
+            webApp: u.indexOf('Safari') == -1, //是否为web应用程序，没有头部与底部
+            weixin: u.indexOf('MicroMessenger') == -1 //是否为微信浏览器
+        };
+    }()
+}
+
+module.exports = browser
@@ -0,0 +1,39 @@
+function init() {
+	// 由于hexo分页不支持，手工美化
+	var $nav = document.querySelector('#page-nav')
+	if ($nav && !document.querySelector('#page-nav .extend.prev')) {
+		$nav.innerHTML = '<a class="extend prev disabled" rel="prev">&laquo; Prev</a>' + $nav.innerHTML
+	}
+	if ($nav && !document.querySelector('#page-nav .extend.next')) {
+		$nav.innerHTML = $nav.innerHTML + '<a class="extend next disabled" rel="next">Next &raquo;</a>'
+	}
+
+	// 新窗口打开
+	if (yiliaConfig && yiliaConfig.open_in_new) {
+		let $a = document.querySelectorAll(('.article-entry a:not(.article-more-a)'))
+		$a.forEach(($em) => {
+			let target = $em.getAttribute('target');
+			if (!target || target === '') {
+				$em.setAttribute('target', '_blank');
+			}
+		})
+	}
+	// 目录序号
+	if (yiliaConfig && yiliaConfig.toc_hide_index) {
+		let $a = document.querySelectorAll(('.toc-number'))
+		$a.forEach(($em) => {
+			$em.style.display = 'none';
+		})
+	}
+
+	// about me 转义
+	var $aboutme = document.querySelector('#js-aboutme')
+	if ($aboutme && $aboutme.length !== 0) {
+		$aboutme.innerHTML = $aboutme.innerText
+	}
+	
+}
+
+module.exports = {
+	init: init
+}
@@ -0,0 +1,18 @@
+// 样式
+import '../css/main.scss'
+// 上报
+// import './report'
+// 图片查看器
+import Viewer from './viewer'
+// 分享
+import Share from './share'
+// 边缘
+import Aside from './aside'
+
+import {addLoadEvent} from './util'
+
+addLoadEvent(function() {
+	Share.init()
+	Viewer.init()
+	Aside.init()
+})
@@ -0,0 +1,104 @@
+import addClass from 'dom101/add-class'
+import removeClass from 'dom101/remove-class'
+import after from 'dom101/after'
+// 浏览器判断
+import Browser from './browser'
+// fix hexo 不支持的配置
+import Fix from './fix'
+
+import {addLoadEvent} from './util'
+
+function isPathMatch(path, href) {
+	let reg = /\/|index.html/g
+	return (path.replace(reg, '')) === (href.replace(reg, ''))
+}
+
+function tabActive() {
+	let $tabs = document.querySelectorAll('.js-header-menu li a')
+	let path = window.location.pathname
+
+	for (var i = 0, len = $tabs.length; i < len; i++) {
+		let $tab = $tabs[i]
+		if (isPathMatch(path, $tab.getAttribute('href'))) {
+			addClass($tab, 'active')
+		}
+	}
+}
+
+function getElementLeft(element) {　　　　
+	var actualLeft = element.offsetLeft;　　　　
+	var current = element.offsetParent;　　　　
+	while (current !== null) {　　　　　　
+		actualLeft += current.offsetLeft;　　　　
+		current = current.offsetParent;　　
+	}　　
+	return actualLeft;
+}　　
+function getElementTop(element) {　　　　
+	var actualTop = element.offsetTop;　　　　
+	var current = element.offsetParent;　　　　
+	while (current !== null) {　　　　　　
+		actualTop += current.offsetTop;　　　　　　
+		current = current.offsetParent;　　　　
+	}　　　　
+	return actualTop;　　
+}
+
+function scrollStop($dom, top, limit, zIndex, diff) {
+	let nowLeft = getElementLeft($dom)
+	let nowTop = getElementTop($dom) - top
+
+	if (nowTop - limit <= diff) {
+		let $newDom = $dom.$newDom
+		if (!$newDom) {
+			$newDom = $dom.cloneNode(true)
+			after($dom, $newDom)
+			$dom.$newDom = $newDom
+			$newDom.style.position = 'fixed'
+			$newDom.style.top = (limit || nowTop) + 'px'
+			$newDom.style.left = nowLeft + 'px'
+			$newDom.style.zIndex = zIndex || 2
+			$newDom.style.width = '100%'
+			$newDom.style.color = '#fff'
+		}
+		$newDom.style.visibility = 'visible'
+		$dom.style.visibility = 'hidden'
+	} else {
+		$dom.style.visibility = 'visible'
+		let $newDom = $dom.$newDom
+		if ($newDom) {
+			$newDom.style.visibility = 'hidden'
+		}
+	}
+}
+
+function handleScroll() {
+	let $overlay = document.querySelector('.js-overlay')
+	let $menu = document.querySelector('.js-header-menu')
+	scrollStop($overlay, document.body.scrollTop, -63, 2, 0)
+	scrollStop($menu, document.body.scrollTop, 1, 3, 0)
+}
+
+function bindScroll() {
+	document.querySelector('#container').addEventListener('scroll', (e) => {
+		handleScroll()
+	})
+
+	window.addEventListener('scroll', (e) => {
+		handleScroll()
+	})
+	handleScroll()
+}
+
+function init() {
+	if (Browser.versions.mobile && window.screen.width < 800) {
+		tabActive()
+		bindScroll()
+	}
+}
+
+init();
+
+addLoadEvent(function() {
+	Fix.init()
+})
@@ -0,0 +1,79 @@
+import addClass from 'dom101/add-class'
+import removeClass from 'dom101/remove-class'
+
+function generate(url, opts) {
+    var url = url.replace(/<%-sUrl%>/g, encodeURIComponent(opts.sUrl))
+        .replace(/<%-sTitle%>/g, opts.sTitle)
+        .replace(/<%-sDesc%>/g, opts.sDesc)
+        .replace(/<%-sPic%>/g, encodeURIComponent(opts.sPic));
+
+    window.open(url);
+}
+
+function showWX() {
+    let $wx = document.querySelector('.js-wx-box')
+    let $mask = document.querySelector('.mask')
+    addClass($wx, 'in')
+    addClass($wx, 'ready')
+    addClass($mask, 'in')
+}
+
+function hideWX() {
+    let $wx = document.querySelector('.js-wx-box')
+    let $mask = document.querySelector('.mask')
+    removeClass($wx, 'in')
+    removeClass($wx, 'ready')
+    removeClass($mask, 'in')
+}
+
+function handleClick(type, opts) {
+	if (type === 'weibo') {
+		generate('http://service.weibo.com/share/share.php?url=<%-sUrl%>&title=<%-sTitle%>&pic=<%-sPic%>', opts)
+	} else if (type === 'qq') {
+		generate('http://connect.qq.com/widget/shareqq/index.html?url=<%-sUrl%>&title=<%-sTitle%>&source=<%-sDesc%>', opts)
+	} else if (type === 'douban') {
+		generate('https://www.douban.com/share/service?image=<%-sPic%>&href=<%-sUrl%>&name=<%-sTitle%>&text=<%-sDesc%>', opts)
+	} else if (type === 'qzone') {
+		generate('http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=<%-sUrl%>&title=<%-sTitle%>&pics=<%-sPic%>&summary=<%-sDesc%>', opts)
+	} else if (type === 'facebook') {
+		generate('https://www.facebook.com/sharer/sharer.php?u=<%-sUrl%>', opts)
+	} else if (type === 'twitter') {
+		generate('https://twitter.com/intent/tweet?text=<%-sTitle%>&url=<%-sUrl%>&via=<%-config.url%>', opts)
+	} else if (type === 'google') {
+		generate('https://plus.google.com/share?url=<%-sUrl%>', opts)
+	} else if (type === 'weixin') {
+		showWX();
+	}
+}
+
+let init = function() {
+    let $sns = document.querySelectorAll('.share-sns');
+    if (!$sns || $sns.length === 0) return;
+
+	let sUrl = window.location.href;
+    let sTitle = document.querySelector('title').innerHTML;
+    let $img = document.querySelectorAll('.article-entry img');
+    let sPic = $img.length ? document.querySelector('.article-entry img').getAttribute('src') : '';
+    if ((sPic !== '') && !/^(http:|https:)?\/\//.test(sPic)) {
+        sPic = window.location.origin + sPic
+    }
+
+    $sns.forEach(($em) => {
+        $em.onclick = (e) => {
+            let type = $em.getAttribute('data-type')
+            handleClick(type, {
+                sUrl: sUrl,
+                sPic: sPic,
+                sTitle: sTitle,
+                sDesc: sTitle
+            })
+        }
+    })
+
+    document.querySelector('.mask').onclick = hideWX
+    document.querySelector('.js-modal-close').onclick = hideWX
+}
+
+module.exports = {
+	init: init
+}
@@ -0,0 +1,130 @@
+// 动画
+import Anm from './anm'
+// 浏览器判断
+import Browser from './browser'
+
+import axios from 'axios'
+import Vue from './vue.min'
+
+const isMobile = (Browser.versions.mobile && window.screen.width < 800)
+
+function fixzero(str) {
+	str = str + ''
+	return str.length === 1 ? '0' + str : str
+}
+
+function setScrollZero() {
+	let $sct = document.querySelectorAll('.tools-section')
+	$sct.forEach((em) => {
+		em.scrollTop = 0
+	})
+}
+let vm = new Vue({
+	el: '#container',
+	data: {
+		isCtnShow: false,
+		isShow: false,
+		items: [],
+		innerArchive: false,
+		friends: false,
+		aboutme: false,
+		jsonFail: false,
+		showTags: false,
+		showCategories: false,
+		search: null
+	},
+	methods: {
+		stop (event) {
+			event.stopPropagation()
+		},
+		chose (name, prefix) {
+			this.search = prefix + name
+		},
+		clearChose () {
+			this.search = null
+		},
+		openSlider (event, type) {
+			event.stopPropagation()
+			this.innerArchive = false
+			this.friends = false
+			this.aboutme = false
+			this[type] = true
+			this.isShow = true
+			this.isCtnShow = true
+			setScrollZero()
+		},
+		hideSlider () {
+			if (this.isShow) {
+				this.isShow = false
+				setTimeout(() => {
+					this.isCtnShow = false
+				}, 300)
+			}
+		}
+	},
+	filters: {
+		urlformat: (str) => {
+			if (window.yiliaConfig && window.yiliaConfig.root) {
+				return window.yiliaConfig.root + str
+			}
+			return '/' + str
+		},
+		dateformat: (str) => {
+			let d = new Date(str)
+			return d.getFullYear() + '-' + fixzero((d.getMonth() + 1)) + '-' + fixzero(d.getDate())
+		}
+	},
+	watch: {
+		search (newVal, oldVal) {
+			if(newVal) {
+				handleSearch.call(this, newVal.toLowerCase())
+			} else {
+				this.items.forEach(function(item){
+					item.isHide = false
+				})
+			}
+		}
+	},
+	mounted () {
+		axios.get(window.yiliaConfig.root + 'content.json?t=' + (+ new Date()))
+		.then((res)=>{
+			this.items = res.data
+		}).catch((err) => {
+			this.jsonFail = true
+		})
+	}
+})
+
+function handleSearch(val) {
+	var type
+	if (val.startsWith('#')) {
+		val = val.substr(1, val.length)
+		type = 'tag'
+	} else if (val.startsWith('$')) {
+		val = val.substr(1, val.length)
+		type = 'category'
+	} else {
+		type = 'title'
+	}
+	this.items.forEach((item) => {
+		switch(type) {
+		case 'title' : 
+			item.isHide = item.title.toLowerCase().indexOf(val) < 0
+			break
+		case 'tag' : 
+			item.isHide = Array.prototype.every.call(item.tags, function(tag){
+				return tag.name.toLowerCase().indexOf(val) < 0
+			})
+			break
+		case 'category' : 
+			item.isHide = Array.prototype.every.call(item.categories, function(category){
+				return category.name.toLowerCase().indexOf(val) < 0
+			})
+			break
+		}
+	})
+}
+
+if (!isMobile) {
+	Anm.init()
+}
@@ -0,0 +1,89 @@
+var e = function() {
+    function r(e, r, n) {
+        return r || n ? String.fromCharCode(r || n) : u[e] || e
+    }
+    function n(e) {
+        return p[e]
+    }
+    var t = /&quot;|&lt;|&gt;|&amp;|&nbsp;|&apos;|&#(\d+);|&#(\d+)/g
+      , o = /['<> "&]/g
+      , u = {
+        "&quot;": '"',
+        "&lt;": "<",
+        "&gt;": ">",
+        "&amp;": "&",
+        "&nbsp;": " "
+    }
+      , c = /\u00a0/g
+      , a = /<br\s*\/?>/gi
+      , i = /\r?\n/g
+      , f = /\s/g
+      , p = {};
+    for (var s in u)
+        p[u[s]] = s;
+    return u["&apos;"] = "'",
+    p["'"] = "&#39;",
+    {
+        encode: function(e) {
+            return e ? ("" + e).replace(o, n).replace(i, "<br/>").replace(f, "&nbsp;") : ""
+        },
+        decode: function(e) {
+            return e ? ("" + e).replace(a, "\n").replace(t, r).replace(c, " ") : ""
+        },
+        encodeBase16: function(e) {
+            if (!e)
+                return e;
+            e += "";
+            for (var r = [], n = 0, t = e.length; t > n; n++)
+                r.push(e.charCodeAt(n).toString(16).toUpperCase());
+            return r.join("")
+        },
+        encodeBase16forJSON: function(e) {
+            if (!e)
+                return e;
+            e = e.replace(/[\u4E00-\u9FBF]/gi, function(e) {
+                return escape(e).replace("%u", "\\u")
+            });
+            for (var r = [], n = 0, t = e.length; t > n; n++)
+                r.push(e.charCodeAt(n).toString(16).toUpperCase());
+            return r.join("")
+        },
+        decodeBase16: function(e) {
+            if (!e)
+                return e;
+            e += "";
+            for (var r = [], n = 0, t = e.length; t > n; n += 2)
+                r.push(String.fromCharCode("0x" + e.slice(n, n + 2)));
+            return r.join("")
+        },
+        encodeObject: function(r) {
+            if (r instanceof Array)
+                for (var n = 0, t = r.length; t > n; n++)
+                    r[n] = e.encodeObject(r[n]);
+            else if ("object" == typeof r)
+                for (var o in r)
+                    r[o] = e.encodeObject(r[o]);
+            else if ("string" == typeof r)
+                return e.encode(r);
+            return r
+        },
+        loadScript: function(path) {
+            var $script = document.createElement('script')
+            document.getElementsByTagName('body')[0].appendChild($script)
+            $script.setAttribute('src', path)
+        },
+        addLoadEvent: function(func){
+            var oldonload = window.onload;
+            if (typeof window.onload!="function") {
+                window.onload = func;
+            } else {
+                window.onload = function() {
+                    oldonload();
+                    func();
+                }
+            }
+        }
+    }
+}();
+
+module.exports = e
@@ -0,0 +1,44 @@
+
+import PhotoSwipe from 'photoswipe'
+import PhotoSwipeUI_Default from 'photoswipe/dist/photoswipe-ui-default'
+import 'photoswipe/dist/default-skin/default-skin.css'
+import 'photoswipe/dist/photoswipe.css'
+
+window.PhotoSwipe = PhotoSwipe
+window.PhotoSwipeUI_Default = PhotoSwipeUI_Default
+
+function init() {
+	let pswpElement = document.querySelectorAll('.pswp')[0];
+	let $imgArr = document.querySelectorAll(('.article-entry img:not(.reward-img)'))
+
+	$imgArr.forEach(($em, i) => {
+		$em.onclick = () => {
+			// slider展开状态
+			// todo: 这样不好，后面改成状态
+			if (document.querySelector('.left-col.show')) return
+			let items = []
+			$imgArr.forEach(($em2, i2) => {
+				let img = $em2.getAttribute('data-idx', i2)
+				let src = $em2.getAttribute('data-target') || $em2.getAttribute('src')
+				let title = $em2.getAttribute('alt')
+				// 获得原图尺寸
+				const image = new Image()
+				image.src = src
+				items.push({
+					src: src,
+					w: image.width || $em2.width,
+					h: image.height || $em2.height,
+					title: title
+				})
+			})
+			var gallery = new PhotoSwipe(pswpElement, PhotoSwipeUI_Default, items, {
+				index: parseInt(i)
+			});
+			gallery.init()
+		}
+	})
+}
+
+module.exports = {
+	init: init
+}