Skip to content

Commit

Permalink
1、note页面效果优化
Browse files Browse the repository at this point in the history
2、qrcode页面优化,添加链接之后关闭
3、双屏下一页不能单条显示
4、摇一摇优化
  • Loading branch information
ksky521 committed Jul 19, 2014
1 parent 582f891 commit 57c1d95
Show file tree
Hide file tree
Showing 10 changed files with 173 additions and 79 deletions.
2 changes: 1 addition & 1 deletion assets/css/nodeppt2.0.css

Large diffs are not rendered by default.

5 changes: 3 additions & 2 deletions assets/js/nodeppt.control.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,8 @@
function doItem(id, itemID) {
itemID = itemID | 0;
var $curSlide = $slides[id];
var toBuild = $curSlide.querySelectorAll('.build > *');
var buildClass = '.build > *,.fadeIn > *,.moveIn > *,.bounceIn > *,.zoomIn > *';
var toBuild = $curSlide.querySelectorAll(buildClass);
var list;
var index = itemID;

Expand Down Expand Up @@ -106,7 +107,7 @@
Slide.Control.methods[type].init(args);
});
}
}
};
Control.init();
Slide.Control = Control;
}(window, document, MixJS.event.broadcast, Slide, MixJS.loadJS));
25 changes: 15 additions & 10 deletions assets/js/nodeppt.control.socket.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ Slide.Control.add('socket', function(S, broadcast) {
time = '00' + time;
return time.substr(-2);
}
var showQrcode;
var qrcodeLink = function() {
//按 q显示控制区域二维码
document.addEventListener('keydown', function(e) {
Expand All @@ -22,17 +23,17 @@ Slide.Control.add('socket', function(S, broadcast) {
$body.appendChild($layer);
var $container = document.getElementById('container');

function showQrcode(e) {
showQrcode = function (e) {
if (showQrcode.isShow) {
$container.style.display = 'block';
// $container.style.display = 'block';
$layer.style.display = 'none';
showQrcode.isShow = false;
} else {
$container.style.display = 'none';
// $container.style.display = 'none';
$layer.style.display = 'block';
showQrcode.isShow = true;
}
}
};
};

var webSocket;
Expand Down Expand Up @@ -111,7 +112,10 @@ Slide.Control.add('socket', function(S, broadcast) {
}
});
webSocket.on('system', function(data) {
console.log(data);
// console.log(data);
if(showQrcode && showQrcode.isShow){
showQrcode();
}
});

this[this.role + 'Connect']();
Expand Down Expand Up @@ -170,14 +174,15 @@ Slide.Control.add('socket', function(S, broadcast) {
if (args.shake) {
//添加shake
MixJS.loadJS(Slide.dir + 'shake.js', function() {
var lastTime = +new Date;
addShakeEvent(function() {
var now = +new Date;
if (now - lastTime > 1000) {
var lastTime = Date.now();
window.addEventListener('shake', function(){
var now = Date.now();
if (now - lastTime > 3000) {
lastTime = now;
Slide.next();
}
});
}, true);

});
}

Expand Down
2 changes: 1 addition & 1 deletion assets/js/nodeppt.js
Original file line number Diff line number Diff line change
Expand Up @@ -130,7 +130,7 @@
//将该标签删除,释放内存
tmpNode.parentNode && tmpNode.parentNode.removeChild(tmpNode);
tmpNode = null;
}
};
}(tmpNode));
}
}
Expand Down
142 changes: 111 additions & 31 deletions assets/js/shake.js
Original file line number Diff line number Diff line change
@@ -1,44 +1,124 @@
(function(window, document) {
if (window.DeviceMotionEvent) {
window.addEventListener('devicemotion', deviceMotionHandler, false);
(function (window, document) {

/**
* from :https://github.com/alexgibson/shake.js/blob/master/shake.js
*
*/
/**
* 摇一摇实现-抽奖游戏
* @global
* @class Shake
*
* @example
* ```html
* <script src="../output/template/common/bdbox/game/shake.js"></script>
* <script>
* window.addEventListener('shake', shakeEventDidOccur, false);
* function shakeEventDidOccur () {
* alert('被摇了');
* }
* </script>
* ```
*/
function Shake() {

//feature detect
this.hasDeviceMotion = 'ondevicemotion' in window;

//default velocity threshold for shake to register
this.threshold = 15;

//use date to prevent multiple shakes firing
this.lastTime = new Date();

//accelerometer values
this.lastX = null;
this.lastY = null;
this.lastZ = null;

//create custom event
if (typeof document.CustomEvent === "function") {
this.event = new document.CustomEvent('shake', {
bubbles: true,
cancelable: true
});
} else if (typeof document.createEvent === "function") {
this.event = document.createEvent('Event');
this.event.initEvent('shake', true, true);
} else {
return false;
}
}

var SHAKE_THRESHOLD = 1500;
var lastUpdate = 0;
var x, y, z, last_x, last_y, last_z;
var shakeEvent = [];
//reset timer values
Shake.prototype.reset = function () {
this.lastTime = new Date();
this.lastX = null;
this.lastY = null;
this.lastZ = null;
};

//start listening for devicemotion
Shake.prototype.start = function () {
this.reset();
if (this.hasDeviceMotion) { window.addEventListener('devicemotion', this, false); }
};

//stop listening for devicemotion
Shake.prototype.stop = function () {

function deviceMotionHandler(eventData) {
// Grab the acceleration including gravity from the results
var acceleration = eventData.accelerationIncludingGravity;
if (this.hasDeviceMotion) { window.removeEventListener('devicemotion', this, false); }
this.reset();
};

var curTime = +new Date();
//calculates if shake did occur
Shake.prototype.devicemotion = function (e) {

if ((curTime - lastUpdate) > 100) {
var current = e.accelerationIncludingGravity,
currentTime,
timeDifference,
deltaX = 0,
deltaY = 0,
deltaZ = 0;

var diffTime = (curTime - lastUpdate);
lastUpdate = curTime;
if ((this.lastX === null) && (this.lastY === null) && (this.lastZ === null)) {
this.lastX = current.x;
this.lastY = current.y;
this.lastZ = current.z;
return;
}

deltaX = Math.abs(this.lastX - current.x);
deltaY = Math.abs(this.lastY - current.y);
deltaZ = Math.abs(this.lastZ - current.z);

x = acceleration.x;
y = acceleration.y;
z = acceleration.z;
if (((deltaX > this.threshold) && (deltaY > this.threshold)) || ((deltaX > this.threshold) && (deltaZ > this.threshold)) || ((deltaY > this.threshold) && (deltaZ > this.threshold))) {
//calculate time in milliseconds since last shake registered
currentTime = new Date();
timeDifference = currentTime.getTime() - this.lastTime.getTime();

var speed = Math.abs(x + y + z - last_x - last_y - last_z) / diffTime * 10000;
if (speed > SHAKE_THRESHOLD) {
shakeEvent.forEach(function(v) {
if (typeof v === 'function') {
v();
}
});
if (timeDifference > 1000) {
window.dispatchEvent(this.event);
this.lastTime = new Date();
}
last_x = x;
last_y = y;
last_z = z;
}

this.lastX = current.x;
this.lastY = current.y;
this.lastZ = current.z;

};

//event handler
Shake.prototype.handleEvent = function (e) {

if (typeof (this[e.type]) === 'function') {
return this[e.type](e);
}
};

//create a new instance of shake.js.
var myShakeEvent = new Shake();
myShakeEvent.start();

}
window.addShakeEvent = function(fn) {
shakeEvent.push(fn);
}
}(window, document));
38 changes: 23 additions & 15 deletions assets/scss/nodeppt2.0.scss
Original file line number Diff line number Diff line change
Expand Up @@ -228,13 +228,7 @@ slides > slide .slide-wrapper{
max-width: $slide-width-widescreen - $slide-left-right-padding*2;
max-height: $slide-height - $slide-top-bottom-padding*2;
}
.note{
color: $gray-2;
h1,h2,h3,h4{
color: black;
@include text-shadow(none);
}
}

blockquote {
font-size: 28px;
line-height: 1.5em;
Expand Down Expand Up @@ -385,6 +379,14 @@ slides > slide {
&:nth-child(6n+5){
background-color: #f68dbb
}

.note{
color: $gray-2;
h1,h2,h3,h4{
color: black;
@include text-shadow(none);
}
}
}


Expand Down Expand Up @@ -1241,22 +1243,28 @@ aside.gdbar {
.qrcode{
display: none;
position: fixed;
width:300px;
height:300px;
left:50%;
top:20%;
margin-left:-170px;
background:white;
padding:20px;
width:100%;
height:100%;
left:0;
top:0;
background: rgba(0,0,0,0.5);

#qrcode{
width:256px;
height:256px;
height:300px;
vertical-align: middle;
margin:0 auto;
position: relative;
background-color: white;
padding: 20px 20px 10px;
top: 100px;
}
p{
text-align: center;
line-height: 44px;
position: absolute;
top: 380px;
width: 100%;
}
}

Expand Down
2 changes: 1 addition & 1 deletion lib/md_parser.js
Original file line number Diff line number Diff line change
Expand Up @@ -207,7 +207,7 @@ function parse(str, note, sAttrs) {
tagStart = '<slide class="' + cls + '" ' + sAttrs + '>';
// console.log(tagStart);
}
return tagStart + '<section class="slide-wrapper">' + note + content + '</section></slide>';
return tagStart + note +'<section class="slide-wrapper">' + content + '</section></slide>';
}

function doAttr(str, isArticle, noHead) {
Expand Down
6 changes: 3 additions & 3 deletions lib/server.js
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,7 @@ module.exports.start = function(port, pptDir, host, argvObj) {
});
});

}
};

function startApp(port, dir, host, argvObj) {
host = host || '0.0.0.0';
Expand Down Expand Up @@ -136,7 +136,7 @@ function startApp(port, dir, host, argvObj) {
pptlist(res, pptDir, argvObj);
return;
} else if (dirname === '/md') {
var uid = req.session.uid;
uid = req.session.uid;
if (!uid) {
uid = now++; //当前连接用户的UID
req.session.uid = uid;
Expand Down Expand Up @@ -289,7 +289,7 @@ function pptlist(res, dir, argvObj) {
}
var url = '/md/' + filename;
list += '<li><a class="star" href="' + url + '" target="_blank">' + title + '</a>';
list += (argvObj.controller === 'socket' ? '' : '&nbsp; [<a href="' + url + '?_multiscreen=1" target="_blank" title="多窗口打开">多窗口</a>]') + '</li>';
list += (argvObj.controller === 'socket' ? '' : '&nbsp; [<a href="' + url + '?_multiscreen=1" target="_blank" title="多窗口打开">多窗口</a>]&nbsp; [<a href="' + url + '?controller=socket" target="_blank" title="用socket远程控制">远程控制</a>]') + '</li>';
}, '', '', function(filename) {
return /\.(md|markdown)$/.test(filename);
});
Expand Down
4 changes: 2 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
{
"name": "nodeppt",
"jsname": "nodeppt",
"description": "Create a PowerPoint presentation with Markdown",
"version": "0.8.0",
"description": "A simple, in-browser, markdown-driven presentation tool",
"version": "0.8.1",
"site": "https://github.com/ksky521/nodePPT",
"author": {
"name": "Theo Wang",
Expand Down
Loading

0 comments on commit 57c1d95

Please sign in to comment.