Skip to content

Commit

Permalink
v0.8.26 开发完成
Browse files Browse the repository at this point in the history
  • Loading branch information
iinterest committed Jan 9, 2014
1 parent efd2386 commit 6b17c01
Show file tree
Hide file tree
Showing 22 changed files with 3,096 additions and 514 deletions.
File renamed without changes.
476 changes: 0 additions & 476 deletions build/css/squirrel.css

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions dist/css/squirrel-min.css

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/js/squirrel-min.js

Large diffs are not rendered by default.

11 changes: 11 additions & 0 deletions docs/changelog.html
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,14 @@
<h3>更新说明</h3>
<div class="change-log">
<div class="version active">
<h4>v0.8.26</h4>
<ul>
<li class="add">框架内置插件支持 CMD 模块化加载。</li>
<li class="up">框架目录结构调整。</li>
</ul>
<div class="data">2014-1-9</div>
</div>
<div class="version">
<h4>v0.8.25</h4>
<ul>
<li class="del">清除 SQ.dom 核心。</li>
Expand Down Expand Up @@ -149,6 +157,9 @@ <h4>v0.8.0</h4>
</ul>
<div class="data">2013-07-09</div>
</div>
<div class="version beta3">
<h4>Squirrel 3 beta</h4>
</div>
</div>
<p></p>
</section>
Expand Down
65 changes: 46 additions & 19 deletions docs/guide.html
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@
<ul class="anchor">
<li class="level-1"><a href="#">快速起步</a></li>
<li class="level-1"><a href="#project">安装工程套件</a></li>
<li class="level-1"><a href="#cmd">模块化加载</a></li>
<li class="level-1"><a href="#howtouse">使用组件、插件</a></li>
<li class="level-1"><a href="#broswer">浏览器支持</a></li>
</ul>
Expand Down Expand Up @@ -70,28 +71,54 @@ <h3 id="project">安装工程套件</h3>
<p>安装完成后可以看到以下目录结构:</p>
<div class="markdown">
<pre><code> Squirrel-pt/
├── app/ (应用目录)
│ ├── dist/ (构建代码)
│ │ ├── css/
│ │ ├── js/
│ │ ├── images/
│ │ ├── font/
│ ├── src/ (源码)
│ │ ├── less/
│ │ ├── js/
│ ├── index.html
├── cmd_modules/ (模块代码)
├── dist/ (构建代码)
│ ├── css/
│ ├── js/
│ ├── images/
│ ├── font/
├── Gruntfile.js
├── index.html
├── libs/ (第三方 JS 类库)
│ ├── zepto/
│ │ ├── zepto-1.0.min.js
├── test/ (单元测试)
├── tools/ (自动化构建工具)
│ ├── grunt/
└── index.html</code></pre>
│ ├── sea.js/
│ ├── zepto.min.js/
├── package.json
├── src/ (源码)
│ ├── less/
│ ├── js/
└── test/ (单元测试)</code></pre>
</div>
<p>在工程的<code>grunt</code>目录下可以执行 Grunt 命令:</p>
<p>安装 Nodejs 组件</p>
<pre class="prettyprint">npm install</pre>
<p>根据项目需求手动修改 package.json 配置文件</p>
<pre class="prettyprint">{
"name": "Squirrel", // 项目名称
"description": "Mobile Web Framwork", // 项目描述
"version": "0.0.1", // 版本
"isCMD": true, // 是否启用 CMD 模式
......
}
</pre>
<p>在工程目录下可以执行 Grunt 命令:</p>
<pre class="prettyprint">grunt build // 执行构建
grunt watch // 监视文件,发现变化自动构建
grunt jsdocs // 生成 JSDoc 模板</pre>
grunt watch // 监视文件,发现变化自动构建</pre>
</section>
<section class="dpl-module">
<h3 id="cmd">模块化加载</h3>
<p>v0.8.26 版本以后开始支持模块化加载,可以按需加载模块,例如添加框架的选项卡模块<code>SQ.Tabs</code>,编辑<code>src/js/main.js</code>文件:</p>
<pre class="prettyprint">(function () {
var SQ = window.SQ || {};
SQ.Tabs = require("tabs"); // 加载 tabs 模块

var tabs = new SQ.Tabs({
EVE_EVENT_TYPE : "mouseover",
DOM_TRIGGER_TARGET : ".J_tabs",
DOM_TABS : ".tabs>li",
DOM_PANELS : ".panels",
NUM_ACTIVE : 0
});
}());</pre>
<p>然后通过 Grunt 构建工具即可生成所需代码。</p>
</section>
<section class="dpl-module">
<h3 id="howtouse">使用组件、插件</h3>
Expand Down
3 changes: 2 additions & 1 deletion docs/static/dpl-famework.css
Original file line number Diff line number Diff line change
Expand Up @@ -340,7 +340,8 @@ blockquote{ margin:20px 0; padding-left:20px; border-left:6px solid #d7d7d7; fon
.change-log .version.build{ border-left-color:#ff6600;}
.change-log .version.hotfix h4::after{ content:"Hotfix"; display:inline-block; padding:0 4px; background:#d10000; border-radius:3px; color:#fff; font-weight:normal; -webkit-transform: scale(0.81);}
.change-log .version a[href*="github"]{ display:inline-block; padding:0 4px 0 4px; background:#f7f7f7; border-radius:2px;}
.change-log h4{ float:left; width:70px; height:40px; padding:10px 0 10px 10px; line-height:20px;}
.change-log .beta3 h4{ width:100%;}
.change-log h4{ float:left; width:70px; height:20px; padding:10px 0 10px 10px; line-height:20px;}
.change-log ul{ float:left; padding:10px;}
.change-log li{ position:relative; width:540px; margin:2px 0; padding-left:20px; line-height:1.4;}
.change-log .data{ position:absolute; top:0; right:0; width:80px; height:20px; text-align:center; line-height:20px; background:#e7e7e7; color:#999; font-size:12px; border-radius:0 0 0 2px;}
Expand Down
22 changes: 11 additions & 11 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -32,8 +32,8 @@ <h1>Squirrel 3<sup>Beta</sup></h1>
<a class="fw-btn download-btn red" href="https://github.com/iinterest/Squirrel-3/releases" target="_blank">下载 Squirrel</a>
<a class="fw-btn doc-btn orange" href="docs/documentation.html">使用指南</a>
<ul class="version">
<li>最新版本:0.8.25</li>
<li>更新时间:2014-1-2</li>
<li>最新版本:0.8.26</li>
<li>更新时间:2014-1-9</li>
<li><a href="docs/changelog.html" target="_top">更新说明</a></li>
</ul>
</div>
Expand Down Expand Up @@ -89,6 +89,15 @@ <h3>定制</h3>
<p>提供定制工具,可以根据实际需要灵活的定制内容,按需最小化加载组件及插件。</p>
</div>
</li>
<li>
<div class="icon cmd">
<i class="fa">CMD</i>
</div>
<div class="introduc">
<h3>模块化</h3>
<p>遵循 CMD 规范,借助 Sea.js 可以按需最小化加载组件及插件。</p>
</div>
</li>
<li>
<div class="icon less">
<i class="fa">{LESS}</i>
Expand All @@ -107,15 +116,6 @@ <h3>开源</h3>
<p>Squirrel 框架遵循 MIT 协议,无论公司还是个人,都可以免费自由使用。</p>
</div>
</li>
<!--<li>
<div class="icon cmd">
<i class="fa">CMD</i>
</div>
<div class="introduc">
<h3>模块化</h3>
<p>遵循 CMD 规范,借助 Sea.js 可以按需最小化加载组件及插件,同时也能够方便的构建并管理自定义模块。</p>
</div>
</li>-->
</ul>
</div>
</div>
Expand Down

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

10 changes: 6 additions & 4 deletions tools/grunt/package.json → package.json
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
{
"name": "squirrel",
"version": "0.8.25",
"description": "移动前端开发框架,让移动 Web 应用开发更加简单、迅速",
"version": "0.8.26",
"description": "移动前端开发框架,提供简单、快速的 Web 开发体验",
"dirs": {
"base": "../..",
"base": ".",
"js_src": "src/js",
"js_build": "build/js",
"js_dist": "dist/js",
Expand All @@ -22,6 +22,8 @@
"grunt-open": "~0.2.2",
"grunt-notify": "~0.2.16",
"grunt-contrib-copy": "~0.4.1",
"grunt-autoprefixer": "~0.5.0"
"grunt-autoprefixer": "~0.5.0",
"grunt-cmd-transport": "~0.4.1",
"grunt-cmd-concat": "~0.2.7"
}
}
127 changes: 127 additions & 0 deletions src/cmd_modules/button/button.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,127 @@
/**
* @file Squirrel Button
* @version 0.1.2
*/

/**
* @changelog
* 0.1.2 * 修复 jshint 问题
* 0.1.1 + 新增 menu 交互模式
* 0.0.1 + 新建
*/
define(function(require, exports, module) {
"use strict";
var SQ = require("core");
/**
* @name Button
* @classdesc 选项卡交互组件
* @constructor
* @param {object} config 组件配置(下面的参数为配置项,配置会写入属性)
* @param {string} config.EVE_EVENT_TYPE 触发事件,click 或 mouseover
* @param {string} config.DOM_TRIGGER_TARGET 被绑定事件的 Dom 元素
* @param {string} config.MODE 交互模式
*/
function Button(config) {
var me = this;
var i;

me.config = {
TXT_LOADING_TIP : "正在加载请稍后..." // 正在加载提示
};

for (i in config) {
if (config.hasOwnProperty(i)) {
me.config[i] = config[i];
}
}

me.$triggerTarget = $(me.config.DOM_TRIGGER_TARGET); // 目标元素

if (me._verify()) {
me._init();
}
}
Button.prototype = {
construtor: Button,
version: "0.1.2",
//state: "init",

// 验证参数是否合法
_verify : function () {
return true;
},
_init : function () {
var me = this;
// menu 模式
if (me.config.MODE === "menu") {
me.$triggerTarget.on(me.config.EVE_EVENT_TYPE, function () {
me.menu();
});
}
},
// 改变按钮状态
setState : function (state) {
var me = this;
//me.state = state;
if (state === "active") {
me.$triggerTarget.addClass("active");
}
if (state === "init") {
me.$triggerTarget.removeClass("active");
}

},
// 按钮菜单效果
menu : function () {
var me = this;
var $menuBtns = $(".J_buttonMenu");
var $menu = me.$triggerTarget.find(".menu");
var $menus = $menuBtns.find(".menu");
var $doc = $(document);

function _resetAll() {
$menus.hide();
$menuBtns.removeClass("active");
}
function _showMenu() {
_resetAll();
$menu.show();
me.setState("active");
$doc.on("click", function (e) {
var $target = $(e.target);
if (!$target.hasClass("sq-btn") && $target.parents(".sq-btn").length === 0) {
_hideMenu();
}
});
}
function _hideMenu() {
$menu.hide();
me.setState("init");
$doc.off("click");
}

if (!me.$triggerTarget.hasClass("active")) {
_showMenu();
} else {
_hideMenu();
}
},
// 按钮开关效果
toggle : function () {
//var me = this;

}
};
module.exports = Button;

// 初始化菜单类型按钮
$(".J_buttonMenu").each(function () {
var $me = $(this);
var button = new Button({
EVE_EVENT_TYPE : "click",
DOM_TRIGGER_TARGET : $me,
MODE : "menu",
CSS_STYLE : ""
});
});
});
Loading

0 comments on commit 6b17c01

Please sign in to comment.