├── LICENSE ├── README ├── demos ├── Carousel │ ├── autoScroll.html │ ├── button.html │ ├── event.html │ ├── focusRange.html │ ├── fx.html │ ├── item │ │ ├── 0.png │ │ ├── 1.png │ │ ├── 2.png │ │ ├── 3.png │ │ ├── 4.png │ │ ├── 5.png │ │ ├── 6.png │ │ ├── 7.png │ │ ├── 8.png │ │ └── 9.png │ ├── method.html │ ├── quickStart.html │ ├── render.html │ ├── setup.html │ ├── step.html │ └── vertical.html ├── ComboBox │ ├── demo.html │ ├── quickStart.html │ └── setup-demo.html ├── DatePicker │ ├── demo.html │ ├── en_demo.html │ ├── plugin.html │ ├── quickStart.html │ ├── timer.html │ └── today.html ├── Dialog │ ├── alert.html │ ├── button.html │ ├── complex.html │ ├── confirm.html │ ├── event.html │ ├── iframe.html │ ├── mask.html │ ├── methods.html │ ├── quickStart.html │ ├── render.html │ └── setup.html ├── Pager │ ├── demo.html │ └── quickStart.html ├── ScrollPanel │ ├── css │ │ └── zhidao.css │ ├── customStyle.html │ ├── event.html │ ├── img │ │ ├── 0.jpg │ │ ├── 1.jpg │ │ ├── 2.jpg │ │ ├── 3.jpg │ │ ├── 4.jpg │ │ ├── 5.jpg │ │ └── knob.png │ ├── method.html │ ├── quickStart.html │ ├── update.html │ ├── zhidao-dynamic.html │ └── zhidao-static.html ├── Slider │ ├── accuracy.html │ ├── cache.html │ ├── currentValue.html │ ├── direction.html │ ├── event.html │ ├── fx.html │ ├── method.html │ ├── orientation.html │ ├── quickStart.html │ ├── render.html │ └── setup.html ├── Suggestion │ ├── demo.html │ ├── quickStart.html │ └── service.json ├── Tab │ ├── event.html │ ├── items.html │ ├── method.html │ ├── originalIndex.html │ ├── quickStart.html │ ├── render.html │ ├── selectDelay.html │ ├── selectEvent.html │ └── setup.html ├── Tooltip │ ├── attach.html │ ├── demo.css │ ├── focus.html │ ├── methods.html │ ├── quickStart.html │ ├── render.html │ ├── setup.html │ ├── tiebaDemo.html │ └── zhidaoDemo.html ├── _Calendar │ ├── quickStart.html │ ├── timer.html │ └── today.html ├── _Tooltip │ ├── attach.html │ ├── demo.css │ ├── focus.html │ ├── quickStart.html │ └── render.html └── common │ ├── Tangram2.0-full.js │ ├── demo.css │ ├── demo.js │ ├── demo.png │ ├── edit_clear.png │ ├── exec.js │ ├── expander.png │ ├── fullscreen_toggle.png │ ├── jquery-1.8.3.js │ ├── shBrushJScript.js │ ├── shCore.js │ └── shCoreDefault.css ├── docs ├── UI │ ├── carousel.png │ ├── dialogue.png │ ├── dialogue.psd │ ├── pager.jpg │ ├── sugestion.png │ ├── tab.png │ ├── tooltip.png │ └── tooltip.psd ├── doto.txt ├── readme.txt └── todo.txt ├── resources ├── default │ ├── common │ │ ├── common.css │ │ ├── shadow.gif │ │ └── shadow.png │ ├── magic.Background │ │ ├── corner.gif │ │ ├── corner.png │ │ ├── horizontal.gif │ │ ├── horizontal.png │ │ ├── magic.Background.css │ │ ├── midland.gif │ │ ├── midland.png │ │ ├── vertical.gif │ │ └── vertical.png │ ├── magic.Calendar │ │ ├── bg.png │ │ └── magic.Calendar.css │ ├── magic.Pager │ │ └── magic.Pager.css │ ├── magic.Tooltip │ │ ├── arrow.gif │ │ ├── arrow.png │ │ ├── close.gif │ │ └── magic.Tooltip.css │ ├── magic.control.Carousel │ │ ├── carousel-btn.png │ │ ├── carousel-vertical-btn.png │ │ ├── dotted.png │ │ ├── magic.control.Carousel-vertical.css │ │ └── magic.control.Carousel.css │ ├── magic.control.ComboBox │ │ ├── magic-combobox-arrow.gif │ │ └── magic.control.ComboBox.css │ ├── magic.control.Dialog │ │ ├── btns.gif │ │ ├── dialog.png │ │ ├── magic.control.Dialog.css │ │ ├── shadow.gif │ │ └── shadow.png │ ├── magic.control.Popup │ │ └── magic.control.Popup.css │ ├── magic.control.ScrollPanel │ │ ├── bg.gif │ │ └── magic.control.ScrollPanel.css │ ├── magic.control.Slider │ │ ├── cache-h-bg.png │ │ ├── cache-h-corner.png │ │ ├── cache-v-bg.png │ │ ├── cache-v-corner.png │ │ ├── magic.Slider.css │ │ ├── slider-h-bg.png │ │ ├── slider-h-bg1.png │ │ ├── slider-h-corner.png │ │ ├── slider-h-knob.png │ │ ├── slider-h-knobHover.png │ │ ├── slider-v-bg.png │ │ ├── slider-v-bg1.png │ │ ├── slider-v-corner.png │ │ ├── slider-v-knob.png │ │ ├── slider-v-knobHover.png │ │ └── sliderThumbs.png │ ├── magic.control.Suggestion │ │ ├── magic.control.Suggestion.css │ │ └── suggestion-input-bg.gif │ └── magic.control.Tab │ │ ├── magic.control.Tab.css │ │ ├── tab-dotted.png │ │ └── tab-title-item.png └── readme.txt ├── src ├── import.js ├── import.php ├── jsloader.js ├── magic.js └── magic │ ├── Background.js │ ├── Background │ └── $styleBox.js │ ├── Base.js │ ├── Calendar.js │ ├── Calendar │ ├── $timer.js │ ├── $title.js │ └── $today.js │ ├── Carousel.js │ ├── Carousel │ └── $button.js │ ├── ComboBox.js │ ├── Dialog.js │ ├── Mask.js │ ├── Pager.js │ ├── Popup.js │ ├── Slider.js │ ├── Tab.js │ ├── Tooltip.js │ ├── Tooltip.js.bak │ ├── adapter │ └── jQueryOrigin.js │ ├── control.js │ ├── control │ ├── Carousel.js │ ├── Carousel │ │ ├── $autoScroll.js │ │ ├── $button.js │ │ ├── $fx.js │ │ └── $itemModify.js │ ├── ComboBox.js │ ├── ComboBox │ │ └── $suggestion.js │ ├── DatePicker.js │ ├── DatePicker │ │ └── $title.js │ ├── Dialog.js │ ├── Dialog │ │ ├── $button.js │ │ └── $mask.js │ ├── Layer.js │ ├── Popup.js │ ├── ScrollPanel.js │ ├── Slider.js │ ├── Slider │ │ ├── $cache.js │ │ └── $fx.js │ ├── Suggestion.js │ ├── Tab.js │ └── Tooltip.js │ ├── setup.js │ └── setup │ ├── background.js │ ├── carousel.js │ ├── comboBox.js │ ├── datePicker.js │ ├── dialog.js │ ├── scrollPanel.js │ ├── slider.js │ ├── suggestion.js │ ├── tab.js │ └── tooltip.js └── test ├── baidu.js ├── magic ├── Calendar.js ├── Calendar │ ├── $timer.js │ ├── $today.js │ ├── _$title.js │ ├── bg.png │ └── magic.Calendar.css ├── Carousel.js ├── Carousel │ └── $button.js ├── ComboBox.js ├── Dialog.js ├── Pager.js ├── Slider.js ├── Tab.js ├── Tooltip.js ├── _Tooltip.js ├── control │ ├── Carousel │ │ ├── $autoScroll.js │ │ ├── $button.js │ │ └── $fx.js │ ├── ComboBox │ │ └── $suggestion.js │ ├── DatePicker │ │ └── $title.js │ ├── Dialog │ │ ├── $button.js │ │ └── $mask.js │ └── Slider │ │ ├── $cache.js │ │ └── $fx.js └── setup │ ├── carousel.js │ ├── carousel │ ├── carousel-btn.png │ ├── carousel-vertical-btn.png │ ├── carousel-vertical.css │ ├── carousel.css │ └── carousel_fx.css │ ├── comboBox.js │ ├── combobox │ ├── combobox.css │ └── magic-combobox-arrow.gif │ ├── datePicker.js │ ├── dialog.js │ ├── dialog │ ├── btns.gif │ ├── dialog.css │ ├── dialog.png │ ├── shadow.gif │ └── shadow.png │ ├── scrollPanel.js │ ├── scrollPanel │ ├── bg.gif │ └── scrollPanel.css │ ├── slider.js │ ├── slider │ ├── cache-h-bg.png │ ├── cache-h-corner.png │ ├── cache-v-bg.png │ ├── cache-v-corner.png │ ├── slider-h-bg.png │ ├── slider-h-bg1.png │ ├── slider-h-corner.png │ ├── slider-h-knob.png │ ├── slider-h-knobHover.png │ ├── slider-v-bg.png │ ├── slider-v-bg1.png │ ├── slider-v-corner.png │ ├── slider-v-knob.png │ ├── slider-v-knobHover.png │ ├── slider.css │ └── sliderThumbs.png │ ├── suggestion.js │ ├── suggestion │ └── suggestion.css │ ├── tab.js │ ├── tab │ ├── tab-dotted.png │ ├── tab-title-item.png │ └── tab.css │ ├── tooltip.js │ └── tooltip │ ├── arrow.gif │ ├── arrow.png │ ├── close.gif │ ├── corner.gif │ ├── corner.png │ ├── horizontal.gif │ ├── horizontal.png │ ├── midland.gif │ ├── midland.png │ ├── tooltip.css │ ├── vertical.gif │ └── vertical.png ├── mindmap ├── Magic Tooltip.xmind ├── Magic.Calendar.$title.xmind ├── Magic.Calendar.$today.xmind ├── Magic.Calendar.xmind ├── Magic.Carousel$autoscroll.xmind ├── Magic.Carousel$fx.xmind ├── Magic.Carousel.$button.xmind ├── Magic.Carousel.xmind ├── Magic.ComboBox$suggestion.xmind ├── Magic.ComboBox.xmind ├── Magic.DatePicker.xmind ├── Magic.Dialog$button.xmind ├── Magic.Dialog$mask.xmind ├── Magic.Dialog.xmind ├── Magic.Pager.xmind ├── Magic.ScrollPanel.xmind ├── Magic.Slider$fx.xmind ├── Magic.Slider.xmind ├── Magic.Suggestion.xmind ├── Magic.Suggestion1.xmind ├── Magic.Tab.xmind └── magic.Calendar.$timer.xmind └── tools ├── br ├── analysis.php ├── case.class.php ├── config.php ├── coveragereport │ └── totalCoverage │ │ ├── jscoverage-highlight.css │ │ ├── jscoverage-ie.css │ │ ├── jscoverage-throbber.gif │ │ ├── jscoverage.css │ │ ├── jscoverage.html │ │ ├── jscoverage.js │ │ └── readCoverage.js ├── css │ ├── bg_button_a.gif │ ├── bg_button_span.gif │ ├── qunit.css │ ├── tangramtest.css │ └── testsuite.css ├── download.php ├── filehelper.php ├── geneHTML.php ├── geneHistory.php ├── geneXML.php ├── import.php ├── js │ ├── UserAction.js │ ├── ext_qunit.js │ ├── jquery-1.7.2.js │ ├── qunit.js │ ├── run.js │ ├── testrunner.js │ └── tools.js ├── lib │ ├── Staf.php │ ├── StafResult.php │ └── jscoverage.exe ├── list.php ├── record.php ├── report.php ├── reportstyle │ └── junit-noframes.xsl ├── run.php ├── runall.php └── smail.php ├── build_report.xml ├── build_run.xml ├── build_run1.xml ├── ci ├── assets │ ├── css │ │ ├── app.css │ │ └── shCoreDefault.css │ ├── img │ │ ├── file.png │ │ ├── folder_closed.png │ │ ├── folder_open.png │ │ ├── header.gif │ │ ├── logo_magic.png │ │ ├── logo_tangram.gif │ │ ├── sidebar.png │ │ ├── status.png │ │ ├── treeview-default-line.gif │ │ └── treeview-default.gif │ ├── js │ │ ├── Check.js │ │ ├── Console.js │ │ ├── Tools.js │ │ ├── app.js │ │ └── tree.js │ └── lib │ │ ├── jQuery-1.8.2.js │ │ ├── jshint.js │ │ ├── mustache.js │ │ ├── sea.js │ │ ├── shBrushJScript.js │ │ └── shCore.js ├── doc.php ├── docTpl.html ├── getFileContent.php ├── getFiles.php ├── index.php └── staticcheck.php └── data ├── flips2.swf ├── frame.html ├── frame.php ├── test.JPG ├── test.html └── testReady.html /LICENSE: -------------------------------------------------------------------------------- 1 | Copyright (c) 2012, Baidu Inc. 2 | All rights reserved. 3 | 4 | Redistribution and use of this software in source and binary forms, with or 5 | without modification, are permitted provided that the following conditions 6 | are met: 7 | 8 | Redistributions of source code must retain the above copyright notice, this 9 | list of conditions and the following disclaimer. 10 | 11 | Redistributions in binary form must reproduce the above copyright notice, 12 | this list of conditions and the following disclaimer in the documentation 13 | and/or other materials provided with the distribution. 14 | 15 | Neither the name of Baidu Inc. nor the names of its contributors may be used 16 | to endorse or promote products derived from this software without specific 17 | prior written permission of Baidu Inc. 18 | 19 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" 20 | AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE 21 | IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE 22 | DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR 23 | ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES 24 | (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; 25 | LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON 26 | ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT 27 | (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS 28 | SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. 29 | -------------------------------------------------------------------------------- /README: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/README -------------------------------------------------------------------------------- /demos/Carousel/focusRange.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | focusRange 7 | 8 | 9 | 10 | 11 | 12 | 22 | 23 | 24 | 25 |
26 |
27 |

Demo列表

28 |
29 |
30 |
31 |

图片轮播组件 --- focusRange 示例

32 |

focusRange 用来描述在 carousel 可视区域内,焦点能够滚动的区域,区域起始位是从0开始,格式:{min: 1, max: 2},当焦点超出了focusRange 范围后就会触发滚动动作.

33 |

在下面的示例中,focusRange为 {min: 1, max:2}, 相对于可视区域,焦点总会保持在第二张第三张的位置。

34 |
35 |
36 |
37 | 38 |
39 |

控制台

40 |
41 |
42 |
43 |
44 | 45 | 63 | 64 | 65 | -------------------------------------------------------------------------------- /demos/Carousel/item/0.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/Carousel/item/0.png -------------------------------------------------------------------------------- /demos/Carousel/item/1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/Carousel/item/1.png -------------------------------------------------------------------------------- /demos/Carousel/item/2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/Carousel/item/2.png -------------------------------------------------------------------------------- /demos/Carousel/item/3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/Carousel/item/3.png -------------------------------------------------------------------------------- /demos/Carousel/item/4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/Carousel/item/4.png -------------------------------------------------------------------------------- /demos/Carousel/item/5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/Carousel/item/5.png -------------------------------------------------------------------------------- /demos/Carousel/item/6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/Carousel/item/6.png -------------------------------------------------------------------------------- /demos/Carousel/item/7.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/Carousel/item/7.png -------------------------------------------------------------------------------- /demos/Carousel/item/8.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/Carousel/item/8.png -------------------------------------------------------------------------------- /demos/Carousel/item/9.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/Carousel/item/9.png -------------------------------------------------------------------------------- /demos/Carousel/quickStart.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 图片轮播组件 quickStart 7 | 8 | 9 | 10 | 11 | 20 | 21 | 22 | 23 | 41 | 42 | -------------------------------------------------------------------------------- /demos/Carousel/render.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Render模式 7 | 8 | 9 | 10 | 11 | 12 | 22 | 23 | 24 | 25 |
26 |
27 |

Demo列表

28 |
29 |
30 |
31 |

图片轮播组件 --- render 模式示例

32 |

Render 模式: 通过向配置项 items 传递参数,并调用 render 方法创建组件。

33 |
34 |
35 |
36 | 37 |
38 |

控制台

39 |
40 |
41 |
42 |
43 | 44 | 60 | 61 | 62 | -------------------------------------------------------------------------------- /demos/Carousel/step.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Step 7 | 8 | 9 | 10 | 11 | 12 | 22 | 23 | 24 | 25 |
26 |
27 |

Demo列表

28 |
29 |
30 |
31 |

图片轮播组件 --- step 示例

32 |

step 用于描述每次滚动过多少个项,默认是每次滚动1项

33 |

在下面的示例中,step 为 4,每次将会滚动 4 张

34 |
35 |
36 |
37 | 38 |
39 |

控制台

40 |
41 |
42 |
43 |
44 | 45 | 64 | 65 | 66 | -------------------------------------------------------------------------------- /demos/Carousel/vertical.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 垂直滚动 7 | 8 | 9 | 10 | 11 | 12 | 21 | 22 | 23 | 24 |
25 |
26 |

Demo列表

27 |
28 |
29 |
30 |

图片轮播组件 --- 垂直滚动

31 |

当设置 orientation 参数为 vertical 时,表示需要一个竖向的滚动组件。

32 |
33 |
34 |
35 | 36 |
37 |

控制台

38 |
39 |
40 |
41 |
42 | 43 | 64 | 65 | 66 | -------------------------------------------------------------------------------- /demos/ComboBox/quickStart.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 组合框组件quickStart 11 | 12 | 13 |
14 |

combobox 组件

15 |
16 |
17 | 28 | 29 | 30 | -------------------------------------------------------------------------------- /demos/ComboBox/setup-demo.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Setup初始化显示 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 |
17 |

Demo列表

18 |
19 |
20 |
21 |

组合框setup初始化演示

22 |

这是一个浏览器原生的select,请点击setup按钮将其变为组合框。

23 |

magic.setup.combobox(select);

24 |
25 |
26 |
27 | 34 |
35 |
36 | 37 |
38 |
39 |
40 |
41 | 50 | 51 | -------------------------------------------------------------------------------- /demos/DatePicker/quickStart.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 日历组件quickStart 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 |

DatePicker

16 |
17 |

选择日期:

18 |
19 |
20 | 28 | 29 | 30 | -------------------------------------------------------------------------------- /demos/Dialog/alert.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Dialog.alert 示例 7 | 8 | 9 | 10 | 11 | 12 | 18 | 19 | 20 | 21 |
22 |
23 |

Demo列表

24 |
25 |
26 |
27 |

Dialog.alert示例

28 |

使用 Dialog.alert 必须在下载 tangram 代码时勾选了“button” 插件

29 |
30 |

31 |
32 |
33 | 34 | 44 | 45 | -------------------------------------------------------------------------------- /demos/Dialog/confirm.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Dialog.confirm 示例 7 | 8 | 9 | 10 | 11 | 12 | 18 | 19 | 20 | 21 |
22 |
23 |

Demo列表

24 |
25 |
26 |
27 |

Dialog.confirm示例

28 |

使用 Dialog.confirm 必须在下载 tangram 代码时勾选了“button” 插件

29 |
30 |

31 |
32 |
33 | 34 | 49 | 50 | -------------------------------------------------------------------------------- /demos/Dialog/iframe.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | iframe 类型内容示例 7 | 8 | 9 | 10 | 11 | 12 | 16 | 17 | 18 | 19 |
20 |
21 |

Demo列表

22 |
23 |
24 |
25 |

对话框组件frame类型内容示例

26 |

setContent 方法第二个参数 contentType 如果取值为 frame,则认为 content 参数是一个 url 地址。

27 |
28 |
29 |

30 |
31 |
32 |
33 | 34 | 49 | 50 | -------------------------------------------------------------------------------- /demos/Dialog/quickStart.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 对话框组件quickStart 11 | 12 | 13 |
14 |
15 | 27 | 28 | 29 | -------------------------------------------------------------------------------- /demos/Dialog/render.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Render 模式示例 7 | 8 | 9 | 10 | 11 | 12 | 16 | 17 | 18 | 19 |
20 |
21 |

Demo列表

22 |
23 |
24 |
25 |

对话框组件 render 模式示例

26 |

实例化后,通过调用实例的 render 方法构建对话框组件

27 |
28 |

29 |
30 |
31 |
32 | 33 | 45 | 46 | -------------------------------------------------------------------------------- /demos/Pager/quickStart.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 分页组件quickStart 7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 22 | 23 | 24 | -------------------------------------------------------------------------------- /demos/ScrollPanel/img/0.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/ScrollPanel/img/0.jpg -------------------------------------------------------------------------------- /demos/ScrollPanel/img/1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/ScrollPanel/img/1.jpg -------------------------------------------------------------------------------- /demos/ScrollPanel/img/2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/ScrollPanel/img/2.jpg -------------------------------------------------------------------------------- /demos/ScrollPanel/img/3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/ScrollPanel/img/3.jpg -------------------------------------------------------------------------------- /demos/ScrollPanel/img/4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/ScrollPanel/img/4.jpg -------------------------------------------------------------------------------- /demos/ScrollPanel/img/5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/ScrollPanel/img/5.jpg -------------------------------------------------------------------------------- /demos/ScrollPanel/img/knob.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/ScrollPanel/img/knob.png -------------------------------------------------------------------------------- /demos/ScrollPanel/quickStart.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | ScrollPanel 组件 quickStart 7 | 8 | 9 | 10 | 11 | 21 | 22 | 23 |
24 |
Test
25 |
26 | 27 | 30 | 31 | -------------------------------------------------------------------------------- /demos/Slider/quickStart.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | QuickStart 7 | 8 | 9 | 10 | 21 | 22 | 23 |
24 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /demos/Suggestion/quickStart.html: -------------------------------------------------------------------------------- 1 |  2 | 3 | 4 | 5 | 6 | 输入框提示组件quickStart 7 | 8 | 9 | 10 | 11 | 18 | 19 | 20 |
21 |
22 | 请任意输入关键字: 23 |
24 |
25 | 44 | 45 | -------------------------------------------------------------------------------- /demos/Suggestion/service.json: -------------------------------------------------------------------------------- 1 | ['value', '北海2value', '北海3value', '北海4value', '北海5value'] -------------------------------------------------------------------------------- /demos/Tab/event.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 常用事件 7 | 8 | 9 | 10 | 11 | 12 | 41 | 42 | 43 | 44 |
45 |
46 |

Demo列表

47 |
48 |
49 |
50 |

选项卡组件 --- 常用事件

51 |

选项卡组件有 onbeforeselect 和 onselect 事件

52 |

onbeforeselect: 当焦点发生改变之前触发,onselect: 当焦点发生改变时触发

53 |

下面的示例中监听了这两个事件。

54 |
55 |
56 |
57 |
58 |
59 |

控制台

60 |
61 |
62 |
63 |
64 | 65 | 88 | 89 | 90 | -------------------------------------------------------------------------------- /demos/Tab/originalIndex.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | originalIndex 7 | 8 | 9 | 10 | 11 | 12 | 41 | 42 | 43 | 44 |
45 |
46 |

Demo列表

47 |
48 |
49 |
50 |

选项卡组件 --- originalIndex 示例

51 |

可以通过 originalIndex 配置选项卡初始打开项

52 |

下面示例中,originalIndex 为1,初始显示第二项

53 |
54 |
55 |
56 |
57 |
58 |

控制台

59 |
60 |
61 |
62 |
63 | 64 | 77 | 78 | 79 | -------------------------------------------------------------------------------- /demos/Tab/quickStart.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | magic.Tab 组件quickStart 7 | 8 | 9 | 10 | 11 | 28 | 29 | 30 |
31 | 41 | 42 | -------------------------------------------------------------------------------- /demos/Tab/render.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Render模式 7 | 8 | 9 | 10 | 11 | 12 | 41 | 42 | 43 | 44 |
45 |
46 |

Demo列表

47 |
48 |
49 |
50 |

选项卡组件 --- render 模式

51 |

Render 模式: 通过向配置项 items 传递参数,并调用 render 方法创建组件。

52 |
53 |
54 |
55 |
56 |
57 |

控制台

58 |
59 |
60 |
61 |
62 | 63 | 74 | 75 | 76 | -------------------------------------------------------------------------------- /demos/Tab/selectDelay.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 延迟选择 7 | 8 | 9 | 10 | 11 | 12 | 41 | 42 | 43 | 44 |
45 |
46 |

Demo列表

47 |
48 |
49 |
50 |

选项卡组件 --- selectDelay 示例

51 |

当 selectEvent 是 mouseover 时,通过 selectDelay 选项卡之间切换的延迟时间,以毫秒为单位,默认0

52 |

下面示例中,标签之间通过鼠标 mouseover 切换,切换延时 500 毫秒

53 |
54 |
55 |
56 |
57 |
58 |

控制台

59 |
60 |
61 |
62 |
63 | 64 | 77 | 78 | 79 | -------------------------------------------------------------------------------- /demos/Tab/selectEvent.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | select 事件 7 | 8 | 9 | 10 | 11 | 12 | 41 | 42 | 43 | 44 |
45 |
46 |

Demo列表

47 |
48 |
49 |
50 |

选项卡组件 --- selectEvent 示例

51 |

触发选项卡切换的事件名称,取值click或mouseover,默认click

52 |

下面示例中,标签之间通过鼠标 mouseover 切换

53 |
54 |
55 |
56 |
57 |
58 |

控制台

59 |
60 |
61 |
62 |
63 | 64 | 76 | 77 | 78 | -------------------------------------------------------------------------------- /demos/Tooltip/demo.css: -------------------------------------------------------------------------------- 1 | .demo{ 2 | font-size: 14px; 3 | padding: 10px; 4 | color: #333; 5 | font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; 6 | position: relative; 7 | /*overflow: hidden;*/ 8 | height: 700px; 9 | } 10 | 11 | .demo h1{ 12 | margin: 0; 13 | padding: 0; 14 | font-size: 22px; 15 | font-weight: 700; 16 | } 17 | 18 | .demo strong{ 19 | font-weight: 700; 20 | color: blue; 21 | } 22 | 23 | .demo-control{ 24 | border-collapse: collapse; 25 | } 26 | 27 | .demo-control td{ 28 | padding: 8px; 29 | background-color: #f6f6f6; 30 | border: 1px solid #ccc; 31 | line-height: 22px; 32 | } 33 | 34 | .demo-control td span{ 35 | vertical-align: middle; 36 | } 37 | 38 | .demo-control td .textInput, 39 | .demo-control td .textInput-s, 40 | .demo-control td .textArea{ 41 | width: 195px; padding-left: 5px; 42 | height: 22px; 43 | line-height: 22px; 44 | border: 1px solid #ccc; 45 | } 46 | 47 | .demo-control td .textInput-s{ 48 | width: 50px; 49 | } 50 | 51 | .demo-control td .textArea{ 52 | height: 50px; 53 | overflow: auto; 54 | } 55 | 56 | .demo-control td .btn{ 57 | width: 60px; 58 | height: 22px; 59 | background-color: #ccc; 60 | line-height: 14px; 61 | padding: 0; 62 | } 63 | 64 | #hello, #world{ 65 | border: 1px solid #900; 66 | width: 290px; padding-left: 10px; 67 | line-height: 30px; 68 | text-align: left; 69 | background-color: #fff; 70 | } 71 | 72 | #world{ 73 | border-color: #009; 74 | } 75 | 76 | #temp-div #hello, #temp-div #world{ 77 | margin-top: 10px; 78 | } 79 | 80 | #temp-div{ 81 | position: absolute; 82 | left: 450px; top: 0; 83 | } 84 | 85 | .tang-body .content{ 86 | font-size: 14px; 87 | } -------------------------------------------------------------------------------- /demos/Tooltip/quickStart.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 提示框框组件quickStart 16 | 17 | 18 | 提示 19 | 20 | 27 | 28 | 29 | -------------------------------------------------------------------------------- /demos/_Tooltip/attach.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Tooltip 组件 attach示例 7 | 8 | 9 | 10 | 11 | 12 | 15 | 16 | 17 | 18 |
19 |

Tooltip 组件 attach 示例

20 |

通过attach方法来和某个dom元素进行绑定,使tooltip指示到该元素

21 | 百度 22 |



23 |
24 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /demos/_Tooltip/demo.css: -------------------------------------------------------------------------------- 1 | .demo{ 2 | font-size: 14px; 3 | padding: 10px; 4 | color: #333; 5 | font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; 6 | position: relative; 7 | } 8 | 9 | .demo h1{ 10 | margin: 0; 11 | padding: 0; 12 | font-size: 22px; 13 | font-weight: 700; 14 | } 15 | 16 | .demo strong{ 17 | font-weight: 700; 18 | color: blue; 19 | } 20 | 21 | .demo-control{ 22 | border-collapse: collapse; 23 | } 24 | 25 | .demo-control td{ 26 | padding: 8px; 27 | background-color: #f6f6f6; 28 | border: 1px solid #ccc; 29 | line-height: 22px; 30 | } 31 | 32 | .demo-control td span{ 33 | vertical-align: middle; 34 | } 35 | 36 | .demo-control td .textInput, 37 | .demo-control td .textInput-s, 38 | .demo-control td .textArea{ 39 | width: 195px; padding-left: 5px; 40 | height: 22px; 41 | line-height: 22px; 42 | border: 1px solid #ccc; 43 | } 44 | 45 | .demo-control td .textInput-s{ 46 | width: 50px; 47 | } 48 | 49 | .demo-control td .textArea{ 50 | height: 50px; 51 | overflow: auto; 52 | } 53 | 54 | .demo-control td .btn{ 55 | width: 60px; 56 | height: 22px; 57 | background-color: #ccc; 58 | line-height: 14px; 59 | padding: 0; 60 | } 61 | 62 | #hello, #world{ 63 | border: 1px solid #900; 64 | width: 290px; padding-left: 10px; 65 | line-height: 30px; 66 | text-align: left; 67 | background-color: #fff; 68 | } 69 | 70 | #world{ 71 | border-color: #009; 72 | } 73 | 74 | #temp-div #hello, #temp-div #world{ 75 | margin-top: 10px; 76 | } 77 | 78 | #temp-div{ 79 | position: absolute; 80 | left: 450px; top: 0; 81 | } 82 | 83 | .tang-body .content{ 84 | font-size: 14px; 85 | } -------------------------------------------------------------------------------- /demos/_Tooltip/focus.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Tooltip 组件 focus示例 7 | 8 | 9 | 10 | 11 | 12 | 15 | 16 | 17 | 18 |
19 |

Tooltip 组件 focus 示例

20 | 使文本域得到焦点或失去焦点来控制tooltip: 21 | 22 |



23 |
24 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /demos/_Tooltip/quickStart.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Tooltip 组件quickStart 7 | 8 | 9 | 10 | 11 | 12 | 15 | 16 | 17 | 18 |
19 |

Tooltip 组件

20 |
21 | 30 | 31 | 32 | -------------------------------------------------------------------------------- /demos/_Tooltip/render.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Tooltip 组件 render示例 7 | 8 | 9 | 10 | 11 | 12 | 15 | 16 | 17 | 18 |
19 |

Tooltip 组件 render 示例

20 |

tooltip的disposeOnHide参数用来设置当关闭tooltip时,是否也销毁tooltip来释放内存占用,默认值是true

21 |
22 | 34 | 35 | 36 | -------------------------------------------------------------------------------- /demos/common/demo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/common/demo.png -------------------------------------------------------------------------------- /demos/common/edit_clear.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/common/edit_clear.png -------------------------------------------------------------------------------- /demos/common/exec.js: -------------------------------------------------------------------------------- 1 | 2 | 3 | function exec(dom){ 4 | var cmd = dom.getAttribute("cmd"); 5 | try{ 6 | eval(parseCmd(cmd)); 7 | }catch(e){ 8 | window.alert("参数出错啦!"); 9 | } 10 | } 11 | 12 | function parseCmd(cmd){ 13 | var params = cmd.match(/#\{\w+\}/g) || []; 14 | var obj = {}; 15 | for(var i = 0, name, param, l = params.length; i < l; i ++){ 16 | param = params[i]; 17 | if(name = /#\{(\w+)\}/.test(param) && RegExp.$1) 18 | obj[name] = getValue(name); 19 | } 20 | cmd = baidu.string.format(cmd, obj); 21 | return cmd; 22 | } 23 | 24 | function getValue(dom){ 25 | return document.getElementById(dom).value; 26 | } -------------------------------------------------------------------------------- /demos/common/expander.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/common/expander.png -------------------------------------------------------------------------------- /demos/common/fullscreen_toggle.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/demos/common/fullscreen_toggle.png -------------------------------------------------------------------------------- /demos/common/shBrushJScript.js: -------------------------------------------------------------------------------- 1 | /** 2 | * SyntaxHighlighter 3 | * http://alexgorbatchev.com/SyntaxHighlighter 4 | * 5 | * SyntaxHighlighter is donationware. If you are using it, please donate. 6 | * http://alexgorbatchev.com/SyntaxHighlighter/donate.html 7 | * 8 | * @version 9 | * 3.0.83 (July 02 2010) 10 | * 11 | * @copyright 12 | * Copyright (C) 2004-2010 Alex Gorbatchev. 13 | * 14 | * @license 15 | * Dual licensed under the MIT and GPL licenses. 16 | */ 17 | ;(function() 18 | { 19 | // CommonJS 20 | typeof(require) != 'undefined' ? SyntaxHighlighter = require('shCore').SyntaxHighlighter : null; 21 | 22 | function Brush() 23 | { 24 | var keywords = 'break case catch continue ' + 25 | 'default delete do else false ' + 26 | 'for function if in instanceof ' + 27 | 'new null return super switch ' + 28 | 'this throw true try typeof var while with' 29 | ; 30 | 31 | var r = SyntaxHighlighter.regexLib; 32 | 33 | this.regexList = [ 34 | { regex: r.multiLineDoubleQuotedString, css: 'string' }, // double quoted strings 35 | { regex: r.multiLineSingleQuotedString, css: 'string' }, // single quoted strings 36 | { regex: r.singleLineCComments, css: 'comments' }, // one line comments 37 | { regex: r.multiLineCComments, css: 'comments' }, // multiline comments 38 | { regex: /\s*#.*/gm, css: 'preprocessor' }, // preprocessor tags like #region and #endregion 39 | { regex: new RegExp(this.getKeywords(keywords), 'gm'), css: 'keyword' } // keywords 40 | ]; 41 | 42 | this.forHtmlScript(r.scriptScriptTags); 43 | }; 44 | 45 | Brush.prototype = new SyntaxHighlighter.Highlighter(); 46 | Brush.aliases = ['js', 'jscript', 'javascript']; 47 | 48 | SyntaxHighlighter.brushes.JScript = Brush; 49 | 50 | // CommonJS 51 | typeof(exports) != 'undefined' ? exports.Brush = Brush : null; 52 | })(); 53 | -------------------------------------------------------------------------------- /docs/UI/carousel.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/docs/UI/carousel.png -------------------------------------------------------------------------------- /docs/UI/dialogue.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/docs/UI/dialogue.png -------------------------------------------------------------------------------- /docs/UI/dialogue.psd: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/docs/UI/dialogue.psd -------------------------------------------------------------------------------- /docs/UI/pager.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/docs/UI/pager.jpg -------------------------------------------------------------------------------- /docs/UI/sugestion.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/docs/UI/sugestion.png -------------------------------------------------------------------------------- /docs/UI/tab.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/docs/UI/tab.png -------------------------------------------------------------------------------- /docs/UI/tooltip.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/docs/UI/tooltip.png -------------------------------------------------------------------------------- /docs/UI/tooltip.psd: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/docs/UI/tooltip.psd -------------------------------------------------------------------------------- /docs/doto.txt: -------------------------------------------------------------------------------- 1 | [] dialog 的 show, hide 方法 2 | [] dialog.html 中那段恶心的 setInterval 代码封装 3 | [] 方荣的 Import 代码修复后代码调整 4 | [] .tang-dialog .tang-background .shadow 的数值移到 js 代码里 5 | [] 写一个 demo 页 6 | [] dialog render 方法尝试 7 | [] 完善 dialog jsdoc 8 | [] dialog 的插件示例 9 | [] dialog mask 的实现 10 | [] 检查 dialog dispatchEvent 是否书写正确 11 | [] filter 滤镜地址考虑 -------------------------------------------------------------------------------- /docs/readme.txt: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/docs/readme.txt -------------------------------------------------------------------------------- /docs/todo.txt: -------------------------------------------------------------------------------- 1 | [done] dialog-mask 的第二次 show 没有 mask 2 | [] control.dialog.mask 中 onload 触发两次(bug) 3 | [] 插件的 $ 符号支持 4 | [done] 遮羞布没有盖住 select 5 | [done] 遮羞布需要提供 zIndex 参数 6 | [done] dialog 的 show, hide 方法 7 | [done] dialog.html 中那段恶心的 setInterval 代码封装 8 | [done] 方荣的 Import 代码修复后代码调整 9 | [done] .tang-dialog .tang-background .shadow 的数值移到 js 代码里 10 | [done] dialog render 方法尝试 11 | [done] 完善 dialog jsdoc 12 | [done] dialog 的插件示例 13 | [done] dialog mask 的实现 14 | [done] 检查 dialog dispatchEvent 是否书写正确 15 | [done] filter 滤镜地址考虑 16 | [done] 绑事件的都移至 load 里去实现 17 | [done] dialog close-btn 的实现 18 | [done] resources 目录规范调整 19 | [done] tang-event 20 | 21 | 原则: 22 | 23 | 1、可能被重写的方法的类不能调用自己的该方法; 24 | 2、重写父类的方法时,保持输入输出一致; -------------------------------------------------------------------------------- /resources/default/common/common.css: -------------------------------------------------------------------------------- 1 | /* tang-ui mini reset, version: 0.9 */ 2 | .tang-ui dl, .tang-ui dt, .tang-ui dd, .tang-ui ul, .tang-ui ol, .tang-ui li, .tang-ui input{ 3 | margin: 0; 4 | padding: 0; 5 | } 6 | .tang-ui table{ 7 | border-collapse: collapse; 8 | border-spacing: 0; 9 | } 10 | .tang-ui img{ 11 | border: 0; 12 | } 13 | .tang-ui li{ 14 | list-style: none; 15 | } 16 | .tang-ui th{ 17 | text-align: left; 18 | } 19 | .tang-ui input, .tang-ui textarea, .tang-ui select{ 20 | font-family: inherit; 21 | font-size: inherit; 22 | font-weight: inherit; 23 | *font-size: 100%; 24 | } 25 | 26 | /* tang-ui commons */ 27 | .tang-ui{ 28 | 29 | } 30 | 31 | .tang-ui .tang-background{ 32 | position: absolute; 33 | z-index: -1; 34 | top: 0; left: 0; 35 | width: 100%; height: 100%; 36 | } 37 | 38 | .tang-ui .tang-foreground{ 39 | 40 | } -------------------------------------------------------------------------------- /resources/default/common/shadow.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/common/shadow.gif -------------------------------------------------------------------------------- /resources/default/common/shadow.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/common/shadow.png -------------------------------------------------------------------------------- /resources/default/magic.Background/corner.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.Background/corner.gif -------------------------------------------------------------------------------- /resources/default/magic.Background/corner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.Background/corner.png -------------------------------------------------------------------------------- /resources/default/magic.Background/horizontal.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.Background/horizontal.gif -------------------------------------------------------------------------------- /resources/default/magic.Background/horizontal.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.Background/horizontal.png -------------------------------------------------------------------------------- /resources/default/magic.Background/magic.Background.css: -------------------------------------------------------------------------------- 1 | /* 普通模式,直接使用 png 实现渐变透明的效果 */ 2 | .tang-background .top__{height:12px; font-size:1px;} 3 | .tang-background .middle__{font-size:1px;} 4 | .tang-background .bottom__{height:12px; font-size:1px;} 5 | 6 | .tang-background .left__{width:12px;} 7 | .tang-background .center__{} 8 | .tang-background .right__{width:12px;} 9 | 10 | /* 放入背景图 */ 11 | .tang-background .corner__{background:transparent url(corner.png) no-repeat;} 12 | .tang-background .vertical__{background:transparent url(vertical.png) repeat-x;} 13 | .tang-background .horizontal__{background:transparent url(horizontal.png) repeat-y;} 14 | .tang-background .midland__{background-image:url(midland.png);} 15 | 16 | .tang-background .top__ .left__{background-position:top left;} 17 | .tang-background .top__ .center__{background-position:top left;} 18 | .tang-background .top__ .right__{background-position:top right;} 19 | .tang-background .middle__ .left__{background-position:top left;} 20 | .tang-background .middle__ .right__{background-position:top right;} 21 | .tang-background .bottom__ .left__{background-position:bottom left;} 22 | .tang-background .bottom__ .center__{background-position:bottom left;} 23 | .tang-background .bottom__ .right__{background-position:bottom right;} 24 | /* 针对低端浏览器(IE6)使用gif代替png,优雅降级 */ 25 | .gif__{} 26 | .tang-background .gif__ .corner__{background-image:url(corner.gif);} 27 | .tang-background .gif__ .vertical__{background-image:url(vertical.gif);} 28 | .tang-background .gif__ .horizontal__{background-image:url(horizontal.gif);} 29 | .tang-background .gif__ .midland__{background-image:url(midland.gif);} -------------------------------------------------------------------------------- /resources/default/magic.Background/midland.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.Background/midland.gif -------------------------------------------------------------------------------- /resources/default/magic.Background/midland.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.Background/midland.png -------------------------------------------------------------------------------- /resources/default/magic.Background/vertical.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.Background/vertical.gif -------------------------------------------------------------------------------- /resources/default/magic.Background/vertical.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.Background/vertical.png -------------------------------------------------------------------------------- /resources/default/magic.Calendar/bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.Calendar/bg.png -------------------------------------------------------------------------------- /resources/default/magic.Pager/magic.Pager.css: -------------------------------------------------------------------------------- 1 | .tang-pager { 2 | font-size : 13px; 3 | font-family : arial; 4 | } 5 | 6 | .tang-pager .tang-pager-first, 7 | .tang-pager .tang-pager-previous, 8 | .tang-pager .tang-pager-normal, 9 | .tang-pager .tang-pager-current, 10 | .tang-pager .tang-pager-next, 11 | .tang-pager .tang-pager-last { 12 | display : inline-block; 13 | margin-right : 5px; 14 | height : 24px; 15 | line-height : 24px; 16 | } 17 | 18 | .tang-pager .tang-pager-first, 19 | .tang-pager .tang-pager-previous, 20 | .tang-pager .tang-pager-normal, 21 | .tang-pager .tang-pager-next, 22 | .tang-pager .tang-pager-last { 23 | text-decoration : none; 24 | border : 1px solid #e7ecf0; 25 | color : #0000cd; 26 | } 27 | 28 | .tang-pager .tang-pager-first, 29 | .tang-pager .tang-pager-previous, 30 | .tang-pager .tang-pager-next, 31 | .tang-pager .tang-pager-last { 32 | padding : 0 8px; 33 | } 34 | 35 | .tang-pager .tang-pager-normal, 36 | .tang-pager .tang-pager-current { 37 | padding : 0 10px; 38 | } 39 | 40 | .tang-pager .tang-pager-first:hover, 41 | .tang-pager .tang-pager-previous:hover, 42 | .tang-pager .tang-pager-normal:hover, 43 | .tang-pager .tang-pager-next:hover, 44 | .tang-pager .tang-pager-last:hover { 45 | background : #e9f1f7; 46 | } 47 | 48 | .tang-pager .tang-pager-current { 49 | font-weight : bold; 50 | } -------------------------------------------------------------------------------- /resources/default/magic.Tooltip/arrow.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.Tooltip/arrow.gif -------------------------------------------------------------------------------- /resources/default/magic.Tooltip/arrow.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.Tooltip/arrow.png -------------------------------------------------------------------------------- /resources/default/magic.Tooltip/close.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.Tooltip/close.gif -------------------------------------------------------------------------------- /resources/default/magic.control.Carousel/carousel-btn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Carousel/carousel-btn.png -------------------------------------------------------------------------------- /resources/default/magic.control.Carousel/carousel-vertical-btn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Carousel/carousel-vertical-btn.png -------------------------------------------------------------------------------- /resources/default/magic.control.Carousel/dotted.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Carousel/dotted.png -------------------------------------------------------------------------------- /resources/default/magic.control.Carousel/magic.control.Carousel-vertical.css: -------------------------------------------------------------------------------- 1 | .tang-carousel { 2 | background: #f4f4f4; 3 | } 4 | .tang-carousel-container { 5 | position: relative;/*must*/ 6 | width: 140px; 7 | height: 560px; 8 | overflow: hidden; 9 | } 10 | .tang-carousel-container .tang-carousel-element { 11 | width: 140px; 12 | } 13 | .tang-carousel-container .tang-carousel-element .tang-carousel-item { 14 | width: 120px; 15 | height: 120px; 16 | padding: 10px; 17 | } 18 | .tang-carousel-container .tang-carousel-element .tang-carousel-item-selected { 19 | background: skyblue; 20 | } 21 | 22 | /*btn*/ 23 | .tang-carousel-btn { 24 | display: block; 25 | width: 62px; 26 | height: 42px; 27 | margin: 0 auto; 28 | background: url(carousel-vertical-btn.png) no-repeat; 29 | } 30 | 31 | 32 | a.tang-carousel-btn-prev:link, 33 | a.tang-carousel-btn-prev:visited {background-position: 0px 0px;} 34 | a.tang-carousel-btn-next:link, 35 | a.tang-carousel-btn-next:visited {background-position: 0px -42px;} 36 | a.tang-carousel-btn-prev:hover { 37 | background-position: -62px 0px; 38 | background-color: #0084ff; 39 | } 40 | a.tang-carousel-btn-next:hover { 41 | background-position: -62px -42px; 42 | background-color: #0084ff; 43 | } 44 | 45 | 46 | a.tang-carousel-btn-prev-disabled:link, 47 | a.tang-carousel-btn-prev-disabled:visited, 48 | a.tang-carousel-btn-prev-disabled:hover, 49 | a.tang-carousel-btn-prev-disabled:active { 50 | background-position: -124px 0px; 51 | } 52 | 53 | a.tang-carousel-btn-next-disabled:link, 54 | a.tang-carousel-btn-next-disabled:visited, 55 | a.tang-carousel-btn-next-disabled:hover, 56 | a.tang-carousel-btn-next-disabled:active { 57 | background-position: -124px -42px; 58 | } 59 | 60 | -------------------------------------------------------------------------------- /resources/default/magic.control.Carousel/magic.control.Carousel.css: -------------------------------------------------------------------------------- 1 | .tang-carousel { 2 | background: #f4f4f4; 3 | } 4 | .tang-carousel-container { 5 | position: relative;/*must*/ 6 | float:left; 7 | width: 560px; 8 | height: 140px; 9 | overflow: hidden; 10 | } 11 | .tang-carousel-container .tang-carousel-element { 12 | height: 140px; 13 | } 14 | .tang-carousel-container .tang-carousel-element .tang-carousel-item { 15 | float: left; 16 | display: inline; 17 | width: 120px; 18 | height: 120px; 19 | padding: 10px; 20 | } 21 | .tang-carousel-container .tang-carousel-element .tang-carousel-item-selected { 22 | background: skyblue; 23 | } 24 | 25 | /*btn*/ 26 | .tang-carousel-btn { 27 | float:left; 28 | margin-top: 45px; 29 | width: 42px; 30 | height: 42px; 31 | background: url(carousel-btn.png) no-repeat; 32 | } 33 | 34 | 35 | a.tang-carousel-btn-prev:link, 36 | a.tang-carousel-btn-prev:visited {background-position: 0px 0px;} 37 | a.tang-carousel-btn-next:link, 38 | a.tang-carousel-btn-next:visited {background-position: -42px 0px;} 39 | a.tang-carousel-btn-prev:hover { 40 | background-position: 0px -42px; 41 | background-color: #0084ff; 42 | } 43 | a.tang-carousel-btn-next:hover { 44 | background-position: -42px -42px; 45 | background-color: #0084ff; 46 | } 47 | 48 | 49 | a.tang-carousel-btn-prev-disabled:link, 50 | a.tang-carousel-btn-prev-disabled:visited, 51 | a.tang-carousel-btn-prev-disabled:hover, 52 | a.tang-carousel-btn-prev-disabled:active { 53 | background-position: 0px -84px; 54 | } 55 | 56 | a.tang-carousel-btn-next-disabled:link, 57 | a.tang-carousel-btn-next-disabled:visited, 58 | a.tang-carousel-btn-next-disabled:hover, 59 | a.tang-carousel-btn-next-disabled:active { 60 | background-position: -42px -84px; 61 | } 62 | 63 | -------------------------------------------------------------------------------- /resources/default/magic.control.ComboBox/magic-combobox-arrow.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.ComboBox/magic-combobox-arrow.gif -------------------------------------------------------------------------------- /resources/default/magic.control.ComboBox/magic.control.ComboBox.css: -------------------------------------------------------------------------------- 1 | .clearfix:after { 2 | content : "."; 3 | display : block; 4 | visibility : hidden; 5 | height : 0; 6 | clear : both; 7 | } 8 | 9 | .clearfix { 10 | zoom : 1; 11 | } 12 | .magic-combobox { 13 | border : 1px solid; 14 | border-top-color : #979797; 15 | border-right-color : #a9a9a9; 16 | border-bottom-color : #a9a9a9; 17 | border-left-color : #979797; 18 | background : #fff; 19 | display : inline-block; 20 | } 21 | .magic-combobox .magic-combobox-input-container { 22 | } 23 | 24 | .magic-combobox .magic-combobox-input-container .magic-combobox-input-outter { 25 | float : left; 26 | margin-right : -20px; 27 | width : 100%; 28 | } 29 | 30 | .magic-combobox .magic-combobox-input-container .magic-combobox-input-inner { 31 | margin-right : 20px; 32 | margin-left : 10px; 33 | } 34 | 35 | .magic-combobox .magic-combobox-input { 36 | height: 23px; 37 | width : 100%; 38 | border : 0; 39 | padding : 0; 40 | margin : 0; 41 | line-height : 17px; 42 | font-size : 12px; 43 | color : #333; 44 | background : #fff; 45 | /* hack for IE7 */ 46 | +margin : -1px 0; 47 | /* hack for IE8 */ 48 | height : 21px\0; 49 | } 50 | .magic-combobox .magic-combobox-input:focus { 51 | outline : none; 52 | } 53 | 54 | .magic-combobox .magic-combobox-arrow { 55 | margin-top : 4px; 56 | float : right; 57 | display : block; 58 | width : 15px; 59 | height : 15px; 60 | overflow : hidden; 61 | background : url(magic-combobox-arrow.gif) no-repeat 0 0; 62 | border-left : 1px solid #a9a9a9; 63 | } 64 | 65 | .magic-combobox .magic-combobox-arrow:hover { 66 | border-left-color : #256eff; 67 | background-position: -15px 0; 68 | } 69 | 70 | .magic-combobox-menu,.magic-combobox-menu .magic-combobox-menu-item { 71 | padding : 0; 72 | margin : 0; 73 | } 74 | 75 | .magic-combobox-menu { 76 | border : 1px solid #979797; 77 | /*border-top : none;*/ 78 | list-style : none; 79 | box-shadow : 3px 3px 3px rgba(0,0,0,.25); 80 | overflow : auto; 81 | background : #fff; 82 | } 83 | 84 | .magic-combobox-menu .magic-combobox-menu-item { 85 | font-size : 12px; 86 | cursor : default; 87 | padding : 6px 0 6px 10px; 88 | } 89 | 90 | .magic-combobox-menu .magic-combobox-menu-item-hover { 91 | background-color : #303030; 92 | color : #fff; 93 | } 94 | 95 | .magic-combobox-disable .magic-combobox-input-container { 96 | background : #f3f3f3; 97 | border-top-color : #9e9e9e; 98 | border-right-color : #a9a9a9; 99 | border-bottom-color : #a9a9a9; 100 | border-left-color : #9e9e9e; 101 | } 102 | 103 | .magic-combobox-disable .magic-combobox-input { 104 | background : #f3f3f3; 105 | color : #cacaca; 106 | } 107 | 108 | .magic-combobox-disable .magic-combobox-arrow, 109 | .magic-combobox-disable .magic-combobox-arrow:hover { 110 | cursor : default; 111 | border-left-color : #d9d9d9; 112 | background-position: -30px center; 113 | } 114 | 115 | .magic-combobox-host { 116 | position : relative; 117 | 118 | } 119 | .magic-combobox-container-setup { 120 | position : absolute; 121 | top : -5px; 122 | left : 0; 123 | } 124 | -------------------------------------------------------------------------------- /resources/default/magic.control.Dialog/btns.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Dialog/btns.gif -------------------------------------------------------------------------------- /resources/default/magic.control.Dialog/dialog.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Dialog/dialog.png -------------------------------------------------------------------------------- /resources/default/magic.control.Dialog/shadow.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Dialog/shadow.gif -------------------------------------------------------------------------------- /resources/default/magic.control.Dialog/shadow.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Dialog/shadow.png -------------------------------------------------------------------------------- /resources/default/magic.control.Popup/magic.control.Popup.css: -------------------------------------------------------------------------------- 1 | /* Techird: Disable these rules at 2013/01/07 */ 2 | .tang-popup{} 3 | 4 | .tang-popup .tang-foreground { 5 | /*padding:5px;*/ 6 | } 7 | 8 | .tang-popup .tang-background { 9 | /*border:1px solid #CCCCCC;*/ 10 | /*background-color:#FFFFFF;*/ 11 | } -------------------------------------------------------------------------------- /resources/default/magic.control.ScrollPanel/bg.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.ScrollPanel/bg.gif -------------------------------------------------------------------------------- /resources/default/magic.control.ScrollPanel/magic.control.ScrollPanel.css: -------------------------------------------------------------------------------- 1 | .tang-scrollpanel{ 2 | overflow:hidden; 3 | } 4 | .tang-scrollpanel .tang-scrollpanel-wrapper{ 5 | position: relative; 6 | overflow: hidden; 7 | } 8 | .tang-scrollpanel .tang-scrollpanel-content{ 9 | position: absolute; 10 | left:0; 11 | top:0; 12 | } 13 | /** slider */ 14 | .tang-scrollpanel .tang-slider { 15 | font-size: 0; 16 | position:absolute; 17 | top:0; 18 | right:0; 19 | background:url(bg.gif) repeat-y -18px 0; 20 | } 21 | .tang-scrollpanel .tang-slider .tang-inner { 22 | position: relative; 23 | } 24 | 25 | .tang-scrollpanel .tang-slider-vtl { 26 | height: 100%; 27 | } 28 | .tang-scrollpanel .tang-slider-vtl .tang-view { 29 | position: absolute; 30 | top: 0; 31 | bottom: 0; 32 | *height: 100%; 33 | } 34 | .tang-scrollpanel .tang-slider-vtl .tang-content { 35 | position: absolute; 36 | top: 0; 37 | bottom: 0; 38 | height: 100%; 39 | } 40 | .tang-scrollpanel .tang-slider-vtl .tang-inner { 41 | display:none; 42 | } 43 | 44 | .tang-scrollpanel .tang-slider-vtl .tang-corner { 45 | height: 18px; 46 | width: 18px; 47 | background:url(bg.gif) no-repeat; 48 | position: absolute; 49 | } 50 | .tang-scrollpanel .tang-slider-vtl .tang-start { 51 | left: 0; 52 | top:0; 53 | background-position:0 0; 54 | } 55 | .tang-scrollpanel .tang-slider-vtl .tang-last { 56 | left: 0; 57 | bottom:0; 58 | background-position:0 -18px; 59 | } 60 | 61 | /** 游标 */ 62 | .tang-scrollpanel .tang-slider .tang-knob { 63 | position: absolute; 64 | display: block; 65 | height: 16px; 66 | width: 16px; 67 | border:1px solid #d2d2d3; 68 | outline: none; 69 | z-index: 10; 70 | cursor: default; 71 | } 72 | .tang-scrollpanel .tang-slider-vtl .tang-knob { 73 | background:#fff; 74 | } -------------------------------------------------------------------------------- /resources/default/magic.control.Slider/cache-h-bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Slider/cache-h-bg.png -------------------------------------------------------------------------------- /resources/default/magic.control.Slider/cache-h-corner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Slider/cache-h-corner.png -------------------------------------------------------------------------------- /resources/default/magic.control.Slider/cache-v-bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Slider/cache-v-bg.png -------------------------------------------------------------------------------- /resources/default/magic.control.Slider/cache-v-corner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Slider/cache-v-corner.png -------------------------------------------------------------------------------- /resources/default/magic.control.Slider/slider-h-bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Slider/slider-h-bg.png -------------------------------------------------------------------------------- /resources/default/magic.control.Slider/slider-h-bg1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Slider/slider-h-bg1.png -------------------------------------------------------------------------------- /resources/default/magic.control.Slider/slider-h-corner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Slider/slider-h-corner.png -------------------------------------------------------------------------------- /resources/default/magic.control.Slider/slider-h-knob.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Slider/slider-h-knob.png -------------------------------------------------------------------------------- /resources/default/magic.control.Slider/slider-h-knobHover.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Slider/slider-h-knobHover.png -------------------------------------------------------------------------------- /resources/default/magic.control.Slider/slider-v-bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Slider/slider-v-bg.png -------------------------------------------------------------------------------- /resources/default/magic.control.Slider/slider-v-bg1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Slider/slider-v-bg1.png -------------------------------------------------------------------------------- /resources/default/magic.control.Slider/slider-v-corner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Slider/slider-v-corner.png -------------------------------------------------------------------------------- /resources/default/magic.control.Slider/slider-v-knob.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Slider/slider-v-knob.png -------------------------------------------------------------------------------- /resources/default/magic.control.Slider/slider-v-knobHover.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Slider/slider-v-knobHover.png -------------------------------------------------------------------------------- /resources/default/magic.control.Slider/sliderThumbs.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Slider/sliderThumbs.png -------------------------------------------------------------------------------- /resources/default/magic.control.Suggestion/magic.control.Suggestion.css: -------------------------------------------------------------------------------- 1 | /** 2 | * Suggestion默认皮肤样式 3 | */ 4 | .tang-suggestion { 5 | font-family: Arial, '宋体'; 6 | font-size: 14px; 7 | color: #000; 8 | } 9 | .tang-suggestion input.tang-suggestion-input { 10 | border: 1px solid #817f82; 11 | height: 22px; 12 | padding-top: 6px; 13 | padding-bottom: 2px; 14 | width: 534px; 15 | background: url(suggestion-input-bg.gif) no-repeat 0 0 #FFF; 16 | font-family: Arial, '宋体'; 17 | font-size: 14px; 18 | color: #000; 19 | padding-left: 8px; 20 | } 21 | .tang-suggestion-popup { 22 | display: none; 23 | font-size: 14px; 24 | background-color: #fff; 25 | } 26 | .tang-suggestion-popup .tang-background { 27 | border: none; 28 | box-shadow: 1px 1px 3px rgba(0,0,0,.3); 29 | } 30 | .tang-suggestion-popup .tang-background table { 31 | display: none; 32 | } 33 | .tang-suggestion-popup .tang-foreground { 34 | border: 1px solid #817f82; 35 | padding: 0; 36 | overflow: hidden; 37 | } 38 | .tang-suggestion-popup .tang-suggestion-prepend, 39 | .tang-suggestion-popup .tang-suggestion-append { 40 | height: 24px; 41 | line-height: 24px; 42 | padding-left: 8px; 43 | color: #888; 44 | font-size: 12px; 45 | border-bottom: 1px solid #ebebeb; 46 | } 47 | .tang-suggestion-popup .tang-suggestion-append { 48 | border-top: 1px solid #ebebeb; 49 | border-bottom: none; 50 | } 51 | .tang-suggestion-popup .tang-suggestion-table { 52 | width: 100%; 53 | } 54 | .tang-suggestion-popup .tang-suggestion-table td { 55 | padding: 6px 8px; 56 | white-space: nowrap; 57 | } 58 | 59 | .tang-suggestion-popup .tang-suggestion-table td.tang-suggestion-current { 60 | background-color: #ebebeb; 61 | } 62 | .tang-suggestion-popup .tang-suggestion-table td.tang-suggestion-disable { 63 | background-color: #999; 64 | } 65 | -------------------------------------------------------------------------------- /resources/default/magic.control.Suggestion/suggestion-input-bg.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Suggestion/suggestion-input-bg.gif -------------------------------------------------------------------------------- /resources/default/magic.control.Tab/magic.control.Tab.css: -------------------------------------------------------------------------------- 1 | .tang-tab { 2 | 3 | } 4 | .tang-tab .tang-title { 5 | height: 28px; 6 | clear: both; 7 | overflow : hidden; 8 | background: url(tab-dotted.png) repeat-x 0px bottom; 9 | } 10 | 11 | 12 | .tang-tab .tang-title .tang-title-item { 13 | float: left; 14 | margin-right: 3px; 15 | } 16 | 17 | .tang-tab .tang-title .tang-title-item-selected {} 18 | 19 | 20 | .tang-tab .tang-title .tang-title-item a { 21 | display: inline-block; 22 | font-size: 12px; 23 | color: #303030; 24 | line-height: 28px; 25 | padding-left: 3px; 26 | background: url(tab-title-item.png) no-repeat 0px -28px; 27 | text-decoration: none; 28 | outline: none; 29 | } 30 | .tang-tab .tang-title .tang-title-item a span { 31 | display: block; 32 | background: url(tab-title-item.png) no-repeat right -112px; 33 | padding: 0px 12px 0px 10px; 34 | text-align: center; 35 | } 36 | .tang-tab .tang-title .tang-title-item-selected a { 37 | font-weight: bold; 38 | background-position: left 0px; 39 | } 40 | .tang-tab .tang-title .tang-title-item-selected a span{ 41 | background-position: right -84px; 42 | } 43 | /*link*/ 44 | .tang-tab .tang-title .tang-title-item a:hover { 45 | background-position: left -56px; 46 | } 47 | .tang-tab .tang-title .tang-title-item a:hover span { 48 | background-position: right -140px; 49 | } 50 | .tang-tab .tang-title .tang-title-item-selected a:hover { 51 | background-position: left 0px; 52 | } 53 | .tang-tab .tang-title .tang-title-item-selected a:hover span { 54 | background-position: right -84px; 55 | } 56 | 57 | .tang-tab .tang-body { 58 | clear : both; 59 | } 60 | .tang-tab .tang-body .tang-body-item { 61 | display: none; 62 | } 63 | .tang-tab .tang-body .tang-body-item-selected { 64 | display: block; 65 | } 66 | -------------------------------------------------------------------------------- /resources/default/magic.control.Tab/tab-dotted.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Tab/tab-dotted.png -------------------------------------------------------------------------------- /resources/default/magic.control.Tab/tab-title-item.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/resources/default/magic.control.Tab/tab-title-item.png -------------------------------------------------------------------------------- /resources/readme.txt: -------------------------------------------------------------------------------- 1 | 2 | resources 为 tangram-ui 的资源目录,请将此目录布署到适合的位置,在开始写 ui 组 3 | 件的使用代码之前,先用 magic.resourcePath = "资源目录地址" 来告诉 tangram 你 4 | 把 resources 布署到哪里,地址相对于当前页面。 5 | 6 | default 目录为皮肤目录,里面存放与皮肤相关的 css 与图片文件,default 为 tangram 7 | 的默认皮肤,如果想应用自己的皮肤,可以把 default 拷贝一份,放于与 default 同级 8 | 目录下,目录名称即为皮肤名称,并且将目录里面的样式与图片按自己的皮肤需求进行更 9 | 改。网页上如果应用定制的新皮肤,请使用 magic.skinName = "皮肤名称" -------------------------------------------------------------------------------- /src/magic.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Copyright (c) 2012, Baidu Inc. All rights reserved. 3 | * Licensed under the BSD License 4 | * you may not use this file except in compliance with the License. 5 | * You may obtain a copy of the License at 6 | * 7 | * http://tangram.baidu.com/license.html 8 | * 9 | * Unless required by applicable law or agreed to in writing, software 10 | * distributed under the License is distributed on an "AS-IS" BASIS, 11 | * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 | * See the License for the specific language governing permissions and 13 | * limitations under the License. 14 | */ 15 | 16 | /** 17 | * 声明 MagicCube 包 18 | * @author dron 19 | * 20 | * 每位工程师都有保持代码优雅的义务 21 | * each engineer has a duty to keep the code elegant 22 | */ 23 | 24 | if(typeof magic != "function"){ 25 | var magic = function(){ 26 | // TODO: 27 | }; 28 | } 29 | 30 | magic.resourcePath = ""; 31 | magic.skinName = "default"; 32 | magic.version = "1.1.0.3"; 33 | 34 | /msie 6/i.test(navigator.userAgent) && 35 | document.execCommand("BackgroundImageCache", false, true); 36 | -------------------------------------------------------------------------------- /src/magic/Background/$styleBox.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Tangram 3 | * Copyright 2011 Baidu Inc. All rights reserved. 4 | * 5 | * version: 0.1 6 | * create: 2011/12/18 7 | * author: meizz 8 | */ 9 | 10 | ///import magic.Background; 11 | ///import baidu.lang.register; 12 | 13 | ///import baidu.browser.ie; 14 | 15 | /** 16 | * @description 给背景层添加一个“九宫格”的插件,可以让用户插入复杂的背景样式如PNG透明,提供一组可外调的CSS:tang-background、tang-background-inner 17 | * @name magic.Background.$styleBox 18 | * @addon 19 | * @param {Object} options 插件选项 20 | * @param {Boolean} options.styleBox 插件开关,默认false 21 | * @author meizz 22 | * @example 23 | * /// for options.styleBox 24 | * var instance = new magic.Background({ 25 | * styleBox: true // 启用九宫格方案 26 | * }); 27 | */ 28 | baidu.lang.register(magic.Background, function(opt){ 29 | if (this.styleBox) { 30 | this._innerHTML = ["" 33 | ,"" 34 | ,"" 35 | ,"" 36 | ,"" 37 | ,"" 38 | ,"" 39 | ,"" 40 | ,"" 41 | ,"" 42 | ,"" 43 | ,"" 44 | ,"" 45 | ,"" 46 | ,"" 47 | ,"" 48 | ,"
   
 ",(this._innerHTML||" ")," 
   
" 49 | ].join(""); 50 | } 51 | }); 52 | -------------------------------------------------------------------------------- /src/magic/Calendar/$today.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Tangram 3 | * Copyright 2012 Baidu Inc. All rights reserved. 4 | * author: robin 5 | */ 6 | 7 | ///import baidu.lang.register; 8 | ///import magic.Calendar; 9 | ///import baidu.i18n.date; 10 | ///import baidu.event.shortcut; 11 | ///import baidu.dom.show; 12 | 13 | /** 14 | * @description 对话框按钮插件 15 | * @name magic.Calendar.$today 16 | * @addon 17 | * @param {Object} options 插件选项 18 | * @param {String} options.today.enable 插件开关,默认false 19 | * @example 20 | * ///for options.today.enable 21 | * var instance = new magic.Calendar({ 22 | * weekStart: 'sat', 23 | * initDate: new Date() 24 | * highlightDates: [new Date('2012/05/06'), new Date('2010/09/12'), {start: new Date('2012/05/15'), end: new Date('2012/06/05')}, new Date('2012/06/30')], 25 | * disabledDates: [{end: new Date('2012/05/05')}, new Date('2012/06/25')], 26 | * language: 'zh-CN' 27 | * today: { 28 | * enable: true 29 | * } 30 | * }); 31 | * instance.render('calendar-container'); 32 | */ 33 | baidu.lang.register(magic.Calendar, 34 | /* constructor */function(options){ 35 | if(options && !(options.today || {}).enable){ return; } 36 | var me = this, 37 | todaySkeleton = ['']; 40 | me.on("render", function(){ 41 | //创建骨架 42 | baidu(me.footerEl).append(todaySkeleton.join('')); 43 | //事件处理 44 | var todayBtn = me.getElement('today'), eventHandler; 45 | baidu(todayBtn).click(eventHandler = function(){ 46 | me.setDate(new Date()); 47 | me.fire("selectdate", { 48 | 'date': me.getDate() 49 | }); 50 | }) 51 | me.on("dispose", function(){ 52 | baidu(todayBtn).off("click", eventHandler); 53 | }); 54 | baidu(me.footerEl).show(); 55 | }); 56 | },{} 57 | ); -------------------------------------------------------------------------------- /src/magic/Carousel/$button.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Tangram 3 | * Copyright 2011 Baidu Inc. All rights reserved. 4 | */ 5 | 6 | ///import baidu.lang.register; 7 | ///import magic.Carousel; 8 | ///import baidu.array.each; 9 | ///import magic.control.Carousel.$button; 10 | ///import baidu.dom.prepend; 11 | 12 | /** 13 | * @description 为图片轮播组件添加前后按钮插件 14 | * @name magic.Carousel.$button 15 | * @addon 16 | * @param {Object} options 插件选项 17 | * @param {Boolean} options.button.enable 插件开关,默认true 18 | * @param {Object} options.button.buttonLabel 前后按钮的文字描述,参考值:{prev: 'left', next: 'right'} 19 | * @author linlingyu 20 | * @example 21 | * /// for options.button.enable,options.button.buttonLabel 22 | * var instance = magic.setup.carousel('one-carousel', { 23 | * button: { 24 | * enable: true, 25 | * buttonLabel: { 26 | * prev: '上一张', 27 | * next: '下一张' 28 | * } 29 | * } 30 | * }); 31 | */ 32 | baidu.lang.register(magic.Carousel, function(options){ 33 | var me = this, 34 | tplButton = '#{content}'; 35 | 36 | me._options.button = baidu.object.extend({ 37 | buttonLabel: { 38 | prev: '', 39 | next: '' 40 | } 41 | }, me._options.button); 42 | 43 | if(!me._options.button.enable){return;} 44 | me.on('ondomready', function(evt){ 45 | var container = me.getElement(); 46 | baidu.dom(container).prepend(baidu.string.format(tplButton, { 47 | 'class': 'tang-carousel-btn-prev', 48 | content: me._options.button.buttonLabel.prev 49 | })); 50 | baidu.dom(container).append(baidu.string.format(tplButton, { 51 | 'class': 'tang-carousel-btn-next', 52 | content: me._options.button.buttonLabel.next 53 | })); 54 | me.on('ondispose', function(){ 55 | baidu(['prev', 'next']).each(function(index, item){ 56 | baidu.dom(me.getElement(item)).remove(); 57 | }); 58 | }); 59 | }); 60 | }); -------------------------------------------------------------------------------- /src/magic/control.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Tangram 3 | * Copyright 2011 Baidu Inc. All rights reserved. 4 | * 5 | * namespace: magic.control 6 | * author: meizz 7 | * version: 0.1 8 | * date: 2011/11/28 9 | */ 10 | 11 | ///import magic; 12 | 13 | /** 14 | * 按 VCD 模式,将 Control 与 View 分离,所有模块的 control 皆放在此空间下 15 | * @namespace magic.control 16 | * @name magic.control 17 | */ 18 | magic.control = magic.control || {}; 19 | -------------------------------------------------------------------------------- /src/magic/control/Carousel/$itemModify.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Tangram 3 | * Copyright 2011 Baidu Inc. All rights reserved. 4 | */ 5 | 6 | ///import baidu.lang.register; 7 | ///import magic.control.Carousel; 8 | ///import baidu.array.each; 9 | ///import baidu.array.removeAt; 10 | ///import baidu.array.indexOf; 11 | /** 12 | * @description 为图片轮播组件增加数据操作功能 13 | * @name magic.control.Carousel.$itemModify 14 | * @addon 15 | * @param {Object} options 插件选项 16 | * @param {Boolean} options.fx.enable 插件开关,默认 true 17 | * @author 夏登平 xiadengping@baidu.com 18 | * @example 19 | * /// for options.itemModify.enable 20 | * var instance = new magic.Carousel({ 21 | * itemModify: { 22 | * enable: true 23 | * } 24 | * }); 25 | */ 26 | baidu.lang.register(magic.control.Carousel, function(options){ 27 | var me = this; 28 | me._options.itemsModify = baidu.object.extend({ 29 | enable: true 30 | }, me._options.itemsModify); 31 | if(!me._options.itemsModify.enable){return;} 32 | 33 | }, { 34 | /** 35 | * @description 删除某一项 36 | * @name magic.control.Carousel#removeItem 37 | * @function 38 | * @grammar magic.control.Carousel#removeItem() 39 | * @param {Number} index 需要删除的索引项 40 | * @example 41 | * var instance = new magic.Carousel(option); 42 | * instance.removeItem(0); // 删除第0项 43 | */ 44 | removeItem : function(index) { 45 | //debugger; 46 | if (index >= this._dataIds.length) { 47 | return; 48 | } 49 | var me = this, 50 | focusRange = me._options.focusRange, 51 | viewSize = me._options.viewSize, 52 | element = me.getElement('element'), 53 | child = baidu.makeArray(baidu.dom(element).children()), 54 | totalCount = me._dataIds.length, 55 | removeTarget = baidu('#' + me._dataIds[index]), 56 | viewIds = [], 57 | count, insertItem; 58 | baidu.array(child).each(function(index, item) { 59 | viewIds.push(item.id); 60 | }) 61 | if (baidu.array(viewIds).indexOf(me._dataIds[index]) != -1) { 62 | baidu(removeTarget).remove(); 63 | if (me._dataIds.length > viewSize) { 64 | count = baidu.array(me._dataIds).indexOf(child[viewSize - 1].id) + 1; 65 | if (count == me._dataIds.length) { 66 | count = 0; 67 | } 68 | insertItem = me._getItem(count); 69 | insertItem.insert(element, 'forward'); 70 | insertItem.loadContent(); 71 | me._resize(); 72 | } 73 | } 74 | delete me._datas[me._getItem(index).guid]; 75 | baidu.array(me._dataIds).removeAt(index); 76 | if (index >= me._dataIds.length) { 77 | index = 0; 78 | } 79 | if(me._selectedIndex == index && me._dataIds.length > 0) { 80 | //me._selectedIndex = -1; 81 | me.focus(index); 82 | } 83 | } 84 | }); -------------------------------------------------------------------------------- /src/magic/control/Layer.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Tangram 3 | * Copyright 2011 Baidu Inc. All rights reserved. 4 | * 5 | * version: 0.1 6 | * date: 2011/11/29 7 | * author: meizz 8 | */ 9 | 10 | ///import magic.Base; 11 | ///import magic.control; 12 | ///import baidu.dom.css; 13 | ///import baidu.dom.width; 14 | ///import baidu.dom.height; 15 | ///import baidu.object.extend; 16 | ///import baidu.lang.createClass; 17 | 18 | /** 19 | * 所有 Layer 基类 20 | * @class 21 | * @name magic.control.Layer 22 | * @grammar new magic.control.Layer(options) 23 | * @superClass magic.Base 24 | * @author meizz 25 | * @param {Object} options 选项参数 26 | * @config {Object} width 宽度,默认auto 27 | * @config {Object} height 高度,默认auto 28 | * @class magic.control.Layer 29 | * @author meizz 30 | */ 31 | magic.control.Layer = baidu.lang.createClass(function(setting){ 32 | this.width = "auto"; 33 | this.height= "auto"; 34 | 35 | baidu.object.extend(this, setting||{}); 36 | },{ 37 | type : "magic.control.Layer" 38 | ,superClass : magic.Base 39 | }) 40 | .extend( 41 | /** @lends magic.control.Layer.prototype */ 42 | { 43 | /** 44 | * @description 通用展现方法 45 | * @name magic.control.Layer#show 46 | * @function 47 | * @grammar magic.control.Layer#show() 48 | */ 49 | show : function(){ 50 | if (this.fire("onbeforeshow")) { 51 | this.getElement().style.display = ""; 52 | this.fire("onshow"); 53 | } 54 | } 55 | /** 56 | * @description 通用隐藏方法 57 | * @name magic.control.Layer#hide 58 | * @function 59 | * @grammar magic.control.Layer#hide() 60 | */ 61 | ,hide : function(){ 62 | if (this.fire("onbeforehide")) { 63 | this.getElement().style.display = "none"; 64 | this.fire("onhide"); 65 | } 66 | } 67 | 68 | /** 69 | * @description 通用设置宽度 70 | * @name magic.control.Layer#setWidth 71 | * @function 72 | * @grammar magic.control.Layer#setWidth() 73 | * @param {Number} width 宽度值:30%|30px|30em|3cm 74 | */ 75 | ,setWidth : function(width) { 76 | this.width = width; 77 | baidu(this.getElement()).width(width); 78 | } 79 | 80 | /** 81 | * @description 通用设置高度 82 | * @name magic.control.Layer#setHeight 83 | * @function 84 | * @grammar magic.control.Layer#setHeight() 85 | * @param {Number} height 高度值:30%|30px|30em|3cm 86 | */ 87 | ,setHeight : function(height) { 88 | this.height = height; 89 | baidu.dom(this.getElement()).height(height); 90 | } 91 | 92 | /** 93 | * @description 通用设置大小 94 | * @name magic.control.Layer#setSize 95 | * @function 96 | * @grammar magic.control.Layer#setSize() 97 | * @param {Number} size {width, height}|[width, height] 98 | * @param {Number} size.width 宽度值:30%|30px|30em|3cm 99 | * @param {Number} size.height 高度值:30%|30px|30em|3cm 100 | */ 101 | ,setSize : function(size){ 102 | this.setWidth(size.width || size[0]); 103 | this.setHeight(size.height||size[1]); 104 | } 105 | }); 106 | -------------------------------------------------------------------------------- /src/magic/control/Slider/$cache.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Tangram 3 | * Copyright 2011 Baidu Inc. All rights reserved. 4 | */ 5 | 6 | ///import baidu.lang.register; 7 | ///import magic.control.Slider; 8 | ///import baidu.dom.prepend; 9 | ///import baidu.dom.css; 10 | ///import baidu.string.format; 11 | 12 | /** 13 | * @description 为滑动条组件增加缓存进度条 14 | * @name magic.control.Slider.$cache 15 | * @addon 16 | * @param {Object} options 插件选项 17 | * @param {Boolean} options.cache.enable 插件开关,默认false 18 | * @author qiaoyue 19 | * @example 20 | * /// for options.cache.enable 21 | * var instance = new magic.Slider({ 22 | * orientation:'horizonal', 23 | * cache:{enable:true} // 启用缓存条 24 | * }); 25 | */ 26 | baidu.lang.register(magic.control.Slider, function(options){ 27 | var me = this, 28 | info = me._info; 29 | info.cache && info.cache.enable && me.on("load", function(){ 30 | var inner = me.getElement('inner'), 31 | _accuracyKey = info._accuracyKey, 32 | cacheClass = info._oppsite ? 'tang-cache-backward' : 'tang-cache-forward', 33 | id = me.$getId('cache'), 34 | html = info._oppsite ? '
' : '
'; 35 | 36 | baidu.dom(inner).prepend(baidu.string.format(html ,{ 37 | id: id, 38 | cacheClass: cacheClass 39 | })); 40 | 41 | }); 42 | 43 | }, { 44 | /** 45 | * @description 设置缓存 46 | * @name magic.control.Slider.$cache#setCache 47 | * @function 48 | * @grammar magic.control.Slider.$cache#setCache(value) 49 | * @param {float} value 要设置的值 50 | * @example 51 | * var instance = new magic.Slider({ 52 | * cache:{enable:true} // 启用缓存条 53 | * }); 54 | * instance.render('s1'); 55 | * instance.setCache(0.7); //设置缓存在滑动条70%的位置 56 | */ 57 | setCache: function(value){ 58 | var me = this, 59 | info = me._info, 60 | cache = me.getElement('cache'), 61 | cachePos = value * info._limit, 62 | cachePercent = me._cachePercent(cachePos); 63 | 64 | value == 0 ? baidu.dom(cache).css('overflow', 'hidden') : baidu.dom(cache).css('overflow', ''); 65 | baidu.dom(cache).css(info._accuracyKey, me._cachePercent(cachePos)); 66 | }, 67 | 68 | /** 69 | * 缓存百分比 70 | * @private 71 | */ 72 | _cachePercent: function(pos){ 73 | return pos / this._info._limit * 100 + '%'; 74 | } 75 | }); -------------------------------------------------------------------------------- /src/magic/setup.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Tangram 3 | * Copyright 2009 Baidu Inc. All rights reserved. 4 | * 5 | * version: 0.1 6 | * date: 2011/11/28 7 | * author: meizz 8 | */ 9 | 10 | 11 | ///import magic; 12 | ///import baidu.dom.on; 13 | 14 | /** 15 | * 各种UI组件反向创建的模块集合 16 | * @namespace magic.setup 17 | * @name magic.setup 18 | */ 19 | (function(){ 20 | magic.setup = magic.setup || function(el, Type, options){ 21 | // 从HTML标签属性 tang-param 里分解出用户指定的参数 22 | var opt = parseAttr(el, "tang-param") || {}; 23 | 24 | // 脚本里直接指定的参数权重要高于HTML标签属性里的tang-param 25 | for (var i in options) opt[i] = options[i]; 26 | 27 | var ui = new Type(opt); 28 | ui.$mappingDom("", el); 29 | 30 | // 添加DOM元素直接调用实例方法的模式 20111205 meizz 31 | // tang-event="onclick:$.hide()" 32 | attachEvent(el, ui.guid); 33 | var doms = el.getElementsByTagName("*"); 34 | for (var i = doms.length - 1; i >= 0; i--) { 35 | attachEvent(doms[i], ui.guid); 36 | }; 37 | 38 | return ui; 39 | }; 40 | 41 | // 解析DOM元素标签自定义属性值,返回 JSON 对象 42 | function parseAttr(el, attr) { 43 | var str = el.getAttribute(attr), keys, json = false; 44 | 45 | if (str && (keys = str.match(reg[0]))) { 46 | json = {}; 47 | for (var i = 0, a; i < keys.length; i++) { 48 | a = keys[i].match(reg[1]); 49 | 50 | // Number类型的处理 51 | !isNaN(a[2]) && (a[2] = +a[2]); 52 | 53 | // 去引号 54 | reg[2].test(a[2]) && (a[2] = a[2].replace(reg[3], "\x242")); 55 | 56 | // Boolean类型的处理 57 | reg[4].test(a[2]) && (a[2] = reg[5].test(a[2])); 58 | 59 | json[a[1]] = a[2]; 60 | }; 61 | } 62 | return json; 63 | } 64 | var reg = [ 65 | /\b[\w\$\-]+\s*:\s*[^;]+/g /*0*/ 66 | ,/([\w\$\-]+)\s*:\s*([^;]+)\s*/ /*1*/ 67 | ,/\'|\"/ /*2*/ 68 | ,/^\s*(\'|\")([^\1]*)\1\s*/ /*3*/ 69 | ,/^(true|false)\s*$/i /*4*/ 70 | ,/\btrue\b/i /*5*/ 71 | ] 72 | 73 | // 解析 DOM 元素标签属性 tang-event ,动态绑定事件 74 | function attachEvent(el, guid) { 75 | var json = parseAttr(el, "tang-event"); 76 | if (json) { 77 | for (var i in json) { 78 | var method = json[i].substr(1); 79 | // 如果用户已经指定参数,有效 80 | method.indexOf("(") < 0 && (method += "()"); 81 | baidu.dom(el).on(i, new Function("baiduInstance('"+guid+"') && baiduInstance('"+guid+"')"+method)); 82 | } 83 | } 84 | } 85 | })(); 86 | -------------------------------------------------------------------------------- /src/magic/setup/background.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Tangram 3 | * Copyright 2011 Baidu Inc. All rights reserved. 4 | * 5 | * version: 2.0 6 | * date: 2011/12/14 7 | * author: meizz 8 | */ 9 | 10 | ///import magic.setup; 11 | ///import magic.Background; 12 | ///import baidu.dom.getCurrentStyle; 13 | ///import baidu.dom.append; 14 | 15 | /** 16 | * 在页面已有 html 结构的基础上创建 background 组件 17 | * @function magic.setup.background 18 | * @name magic.setup.background 19 | * @param {dom-id|HTMLElement} el 容器对象 20 | * @grammar magic.setup.background(el, options) 21 | * @param {Object} options 参数设置 22 | * @config {Boolean} options.coverable 可选,默认为False,添加背景覆盖层,防止鼠标事件穿透,同时IE6里还可以遮盖select、Flash等 23 | * @return {magic.Background} magic.Background 实例 24 | */ 25 | 26 | magic.setup.background = function(el, options){ 27 | var opt = options || {}; 28 | 29 | var bg = magic.setup(baidu.dom(el).get(0)||el, magic.Background, opt); 30 | 31 | var y = bg.getElement(), s=y.style, yp=y.parentNode; 32 | s.top = "0px"; 33 | s.left = "0px"; 34 | s.width = bg.timer ? "10px" : "100%"; 35 | s.height = bg.timer ? "10px" : "100%"; 36 | s.position = "absolute"; 37 | s.zIndex = -9; 38 | 39 | bg.coverable && baidu.dom(y).append(bg._coverDom||""); 40 | yp != document.body 41 | && baidu.dom(yp).css("position")=="static" 42 | && (yp.style.position="relative"); 43 | 44 | return bg; 45 | }; -------------------------------------------------------------------------------- /src/magic/setup/carousel.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Tangram 3 | * Copyright 2011 Baidu Inc. All rights reserved. 4 | */ 5 | 6 | ///import magic.setup; 7 | ///import magic.control.Carousel; 8 | 9 | 10 | /** 11 | * @description 由HTML反向创建 图片轮播组件.(关于单个滚动项的宽高尺寸说明:单个滚动项由li元素组成,内容的尺寸由用户自定义(这里请确保每个滚动项的内容尺寸都是相同,否则滚动的运算会出错),则单个滚动项的尺寸应该为:内容尺寸 + li元素的padding + li元素的margin + li元素的border) 12 | * @name magic.setup.carousel 13 | * @function 14 | * @grammar magic.setup.carousel(el, options) 15 | * @param {String|HTMLElement} el 一个包含Carousel所需结构的容器对象. 16 | * @param {Object} options 选项. 17 | * @param {Number} options.orientation 描述该组件是创建一个横向滚动组件或是竖向滚动组件,取值:{horizontal: 横向, vertical: 竖向},默认horizontal 18 | * @param {Number} options.originalIndex 默认选项卡的聚焦项,默认0 19 | * @param {Number} options.viewSize 描述一页显示多少个滚动项,默认3 20 | * @param {Object} options.focusRange 描述焦点在viewSize参数中的滚动范围,区域起始位从0开始,格式:{min: 0, max: 4},当焦点超出focusRange指定的范围时才会触发可视区域的滚动动作,默认{min: 0, max: options.viewSize - 1 || 2} 21 | * @param {Boolean} options.isLoop 是否支持循环滚动,默认false 22 | * @param {Number} options.step 描述每次调用focusPrev或focusNext方法时一次滚动过多少个项,默认1 23 | * @return {magic.control.Carousel} Carousel实例. 24 | * @author linlingyu 25 | * @example 26 | * /// for el,options.orientation,options.isLoop 27 | * var carousel = magic.setup.carousel('one-carousel', { 28 | * orientation: 'vertical', // 竖向滚动 29 | * isLoop: true, // 循环滚动 30 | * }); 31 | * @example 32 | * /// for options.originalIndex 33 | * var carousel = magic.setup.carousel('one-carousel', { 34 | * originalIndex: 2, 35 | * }); 36 | * @example 37 | * /// for options.viewSize 38 | * var carousel = magic.setup.carousel('one-carousel', { 39 | * viewSize: 2, 40 | * }); 41 | * @example 42 | * /// for options.focusRange 43 | * var carousel = magic.setup.carousel('one-carousel', { 44 | * focusRange: {min: 1, max: 2} // 当焦点位置超过2(max),或小于1(min)时,可视区域将会滚动,否则不滚动,该项参数保证了焦点所在的位置相对于可视区域始终在{min: 1, max: 2}之间 45 | * }); 46 | * @example 47 | * /// for options.step 48 | * var carousel = magic.setup.carousel('one-carousel', { 49 | * step: 4 50 | * }); 51 | */ 52 | magic.setup.carousel = function(el, options) { 53 | /** 54 | *@description carousel 组件 setup 模式的实例对象 55 | *@instace 56 | *@name magic.setup.carousel! 57 | *@superClass magic.control.Carousel 58 | *@return {instace} magic.control.Carousel 实例对象 59 | */ 60 | var instance = magic.setup(baidu.dom('#'+el).get(0), magic.control.Carousel, options); 61 | instance.fire('onload'); 62 | return instance; 63 | }; 64 | -------------------------------------------------------------------------------- /src/magic/setup/scrollPanel.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Tangram 3 | * Copyright 2011 Baidu Inc. All rights reserved. 4 | * 5 | * version: 2.0 6 | * date: 2012/12/20 7 | * author: pengzhan.lee 8 | */ 9 | 10 | ///import magic.setup; 11 | ///import magic.control.ScrollPanel; 12 | 13 | /** 14 | * @description 滚动面板 15 | * @name magic.setup.scrollPanel 16 | * @function 17 | * @grammar magic.setup.ScrollPanel(options) 18 | * @param {Object} options 自定义选项 19 | * @param {Number} options.autoUpdateDelay 自动适应内容区域大小延时(ms), 默认值 500。如果您的内容区域并非动态,设置为 false 可减少一个定时器开销 20 | * @param {Number} options.arrowButtonStep 点击箭头按钮滚动的距离(px), 默认值 20 21 | * @param {Number} options.mousewheelStep 鼠标滚轮滚动的距离(px), 默认值 50 22 | * @param {Number} options.scrollbarStep 点击滚动条空白区域滚动的距离(px), 默认值 80 23 | * @param {Number} options.intervalScrollDelay (点击到箭头或滚动条空白区域时)持续滚动延时(ms),默认 300 24 | * @param {Number} options.intervalScrollFreq (点击到箭头或滚动条空白区域时)持续滚动频率(ms),默认 100 25 | * @param {Number} options.scrollbarMinHeight 滚动条控制手柄最小高度(px),默认 10 26 | * @author pengzhan.lee 27 | * @return {magic.control.ScrollPanel} ScrollPanel实例 28 | * @example 29 | * /// for options.autoUpdateDelay 30 | * var instance = magic.setup.scrollPanel('target', { 31 | * autoUpdateDelay: false 32 | * }); 33 | * @example 34 | * /// for options.arrowButtonStep,options.mousewheelStep,options.scrollbarStep, 35 | * var instance = magic.setup.scrollPanel('target', { 36 | * arrowButtonStep: 50, 37 | * mousewheelStep: 80, 38 | * scrollbarStep: 120 39 | * }); 40 | * @example 41 | * /// for options.intervalScrollDelay,options.intervalScrollFreq 42 | * var instance = magic.setup.scrollPanel('target', { 43 | * intervalScrollDelay: 200, 44 | * intervalScrollFreq: 200 45 | * }); 46 | * @example 47 | * /// for options.scrollbarMinHeight 48 | * var instance = magic.setup.scrollPanel('target', { 49 | * scrollbarMinHeight: 20 50 | * }); 51 | */ 52 | 53 | 54 | magic.setup.scrollPanel = function(el, options){ 55 | 56 | /** 57 | * @description 滚动面板 58 | * @instace 59 | * @name magic.setup.scrollPanel! 60 | * @superClass magic.control.ScrollPanel 61 | * @return {instace} magic.control.ScrollPanel 实例对象 62 | */ 63 | 64 | if(baidu.type(el) === "string"){ 65 | el = '#' + el; 66 | } 67 | var el = baidu(el)[0], 68 | instance = magic.setup(el, magic.control.ScrollPanel, options); 69 | instance.$mappingDom('target', el); 70 | instance.fire('load'); 71 | return instance; 72 | }; 73 | -------------------------------------------------------------------------------- /src/magic/setup/slider.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Tangram 3 | * Copyright 2011 Baidu Inc. All rights reserved. 4 | */ 5 | 6 | 7 | ///import magic.setup; 8 | ///import magic.control.Slider; 9 | 10 | /** 11 | * @description 在页面已有 html 结构的基础上创建滑动条组件 12 | * @name magic.setup.slider 13 | * @function 14 | * @grammar magic.setup.slider(el,options) 15 | * @param {String|HTMLElement} el 一个包含Carousel所需结构的容器对象. 16 | * @param {Object} options 选项 17 | * @param {String} options.orientation 决定滑动条是水平还是垂直,'horizontal' || 'vertical',默认vertical 18 | * @param {String} options.direction 决定从哪一端开始移动,'forward'或'backward',默认backward 19 | * @param {Float} options.accuracy 精确度,0-1之间的小数,默认0 20 | * @param {Number} options.currentValue 滑动条的初始值,即游标初始位置,默认0 21 | * @author qiaoyue 22 | * @example 23 | * /// for el,options.orientation 24 | * var slider = magic.setup.slider('s1' ,{ 25 | * orientation: 'horizontal' // 水平滑动条 26 | * }); 27 | * @example 28 | * /// for options.direction 29 | * var slider = magic.setup.slider('s1' ,{ 30 | * direction: 'forward' 31 | * }); 32 | * @example 33 | * /// for options.accuracy 34 | * var slider = magic.setup.slider('s1' ,{ 35 | * accuracy: 0.25 36 | * }); 37 | * @example 38 | * /// for options.accuracy 39 | * var slider = magic.setup.slider('s1' ,{ 40 | * currentValue: 10 41 | * }); 42 | */ 43 | 44 | magic.setup.slider = function(el, options){ 45 | /** 46 | *@description slider 组件 setup 模式的实例对象 47 | *@instace 48 | *@name magic.setup.slider! 49 | *@superClass magic.control.Slider 50 | *@return {instace} magic.control.Slider 实例对象 51 | */ 52 | var me = magic.setup(baidu.dom('#'+el).get(0), magic.control.Slider, options), 53 | container = me.getElement(); 54 | 55 | me.$mappingDom('view', baidu('.tang-view', container)[0]); 56 | me.$mappingDom('knob', baidu('.tang-knob', container)[0]); 57 | me.$mappingDom('process', baidu('.tang-process', container)[0]); 58 | me.$mappingDom('inner', baidu('.tang-inner', container)[0]); 59 | 60 | me.fire("load"); 61 | return me; 62 | }; -------------------------------------------------------------------------------- /src/magic/setup/suggestion.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Tangram 3 | * Copyright 2011 Baidu Inc. All rights reserved. 4 | * 5 | * version: 2.0 6 | * date: 2011/11/28 7 | * author: zhaochengyang 8 | */ 9 | 10 | ///import magic.setup; 11 | ///import magic.control.Suggestion; 12 | 13 | /** 14 | * @description 由HTML反向创建输入框提示组件 15 | * @name magic.setup.suggestion 16 | * @function 17 | * @grammar magic.setup.suggestion(el, options) 18 | * @param {String|HTMLElement} el 输入框提示组件对应的input输入框ID或者dom元素 19 | * @param {Object} options 选项 20 | * @param {Object} options.offset suggestion相对于输入框的偏移量,传入的参数中可包括offsetX、 offsetY、width三个值(在CSS中使用margin同样可以定位)。 21 | * @param {Function} options.getData 在需要获取数据的时候会调用此函数来获取数据,传入的参数query是用户在输入框中输入的数据。在获取到数据后,需要触发ongetdata事件,并传入参数,例如me.fire("ongetdata", query, returnValue); 22 | * @param {String} options.prependHTML 写在下拉框列表前面的html 23 | * @param {String} options.appendHTML 写在下拉框列表后面的html 24 | * @param {Boolean} options.holdHighLight 鼠标移出待选项区域后,是否保持条目的高亮状态,默认false 25 | * @return {magic.control.Suggestion} Suggestion实例. 26 | * @author meizz, zhaochengyang 27 | * @example 28 | * /// for options.offset 29 | * var sgt = magic.setup.suggestion('sgt', { 30 | * offset: { 31 | * 'offsetX': 0, 32 | * 'offsetY': 0 33 | * } 34 | * }); 35 | * @example 36 | * /// for options.getData 37 | * var getData = function(key){ 38 | * var me = this; 39 | * // 向服务器发送用户输入 40 | * baiud.ajax.get('search.php?'+key), function(xhr, rsp){ 41 | * // 获取数据后, 传递给 receiveData 42 | * var data = eval(rsp); 43 | * me.receiveData(key, data); 44 | * }); 45 | * } 46 | * var sgt = magic.setup.suggestion('sgt', { 47 | * getData: getData 48 | * }); 49 | * @example 50 | * /// for options.prependHTML,options.appendHTML 51 | * var sgt = magic.setup.suggestion('sgt', { 52 | * prependHTML: '写在下拉框列表前面的HTML', 53 | * appendHTML: '关闭'; 54 | * }); 55 | * @example 56 | * /// for options.holdHighLight 57 | * var sgt = magic.setup.suggestion('sgt', { 58 | * getData: getData, 59 | * holdHighLight: false //鼠标移出待选项区域后消除高亮状态 60 | * }); 61 | */ 62 | magic.setup.suggestion = function(el, options){ 63 | /** 64 | * @description suggestion 组件 setup 模式的实例对象 65 | * @instace 66 | * @name magic.setup.suggestion! 67 | * @superClass magic.control.Suggestion 68 | * @return {instace} magic.control.Suggestion 实例对象 69 | */ 70 | var el = baidu.dom('#'+el).get(0), 71 | instance = magic.setup(el, magic.control.Suggestion, options); 72 | 73 | instance.$mappingDom('input', el); 74 | instance.fire('onload'); 75 | 76 | return instance; 77 | }; -------------------------------------------------------------------------------- /src/magic/setup/tab.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Tangram 3 | * Copyright 2011 Baidu Inc. All rights reserved. 4 | */ 5 | 6 | ///import magic.setup; 7 | ///import magic.control.Tab; 8 | 9 | 10 | /** 11 | * @description 由HTML反向创建选项卡组件 12 | * @name magic.setup.tab 13 | * @function 14 | * @grammar magic.setup.tab(el, options) 15 | * @param {String|HTMLElement} el 一个包含Tab所需结构的容器对象. 16 | * @param {Object} options 选项. 17 | * @param {String} options.selectEvent 触发选项卡切换的事件名称,取值click或mouseover,默认click 18 | * @param {Number} options.selectDelay 当selectEvent是mouseover时,选项卡之间切换的延迟时间,以毫秒为单位,默认0 19 | * @param {Number} options.originalIndex 默认选项卡的打开项,默认0 20 | * @return {magic.control.Tab} Tab实例. 21 | * @author meizz, linlingyu 22 | * @example 23 | * /// for el, options.originalIndex 24 | * var tab = magic.setup.tab('tab-container',{ 25 | * originalIndex: 2 // 默认打开第三个tab 26 | * }); 27 | * @example 28 | * /// for options.selectEvent,options.selectDelay 29 | * var tab = magic.setup.tab('tab-container',{ 30 | * selectEvent : 'mouseover', // mouseover 触发切换 31 | * selectDelay : 500 切换延时500毫秒 32 | * }); 33 | */ 34 | magic.setup.tab = function(el, options) { 35 | /** 36 | * @description tab 组件 setup 模式的实例对象 37 | * @instace 38 | * @name magic.setup.tab! 39 | * @superClass magic.control.Tab 40 | * @return {instace} magic.control.Tab 实例对象 41 | */ 42 | var instance = magic.setup(baidu.dom('#'+el).get(0), magic.control.Tab, options); 43 | instance.fire('onload'); 44 | return instance; 45 | }; 46 | -------------------------------------------------------------------------------- /test/baidu.js: -------------------------------------------------------------------------------- 1 | module("baidu"); 2 | 3 | test("version check", function(){ 4 | equals(baidu.version, "2.0", "version check"); 5 | }); -------------------------------------------------------------------------------- /test/magic/Calendar/bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/Calendar/bg.png -------------------------------------------------------------------------------- /test/magic/setup/carousel/carousel-btn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/carousel/carousel-btn.png -------------------------------------------------------------------------------- /test/magic/setup/carousel/carousel-vertical-btn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/carousel/carousel-vertical-btn.png -------------------------------------------------------------------------------- /test/magic/setup/carousel/carousel-vertical.css: -------------------------------------------------------------------------------- 1 | .tang-carousel { 2 | background: #f4f4f4; 3 | } 4 | .tang-carousel-container { 5 | position: relative;/*must*/ 6 | overflow: hidden; 7 | } 8 | .tang-carousel-container .tang-carousel-element { 9 | } 10 | .tang-carousel-container .tang-carousel-element .tang-carousel-item { 11 | border:solid 1px; 12 | margin:1px; 13 | pading: 1px; 14 | } 15 | .tang-carousel-container .tang-carousel-element .tang-carousel-item-selected { 16 | border:solid 1px red 17 | } 18 | 19 | /*btn*/ 20 | .tang-carousel-btn { 21 | display: block; 22 | width: 62px; 23 | height: 42px; 24 | margin: 0 auto; 25 | background: url(carousel-vertical-btn.png) no-repeat; 26 | } 27 | 28 | 29 | a.tang-carousel-btn-prev:link, 30 | a.tang-carousel-btn-prev:visited {background-position: 0px 0px;} 31 | a.tang-carousel-btn-next:link, 32 | a.tang-carousel-btn-next:visited {background-position: 0px -42px;} 33 | a.tang-carousel-btn-prev:hover { 34 | background-position: -62px 0px; 35 | background-color: #0084ff; 36 | } 37 | a.tang-carousel-btn-next:hover { 38 | background-position: -62px -42px; 39 | background-color: #0084ff; 40 | } 41 | 42 | 43 | a.tang-carousel-btn-prev-disabled:link, 44 | a.tang-carousel-btn-prev-disabled:visited, 45 | a.tang-carousel-btn-prev-disabled:hover, 46 | a.tang-carousel-btn-prev-disabled:active { 47 | background-position: -124px 0px; 48 | } 49 | 50 | a.tang-carousel-btn-next-disabled:link, 51 | a.tang-carousel-btn-next-disabled:visited, 52 | a.tang-carousel-btn-next-disabled:hover, 53 | a.tang-carousel-btn-next-disabled:active { 54 | background-position: -124px -42px; 55 | } 56 | .cssloaded{ 57 | width: 20px 58 | } 59 | -------------------------------------------------------------------------------- /test/magic/setup/carousel/carousel.css: -------------------------------------------------------------------------------- 1 | .tang-ui dl, .tang-ui dt, .tang-ui dd, .tang-ui ul, .tang-ui ol, .tang-ui li, .tang-ui input{ 2 | margin: 0; 3 | padding: 0; 4 | } 5 | .tang-ui li{ 6 | list-style: none; 7 | } 8 | 9 | .tang-carousel { 10 | background: #f4f4f4; 11 | } 12 | .tang-carousel-container { 13 | position: relative;/*must*/ 14 | float:left; 15 | overflow: hidden; 16 | } 17 | .tang-carousel-container .tang-carousel-element { 18 | } 19 | .tang-carousel-container .tang-carousel-element .tang-carousel-item { 20 | float: left; 21 | display: inline; 22 | border:solid 1px; 23 | margin:1px; 24 | pading: 1px; 25 | } 26 | .tang-carousel-container .tang-carousel-element .tang-carousel-item-selected { 27 | border:solid 1px red 28 | } 29 | 30 | /*btn*/ 31 | .tang-carousel-btn { 32 | float:left; 33 | } 34 | 35 | 36 | a.tang-carousel-btn-prev:link, 37 | a.tang-carousel-btn-prev:visited {background-position: 0px 0px;} 38 | a.tang-carousel-btn-next:link, 39 | a.tang-carousel-btn-next:visited {background-position: -42px 0px;} 40 | a.tang-carousel-btn-prev:hover { 41 | background-position: 0px -42px; 42 | background-color: #0084ff; 43 | } 44 | a.tang-carousel-btn-next:hover { 45 | background-position: -42px -42px; 46 | background-color: #0084ff; 47 | } 48 | 49 | 50 | a.tang-carousel-btn-prev-disabled:link, 51 | a.tang-carousel-btn-prev-disabled:visited, 52 | a.tang-carousel-btn-prev-disabled:hover, 53 | a.tang-carousel-btn-prev-disabled:active { 54 | background-position: 0px -84px; 55 | } 56 | 57 | a.tang-carousel-btn-next-disabled:link, 58 | a.tang-carousel-btn-next-disabled:visited, 59 | a.tang-carousel-btn-next-disabled:hover, 60 | a.tang-carousel-btn-next-disabled:active { 61 | background-position: -42px -84px; 62 | } 63 | .cssloaded{ 64 | width: 20px 65 | } -------------------------------------------------------------------------------- /test/magic/setup/carousel/carousel_fx.css: -------------------------------------------------------------------------------- 1 | /* tang-ui mini reset, version: 0.9 */ 2 | .tang-ui dl, .tang-ui dt, .tang-ui dd, .tang-ui ul, .tang-ui ol, .tang-ui li, .tang-ui input{ 3 | margin: 0; 4 | padding: 0; 5 | } 6 | .tang-ui table{ 7 | border-collapse: collapse; 8 | border-spacing: 0; 9 | } 10 | .tang-ui img{ 11 | border: 0; 12 | } 13 | .tang-ui li{ 14 | list-style: none; 15 | } 16 | .tang-ui th{ 17 | text-align: left; 18 | } 19 | .tang-ui input, .tang-ui textarea, .tang-ui select{ 20 | font-family: inherit; 21 | font-size: inherit; 22 | font-weight: inherit; 23 | *font-size: 100%; 24 | } 25 | 26 | /* tang-ui commons */ 27 | .tang-ui{ 28 | 29 | } 30 | 31 | .tang-ui .tang-background{ 32 | position: absolute; 33 | z-index: -1; 34 | top: 0; left: 0; 35 | width: 100%; height: 100%; 36 | } 37 | 38 | .tang-ui .tang-foreground{ 39 | 40 | } 41 | .tang-carousel { 42 | background: #f4f4f4; 43 | } 44 | .tang-carousel-container { 45 | position: relative;/*must*/ 46 | float:left; 47 | width: 426px; 48 | height: 142px; 49 | overflow: hidden; 50 | } 51 | .tang-carousel-container .tang-carousel-element { 52 | height: 142px; 53 | } 54 | .tang-carousel-container .tang-carousel-element .tang-carousel-item { 55 | float: left; 56 | display: inline; 57 | width: 120px; 58 | height: 120px; 59 | padding: 5px; 60 | margin:5px; 61 | border:solid 1px 62 | } 63 | .tang-carousel-container .tang-carousel-element .tang-carousel-item-selected { 64 | border:solid 1px red 65 | } 66 | 67 | /*btn*/ 68 | .tang-carousel-btn { 69 | float:left; 70 | margin-top: 45px; 71 | width: 42px; 72 | height: 42px; 73 | background: url(carousel-btn.png) no-repeat; 74 | } 75 | 76 | 77 | a.tang-carousel-btn-prev:link, 78 | a.tang-carousel-btn-prev:visited {background-position: 0px 0px;} 79 | a.tang-carousel-btn-next:link, 80 | a.tang-carousel-btn-next:visited {background-position: -42px 0px;} 81 | a.tang-carousel-btn-prev:hover { 82 | background-position: 0px -42px; 83 | background-color: #0084ff; 84 | } 85 | a.tang-carousel-btn-next:hover { 86 | background-position: -42px -42px; 87 | background-color: #0084ff; 88 | } 89 | 90 | 91 | a.tang-carousel-btn-prev-disabled:link, 92 | a.tang-carousel-btn-prev-disabled:visited, 93 | a.tang-carousel-btn-prev-disabled:hover, 94 | a.tang-carousel-btn-prev-disabled:active { 95 | background-position: 0px -84px; 96 | } 97 | 98 | a.tang-carousel-btn-next-disabled:link, 99 | a.tang-carousel-btn-next-disabled:visited, 100 | a.tang-carousel-btn-next-disabled:hover, 101 | a.tang-carousel-btn-next-disabled:active { 102 | background-position: -42px -84px; 103 | } 104 | 105 | 106 | .cssloaded{ 107 | width: 20px 108 | } -------------------------------------------------------------------------------- /test/magic/setup/combobox/magic-combobox-arrow.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/combobox/magic-combobox-arrow.gif -------------------------------------------------------------------------------- /test/magic/setup/dialog/btns.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/dialog/btns.gif -------------------------------------------------------------------------------- /test/magic/setup/dialog/dialog.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/dialog/dialog.png -------------------------------------------------------------------------------- /test/magic/setup/dialog/shadow.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/dialog/shadow.gif -------------------------------------------------------------------------------- /test/magic/setup/dialog/shadow.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/dialog/shadow.png -------------------------------------------------------------------------------- /test/magic/setup/scrollPanel/bg.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/scrollPanel/bg.gif -------------------------------------------------------------------------------- /test/magic/setup/scrollPanel/scrollPanel.css: -------------------------------------------------------------------------------- 1 | .tang-scrollpanel{ 2 | overflow:hidden; 3 | } 4 | .tang-scrollpanel .tang-scrollpanel-wrapper{ 5 | position: relative; 6 | overflow: hidden; 7 | } 8 | .tang-scrollpanel .tang-scrollpanel-content{ 9 | position: absolute; 10 | left:0; 11 | top:0; 12 | } 13 | /** slider */ 14 | .tang-scrollpanel .tang-slider { 15 | font-size: 0; 16 | position:absolute; 17 | top:0; 18 | right:0; 19 | background:url(bg.gif) repeat-y -18px 0; 20 | } 21 | .tang-scrollpanel .tang-slider .tang-inner { 22 | position: relative; 23 | } 24 | 25 | .tang-scrollpanel .tang-slider-vtl { 26 | height: 100%; 27 | } 28 | .tang-scrollpanel .tang-slider-vtl .tang-view { 29 | position: absolute; 30 | top: 0; 31 | bottom: 0; 32 | *height: 100%; 33 | } 34 | .tang-scrollpanel .tang-slider-vtl .tang-content { 35 | position: absolute; 36 | top: 0; 37 | bottom: 0; 38 | height: 100%; 39 | } 40 | .tang-scrollpanel .tang-slider-vtl .tang-inner { 41 | display:none; 42 | } 43 | 44 | .tang-scrollpanel .tang-slider-vtl .tang-corner { 45 | height: 18px; 46 | width: 18px; 47 | background:url(bg.gif) no-repeat; 48 | position: absolute; 49 | } 50 | .tang-scrollpanel .tang-slider-vtl .tang-start { 51 | left: 0; 52 | top:0; 53 | background-position:0 0; 54 | } 55 | .tang-scrollpanel .tang-slider-vtl .tang-last { 56 | left: 0; 57 | bottom:0; 58 | background-position:0 -18px; 59 | } 60 | 61 | /** 游标 */ 62 | .tang-scrollpanel .tang-slider .tang-knob { 63 | position: absolute; 64 | display: block; 65 | height: 16px; 66 | width: 16px; 67 | border:1px solid #d2d2d3; 68 | outline: none; 69 | z-index: 10; 70 | cursor: default; 71 | } 72 | .tang-scrollpanel .tang-slider-vtl .tang-knob { 73 | background:#fff; 74 | } 75 | 76 | .cssloaded{ 77 | width: 20px 78 | } -------------------------------------------------------------------------------- /test/magic/setup/slider/cache-h-bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/slider/cache-h-bg.png -------------------------------------------------------------------------------- /test/magic/setup/slider/cache-h-corner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/slider/cache-h-corner.png -------------------------------------------------------------------------------- /test/magic/setup/slider/cache-v-bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/slider/cache-v-bg.png -------------------------------------------------------------------------------- /test/magic/setup/slider/cache-v-corner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/slider/cache-v-corner.png -------------------------------------------------------------------------------- /test/magic/setup/slider/slider-h-bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/slider/slider-h-bg.png -------------------------------------------------------------------------------- /test/magic/setup/slider/slider-h-bg1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/slider/slider-h-bg1.png -------------------------------------------------------------------------------- /test/magic/setup/slider/slider-h-corner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/slider/slider-h-corner.png -------------------------------------------------------------------------------- /test/magic/setup/slider/slider-h-knob.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/slider/slider-h-knob.png -------------------------------------------------------------------------------- /test/magic/setup/slider/slider-h-knobHover.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/slider/slider-h-knobHover.png -------------------------------------------------------------------------------- /test/magic/setup/slider/slider-v-bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/slider/slider-v-bg.png -------------------------------------------------------------------------------- /test/magic/setup/slider/slider-v-bg1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/slider/slider-v-bg1.png -------------------------------------------------------------------------------- /test/magic/setup/slider/slider-v-corner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/slider/slider-v-corner.png -------------------------------------------------------------------------------- /test/magic/setup/slider/slider-v-knob.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/slider/slider-v-knob.png -------------------------------------------------------------------------------- /test/magic/setup/slider/slider-v-knobHover.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/slider/slider-v-knobHover.png -------------------------------------------------------------------------------- /test/magic/setup/slider/sliderThumbs.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/slider/sliderThumbs.png -------------------------------------------------------------------------------- /test/magic/setup/suggestion/suggestion.css: -------------------------------------------------------------------------------- 1 | /** 2 | * Suggestion默认皮肤样式 3 | */ 4 | .tang-suggestion { 5 | font-family: Arial, '宋体'; 6 | font-size: 14px; 7 | color: #000; 8 | } 9 | .tang-suggestion input.tang-suggestion-input { 10 | border: 1px solid #817f82; 11 | height: 22px; 12 | padding-top: 6px; 13 | padding-bottom: 2px; 14 | width: 534px; 15 | background: url(suggestion-input-bg.gif) no-repeat 0 0 #FFF; 16 | font-family: Arial, '宋体'; 17 | font-size: 14px; 18 | color: #000; 19 | padding-left: 8px; 20 | } 21 | .tang-suggestion-popup { 22 | display: none; 23 | font-size: 14px; 24 | background-color: #fff; 25 | } 26 | .tang-suggestion-popup .tang-background table { 27 | display: none; 28 | } 29 | .tang-suggestion-popup .tang-foreground { 30 | border: 1px solid #817f82; 31 | overflow: hidden; 32 | } 33 | .tang-suggestion-popup .tang-suggestion-prepend, 34 | .tang-suggestion-popup .tang-suggestion-append { 35 | height: 24px; 36 | line-height: 24px; 37 | padding-left: 8px; 38 | color: #888; 39 | font-size: 12px; 40 | border-bottom: 1px solid #ebebeb; 41 | } 42 | .tang-suggestion-popup .tang-suggestion-append { 43 | border-top: 1px solid #ebebeb; 44 | border-bottom: none; 45 | } 46 | .tang-suggestion-popup .tang-suggestion-table { 47 | width: 100%; 48 | } 49 | .tang-suggestion-popup .tang-suggestion-table td { 50 | padding: 6px 8px; 51 | white-space: nowrap; 52 | } 53 | 54 | .tang-suggestion-popup .tang-suggestion-table td.tang-suggestion-current { 55 | background-color: #ebebeb; 56 | } 57 | .tang-suggestion-popup .tang-suggestion-table td.tang-suggestion-disable { 58 | background-color: #999; 59 | } 60 | .cssloaded{ 61 | width: 20px 62 | } -------------------------------------------------------------------------------- /test/magic/setup/tab/tab-dotted.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/tab/tab-dotted.png -------------------------------------------------------------------------------- /test/magic/setup/tab/tab-title-item.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/tab/tab-title-item.png -------------------------------------------------------------------------------- /test/magic/setup/tab/tab.css: -------------------------------------------------------------------------------- 1 | .tang-tab { 2 | 3 | } 4 | .tang-tab .tang-title { 5 | height: 28px; 6 | clear: both; 7 | overflow : hidden; 8 | background: url(tab-dotted.png) repeat-x 0px bottom; 9 | } 10 | 11 | 12 | .tang-tab .tang-title .tang-title-item { 13 | float: left; 14 | margin-right: 3px; 15 | } 16 | 17 | .tang-tab .tang-title .tang-title-item-selected {} 18 | 19 | 20 | .tang-tab .tang-title .tang-title-item a { 21 | display: inline-block; 22 | font-size: 12px; 23 | color: #303030; 24 | line-height: 28px; 25 | padding-left: 3px; 26 | background: url(tab-title-item.png) no-repeat 0px -28px; 27 | text-decoration: none; 28 | outline: none; 29 | } 30 | .tang-tab .tang-title .tang-title-item a span { 31 | display: block; 32 | background: url(tab-title-item.png) no-repeat right -112px; 33 | padding: 0px 12px 0px 10px; 34 | text-align: center; 35 | } 36 | .tang-tab .tang-title .tang-title-item-selected a { 37 | font-weight: bold; 38 | background-position: left 0px; 39 | } 40 | .tang-tab .tang-title .tang-title-item-selected a span{ 41 | background-position: right -84px; 42 | } 43 | /*link*/ 44 | .tang-tab .tang-title .tang-title-item a:hover { 45 | background-position: left -56px; 46 | } 47 | .tang-tab .tang-title .tang-title-item a:hover span { 48 | background-position: right -140px; 49 | } 50 | .tang-tab .tang-title .tang-title-item-selected a:hover { 51 | background-position: left 0px; 52 | } 53 | .tang-tab .tang-title .tang-title-item-selected a:hover span { 54 | background-position: right -84px; 55 | } 56 | 57 | .tang-tab .tang-body { 58 | clear : both; 59 | } 60 | .tang-tab .tang-body .tang-body-item { 61 | display: none; 62 | } 63 | .tang-tab .tang-body .tang-body-item-selected { 64 | display: block; 65 | } 66 | .cssloaded{ 67 | width: 20px 68 | } -------------------------------------------------------------------------------- /test/magic/setup/tooltip/arrow.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/tooltip/arrow.gif -------------------------------------------------------------------------------- /test/magic/setup/tooltip/arrow.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/tooltip/arrow.png -------------------------------------------------------------------------------- /test/magic/setup/tooltip/close.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/tooltip/close.gif -------------------------------------------------------------------------------- /test/magic/setup/tooltip/corner.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/tooltip/corner.gif -------------------------------------------------------------------------------- /test/magic/setup/tooltip/corner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/tooltip/corner.png -------------------------------------------------------------------------------- /test/magic/setup/tooltip/horizontal.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/tooltip/horizontal.gif -------------------------------------------------------------------------------- /test/magic/setup/tooltip/horizontal.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/tooltip/horizontal.png -------------------------------------------------------------------------------- /test/magic/setup/tooltip/midland.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/tooltip/midland.gif -------------------------------------------------------------------------------- /test/magic/setup/tooltip/midland.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/tooltip/midland.png -------------------------------------------------------------------------------- /test/magic/setup/tooltip/vertical.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/tooltip/vertical.gif -------------------------------------------------------------------------------- /test/magic/setup/tooltip/vertical.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/magic/setup/tooltip/vertical.png -------------------------------------------------------------------------------- /test/mindmap/Magic Tooltip.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic Tooltip.xmind -------------------------------------------------------------------------------- /test/mindmap/Magic.Calendar.$title.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic.Calendar.$title.xmind -------------------------------------------------------------------------------- /test/mindmap/Magic.Calendar.$today.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic.Calendar.$today.xmind -------------------------------------------------------------------------------- /test/mindmap/Magic.Calendar.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic.Calendar.xmind -------------------------------------------------------------------------------- /test/mindmap/Magic.Carousel$autoscroll.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic.Carousel$autoscroll.xmind -------------------------------------------------------------------------------- /test/mindmap/Magic.Carousel$fx.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic.Carousel$fx.xmind -------------------------------------------------------------------------------- /test/mindmap/Magic.Carousel.$button.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic.Carousel.$button.xmind -------------------------------------------------------------------------------- /test/mindmap/Magic.Carousel.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic.Carousel.xmind -------------------------------------------------------------------------------- /test/mindmap/Magic.ComboBox$suggestion.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic.ComboBox$suggestion.xmind -------------------------------------------------------------------------------- /test/mindmap/Magic.ComboBox.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic.ComboBox.xmind -------------------------------------------------------------------------------- /test/mindmap/Magic.DatePicker.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic.DatePicker.xmind -------------------------------------------------------------------------------- /test/mindmap/Magic.Dialog$button.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic.Dialog$button.xmind -------------------------------------------------------------------------------- /test/mindmap/Magic.Dialog$mask.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic.Dialog$mask.xmind -------------------------------------------------------------------------------- /test/mindmap/Magic.Dialog.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic.Dialog.xmind -------------------------------------------------------------------------------- /test/mindmap/Magic.Pager.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic.Pager.xmind -------------------------------------------------------------------------------- /test/mindmap/Magic.ScrollPanel.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic.ScrollPanel.xmind -------------------------------------------------------------------------------- /test/mindmap/Magic.Slider$fx.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic.Slider$fx.xmind -------------------------------------------------------------------------------- /test/mindmap/Magic.Slider.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic.Slider.xmind -------------------------------------------------------------------------------- /test/mindmap/Magic.Suggestion.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic.Suggestion.xmind -------------------------------------------------------------------------------- /test/mindmap/Magic.Suggestion1.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic.Suggestion1.xmind -------------------------------------------------------------------------------- /test/mindmap/Magic.Tab.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/Magic.Tab.xmind -------------------------------------------------------------------------------- /test/mindmap/magic.Calendar.$timer.xmind: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/mindmap/magic.Calendar.$timer.xmind -------------------------------------------------------------------------------- /test/tools/br/config.php: -------------------------------------------------------------------------------- 1 | array('10.81.58.63', "C:\\Program Files\\Internet Explorer\\iexplore.exe") 5 | ,'maxthon'=>array('10.81.58.63', "C:\\Program Files\\Maxthon3\\Bin\\Maxthon.exe") 6 | ,'firefox'=>array('10.81.58.63', "C:\\Program Files\\mozilla firefox\\firefox.exe") 7 | ,'ie7'=>array('10.81.58.86', "C:\\Program Files\\Internet Explorer\\iexplore.exe") 8 | ,'chrome'=>array('10.81.58.86', "C:\\Documents and Settings\\geqa3\\Local Settings\\Application Data\\Google\\Chrome\\Application\\chrome.exe") 9 | ,'opera'=>array('10.81.58.86', "C:\\Program Files\\Opera\\opera.exe") 10 | ,'ie8'=>array('10.81.58.64', "C:\\Program Files\\Internet Explorer\\iexplore.exe") 11 | ,'safari'=>array('10.81.58.64', "C:\\Program Files\\Safari\\Safari.exe") 12 | // ,'360'=>array('10.81.23.220', "C:\\Program Files\\360\\360se3\\360SE.exe") 13 | // , 'baidu'=>array('10.81.21.93', "C:\\Program Files\\baidu\\baidubrowser\\baidubrowser.exe") 14 | ); 15 | 16 | public static $DEBUG = false; 17 | 18 | public static $HISTORY_REPORT_PATH = '/report'; 19 | 20 | public static function StopAll(){ 21 | $hostarr = array(); 22 | foreach (Config::$BROWSERS as $b=>$h){ 23 | $host = $h[0]; 24 | if(array_search($host, $hostarr)) 25 | continue; 26 | array_push($hostarr, $host); 27 | require_once 'lib/Staf.php'; 28 | Staf::process_stop('', $host, true); 29 | Staf::process("free all"); 30 | } 31 | } 32 | /** 33 | * 源码路径配置,会在所有位置寻找源码 34 | * @var ArrayIterator::String 35 | */ 36 | public static $SOURCE_PATH = array("../../../src/", 37 | "../../../../Tangram2/src/" 38 | ); 39 | 40 | /** 41 | * 覆盖率相关源码所在路径,如果路径中没有找到会回到$SOURCH_PATH中查找 42 | * @var string 43 | */ 44 | public static $COVERAGE_PATH = "../../../test/coverage/"; 45 | 46 | /** 47 | * download dest 48 | */ 49 | public static $DL_DEST_DIR = "C:\\Documents and Settings\\tianlili\\My Documents\\Downloads\\"; 50 | 51 | public static $DL_FILE_MAGIC = "magic.zip"; 52 | 53 | public static $DL_FILE_TANGRAM = "tangram.zip"; 54 | 55 | /** 56 | * release path 57 | */ 58 | public static $RELEASE_PATH = "D:\\Workplace\\Magic\\release\\"; 59 | 60 | public static $RELEASE_FILE= "magic-min.js"; 61 | } 62 | ?> -------------------------------------------------------------------------------- /test/tools/br/coveragereport/totalCoverage/jscoverage-highlight.css: -------------------------------------------------------------------------------- 1 | /* 2 | jscoverage-highlight.css - JSCoverage syntax highlighting style sheet 3 | Copyright (C) 2008, 2009, 2010 siliconforks.com 4 | 5 | This program is free software; you can redistribute it and/or modify 6 | it under the terms of the GNU General Public License as published by 7 | the Free Software Foundation; either version 2 of the License, or 8 | (at your option) any later version. 9 | 10 | This program is distributed in the hope that it will be useful, 11 | but WITHOUT ANY WARRANTY; without even the implied warranty of 12 | MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 13 | GNU General Public License for more details. 14 | 15 | You should have received a copy of the GNU General Public License along 16 | with this program; if not, write to the Free Software Foundation, Inc., 17 | 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA. 18 | */ 19 | 20 | /* keyword, type, symbol, cbracket */ 21 | #sourceTable .k { 22 | font-weight: bold; 23 | } 24 | 25 | /* string, regexp, number */ 26 | #sourceTable .s { 27 | color: #006400; 28 | } 29 | 30 | /* specialchar */ 31 | #sourceTable .t { 32 | color: #2e8b57; 33 | } 34 | 35 | /* comment */ 36 | #sourceTable .c { 37 | font-style: italic; 38 | } 39 | -------------------------------------------------------------------------------- /test/tools/br/coveragereport/totalCoverage/jscoverage-ie.css: -------------------------------------------------------------------------------- 1 | /* 2 | jscoverage-ie.css - JSCoverage style sheet for Internet Explorer 3 | Copyright (C) 2007, 2008, 2009, 2010 siliconforks.com 4 | 5 | This program is free software; you can redistribute it and/or modify 6 | it under the terms of the GNU General Public License as published by 7 | the Free Software Foundation; either version 2 of the License, or 8 | (at your option) any later version. 9 | 10 | This program is distributed in the hope that it will be useful, 11 | but WITHOUT ANY WARRANTY; without even the implied warranty of 12 | MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 13 | GNU General Public License for more details. 14 | 15 | You should have received a copy of the GNU General Public License along 16 | with this program; if not, write to the Free Software Foundation, Inc., 17 | 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA. 18 | */ 19 | 20 | #headingDiv { 21 | position: static; 22 | margin-left: 10px; 23 | margin-right: 10px; 24 | padding-top: 0.5em; 25 | } 26 | 27 | #tabs { 28 | clear: all; 29 | position: static; 30 | top: auto; 31 | left: auto; 32 | right: auto; 33 | height: auto; 34 | margin-left: 10px; 35 | margin-right: 10px; 36 | } 37 | 38 | #tabs div { 39 | position: relative; 40 | height: auto; 41 | line-height: normal; 42 | padding-top: 5px; 43 | padding-bottom: 5px; 44 | } 45 | 46 | #tabs div.selected { 47 | padding-bottom: 6px; 48 | z-index: 2; 49 | } 50 | 51 | .TabPage { 52 | position: relative; 53 | top: -1px; 54 | left: auto; 55 | right: auto; 56 | bottom: auto; 57 | clear: left; 58 | margin-left: 10px; 59 | margin-right: 10px; 60 | padding: 10px; 61 | z-index: 1; 62 | } 63 | 64 | #locationDiv { 65 | margin-bottom: 10px; 66 | } 67 | 68 | #iframeDiv { 69 | position: static; 70 | width: 100%; 71 | } 72 | 73 | #summaryDiv { 74 | position: static; 75 | width: 100%; 76 | } 77 | 78 | #fileDiv { 79 | margin-bottom: 10px; 80 | } 81 | 82 | #sourceDiv { 83 | position: static; 84 | width: 100%; 85 | } 86 | 87 | #storeDiv { 88 | position: static; 89 | width: 100%; 90 | } 91 | 92 | /* some defaults */ 93 | 94 | .TabPage { 95 | height: 650px; 96 | } 97 | 98 | #iframeDiv { 99 | height: 600px; 100 | } 101 | 102 | #summaryDiv { 103 | height: 600px; 104 | } 105 | 106 | #sourceDiv { 107 | height: 600px; 108 | } 109 | -------------------------------------------------------------------------------- /test/tools/br/coveragereport/totalCoverage/jscoverage-throbber.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/tools/br/coveragereport/totalCoverage/jscoverage-throbber.gif -------------------------------------------------------------------------------- /test/tools/br/css/bg_button_a.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/tools/br/css/bg_button_a.gif -------------------------------------------------------------------------------- /test/tools/br/css/bg_button_span.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/tools/br/css/bg_button_span.gif -------------------------------------------------------------------------------- /test/tools/br/download.php: -------------------------------------------------------------------------------- 1 | open($zipfile)) { 21 | // extract contents to destination directory 22 | $res = $zip->extractTo($dest, $entries); 23 | // close archive 24 | $zip->close(); 25 | 26 | if($res===TRUE) 27 | { 28 | return TRUE; 29 | } 30 | } 31 | 32 | return FALSE; 33 | } 34 | 35 | function del_file($files=array()) 36 | { 37 | foreach ($files as $file) 38 | { 39 | if(file_exists($file) && is_file($file)) 40 | { 41 | if(!unlink($file)) 42 | { 43 | return FALSE; 44 | } 45 | } 46 | } 47 | 48 | return TRUE; 49 | } 50 | 51 | //if($_REQUEST["action"]=='unzip') 52 | echo unzip_file(Config::$DL_DEST_DIR.Config::$DL_FILE_MAGIC, Config::$RELEASE_PATH, array(Config::$RELEASE_FILE)); 53 | //else if($_REQUEST["action"]=='delete') 54 | // echo del_file(array(Config::$DL_DEST_DIR.Config::$DL_FILE_MAGIC, Config::$DL_DEST_DIR.Config::$DL_FILE_TANGRAM)); 55 | ?> -------------------------------------------------------------------------------- /test/tools/br/filehelper.php: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /test/tools/br/geneHistory.php: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /test/tools/br/import.php: -------------------------------------------------------------------------------- 1 | get_import_srcs($d))); 34 | } 35 | if(Config::$DEBUG)var_dump($IGNORE); 36 | 37 | function importSrc($d, $dep=false, $cov=false){ 38 | global $IGNORE; 39 | foreach($IGNORE as $idx=>$domain) 40 | if($domain == $d){ 41 | return ""; 42 | } 43 | 44 | array_push($IGNORE, $d); 45 | $ccnt = Analysis::get_src_cnt($d, $cov); 46 | if($dep){ 47 | return preg_replace("/\/\/\/import\s+(magic(\.[\w\-\$]+)*);?/ies", "importSrc('\\1', $dep)", $ccnt['c']); 48 | } 49 | else 50 | return preg_replace("/\/\/\/import\s+([\w\-\$]+(\.[\w\-\$]+)*);?/ies", "importSrc('\\1')", $ccnt['c']); 51 | } 52 | //update by bell 2011-03-25, 更新覆盖率相关逻辑 53 | if(!$cov){ 54 | $cnt = ""; 55 | foreach($f as $d){ 56 | $cnt.=importSrc($d, $dep, $cov); 57 | } 58 | echo $cnt; 59 | }else{ 60 | $IMPORT_LIST = array(); 61 | foreach($f as $d){ 62 | if(Config::$DEBUG)var_dump($d); 63 | $IMPORT_LIST = array_merge($IMPORT_LIST, array_keys($analysis->get_import_srcs($d))); 64 | } 65 | if(Config::$DEBUG) var_dump('after analysis', $IMPORT_LIST); 66 | else foreach($IMPORT_LIST as $d) { 67 | if(array_search($d, $IGNORE)) 68 | continue; 69 | $c = Analysis::get_src_cnt($d); 70 | echo $c['cc']."\n"; 71 | } 72 | } 73 | ?> -------------------------------------------------------------------------------- /test/tools/br/js/ext_qunit.js: -------------------------------------------------------------------------------- 1 | /** 2 | * 重载QUnit部分接口实现批量执行控制功能 3 | */ 4 | (function() { 5 | if (!QUnit) 6 | return; 7 | var ms = QUnit.moduleStart, d = QUnit.done; 8 | 9 | function _d(args /* failures, total */) { 10 | //默认展开失败用例 11 | $('li.fail ol').toggle(); 12 | if (parent && parent.brtest) { 13 | parent.$(parent.brtest).trigger('done', [ new Date().getTime(), { 14 | failed : args[0], 15 | passed : args[1] 16 | }, window._$jscoverage || null ]); 17 | } 18 | 19 | // chengyang 20 | if(parent && parent.testDoneCallBack){ 21 | parent.testDoneCallBack({ failed: args[0], passed: args[1] }); 22 | } 23 | } 24 | 25 | QUnit.moduleStart = function(name,testEnvironment) { 26 | stop(); 27 | /* 为批量执行等待import.php正确返回 */ 28 | var h = setInterval(function() { 29 | if (window && window['baidu']) { 30 | clearInterval(h); 31 | ms.apply(this, arguments); 32 | start(); 33 | } 34 | }, 20); 35 | }; 36 | 37 | QUnit.done = function() { 38 | _d(arguments); 39 | d.apply(this, arguments); 40 | }; 41 | 42 | push = function(result, actual, expected, message) { 43 | message = message || (result ? "okay" : "failed"); 44 | QUnit.ok( result, result ? message + ": " + expected : message + ", expected: " + QUnit.jsDump.parse(expected) + " result: " + QUnit.jsDump.parse(actual) ); 45 | }; 46 | approximateEqual = function(actual, expected, difference, message){ 47 | if(typeof difference == "string"){ 48 | var message = difference; 49 | var difference = 1; 50 | } 51 | push(Math.abs(parseInt(actual) - parseInt(expected)) <= difference, actual, expected, message); 52 | }; 53 | })(); 54 | -------------------------------------------------------------------------------- /test/tools/br/lib/Staf.php: -------------------------------------------------------------------------------- 1 | ]] COMMAND [PARMS ] 19 | * @param $path 20 | * @param $params 21 | * @param $host 22 | */ 23 | public static function process_start($path, $params, $host='local', $wait=false){ 24 | $cmd = "start shell command \\\"\"$path\"\\\" parms \\\"\"$params\"\\\""; 25 | if($wait){ 26 | $cmd.=" wait returnstdout returnstderr"; 27 | } 28 | return self::process($cmd, $host); 29 | } 30 | 31 | /** 32 | * STOP | HANDLE > [USING ] 33 | * @param unknown_type $handle 34 | * @param unknown_type $host 35 | */ 36 | public static function process_stop($handle, $host='local', $all=0){ 37 | $cmd = $all ? "STOP ALL CONFIRM":"STOP HANDLE $handle"; 38 | return self::process($cmd, $host); 39 | } 40 | 41 | public static function queryHandle($browser){ 42 | $filename = "temp\\$browser"; 43 | if(file_exists($filename)){ 44 | $handle = file_get_contents($filename); 45 | delete($filename); 46 | return $handle; 47 | } 48 | return false; 49 | } 50 | 51 | public static function saveHandle($browser){ 52 | $filename = "temp\\$browser"; 53 | $fp = fopen($filename, 'w'); 54 | fwrite($fp, 'test'); 55 | fclose($fp); 56 | } 57 | } 58 | ?> -------------------------------------------------------------------------------- /test/tools/br/lib/StafResult.php: -------------------------------------------------------------------------------- 1 | rc = $rc; 9 | $this->info = $info; 10 | } 11 | 12 | public function __toString() 13 | { 14 | return "return code : ".$rc.", return info : ".$info."\n"; 15 | } 16 | 17 | public static function parse($result){ 18 | return new StafResult(0, $result); 19 | } 20 | }?> -------------------------------------------------------------------------------- /test/tools/br/lib/jscoverage.exe: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/tools/br/lib/jscoverage.exe -------------------------------------------------------------------------------- /test/tools/br/list.php: -------------------------------------------------------------------------------- 1 | 6 | 7 | 8 | 9 | 10 | 11 | Tangram Test Index Page 12 | 13 | 14 | 16 | 17 | 18 |
19 |

Tangram Test Index Page

20 |

21 | Tangram Nighty Document 22 |

23 |
24 |
25 | 自动下一个出错时终止 29 |
30 | 折叠用例 32 |
33 |
34 |
35 | 40 |
41 |
42 | 44 | 45 | 46 | 遗漏用例 48 |
49 |
50 | 55 |
56 |
57 | 58 | 59 | -------------------------------------------------------------------------------- /test/tools/br/record.php: -------------------------------------------------------------------------------- 1 | 0){ 9 | //针对kissList过滤,移除全部正确用例 10 | 11 | $html = geneHTML($kissList); 12 | echo $html; 13 | require_once 'geneHistory.php'; 14 | geneHistory($html); 15 | 16 | if(!Config::$DEBUG){ 17 | $_mails = explode('mail=', $_POST['config']); 18 | if(sizeof($_mails)==2){ 19 | require_once 'smail.php'; 20 | sendmail($html, true); 21 | } 22 | require_once 'config.php'; 23 | Config::StopAll(); 24 | } 25 | } 26 | ?> -------------------------------------------------------------------------------- /test/tools/br/report.php: -------------------------------------------------------------------------------- 1 | "; 6 | return; 7 | } 8 | 9 | function report(){ 10 | /** 11 | * for junit report 12 | */ 13 | $dom = new DOMDocument('1.0', 'utf-8'); 14 | $suite = $dom->appendChild($dom->createElement('testsuite')); 15 | $cfg = preg_split('/[&=]/', $_POST['config']); 16 | $config = array(); 17 | for($i = 0; $i < sizeof($cfg); $i+=2){ 18 | // echo "{$cfg[$i]} {$cfg[$i+1]}\r\n
"; 19 | $config[$cfg[$i]] = $cfg[$i+1]; 20 | $p = $suite->appendChild($dom->createElement("property")); 21 | $p->setAttribute('name', $cfg[$i]); 22 | $p->setAttribute('value', $cfg[$i+1]); 23 | } 24 | $suite->setAttribute("name", $config['browser']); 25 | $errors = 0; 26 | $failures = 0; 27 | $tests = 0; 28 | $time = 0; 29 | foreach($_POST as $key=>$value){ 30 | if($key == 'config') 31 | continue; 32 | 33 | $info = explode(",", $value); 34 | 35 | //errornum + ',' + allnum + ','+ kissPerc || 0 + ',' + wb.kissstart + ','+ wb.kissend; 36 | $casetime = ($info[4]-$info[3])/1000; 37 | $time+=$casetime; 38 | $tests++; 39 | $failure = (int)($info[0]); 40 | $case = $suite->appendChild($dom->createElement('testcase')); 41 | $case->setAttribute("name", $key); 42 | $case->setAttribute("time", $casetime); 43 | $case->setAttribute("cov", $info[2]); 44 | if($failure > 0){ 45 | $failures++; 46 | $failinfo = $case->appendChild($dom->createElement('failure')); 47 | $failinfo->setAttribute('type', 'junit.framework.AssertionFailedError'); 48 | //FROM php.net, You cannot simply overwrite $textContent, to replace the text content of a DOMNode, as the missing readonly flag suggests. 49 | $kiss = join(".", split("_", $key)); 50 | $failinfo->appendChild(new DOMText("run")); 51 | } 52 | //TODO add more case info in xml 53 | } 54 | 55 | $suite->setAttribute('time', $time); 56 | $suite->setAttribute('failures', $failures); 57 | $suite->setAttribute('tests', $tests); 58 | 59 | if(!is_dir("report")) 60 | mkdir("report"); 61 | $dom->save("report/{$config['browser']}.xml"); 62 | } 63 | 64 | report(); 65 | include 'config.php'; 66 | $dom = new DOMDocument('1.0', 'utf-8'); 67 | $testsuites = $dom->appendChild($dom->createElement('testsuites')); 68 | foreach (Config::$BROWSERS as $key=>$value){ 69 | $file = "report/$key.xml"; 70 | if(!file_exists($file)){ 71 | echo "wait for report : $file\r\n
"; 72 | return; 73 | } 74 | $xmlDoc = new DOMDocument('1.0', 'utf-8'); 75 | $xmlDoc->load($file); 76 | $xmlDom = $xmlDoc->documentElement; 77 | //echo $xmlDom->nodeName; 78 | $testsuites->appendChild($dom->importNode($xmlDom, true)); 79 | } 80 | $dom->save("report.xml"); 81 | 82 | Config::StopAll(); 83 | ?> -------------------------------------------------------------------------------- /test/tools/br/run.php: -------------------------------------------------------------------------------- 1 | '; 6 | }; 7 | require_once "case.class.php"; 8 | $c = new Kiss('../../../', $_GET['case']); 9 | if($c->fileunexist){ 10 | echo '该接口无用例'; 11 | return; 12 | } 13 | $title = $c->name; 14 | $cov = array_key_exists('cov', $_GET); 15 | $release = array_key_exists('release', $_GET); 16 | $dep = array_key_exists('dep', $_GET) ? $_GET['dep'] : false; 17 | ?> 18 | 19 | 20 | 21 | <?php print("run case $title");?> 22 | print_js($cov, $release, $dep); ?> 23 | 24 | 25 |

" target="_blank">新窗口打开name);?>

26 |

27 |

28 |
    29 | 30 | 31 | -------------------------------------------------------------------------------- /test/tools/br/runall.php: -------------------------------------------------------------------------------- 1 | \n"; 54 | } 55 | } 56 | } 57 | closedir( $handle ); 58 | if( rmdir( $dirName ) )echo "成功删除目录: $dirName
    \n"; 59 | } 60 | } 61 | 62 | if(array_key_exists('clear', $_GET)){ 63 | print 'debug - clear report'; 64 | //Config::StopAll(); 65 | if(file_exists('report')) 66 | delDirAndFile('report'); 67 | } 68 | 69 | if(file_exists('report')){ 70 | // rmdir('report'); 71 | $reports = scandir('report'); 72 | print 'on batch run, please waiting : '. (sizeof($reports)-2); 73 | return; 74 | }else{ 75 | mkdir('report'); 76 | } 77 | 78 | /*记录运行时信息*/ 79 | $b = array_key_exists('browser', $_GET) ? $_GET['browser'] : 'all'; 80 | if($b !='all'){ 81 | run($b, $release, true); 82 | }else{ 83 | Config::StopAll();//添加启动前结束浏览器步骤 84 | foreach(Config::$BROWSERS as $b=>$i){ 85 | run($b, $release); 86 | } 87 | } 88 | ?> -------------------------------------------------------------------------------- /test/tools/br/smail.php: -------------------------------------------------------------------------------- 1 | '; 6 | $headers['Subject'] = '批量运行结果——tangram ui'; 7 | $params['host'] = 'hotswap-c.baidu.com';//email.baidu.com'; 8 | $headers['Content-type'] = "text/html;charset=utf-8";//设置邮件内容为html格式 9 | $params['auth'] = false; 10 | $params['debug'] = false; 11 | // Create the mail object using the Mail::factory method 12 | $mail_object =& Mail::factory('smtp', $params); 13 | $result = $mail_object->send($headers['To'], $headers, $body); 14 | } 15 | ?> -------------------------------------------------------------------------------- /test/tools/build_report.xml: -------------------------------------------------------------------------------- 1 | 2 | 10 | 11 | 12 | for report merge and mail 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | ${report.html} 32 | 33 | 34 | 35 | 36 | 37 | -------------------------------------------------------------------------------- /test/tools/build_run.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | [report] : ${report.file} 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | -------------------------------------------------------------------------------- /test/tools/build_run1.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | [report] : ${report.file} 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | -------------------------------------------------------------------------------- /test/tools/ci/assets/img/file.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/tools/ci/assets/img/file.png -------------------------------------------------------------------------------- /test/tools/ci/assets/img/folder_closed.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/tools/ci/assets/img/folder_closed.png -------------------------------------------------------------------------------- /test/tools/ci/assets/img/folder_open.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/tools/ci/assets/img/folder_open.png -------------------------------------------------------------------------------- /test/tools/ci/assets/img/header.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/tools/ci/assets/img/header.gif -------------------------------------------------------------------------------- /test/tools/ci/assets/img/logo_magic.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/tools/ci/assets/img/logo_magic.png -------------------------------------------------------------------------------- /test/tools/ci/assets/img/logo_tangram.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/tools/ci/assets/img/logo_tangram.gif -------------------------------------------------------------------------------- /test/tools/ci/assets/img/sidebar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/tools/ci/assets/img/sidebar.png -------------------------------------------------------------------------------- /test/tools/ci/assets/img/status.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/tools/ci/assets/img/status.png -------------------------------------------------------------------------------- /test/tools/ci/assets/img/treeview-default-line.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/tools/ci/assets/img/treeview-default-line.gif -------------------------------------------------------------------------------- /test/tools/ci/assets/img/treeview-default.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/tools/ci/assets/img/treeview-default.gif -------------------------------------------------------------------------------- /test/tools/ci/assets/js/Tools.js: -------------------------------------------------------------------------------- 1 | define(function(require, exports) { 2 | 3 | /** 4 | * 编码HTML 5 | */ 6 | exports.encodeHTML = function(source) { 7 | return String(source) 8 | .replace(/&/g,'&') 9 | .replace(//g,'>') 11 | .replace(/"/g, """) 12 | .replace(/'/g, "'"); 13 | }; 14 | 15 | /** 16 | * 格式化字符串 17 | */ 18 | exports.sformat = function(source, opt){ 19 | return source.replace(/#\{(.+?)\}/g, function(match, key){ 20 | var replacer = opt[key]; 21 | 22 | return ('undefined' == typeof replacer ? '' : replacer); 23 | }); 24 | }; 25 | 26 | /** 27 | * 对目标数字进行0补齐处理 28 | */ 29 | var pad = function (number) { 30 | var source = number; 31 | var pre = "", 32 | string = String(Math.abs(source)); 33 | 34 | if (string.length < 2) { 35 | pre = '0'; 36 | } 37 | 38 | return pre + string; 39 | }; 40 | 41 | /** 42 | * 格式化日期 43 | */ 44 | exports.dformat = function(date, pattern){ 45 | if(!date){ 46 | var date = new Date(); 47 | } 48 | 49 | if ('string' != typeof pattern) { 50 | var pattern = 'HH:mm:ss'; 51 | } 52 | 53 | function replacer(patternPart, result) { 54 | pattern = pattern.replace(patternPart, result); 55 | } 56 | 57 | var year = date.getFullYear(), 58 | hours = date.getHours(), 59 | minutes = date.getMinutes(), 60 | seconds = date.getSeconds(); 61 | 62 | replacer(/HH/g, pad(hours, 2)); 63 | replacer(/mm/g, pad(minutes, 2)); 64 | replacer(/ss/g, pad(seconds, 2)); 65 | 66 | return pattern; 67 | }; 68 | }); -------------------------------------------------------------------------------- /test/tools/ci/assets/lib/shBrushJScript.js: -------------------------------------------------------------------------------- 1 | /** 2 | * SyntaxHighlighter 3 | * http://alexgorbatchev.com/SyntaxHighlighter 4 | * 5 | * SyntaxHighlighter is donationware. If you are using it, please donate. 6 | * http://alexgorbatchev.com/SyntaxHighlighter/donate.html 7 | * 8 | * @version 9 | * 3.0.83 (July 02 2010) 10 | * 11 | * @copyright 12 | * Copyright (C) 2004-2010 Alex Gorbatchev. 13 | * 14 | * @license 15 | * Dual licensed under the MIT and GPL licenses. 16 | */ 17 | ;(function() 18 | { 19 | // CommonJS 20 | typeof(require) != 'undefined' ? SyntaxHighlighter = require('shCore').SyntaxHighlighter : null; 21 | 22 | function Brush() 23 | { 24 | var keywords = 'break case catch continue ' + 25 | 'default delete do else false ' + 26 | 'for function if in instanceof ' + 27 | 'new null return super switch ' + 28 | 'this throw true try typeof var while with' 29 | ; 30 | 31 | var r = SyntaxHighlighter.regexLib; 32 | 33 | this.regexList = [ 34 | { regex: r.multiLineDoubleQuotedString, css: 'string' }, // double quoted strings 35 | { regex: r.multiLineSingleQuotedString, css: 'string' }, // single quoted strings 36 | { regex: r.singleLineCComments, css: 'comments' }, // one line comments 37 | { regex: r.multiLineCComments, css: 'comments' }, // multiline comments 38 | { regex: /\s*#.*/gm, css: 'preprocessor' }, // preprocessor tags like #region and #endregion 39 | { regex: new RegExp(this.getKeywords(keywords), 'gm'), css: 'keyword' } // keywords 40 | ]; 41 | 42 | this.forHtmlScript(r.scriptScriptTags); 43 | }; 44 | 45 | Brush.prototype = new SyntaxHighlighter.Highlighter(); 46 | Brush.aliases = ['js', 'jscript', 'javascript']; 47 | 48 | SyntaxHighlighter.brushes.JScript = Brush; 49 | 50 | // CommonJS 51 | typeof(exports) != 'undefined' ? exports.Brush = Brush : null; 52 | })(); 53 | -------------------------------------------------------------------------------- /test/tools/ci/doc.php: -------------------------------------------------------------------------------- 1 | $value) { 12 | if(preg_match('/@description/', $value)){ 13 | preg_match('/description\s(.*)\r/', $value, $matches); 14 | $data['description'] = $matches[1]; 15 | }elseif(preg_match('/@name/', $value)){ 16 | preg_match('/name\s(.*)\r/', $value, $matches); 17 | $data['name'] = $matches[1]; 18 | }elseif(preg_match('/@grammar/', $value)){ 19 | preg_match('/grammar\s(.*)\r/', $value, $matches); 20 | $data['grammar'] = $matches[1]; 21 | $shortgrammar = explode('.', $matches[1]); 22 | $data['shortgrammar'] = $shortgrammar[count($shortgrammar) - 1]; 23 | }elseif(preg_match('/@param/', $value)){ 24 | !$data['param'] && $data['param'] = array(); 25 | preg_match('/param\s*([^\s]*)\s*([^\s]*)\s*(.*)\r/', $value, $matches); 26 | $data['param'][] = array('type' => $matches[1], 'name' => $matches[2], 'desc' => $matches[3]); 27 | $data['hasparam'] = true; 28 | }elseif(preg_match('/@return/', $value)){ 29 | preg_match('/return\s*([^\s]*)\s*(.*)\r/', $value, $matches); 30 | $data['return'] = array('type' => $matches[1], 'desc' => $matches[2]); 31 | }elseif(preg_match('/@example/', $value)){ 32 | $data['example'] = array(); 33 | $example = explode('示例代码:', preg_replace('/@example\s/', '', $value)); 34 | $data['example']['desc'] = preg_replace('/\r\n/', '
    ', $example[0]); 35 | $example[1] && $data['example']['code'] = $example[1]; 36 | } 37 | 38 | 39 | } 40 | $datas[] = $data; 41 | } 42 | 43 | // 匹配注释块 44 | preg_match_all('/\/\*[\s\S]*?\*\//', $content, $matches); 45 | $matches = $matches[0]; 46 | 47 | // 过滤出标准API注释块 48 | foreach ($matches as $key => $matche) { 49 | if(!preg_match('/@description/', $matche)){ 50 | unset($matches[$key]); 51 | } 52 | } 53 | 54 | // 匹配出注释块的每一项 55 | $datas = array(); 56 | foreach ($matches as $key => $matche) { 57 | preg_match_all('/(@[\s\S]*?)(?:\*\s|\*\/)/', $matche, $items); 58 | // var_dump($items[1]); 59 | getDesc($items[1]); 60 | } 61 | 62 | echo json_encode($datas); 63 | ?> -------------------------------------------------------------------------------- /test/tools/ci/docTpl.html: -------------------------------------------------------------------------------- 1 |
    2 |

    {{shortgrammar}}

    3 | 4 |

    5 | {{grammar}} : {{description}} 6 |

    7 | 8 | {{#hasparam}} 9 |

    参数

    10 | 11 | 12 | 13 | 14 | 15 | 16 | {{/hasparam}} 17 | {{#param}} 18 | 19 | 20 | 21 | 22 | 23 | {{/param}} 24 | {{#hasparam}} 25 |
    参数名类型描述
    {{name}}{{type}}{{desc}}
    26 | {{/hasparam}} 27 | {{#return}} 28 |

    返回值

    29 |

    {{type}} {{desc}}

    30 | {{/return}} 31 | {{#example}} 32 |

    说明

    33 |
    34 |

    {{{desc}}}

    35 |
    36 | {{#code}} 37 |

    示例

    38 |
    39 |
    {{code}}
    40 |
    41 | {{/code}} 42 | {{/example}} 43 |
    44 |
    -------------------------------------------------------------------------------- /test/tools/ci/getFileContent.php: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /test/tools/ci/getFiles.php: -------------------------------------------------------------------------------- 1 | array( 7 | array('children' => array(), 'name' => 'magic', 'type' => 'folder', 'dir' => $src_dir.'/magic'), 8 | array('children' => array(), 'name' => 'magic.js', 'type' => 'file', 'dir' => $src_dir.'/magic.js') 9 | )); 10 | }else{ 11 | $treeDates = array('children' => array( 12 | array('children' => array(), 'name' => 'baidu', 'type' => 'folder', 'dir' => $src_dir.'/baidu'), 13 | array('children' => array(), 'name' => 'plugin', 'type' => 'folder', 'dir' => $src_dir.'/plugin'), 14 | array('children' => array(), 'name' => 'baidu.js', 'type' => 'file', 'dir' => $src_dir.'/baidu.js') 15 | )); 16 | } 17 | 18 | function getSubFolders($dir, &$node){ 19 | $handler = opendir($dir); 20 | $filename = readdir($handler); 21 | 22 | $_files = array(); 23 | 24 | while($filename){ 25 | // 如果是文件夹,递归执行 26 | if(is_dir($dir.'/'.$filename) && $filename != '.' && $filename != '..'){ 27 | $child = array('children' => array(), 'name' => $filename, 'type' => 'folder', 'dir' => $dir.'/'.$filename); 28 | $node['children'][] = $child; 29 | getSubFolders($dir.'/'.$filename, $node['children'][count($node['children']) - 1]); 30 | }elseif(is_file($dir.'/'.$filename)){ // 如果是文件,直接设置name和type属性 31 | $_files[] = array('children' => array(), 'name' => $filename, 'type' => 'file', 'dir' => $dir.'/'.$filename); 32 | } 33 | 34 | $filename = readdir($handler); 35 | } 36 | 37 | // 最后合并文件类型的节点,以保证文件夹在前面,文件在后面 38 | $node['children'] = array_merge($node['children'], $_files); 39 | } 40 | 41 | 42 | foreach ($treeDates['children'] as $key=>$child) { 43 | $filename = $src_dir.'/'.$child['name']; 44 | 45 | if(is_dir($filename)){ 46 | getSubFolders($filename, $treeDates['children'][$key]); 47 | }else{ 48 | 49 | } 50 | } 51 | 52 | echo json_encode($treeDates); 53 | ?> 54 | -------------------------------------------------------------------------------- /test/tools/ci/staticcheck.php: -------------------------------------------------------------------------------- 1 | >>>>>>)/', $fileContent)){ 33 | $conflictCheck = 'failure'; 34 | } 35 | 36 | # 检查关联用例是否修改 37 | $srcLastModifyTime = date("Y-m-d H:i:s", filemtime($file)); 38 | $testfile = preg_replace('/src/', 'test', $file); 39 | $testCaseCheck = 'pass'; 40 | if(!is_file($testfile)){ 41 | $testLastModifyTime = '-'; 42 | $testCaseCheck = 'warning'; 43 | }else{ 44 | $testLastModifyTime = date("Y-m-d H:i:s", filemtime($testfile)); 45 | if(filemtime($file) > filemtime($testfile)){ 46 | $testCaseCheck = 'warning'; 47 | } 48 | } 49 | 50 | 51 | 52 | $result['encodingCheck'] = array('status' => $fileencodingCheck, 'msg' => $fileencoding); 53 | $result['BombCheck'] = array('status' => $bombCheck); 54 | $result['tabCheck'] = array('status' => $tabCheck); 55 | $result['conflictCheck'] = array('status' => $conflictCheck); 56 | $result['testCaseCheck'] = array('status' => $testCaseCheck, 'msg' => array('srcLastModify' => $srcLastModifyTime, 'testCaseLastModify' => $testLastModifyTime)); 57 | 58 | echo json_encode($result); 59 | 60 | # TODO 按顺序展开节点 61 | # TODO API文档预览 62 | # TODO 自动修复编码、Bomb、Tab 63 | ?> -------------------------------------------------------------------------------- /test/tools/data/flips2.swf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/tools/data/flips2.swf -------------------------------------------------------------------------------- /test/tools/data/frame.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 10 | -------------------------------------------------------------------------------- /test/tools/data/frame.php: -------------------------------------------------------------------------------- 1 | 3 | 4 | 5 | 11 | 12 | \n"; 23 | print ""; 24 | } 25 | else{ 26 | print ""; 27 | } 28 | ?> 29 | 32 | 33 | 34 | 35 | 36 | -------------------------------------------------------------------------------- /test/tools/data/test.JPG: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/BaiduFE/Magic/b7ba300e8577ced3345ed956c905a4c898468f44/test/tools/data/test.JPG -------------------------------------------------------------------------------- /test/tools/data/test.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | -------------------------------------------------------------------------------- /test/tools/data/testReady.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 9 | 10 | 11 | --------------------------------------------------------------------------------