Skip to content

Commit

Permalink
fix the problem of load animation
Browse files Browse the repository at this point in the history
  • Loading branch information
@microud
microud committed May 14, 2016
1 parent 008c546 commit 24d4efe
Show file tree
Hide file tree
Showing 8 changed files with 77 additions and 205 deletions.
62 changes: 32 additions & 30 deletions next-mist/assets/js/bootstrap.js
View file
@@ -1,44 +1,46 @@
/* global NexT: true */
/* global NexT: true */

$(document).ready(function () {
$(document).ready(function () {

$(document).trigger('bootstrap:before');
$(document).trigger('bootstrap:before');

NexT.utils.isMobile() && window.FastClick.attach(document.body);
NexT.utils.isMobile() && window.FastClick.attach(document.body);

NexT.utils.lazyLoadPostsImages();
NexT.utils.lazyLoadPostsImages();

NexT.utils.registerBackToTop();
NexT.utils.registerBackToTop();

$('.site-nav-toggle button').on('click', function () {
var $siteNav = $('.site-nav');
var ON_CLASS_NAME = 'site-nav-on';
var isSiteNavOn = $siteNav.hasClass(ON_CLASS_NAME);
var animateAction = isSiteNavOn ? 'slideUp' : 'slideDown';
var animateCallback = isSiteNavOn ? 'removeClass' : 'addClass';
$('.site-nav-toggle button').on('click', function () {
var $siteNav = $('.site-nav');
var ON_CLASS_NAME = 'site-nav-on';
var isSiteNavOn = $siteNav.hasClass(ON_CLASS_NAME);
var animateAction = isSiteNavOn ? 'slideUp' : 'slideDown';
var animateCallback = isSiteNavOn ? 'removeClass' : 'addClass';

$siteNav.stop()[animateAction]('fast', function () {
$siteNav[animateCallback](ON_CLASS_NAME);
});
});

$siteNav.stop()[animateAction]('fast', function () {
$siteNav[animateCallback](ON_CLASS_NAME);
});
});

CONFIG.fancybox && NexT.utils.wrapImageWithFancyBox();
NexT.utils.embeddedVideoTransformer();
NexT.utils.addActiveClassToMenuItem();

CONFIG.fancybox && NexT.utils.wrapImageWithFancyBox();
NexT.utils.embeddedVideoTransformer();
NexT.utils.addActiveClassToMenuItem();

// Define Motion Sequence.
NexT.motion.integrator
.add(NexT.motion.middleWares.logo)
.add(NexT.motion.middleWares.menu)
.add(NexT.motion.middleWares.postList)
.add(NexT.motion.middleWares.sidebar);

// Define Motion Sequence.
NexT.motion.integrator
.add(NexT.motion.middleWares.logo)
.add(NexT.motion.middleWares.menu)
.add(NexT.motion.middleWares.postList)
.add(NexT.motion.middleWares.sidebar);
$(document).trigger('motion:before');

$(document).trigger('motion:before');
// Bootstrap Motion.
CONFIG.motion && NexT.motion.integrator.bootstrap();

// Bootstrap Motion.
CONFIG.motion && NexT.motion.integrator.bootstrap();
$(document).trigger('bootstrap:after');
//$("#menu").addClass("fadeInDown");

$(document).trigger('bootstrap:after');
});
});
152 changes: 11 additions & 141 deletions next-mist/default.hbs
View file
Expand Up @@ -24,55 +24,21 @@
<link href="{{asset "vendors/font-awesome/css/font-awesome.min.css"}}" rel="stylesheet" type="text/css">
<link href="{{asset "css/main.css"}}" rel="stylesheet" type="text/css">
<script type="text/javascript" src="{{asset "js/jquery.min.js"}}"></script>
<script src="{{asset "js/temp.js"}}></script>
<!-- End Style-->
<!--
<style type="text/css">.MathJax_Preview {color: #888}
#MathJax_Message {position: fixed; left: 1em; bottom: 1.5em; background-color: #E6E6E6; border: 1px solid #959595; margin: 0px; padding: 2px 8px; z-index: 102; color: black; font-size: 80%; width: auto; white-space: nowrap}
#MathJax_MSIE_Frame {position: absolute; top: 0; left: 0; width: 0px; z-index: 101; border: 0px; margin: 0px; padding: 0px}
.MathJax_Error {color: #CC0000; font-style: italic}
</style><style type="text/css">.MathJax_Hover_Frame {border-radius: .25em; -webkit-border-radius: .25em; -moz-border-radius: .25em; -khtml-border-radius: .25em; box-shadow: 0px 0px 15px #83A; -webkit-box-shadow: 0px 0px 15px #83A; -moz-box-shadow: 0px 0px 15px #83A; -khtml-box-shadow: 0px 0px 15px #83A; border: 1px solid #A6D ! important; display: inline-block; position: absolute}
.MathJax_Hover_Arrow {position: absolute; width: 15px; height: 11px; cursor: pointer}
</style>
<style type="text/css">#MathJax_Zoom {position: absolute; background-color: #F0F0F0; overflow: auto; display: block; z-index: 301; padding: .5em; border: 1px solid black; margin: 0; font-weight: normal; font-style: normal; text-align: left; text-indent: 0; text-transform: none; line-height: normal; letter-spacing: normal; word-spacing: normal; word-wrap: normal; white-space: nowrap; float: none; box-shadow: 5px 5px 15px #AAAAAA; -webkit-box-shadow: 5px 5px 15px #AAAAAA; -moz-box-shadow: 5px 5px 15px #AAAAAA; -khtml-box-shadow: 5px 5px 15px #AAAAAA; filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=2, OffY=2, Color='gray', Positive='true')}
#MathJax_ZoomOverlay {position: absolute; left: 0; top: 0; z-index: 300; display: inline-block; width: 100%; height: 100%; border: 0; padding: 0; margin: 0; background-color: white; opacity: 0; filter: alpha(opacity=0)}
#MathJax_ZoomFrame {position: relative; display: inline-block; height: 0; width: 0}
#MathJax_ZoomEventTrap {position: absolute; left: 0; top: 0; z-index: 302; display: inline-block; border: 0; padding: 0; margin: 0; background-color: white; opacity: 0; filter: alpha(opacity=0)}
</style>
<style type="text/css">#MathJax_About {position: fixed; left: 50%; width: auto; text-align: center; border: 3px outset; padding: 1em 2em; background-color: #DDDDDD; color: black; cursor: default; font-family: message-box; font-size: 120%; font-style: normal; text-indent: 0; text-transform: none; line-height: normal; letter-spacing: normal; word-spacing: normal; word-wrap: normal; white-space: nowrap; float: none; z-index: 201; border-radius: 15px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -khtml-border-radius: 15px; box-shadow: 0px 10px 20px #808080; -webkit-box-shadow: 0px 10px 20px #808080; -moz-box-shadow: 0px 10px 20px #808080; -khtml-box-shadow: 0px 10px 20px #808080; filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=2, OffY=2, Color='gray', Positive='true')}
.MathJax_Menu {position: absolute; background-color: white; color: black; width: auto; padding: 5px 0px; border: 1px solid #CCCCCC; margin: 0; cursor: default; font: menu; text-align: left; text-indent: 0; text-transform: none; line-height: normal; letter-spacing: normal; word-spacing: normal; word-wrap: normal; white-space: nowrap; float: none; z-index: 201; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -khtml-border-radius: 5px; box-shadow: 0px 10px 20px #808080; -webkit-box-shadow: 0px 10px 20px #808080; -moz-box-shadow: 0px 10px 20px #808080; -khtml-box-shadow: 0px 10px 20px #808080; filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=2, OffY=2, Color='gray', Positive='true')}
.MathJax_MenuItem {padding: 1px 2em; background: transparent}
.MathJax_MenuArrow {position: absolute; right: .5em; color: #666666}
.MathJax_MenuActive .MathJax_MenuArrow {color: white}
.MathJax_MenuArrow.RTL {left: .5em; right: auto}
.MathJax_MenuCheck {position: absolute; left: .7em}
.MathJax_MenuCheck.RTL {right: .7em; left: auto}
.MathJax_MenuRadioCheck {position: absolute; left: .7em}
.MathJax_MenuRadioCheck.RTL {right: .7em; left: auto}
.MathJax_MenuLabel {padding: 1px 2em 3px 1.33em; font-style: italic}
.MathJax_MenuRule {border-top: 1px solid #DDDDDD; margin: 4px 3px}
.MathJax_MenuDisabled {color: GrayText}
.MathJax_MenuActive {background-color: #606872; color: white}
.MathJax_Menu_Close {position: absolute; width: 31px; height: 31px; top: -15px; left: -15px}
</style>-->
<style type="text/css">.fancybox-margin{margin-right:15px;}</style>
<link type="text/css" rel="stylesheet" href="http://static.duoshuo.com/styles/embed.default.css?9b2a46a0.css">
<link rel="stylesheet" type="text/css" href="//s.swiftypecdn.com/assets/new_embed-508e52cea43e0f8f7a362d4cde82d416.css">
<style type="text/css">.st-install-8Exkz7xsCTJyyCHiK9TY .st-ui-result .st-ui-type-heading { color:#0089d7 !important }
.st-install-8Exkz7xsCTJyyCHiK9TY .st-ui-result em {font-style:normal; font-weight:bold; background-color:#f6fcfe !important}
</style>

{{ghost_head}}
<script type="text/javascript" id="hexo.configuration">
var NexT = window.NexT || {};
var CONFIG = {
scheme: 'Mist',
sidebar: {"position":"left","display":"post"},
fancybox: true,
motion: true,
duoshuo: {
userId: 4141040,
author: '{{author}}'
}
motion: true //,
// duoshuo: {
// userId: 4141040,
// author: ''
//}
};
</script>

Expand All @@ -81,16 +47,15 @@


<body class="{{body_class}}">
<div id="MathJax_Message" style="display: none;"></div>
<div class="container one-collumn sidebar-position-left page-home">
<div class="headband"></div>
<header id="header" class="header" itemscope="" itemtype="http://schema.org/WPHeader">
<div class="header-inner"><div class="site-meta ">
<div class="custom-logo-site-title">
<a href="{{@blog.url}}" class="brand" rel="start" style="opacity: 1;">
<span class="logo-line-before"><i class="" style="transform: translateX(100%);"></i></span>
<span class="site-title" style="opacity: 1; top: 0px;">{{@blog.title}}</span>
<span class="logo-line-after"><i class="" style="transform: translateX(-100%);"></i></span>
<a href="{{@blog.url}}" class="brand" rel="start" >
<span class="logo-line-before "><i class=""></i></span>
<span class="site-title">{{@blog.title}}</span>
<span class="logo-line-after"><i class=""></i></span>
</a>
</div>
</div>
Expand All @@ -107,20 +72,12 @@
<form class="site-search-form">
<input type="text" id="st-search-input" class="st-search-input st-default-search-input" autocomplete="off" autocorrect="off" autocapitalize="off">
</form>
<script type="text/javascript">
(function(w,d,t,u,n,s,e){w['SwiftypeObject']=n;w[n]=w[n]||function(){
(w[n].q=w[n].q||[]).push(arguments);};s=d.createElement(t);
e=d.getElementsByTagName(t)[0];s.async=1;s.src=u;e.parentNode.insertBefore(s,e);
})(window,document,'script','//s.swiftypecdn.com/install/v2/st.js','_st');
<!--install-->_st('install', '8Exkz7xsCTJyyCHiK9TY','2.0.0');
</script>
</div>
</nav>
</div>
</header>
<main id="main" class="main">
<div class="main-inner">
<div class="main-inner ">
{{{body}}}
</div>
</main>
Expand Down Expand Up @@ -155,7 +112,6 @@
<script type="text/javascript" src="{{asset "vendors/jquery_lazyload/jquery.lazyload.js"}}"></script>
<script type="text/javascript" src="{{asset "vendors/fancybox/jquery.fancybox.pack.js"}}"></script>
<script type="text/javascript" src="{{asset "vendors/ua-parser-js/ua-parser.pack.js"}}"></script>
<script type="text/javascript" src="{{asset "vendors/swiftype/st.js"}}"></script>

<script type="text/javascript" src="{{asset "js/motion.js"}}"></script>
<script type="text/javascript" src="{{asset "js/utils.js"}}"></script>
Expand All @@ -165,93 +121,7 @@

<script type="text/javascript" src="{{asset "js/bootstrap.js"}}"></script>

<script>
function showTime(Counter) {
var query = new AV.Query(Counter);
var entries = [];
var $visitors = $(".leancloud_visitors");
$visitors.each(function () {
entries.push( $(this).attr("id").trim() );
});
query.containedIn('url', entries);
query.find()
.done(function (results) {
var COUNT_CONTAINER_REF = '.leancloud-visitors-count';
if (results.length === 0) {
$visitors.find(COUNT_CONTAINER_REF).text(0);
return;
}
for (var i = 0; i < results.length; i++) {
var item = results[i];
var url = item.get('url');
var time = item.get('time');
var element = document.getElementById(url);

$(element).find(COUNT_CONTAINER_REF).text(time);
}
})
.fail(function (object, error) {
console.log("Error: " + error.code + " " + error.message);
});
}
function addCount(Counter) {
var $visitors = $(".leancloud_visitors");
var url = $visitors.attr('id').trim();
var title = $visitors.attr('data-flag-title').trim();
var query = new AV.Query(Counter);
query.equalTo("url", url);
query.find({
success: function(results) {
if (results.length > 0) {
var counter = results[0];
counter.fetchWhenSave(true);
counter.increment("time");
counter.save(null, {
success: function(counter) {
var $element = $(document.getElementById(url));
$element.find('.leancloud-visitors-count').text(counter.get('time'));
},
error: function(counter, error) {
console.log('Failed to save Visitor num, with error message: ' + error.message);
}
});
} else {
var newcounter = new Counter();
newcounter.set("title", title);
newcounter.set("url", url);
newcounter.set("time", 1);
newcounter.save(null, {
success: function(newcounter) {
var $element = $(document.getElementById(url));
$element.find('.leancloud-visitors-count').text(newcounter.get('time'));
},
error: function(newcounter, error) {
console.log('Failed to create');
}
});
}
},
error: function(error) {
console.log('Error:' + error.code + " " + error.message);
}
});
}
$(function() {
var Counter = AV.Object.extend("Counter");
if ($('.leancloud_visitors').length == 1) {
addCount(Counter);
} else if ($('.post-title-link').length > 1) {
showTime(Counter);
}
});
</script>

</body>
</html>
10 changes: 5 additions & 5 deletions next-mist/index.hbs
View file
Expand Up @@ -3,7 +3,7 @@
<div id="content" class="content">
<section id="posts" class="posts-expand">
{{#foreach posts}}
<article class="post posts-type-normal" style="opacity: 1; display: block; transform: translateY(0px);">
<article class="post posts-type-normal">
<header class="post-header">
<h1 class="post-title" itemprop="name headline">
<a class="post-title-link" href="{{url}}">{{{title}}}</a>
Expand All @@ -16,7 +16,7 @@
</span>
<span class="post-category">&nbsp; | &nbsp;
<span class="post-meta-item-icon"><i class="fa fa-folder-o"></i></span>
<span class="post-meta-item-text">分类于</span>
<span class="post-meta-item-text">标签</span>
<span itemprop="about" itemscope="" itemtype="https://schema.org/Thing">
{{#if tags}}
{{tags}}
Expand All @@ -39,9 +39,9 @@
</div>
<div class="sidebar-toggle">
<div class="sidebar-toggle-line-wrap">
<span class="sidebar-toggle-line sidebar-toggle-line-first" style="width: 100%; top: 0px; transform: rotateZ(0deg); opacity: 1; left: 0px;"></span>
<span class="sidebar-toggle-line sidebar-toggle-line-middle" style="width: 100%; opacity: 1; left: 0px; top: 0px; transform: rotateZ(0deg);"></span>
<span class="sidebar-toggle-line sidebar-toggle-line-last" style="width: 100%; top: 0px; transform: rotateZ(0deg); opacity: 1; left: 0px;"></span>
<span class="sidebar-toggle-line sidebar-toggle-line-first"></span>
<span class="sidebar-toggle-line sidebar-toggle-line-middle"></span>
<span class="sidebar-toggle-line sidebar-toggle-line-last" ></span>
</div>
</div>
<aside id="sidebar" class="sidebar" style="display: none; width: 320px;">
Expand Down
8 changes: 4 additions & 4 deletions next-mist/page-about.hbs
View file
Expand Up @@ -4,7 +4,7 @@
<div class="content-wrap page-post-detail">
<div id="content" class="content">
<div id="post" class="posts-expand">
<article class="post post-type-normal" itemscope="" itemtype="http://schema.org/Article" style="opacity: 1; display: block; transform: translateY(0px);">
<article class="post post-type-normal" itemscope="" itemtype="http://schema.org/Article" >
<header class="post-header">
<h1 class="post-title" itemprop="name headline">{{title}}</h1>
</header>
Expand All @@ -19,9 +19,9 @@
{{/post}}
<div class="sidebar-toggle">
<div class="sidebar-toggle-line-wrap">
<span class="sidebar-toggle-line sidebar-toggle-line-first" style="width: 100%; top: 0px; transform: rotateZ(0deg); opacity: 1; left: 0px;"></span>
<span class="sidebar-toggle-line sidebar-toggle-line-middle" style="width: 100%; opacity: 1; left: 0px; top: 0px; transform: rotateZ(0deg);"></span>
<span class="sidebar-toggle-line sidebar-toggle-line-last" style="width: 100%; top: 0px; transform: rotateZ(0deg); opacity: 1; left: 0px;"></span>
<span class="sidebar-toggle-line sidebar-toggle-line-first" ></span>
<span class="sidebar-toggle-line sidebar-toggle-line-middle"></span>
<span class="sidebar-toggle-line sidebar-toggle-line-last"></span>
</div>
</div>
<aside id="sidebar" class="sidebar" style="display: none; width: 320px;">
Expand Down
Empty file added next-mist/page-search.hbs
View file
Empty file.
2 changes: 1 addition & 1 deletion next-mist/partials/navigation.hbs
View file
@@ -1,6 +1,6 @@
<ul id="menu" class="menu menu-left">
{{#foreach navigation}}
<li class="menu-item menu-item-home menu-item-active nav-{{slug}}{{#if current}} nav-current{{/if}}" style="opacity: 1; transform: translateY(0px);" role="presentation">
<li class="menu-item menu-item-home menu-item-active nav-{{slug}}{{#if current}} nav-current{{/if}}" role="presentation">
<a href="{{url absolute="true"}}" rel="section">
<i class="menu-item-icon fa fa-home fa-fw"></i> <br>{{label}}
</a>
Expand Down

0 comments on commit 24d4efe

Please sign in to comment.