diff --git a/CHANGELOG.md b/CHANGELOG.md index 1d77eed977b660c9b8fad6506c3a32aacb7074fb..815e44a72b8a4fc73c8558cb6f7e6c8a558b0b7a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,19 +1,29 @@ # Amaze UI Change Log --- -## 2014.09 W4 -### Build 文件 +### 2014.09 W5 + +- `NEW` 文档标题添加链接按钮； +- `FIXED` #103 #17 Modal 关闭打开/关闭时间间隔过短操作失效问题； +- `NEW` FastClick 升级到 `1.0.3`； +- `IMPROVED` 调整 FastClick 加载模式，解决在 Chrome 模拟器中链接不能点击的问题； + +## Amaze UI v1.0.0-beta2 + +### 2014.09 W4 + +#### Build 文件 - 文件名与项目名称统一； - 增加 `basic`、`widgets` 两个版本供用户选择； - 上传到 [http://staticfile.org/](http://staticfile.org/)，搜索 amazeui 查看相关文件链接。 -### 官网 +#### 官网 - 优化左侧菜单固定效果，菜单高度超过窗口高度时增加滚动条。 -### CSS +#### CSS - 重新样式梳理 `z-index`； @@ -40,7 +50,7 @@ __Input Group__： - `IMPROVED` 处理不同尺寸垂直对齐问题。 -### JS 插件 +#### JS 插件 __Button__： @@ -71,7 +81,7 @@ __Tabs__： - `IMPROVED` #96 改进触控事件处理逻辑，避免标签中有 DOM 元素时触控失效问题。 -### Web 组件 +#### Web 组件 - 重新样式梳理 `z-index`； @@ -89,9 +99,9 @@ __Gallery__： - `IMPROVED` PureView 调用逻辑增强，判断是否设置了 PureView 的选项。 -## 2014.09 W3 +### 2014.09 W3 -### CSS +#### CSS __Badge__： @@ -105,7 +115,7 @@ __Topbar__： - `NEW` 增加顶部/底部固定样式。 -### JS 插件 +#### JS 插件 __Dropdown__: @@ -140,7 +150,7 @@ __Progress__： - `CHANGED` 样式主色调整为绿色。 -### Web 组件 +#### Web 组件 __Gotop__： @@ -156,7 +166,7 @@ __Tabs__： - `IMPROVED` #72 使用 `flexbox` 实现均分，提高微信 webview 兼容性。 -## 2014.09 W2 +### 2014.09 W2 __CSS__： @@ -180,7 +190,7 @@ __Web 组件__： - `IMPROVED` Paragraph 使用 PureView 插件； - `CHANGED` 移除 Navbar `package.json` 中图标位置设置选项； -## 2014.09 W1 +### 2014.09 W1 __JS 插件__： @@ -192,7 +202,7 @@ __Navbar 组件__： - `FIXED` 修复二维码 URL。 -## 2014.08 W4 +### 2014.08 W4 __Navbar 组件__： @@ -219,23 +229,23 @@ __布局示例__： - 调整路径，下载包中 Amaze UI 相关的资源使用本地文件。 -## 2014.08 W3 +### 2014.08 W3 -### 官网 +#### 官网 - 首页增加更新订阅； - 文档增加目录。 -### Web 组件 +#### Web 组件 - 增加 Web 组件本地预览服务器； - 公用的 Demo 数据提取到 `package.json` 的 `demoContent` 下面； - 组件细节调整。 -## 2014.08 W2 +### 2014.08 W2 -### Web 组件 +#### Web 组件 __Titlebar__: diff --git a/docs/css/button.md b/docs/css/button.md index aae2d392ff6956a4a160ec4c353126876cd5e432..e511df5cdf453a461f03e47fcbd279198fb4c694 100644 --- a/docs/css/button.md +++ b/docs/css/button.md @@ -22,8 +22,8 @@ - - +链接 +应用按钮样式的链接 ````` ```html @@ -33,8 +33,8 @@ - - +链接 +应用按钮样式的链接 ``` ### 方形按钮 diff --git a/docs/css/utility.md b/docs/css/utility.md index 20f4b40932e43f36eb165349b7c0fbf86fcb8b29..0325df82ea89e05b6d3d0c125221b922b1aa50b1 100644 --- a/docs/css/utility.md +++ b/docs/css/utility.md @@ -674,7 +674,7 @@ #### 多行文字截断 -在只针对 PC 端开发时代，我们可以通过后端控制输出文字的长度来实现固定行数的效果。 +在只针对 PC 端开发的年代，可以通过后端控制输出文字的长度来实现固定行数的效果。 但在响应式页面，这可能不再适用，只能输出足够多的文字，然后通过前端截取需要的行数。 @@ -712,6 +712,7 @@ __参考链接__ - [Line Clampin’ - Truncating Multiple Line Text](http://css-tricks.com/line-clampin/) - [CSS Ellipsis: How to Manage Multi-Line Ellipsis in Pure CSS](http://www.mobify.com/blog/multiline-ellipsis-in-pure-css/) - [Clamp.js](https://github.com/josephschmitt/Clamp.js) +- [TextTailor.JS](https://github.com/jpntex/TextTailor.js) ### 图片替换 diff --git a/docs/getting-started/credits.md b/docs/getting-started/credits.md index 296a48f81c4304125dc88edfbdf8c427190e55f2..6f83752bb0e459acb2a417468ef76b8a284f7328 100644 --- a/docs/getting-started/credits.md +++ b/docs/getting-started/credits.md @@ -12,6 +12,12 @@ Amaze UI 的诞生，依托于 GitHub 及其他技术社区上一些优秀的资 ## v1.0.0 鸣谢名单 + + ### Beta2 整理过程难免有遗漏，请见谅！在此拜谢！（排名不分先后） diff --git a/js/core.js b/js/core.js index d4f5447b5fff7a1097acd7cda80650fdaa2e5fd0..6ce22ba00835c13aaf2caf8c8a5a5b2241f1133f 100644 --- a/js/core.js +++ b/js/core.js @@ -1,4 +1,6 @@ define(function(require, exports, module) { + 'use strict'; + // Zepto animate extend require('zepto.extend.fx'); @@ -8,10 +10,12 @@ define(function(require, exports, module) { // Zepto selector extend require('zepto.extend.selector'); + var $ = window.Zepto, UI = $.AMUI || {}, $win = $(window), doc = window.document, + FastClick = require('util.fastclick'), $html = $('html'); UI.support = {}; @@ -331,16 +335,6 @@ define(function(require, exports, module) { }; })(); - // Require fastclick.js on touch devices - if (UI.support.touch) { - require.async(['util.fastclick'], function(FastClick) { - $(function() { - FastClick && FastClick.attach(document.body); - $html.addClass('am-touch'); - }); - }); - } - // via http://davidwalsh.name/detect-scrollbar-width UI.utils.measureScrollbar = function() { if (document.body.clientWidth >= window.innerWidth) return 0; @@ -387,6 +381,59 @@ define(function(require, exports, module) { } }; + /** + * https://github.com/cho45/micro-template.js + * (c) cho45 http://cho45.github.com/mit-license + */ + + UI.template = function(id, data) { + var me = arguments.callee; + + if (!me.cache[id]) me.cache[id] = (function () { + var name = id, + string = /^[\w\-]+$/.test(id) ? me.get(id): (name = 'template(string)', id); // no warnings + var line = 1, body = ( + "try { " + + (me.variable ? "var " + me.variable + " = this.stash;" : "with (this.stash) { ") + + "this.ret += '" + + string. + replace(/<%/g, '\x11').replace(/%>/g, '\x13'). // if you want other tag, just edit this line + replace(/'(?![^\x11\x13]+?\x13)/g, '\\x27'). + replace(/^\s*|\s*$/g, ''). + replace(/\n/g, function () { return "';\nthis.line = " + (++line) + "; this.ret += '\\n" }). + replace(/\x11-(.+?)\x13/g, "' + ($1) + '"). + replace(/\x11=(.+?)\x13/g, "' + this.escapeHTML($1) + '"). + replace(/\x11(.+?)\x13/g, "'; $1; this.ret += '") + + "'; " + (me.variable ? "" : "}") + "return this.ret;" + + "} catch (e) { throw 'TemplateError: ' + e + ' (on " + name + "' + ' line ' + this.line + ')'; } " + + "//@ sourceURL=" + name + "\n" // source map + ).replace(/this\.ret \+= '';/g, ''); + var func = new Function(body); + var map = { '&' : '&', '<' : '<', '>' : '>', '\x22' : '"', '\x27' : ''' }; + var escapeHTML = function (string) { return (''+string).replace(/[&<>\'\"]/g, function (_) { return map[_] }) }; + return function (stash) { return func.call(me.context = { escapeHTML: escapeHTML, line: 1, ret : '', stash: stash }) }; + })(); + return data ? me.cache[id](data) : me.cache[id]; + }; + + UI.template.cache = {}; + + UI.template.get = function(id) { + if (id) { + var element = document.getElementById(id); + return element && element.innerHTML || ''; + } + }; + + // Attach FastClick on touch devices + if (UI.support.touch) { + $html.addClass('am-touch'); + + $(function() { + FastClick.attach(document.body); + }); + } + $(function() { var $body = $('body'); diff --git a/js/ui.share.js b/js/ui.share.js index e5a42f3107e31a53eace7cc3263d78d75dceeb06..2ad47c8703b019a205bdb66b9522d77cf68e7664 100644 --- a/js/ui.share.js +++ b/js/ui.share.js @@ -1,62 +1,15 @@ define(function(require, exports, module) { + 'use strict'; require('core'); require('ui.modal'); - var QRCode = require('util.qrcode'); - - var $ = window.Zepto, + var QRCode = require('util.qrcode'), + $ = window.Zepto, UI = $.AMUI, doc = document, $doc = $(doc), transition = UI.support.transition; - /** - * https://github.com/cho45/micro-template.js - * (c) cho45 http://cho45.github.com/mit-license - */ - - function template(id, data) { - var me = arguments.callee; - if (!me.cache[id]) me.cache[id] = (function() { - var name = id, string = /^[\w\-]+$/.test(id) ? me.get(id) : (name = 'template(string)', id); // no warnings - var line = 1, body = ( - "try { " + - (me.variable ? "var " + me.variable + " = this.stash;" : "with (this.stash) { ") + - "this.ret += '" + - string. - replace(/<%/g, '\x11').replace(/%>/g, '\x13'). // if you want other tag, just edit this line - replace(/'(?![^\x11\x13]+?\x13)/g, '\\x27'). - replace(/^\s*|\s*$/g, ''). - replace(/\n/g, function() { - return "';\nthis.line = " + (++line) + "; this.ret += '\\n" - }). - replace(/\x11=raw(.+?)\x13/g, "' + ($1) + '"). - replace(/\x11=(.+?)\x13/g, "' + this.escapeHTML($1) + '"). - replace(/\x11(.+?)\x13/g, "'; $1; this.ret += '") + - "'; " + (me.variable ? "" : "}") + "return this.ret;" + - "} catch (e) { throw 'TemplateError: ' + e + ' (on " + name + "' + ' line ' + this.line + ')'; } " + - "//@ sourceURL=" + name + "\n" // source map - ).replace(/this\.ret \+= '';/g, ''); - var func = new Function(body); - var map = {'&': '&', '<': '<', '>': '>', '\x22': '"', '\x27': '''}; - var escapeHTML = function(string) { - return ('' + string).replace(/[&<>\'\"]/g, function(_) { - return map[_] - }) - }; - return function(stash) { - return func.call(me.context = {escapeHTML: escapeHTML, line: 1, ret: '', stash: stash}) - }; - })(); - return data ? me.cache[id](data) : me.cache[id]; - } - - template.cache = {}; - - template.get = function(id) { - return Share.DEFAULTS.tpl; - }; - var Share = function(options) { this.options = $.extend({}, Share.DEFAULTS, options || {}); this.$element = null; @@ -64,7 +17,6 @@ define(function(require, exports, module) { this.pics = null; this.inited = false; this.active = false; - // this.init(); }; @@ -77,12 +29,12 @@ define(function(require, exports, module) { desc: 'Hi，孤夜观天象，发现一个不错的西西，分享一下下 ;-)', via: 'Amaze UI', tpl: '
' + - '

<%= title %>

' + - '' + - '
' + - '
' + '

<%= title %>

' + + '' + + '
' + + '' }; Share.SNS = { @@ -222,7 +174,7 @@ define(function(require, exports, module) { } }); - return template('share', $.extend({}, options, {sns: snsData})); + return UI.template(options.tpl, $.extend({}, options, {sns: snsData})); }; Share.prototype.init = function() { @@ -333,6 +285,8 @@ define(function(require, exports, module) { }; Share.prototype.wechatQr = function() { + if (window.WeixinJSBridge) {} + if (!this.$wechatQr) { var qrId = UI.utils.generateGUID('am-share-wechat'), $qr = $('
分享到微信 ×
', { @@ -370,5 +324,3 @@ define(function(require, exports, module) { module.exports = share; }); - -// TODO: 模板函数公有化 diff --git a/js/util.fastclick.js b/js/util.fastclick.js index c24dc4bc3cb1f27e4a50618360a29845c5b286c1..43129cea3cbfa290a7309e3ea5ec6b14ea08e447 100644 --- a/js/util.fastclick.js +++ b/js/util.fastclick.js @@ -1,10 +1,12 @@ define(function(require, exports, module) { + 'use strict'; + var $ = window.Zepto; /** - * FastClick: polyfill to remove click delays on browsers with touch UIs. + * @preserve FastClick: polyfill to remove click delays on browsers with touch UIs. * - * @version 1.0.2 + * @version 1.0.3 * @codingstandard ftlabs-jsv2 * @copyright The Financial Times Limited [All Rights Reserved] * @license MIT License (see LICENSE.txt) @@ -22,7 +24,6 @@ define(function(require, exports, module) { * @param {Object} options The options to override the defaults */ function FastClick(layer, options) { - 'use strict'; var oldOnClick; options = options || {}; @@ -200,6 +201,12 @@ define(function(require, exports, module) { */ var deviceIsIOSWithBadTarget = deviceIsIOS && (/OS ([6-9]|\d{2})_\d/).test(navigator.userAgent); + /** + * BlackBerry requires exceptions. + * + * @type boolean + */ + var deviceIsBlackBerry10 = navigator.userAgent.indexOf('BB10') > 0; /** * Determine whether a given element requires a native click. @@ -208,7 +215,6 @@ define(function(require, exports, module) { * @returns {boolean} Returns true if the element needs a native click */ FastClick.prototype.needsClick = function(target) { - 'use strict'; switch (target.nodeName.toLowerCase()) { // Don't send a synthetic click to disabled inputs (issue #62) @@ -244,7 +250,6 @@ define(function(require, exports, module) { * @returns {boolean} Returns true if the element requires a call to focus to simulate native click. */ FastClick.prototype.needsFocus = function(target) { - 'use strict'; switch (target.nodeName.toLowerCase()) { case 'textarea': return true; @@ -276,7 +281,6 @@ define(function(require, exports, module) { * @param {Event} event */ FastClick.prototype.sendClick = function(targetElement, event) { - 'use strict'; var clickEvent, touch; // On some Android devices activeElement needs to be blurred otherwise the synthetic click will have no effect (#24) @@ -294,7 +298,6 @@ define(function(require, exports, module) { }; FastClick.prototype.determineEventType = function(targetElement) { - 'use strict'; //Issue #159: Android Chrome Select Box does not open with a synthetic click event if (deviceIsAndroid && targetElement.tagName.toLowerCase() === 'select') { @@ -309,7 +312,6 @@ define(function(require, exports, module) { * @param {EventTarget|Element} targetElement */ FastClick.prototype.focus = function(targetElement) { - 'use strict'; var length; // Issue #160: on iOS 7, some input elements (e.g. date datetime) throw a vague TypeError on setSelectionRange. These elements don't have an integer value for the selectionStart and selectionEnd properties, but unfortunately that can't be used for detection because accessing the properties also throws a TypeError. Just check the type instead. Filed as Apple bug #15122724. @@ -328,7 +330,6 @@ define(function(require, exports, module) { * @param {EventTarget|Element} targetElement */ FastClick.prototype.updateScrollParent = function(targetElement) { - 'use strict'; var scrollParent, parentElement; scrollParent = targetElement.fastClickScrollParent; @@ -360,7 +361,6 @@ define(function(require, exports, module) { * @returns {Element|EventTarget} */ FastClick.prototype.getTargetElementFromEventTarget = function(eventTarget) { - 'use strict'; // On some older browsers (notably Safari on iOS 4.1 - see issue #56) the event target may be a text node. if (eventTarget.nodeType === Node.TEXT_NODE) { @@ -378,7 +378,6 @@ define(function(require, exports, module) { * @returns {boolean} */ FastClick.prototype.onTouchStart = function(event) { - 'use strict'; var targetElement, touch, selection; // Ignore multiple touches, otherwise pinch-to-zoom is prevented if both fingers are on the FastClick element (issue #111). @@ -404,7 +403,10 @@ define(function(require, exports, module) { // with the same identifier as the touch event that previously triggered the click that triggered the alert. // Sadly, there is an issue on iOS 4 that causes some normal touch events to have the same identifier as an // immediately preceeding touch event (issue #52), so this fix is unavailable on that platform. - if (touch.identifier === this.lastTouchIdentifier) { + // Issue 120: touch.identifier is 0 when Chrome dev tools 'Emulate touch events' is set with an iOS device UA string, + // which causes all touch events to be ignored. As this block only applies to iOS, and iOS identifiers are always long, + // random integers, it's safe to to continue if the identifier is 0 here. + if (touch.identifier && touch.identifier === this.lastTouchIdentifier) { event.preventDefault(); return false; } @@ -444,7 +446,6 @@ define(function(require, exports, module) { * @returns {boolean} */ FastClick.prototype.touchHasMoved = function(event) { - 'use strict'; var touch = event.changedTouches[0], boundary = this.touchBoundary; if (Math.abs(touch.pageX - this.touchStartX) > boundary || Math.abs(touch.pageY - this.touchStartY) > boundary) { @@ -462,7 +463,6 @@ define(function(require, exports, module) { * @returns {boolean} */ FastClick.prototype.onTouchMove = function(event) { - 'use strict'; if (!this.trackingClick) { return true; } @@ -484,7 +484,6 @@ define(function(require, exports, module) { * @returns {Element|null} */ FastClick.prototype.findControl = function(labelElement) { - 'use strict'; // Fast path for newer browsers supporting the HTML5 control attribute if (labelElement.control !== undefined) { @@ -509,7 +508,6 @@ define(function(require, exports, module) { * @returns {boolean} */ FastClick.prototype.onTouchEnd = function(event) { - 'use strict'; var forElement, trackingClickStart, targetTagName, scrollParent, touch, targetElement = this.targetElement; if (!this.trackingClick) { @@ -603,7 +601,6 @@ define(function(require, exports, module) { * @returns {void} */ FastClick.prototype.onTouchCancel = function() { - 'use strict'; this.trackingClick = false; this.targetElement = null; }; @@ -616,7 +613,6 @@ define(function(require, exports, module) { * @returns {boolean} */ FastClick.prototype.onMouse = function(event) { - 'use strict'; // If a target element was never set (because a touch event was never fired) allow the event if (!this.targetElement) { @@ -667,7 +663,6 @@ define(function(require, exports, module) { * @returns {boolean} */ FastClick.prototype.onClick = function(event) { - 'use strict'; var permitted; // It's possible for another FastClick-like library delivered with third-party code to fire a click event before FastClick does (issue #44). In that case, set the click-tracking flag back to false and return early. This will cause onTouchEnd to return early. @@ -700,7 +695,6 @@ define(function(require, exports, module) { * @returns {void} */ FastClick.prototype.destroy = function() { - 'use strict'; var layer = this.layer; if (deviceIsAndroid) { @@ -723,9 +717,9 @@ define(function(require, exports, module) { * @param {Element} layer The layer to listen on */ FastClick.notNeeded = function(layer) { - 'use strict'; var metaViewport; var chromeVersion; + var blackberryVersion; // Devices that don't support touch don't need FastClick if (typeof window.ontouchstart === 'undefined') { @@ -757,6 +751,27 @@ define(function(require, exports, module) { } } + if (deviceIsBlackBerry10) { + blackberryVersion = navigator.userAgent.match(/Version\/([0-9]*)\.([0-9]*)/); + + // BlackBerry 10.3+ does not require Fastclick library. + // https://github.com/ftlabs/fastclick/issues/251 + if (blackberryVersion[1] >= 10 && blackberryVersion[2] >= 3) { + metaViewport = document.querySelector('meta[name=viewport]'); + + if (metaViewport) { + // user-scalable=no eliminates click delay. + if (metaViewport.content.indexOf('user-scalable=no') !== -1) { + return true; + } + // width=device-width (or less than device-width) eliminates click delay. + if (document.documentElement.scrollWidth <= window.outerWidth) { + return true; + } + } + } + } + // IE10 with -ms-touch-action: none, which disables double-tap-to-zoom (issue #97) if (layer.style.msTouchAction === 'none') { return true; @@ -773,10 +788,8 @@ define(function(require, exports, module) { * @param {Object} options The options to override the defaults */ FastClick.attach = function(layer, options) { - 'use strict'; return new FastClick(layer, options); }; - module.exports = FastClick; -}); \ No newline at end of file +}); diff --git a/less/ui.share.less b/less/ui.share.less index a880f1ad915b57f0ff0a88de47b8d6bd791aefd1..316478ab8d97764e3bfeef5a78bf32c10ecae214 100644 --- a/less/ui.share.less +++ b/less/ui.share.less @@ -14,10 +14,12 @@ // // ======================================================================== +/* ======================================================================== + Component: Share Plugin + ========================================================================== */ @share-bg: #f8f8f8; - .am-share { font-size: 14px; } @@ -37,9 +39,9 @@ content: ""; display: block; width: 100%; - height: 1px; + height: 0; margin-top: 10px; - background-color: #dfdfdf; + border-bottom: 1px solid #dfdfdf; } } @@ -120,7 +122,6 @@ .am-modal-dialog { background-color: #fff; border: 1px solid #dedede; - .box-shadow(0 0 5px #ddd); } .am-modal-hd { @@ -144,4 +145,3 @@ } } } -