@ -0,0 +1,18 @@ |
|||||||
|
DROP TABLE on_options; |
||||||
|
CREATE TABLE on_options ( |
||||||
|
"id" INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT, |
||||||
|
"key" TEXT(64) NOT NULL, |
||||||
|
"value" TEXT, |
||||||
|
"extend" TEXT, |
||||||
|
CONSTRAINT "option_key_only" UNIQUE ("key" ASC) |
||||||
|
); |
||||||
|
|
||||||
|
CREATE INDEX "main"."on_options_id_IDX" |
||||||
|
ON "on_options" ( |
||||||
|
"id" ASC, |
||||||
|
"key" ASC |
||||||
|
); |
||||||
|
CREATE INDEX "main"."on_options_key_IDX" |
||||||
|
ON "on_options" ( |
||||||
|
"key" ASC |
||||||
|
); |
@ -0,0 +1,3 @@ |
|||||||
|
INSERT INTO on_options ("key", value, extend) VALUES('theme', 'default', NULL); |
||||||
|
INSERT INTO on_options ("key", value, extend) VALUES('s_site', 'a:6:{s:5:"title";s:6:"OneNav";s:4:"logo";s:0:"";s:8:"subtitle";s:24:"开源书签管理程序";s:8:"keywords";s:107:"OneNav,OneNav导航,OneNav书签,开源导航,开源书签,简洁导航,云链接,个人导航,个人书签";s:11:"description";s:319:"OneNav是一款开源免费的书签(导航)管理程序,由xiaoz使用使用PHP + SQLite 3开发,界面简洁,安装简单,使用方便。OneNav可帮助你将浏览器书签集中式管理,解决跨设备、跨平台、跨浏览器之间同步和访问困难问题,做到一处部署,随处访问。";s:13:"custom_header";s:0:"";}', NULL); |
||||||
|
INSERT INTO on_options ("key", value, extend) VALUES('s_transition_page', 'a:3:{s:7:"control";s:3:"off";s:17:"visitor_stay_time";i:5;s:15:"admin_stay_time";i:0;}', NULL); |
@ -0,0 +1 @@ |
|||||||
|
html #layuicss-skincodecss{display:none;position:absolute;width:1989px}.layui-code-h3,.layui-code-view{position:relative;font-size:12px}.layui-code-view{display:block;margin:10px 0;padding:0;border:1px solid #eee;border-left-width:6px;background-color:#FAFAFA;color:#333;font-family:Courier New}.layui-code-h3{padding:0 10px;height:40px;line-height:40px;border-bottom:1px solid #eee}.layui-code-h3 a{position:absolute;right:10px;top:0;color:#999}.layui-code-view .layui-code-ol{position:relative;overflow:auto}.layui-code-view .layui-code-ol li{position:relative;margin-left:45px;line-height:20px;padding:0 10px;border-left:1px solid #e2e2e2;list-style-type:decimal-leading-zero;*list-style-type:decimal;background-color:#fff}.layui-code-view .layui-code-ol li:first-child{padding-top:10px}.layui-code-view .layui-code-ol li:last-child{padding-bottom:10px}.layui-code-view pre{margin:0}.layui-code-notepad{border:1px solid #0C0C0C;border-left-color:#3F3F3F;background-color:#0C0C0C;color:#C2BE9E}.layui-code-notepad .layui-code-h3{border-bottom:none}.layui-code-notepad .layui-code-ol li{background-color:#3F3F3F;border-left:none}.layui-code-demo .layui-code{visibility:visible!important;margin:-15px;border-top:none;border-right:none;border-bottom:none}.layui-code-demo .layui-tab-content{padding:15px;border-top:none} |
Before Width: | Height: | Size: 5.8 KiB After Width: | Height: | Size: 5.8 KiB |
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 11 KiB |
Before Width: | Height: | Size: 5.7 KiB After Width: | Height: | Size: 5.7 KiB |
Before Width: | Height: | Size: 701 B After Width: | Height: | Size: 701 B |
Before Width: | Height: | Size: 1.7 KiB After Width: | Height: | Size: 1.7 KiB |
Before Width: | Height: | Size: 299 KiB After Width: | Height: | Size: 299 KiB |
@ -0,0 +1,201 @@ |
|||||||
|
Apache License |
||||||
|
Version 2.0, January 2004 |
||||||
|
http://www.apache.org/licenses/ |
||||||
|
|
||||||
|
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION |
||||||
|
|
||||||
|
1. Definitions. |
||||||
|
|
||||||
|
"License" shall mean the terms and conditions for use, reproduction, |
||||||
|
and distribution as defined by Sections 1 through 9 of this document. |
||||||
|
|
||||||
|
"Licensor" shall mean the copyright owner or entity authorized by |
||||||
|
the copyright owner that is granting the License. |
||||||
|
|
||||||
|
"Legal Entity" shall mean the union of the acting entity and all |
||||||
|
other entities that control, are controlled by, or are under common |
||||||
|
control with that entity. For the purposes of this definition, |
||||||
|
"control" means (i) the power, direct or indirect, to cause the |
||||||
|
direction or management of such entity, whether by contract or |
||||||
|
otherwise, or (ii) ownership of fifty percent (50%) or more of the |
||||||
|
outstanding shares, or (iii) beneficial ownership of such entity. |
||||||
|
|
||||||
|
"You" (or "Your") shall mean an individual or Legal Entity |
||||||
|
exercising permissions granted by this License. |
||||||
|
|
||||||
|
"Source" form shall mean the preferred form for making modifications, |
||||||
|
including but not limited to software source code, documentation |
||||||
|
source, and configuration files. |
||||||
|
|
||||||
|
"Object" form shall mean any form resulting from mechanical |
||||||
|
transformation or translation of a Source form, including but |
||||||
|
not limited to compiled object code, generated documentation, |
||||||
|
and conversions to other media types. |
||||||
|
|
||||||
|
"Work" shall mean the work of authorship, whether in Source or |
||||||
|
Object form, made available under the License, as indicated by a |
||||||
|
copyright notice that is included in or attached to the work |
||||||
|
(an example is provided in the Appendix below). |
||||||
|
|
||||||
|
"Derivative Works" shall mean any work, whether in Source or Object |
||||||
|
form, that is based on (or derived from) the Work and for which the |
||||||
|
editorial revisions, annotations, elaborations, or other modifications |
||||||
|
represent, as a whole, an original work of authorship. For the purposes |
||||||
|
of this License, Derivative Works shall not include works that remain |
||||||
|
separable from, or merely link (or bind by name) to the interfaces of, |
||||||
|
the Work and Derivative Works thereof. |
||||||
|
|
||||||
|
"Contribution" shall mean any work of authorship, including |
||||||
|
the original version of the Work and any modifications or additions |
||||||
|
to that Work or Derivative Works thereof, that is intentionally |
||||||
|
submitted to Licensor for inclusion in the Work by the copyright owner |
||||||
|
or by an individual or Legal Entity authorized to submit on behalf of |
||||||
|
the copyright owner. For the purposes of this definition, "submitted" |
||||||
|
means any form of electronic, verbal, or written communication sent |
||||||
|
to the Licensor or its representatives, including but not limited to |
||||||
|
communication on electronic mailing lists, source code control systems, |
||||||
|
and issue tracking systems that are managed by, or on behalf of, the |
||||||
|
Licensor for the purpose of discussing and improving the Work, but |
||||||
|
excluding communication that is conspicuously marked or otherwise |
||||||
|
designated in writing by the copyright owner as "Not a Contribution." |
||||||
|
|
||||||
|
"Contributor" shall mean Licensor and any individual or Legal Entity |
||||||
|
on behalf of whom a Contribution has been received by Licensor and |
||||||
|
subsequently incorporated within the Work. |
||||||
|
|
||||||
|
2. Grant of Copyright License. Subject to the terms and conditions of |
||||||
|
this License, each Contributor hereby grants to You a perpetual, |
||||||
|
worldwide, non-exclusive, no-charge, royalty-free, irrevocable |
||||||
|
copyright license to reproduce, prepare Derivative Works of, |
||||||
|
publicly display, publicly perform, sublicense, and distribute the |
||||||
|
Work and such Derivative Works in Source or Object form. |
||||||
|
|
||||||
|
3. Grant of Patent License. Subject to the terms and conditions of |
||||||
|
this License, each Contributor hereby grants to You a perpetual, |
||||||
|
worldwide, non-exclusive, no-charge, royalty-free, irrevocable |
||||||
|
(except as stated in this section) patent license to make, have made, |
||||||
|
use, offer to sell, sell, import, and otherwise transfer the Work, |
||||||
|
where such license applies only to those patent claims licensable |
||||||
|
by such Contributor that are necessarily infringed by their |
||||||
|
Contribution(s) alone or by combination of their Contribution(s) |
||||||
|
with the Work to which such Contribution(s) was submitted. If You |
||||||
|
institute patent litigation against any entity (including a |
||||||
|
cross-claim or counterclaim in a lawsuit) alleging that the Work |
||||||
|
or a Contribution incorporated within the Work constitutes direct |
||||||
|
or contributory patent infringement, then any patent licenses |
||||||
|
granted to You under this License for that Work shall terminate |
||||||
|
as of the date such litigation is filed. |
||||||
|
|
||||||
|
4. Redistribution. You may reproduce and distribute copies of the |
||||||
|
Work or Derivative Works thereof in any medium, with or without |
||||||
|
modifications, and in Source or Object form, provided that You |
||||||
|
meet the following conditions: |
||||||
|
|
||||||
|
(a) You must give any other recipients of the Work or |
||||||
|
Derivative Works a copy of this License; and |
||||||
|
|
||||||
|
(b) You must cause any modified files to carry prominent notices |
||||||
|
stating that You changed the files; and |
||||||
|
|
||||||
|
(c) You must retain, in the Source form of any Derivative Works |
||||||
|
that You distribute, all copyright, patent, trademark, and |
||||||
|
attribution notices from the Source form of the Work, |
||||||
|
excluding those notices that do not pertain to any part of |
||||||
|
the Derivative Works; and |
||||||
|
|
||||||
|
(d) If the Work includes a "NOTICE" text file as part of its |
||||||
|
distribution, then any Derivative Works that You distribute must |
||||||
|
include a readable copy of the attribution notices contained |
||||||
|
within such NOTICE file, excluding those notices that do not |
||||||
|
pertain to any part of the Derivative Works, in at least one |
||||||
|
of the following places: within a NOTICE text file distributed |
||||||
|
as part of the Derivative Works; within the Source form or |
||||||
|
documentation, if provided along with the Derivative Works; or, |
||||||
|
within a display generated by the Derivative Works, if and |
||||||
|
wherever such third-party notices normally appear. The contents |
||||||
|
of the NOTICE file are for informational purposes only and |
||||||
|
do not modify the License. You may add Your own attribution |
||||||
|
notices within Derivative Works that You distribute, alongside |
||||||
|
or as an addendum to the NOTICE text from the Work, provided |
||||||
|
that such additional attribution notices cannot be construed |
||||||
|
as modifying the License. |
||||||
|
|
||||||
|
You may add Your own copyright statement to Your modifications and |
||||||
|
may provide additional or different license terms and conditions |
||||||
|
for use, reproduction, or distribution of Your modifications, or |
||||||
|
for any such Derivative Works as a whole, provided Your use, |
||||||
|
reproduction, and distribution of the Work otherwise complies with |
||||||
|
the conditions stated in this License. |
||||||
|
|
||||||
|
5. Submission of Contributions. Unless You explicitly state otherwise, |
||||||
|
any Contribution intentionally submitted for inclusion in the Work |
||||||
|
by You to the Licensor shall be under the terms and conditions of |
||||||
|
this License, without any additional terms or conditions. |
||||||
|
Notwithstanding the above, nothing herein shall supersede or modify |
||||||
|
the terms of any separate license agreement you may have executed |
||||||
|
with Licensor regarding such Contributions. |
||||||
|
|
||||||
|
6. Trademarks. This License does not grant permission to use the trade |
||||||
|
names, trademarks, service marks, or product names of the Licensor, |
||||||
|
except as required for reasonable and customary use in describing the |
||||||
|
origin of the Work and reproducing the content of the NOTICE file. |
||||||
|
|
||||||
|
7. Disclaimer of Warranty. Unless required by applicable law or |
||||||
|
agreed to in writing, Licensor provides the Work (and each |
||||||
|
Contributor provides its Contributions) on an "AS IS" BASIS, |
||||||
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or |
||||||
|
implied, including, without limitation, any warranties or conditions |
||||||
|
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A |
||||||
|
PARTICULAR PURPOSE. You are solely responsible for determining the |
||||||
|
appropriateness of using or redistributing the Work and assume any |
||||||
|
risks associated with Your exercise of permissions under this License. |
||||||
|
|
||||||
|
8. Limitation of Liability. In no event and under no legal theory, |
||||||
|
whether in tort (including negligence), contract, or otherwise, |
||||||
|
unless required by applicable law (such as deliberate and grossly |
||||||
|
negligent acts) or agreed to in writing, shall any Contributor be |
||||||
|
liable to You for damages, including any direct, indirect, special, |
||||||
|
incidental, or consequential damages of any character arising as a |
||||||
|
result of this License or out of the use or inability to use the |
||||||
|
Work (including but not limited to damages for loss of goodwill, |
||||||
|
work stoppage, computer failure or malfunction, or any and all |
||||||
|
other commercial damages or losses), even if such Contributor |
||||||
|
has been advised of the possibility of such damages. |
||||||
|
|
||||||
|
9. Accepting Warranty or Additional Liability. While redistributing |
||||||
|
the Work or Derivative Works thereof, You may choose to offer, |
||||||
|
and charge a fee for, acceptance of support, warranty, indemnity, |
||||||
|
or other liability obligations and/or rights consistent with this |
||||||
|
License. However, in accepting such obligations, You may act only |
||||||
|
on Your own behalf and on Your sole responsibility, not on behalf |
||||||
|
of any other Contributor, and only if You agree to indemnify, |
||||||
|
defend, and hold each Contributor harmless for any liability |
||||||
|
incurred by, or claims asserted against, such Contributor by reason |
||||||
|
of your accepting any such warranty or additional liability. |
||||||
|
|
||||||
|
END OF TERMS AND CONDITIONS |
||||||
|
|
||||||
|
APPENDIX: How to apply the Apache License to your work. |
||||||
|
|
||||||
|
To apply the Apache License to your work, attach the following |
||||||
|
boilerplate notice, with the fields enclosed by brackets "[]" |
||||||
|
replaced with your own identifying information. (Don't include |
||||||
|
the brackets!) The text should be enclosed in the appropriate |
||||||
|
comment syntax for the file format. We also recommend that a |
||||||
|
file or class name and description of purpose be included on the |
||||||
|
same "printed page" as the copyright notice for easier |
||||||
|
identification within third-party archives. |
||||||
|
|
||||||
|
Copyright [yyyy] [name of copyright owner] |
||||||
|
|
||||||
|
Licensed under the Apache License, Version 2.0 (the "License"); |
||||||
|
you may not use this file except in compliance with the License. |
||||||
|
You may obtain a copy of the License at |
||||||
|
|
||||||
|
http://www.apache.org/licenses/LICENSE-2.0 |
||||||
|
|
||||||
|
Unless required by applicable law or agreed to in writing, software |
||||||
|
distributed under the License is distributed on an "AS IS" BASIS, |
||||||
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||||
|
See the License for the specific language governing permissions and |
||||||
|
limitations under the License. |
@ -0,0 +1,393 @@ |
|||||||
|
Attribution 4.0 International |
||||||
|
|
||||||
|
======================================================================= |
||||||
|
|
||||||
|
Creative Commons Corporation ("Creative Commons") is not a law firm and |
||||||
|
does not provide legal services or legal advice. Distribution of |
||||||
|
Creative Commons public licenses does not create a lawyer-client or |
||||||
|
other relationship. Creative Commons makes its licenses and related |
||||||
|
information available on an "as-is" basis. Creative Commons gives no |
||||||
|
warranties regarding its licenses, any material licensed under their |
||||||
|
terms and conditions, or any related information. Creative Commons |
||||||
|
disclaims all liability for damages resulting from their use to the |
||||||
|
fullest extent possible. |
||||||
|
|
||||||
|
Using Creative Commons Public Licenses |
||||||
|
|
||||||
|
Creative Commons public licenses provide a standard set of terms and |
||||||
|
conditions that creators and other rights holders may use to share |
||||||
|
original works of authorship and other material subject to copyright |
||||||
|
and certain other rights specified in the public license below. The |
||||||
|
following considerations are for informational purposes only, are not |
||||||
|
exhaustive, and do not form part of our licenses. |
||||||
|
|
||||||
|
Considerations for licensors: Our public licenses are |
||||||
|
intended for use by those authorized to give the public |
||||||
|
permission to use material in ways otherwise restricted by |
||||||
|
copyright and certain other rights. Our licenses are |
||||||
|
irrevocable. Licensors should read and understand the terms |
||||||
|
and conditions of the license they choose before applying it. |
||||||
|
Licensors should also secure all rights necessary before |
||||||
|
applying our licenses so that the public can reuse the |
||||||
|
material as expected. Licensors should clearly mark any |
||||||
|
material not subject to the license. This includes other CC- |
||||||
|
licensed material, or material used under an exception or |
||||||
|
limitation to copyright. More considerations for licensors: |
||||||
|
wiki.creativecommons.org/Considerations_for_licensors |
||||||
|
|
||||||
|
Considerations for the public: By using one of our public |
||||||
|
licenses, a licensor grants the public permission to use the |
||||||
|
licensed material under specified terms and conditions. If |
||||||
|
the licensor's permission is not necessary for any reason--for |
||||||
|
example, because of any applicable exception or limitation to |
||||||
|
copyright--then that use is not regulated by the license. Our |
||||||
|
licenses grant only permissions under copyright and certain |
||||||
|
other rights that a licensor has authority to grant. Use of |
||||||
|
the licensed material may still be restricted for other |
||||||
|
reasons, including because others have copyright or other |
||||||
|
rights in the material. A licensor may make special requests, |
||||||
|
such as asking that all changes be marked or described. |
||||||
|
Although not required by our licenses, you are encouraged to |
||||||
|
respect those requests where reasonable. More_considerations |
||||||
|
for the public: |
||||||
|
wiki.creativecommons.org/Considerations_for_licensees |
||||||
|
|
||||||
|
======================================================================= |
||||||
|
|
||||||
|
Creative Commons Attribution 4.0 International Public License |
||||||
|
|
||||||
|
By exercising the Licensed Rights (defined below), You accept and agree |
||||||
|
to be bound by the terms and conditions of this Creative Commons |
||||||
|
Attribution 4.0 International Public License ("Public License"). To the |
||||||
|
extent this Public License may be interpreted as a contract, You are |
||||||
|
granted the Licensed Rights in consideration of Your acceptance of |
||||||
|
these terms and conditions, and the Licensor grants You such rights in |
||||||
|
consideration of benefits the Licensor receives from making the |
||||||
|
Licensed Material available under these terms and conditions. |
||||||
|
|
||||||
|
|
||||||
|
Section 1 -- Definitions. |
||||||
|
|
||||||
|
a. Adapted Material means material subject to Copyright and Similar |
||||||
|
Rights that is derived from or based upon the Licensed Material |
||||||
|
and in which the Licensed Material is translated, altered, |
||||||
|
arranged, transformed, or otherwise modified in a manner requiring |
||||||
|
permission under the Copyright and Similar Rights held by the |
||||||
|
Licensor. For purposes of this Public License, where the Licensed |
||||||
|
Material is a musical work, performance, or sound recording, |
||||||
|
Adapted Material is always produced where the Licensed Material is |
||||||
|
synched in timed relation with a moving image. |
||||||
|
|
||||||
|
b. Adapter's License means the license You apply to Your Copyright |
||||||
|
and Similar Rights in Your contributions to Adapted Material in |
||||||
|
accordance with the terms and conditions of this Public License. |
||||||
|
|
||||||
|
c. Copyright and Similar Rights means copyright and/or similar rights |
||||||
|
closely related to copyright including, without limitation, |
||||||
|
performance, broadcast, sound recording, and Sui Generis Database |
||||||
|
Rights, without regard to how the rights are labeled or |
||||||
|
categorized. For purposes of this Public License, the rights |
||||||
|
specified in Section 2(b)(1)-(2) are not Copyright and Similar |
||||||
|
Rights. |
||||||
|
|
||||||
|
d. Effective Technological Measures means those measures that, in the |
||||||
|
absence of proper authority, may not be circumvented under laws |
||||||
|
fulfilling obligations under Article 11 of the WIPO Copyright |
||||||
|
Treaty adopted on December 20, 1996, and/or similar international |
||||||
|
agreements. |
||||||
|
|
||||||
|
e. Exceptions and Limitations means fair use, fair dealing, and/or |
||||||
|
any other exception or limitation to Copyright and Similar Rights |
||||||
|
that applies to Your use of the Licensed Material. |
||||||
|
|
||||||
|
f. Licensed Material means the artistic or literary work, database, |
||||||
|
or other material to which the Licensor applied this Public |
||||||
|
License. |
||||||
|
|
||||||
|
g. Licensed Rights means the rights granted to You subject to the |
||||||
|
terms and conditions of this Public License, which are limited to |
||||||
|
all Copyright and Similar Rights that apply to Your use of the |
||||||
|
Licensed Material and that the Licensor has authority to license. |
||||||
|
|
||||||
|
h. Licensor means the individual(s) or entity(ies) granting rights |
||||||
|
under this Public License. |
||||||
|
|
||||||
|
i. Share means to provide material to the public by any means or |
||||||
|
process that requires permission under the Licensed Rights, such |
||||||
|
as reproduction, public display, public performance, distribution, |
||||||
|
dissemination, communication, or importation, and to make material |
||||||
|
available to the public including in ways that members of the |
||||||
|
public may access the material from a place and at a time |
||||||
|
individually chosen by them. |
||||||
|
|
||||||
|
j. Sui Generis Database Rights means rights other than copyright |
||||||
|
resulting from Directive 96/9/EC of the European Parliament and of |
||||||
|
the Council of 11 March 1996 on the legal protection of databases, |
||||||
|
as amended and/or succeeded, as well as other essentially |
||||||
|
equivalent rights anywhere in the world. |
||||||
|
|
||||||
|
k. You means the individual or entity exercising the Licensed Rights |
||||||
|
under this Public License. Your has a corresponding meaning. |
||||||
|
|
||||||
|
|
||||||
|
Section 2 -- Scope. |
||||||
|
|
||||||
|
a. License grant. |
||||||
|
|
||||||
|
1. Subject to the terms and conditions of this Public License, |
||||||
|
the Licensor hereby grants You a worldwide, royalty-free, |
||||||
|
non-sublicensable, non-exclusive, irrevocable license to |
||||||
|
exercise the Licensed Rights in the Licensed Material to: |
||||||
|
|
||||||
|
a. reproduce and Share the Licensed Material, in whole or |
||||||
|
in part; and |
||||||
|
|
||||||
|
b. produce, reproduce, and Share Adapted Material. |
||||||
|
|
||||||
|
2. Exceptions and Limitations. For the avoidance of doubt, where |
||||||
|
Exceptions and Limitations apply to Your use, this Public |
||||||
|
License does not apply, and You do not need to comply with |
||||||
|
its terms and conditions. |
||||||
|
|
||||||
|
3. Term. The term of this Public License is specified in Section |
||||||
|
6(a). |
||||||
|
|
||||||
|
4. Media and formats; technical modifications allowed. The |
||||||
|
Licensor authorizes You to exercise the Licensed Rights in |
||||||
|
all media and formats whether now known or hereafter created, |
||||||
|
and to make technical modifications necessary to do so. The |
||||||
|
Licensor waives and/or agrees not to assert any right or |
||||||
|
authority to forbid You from making technical modifications |
||||||
|
necessary to exercise the Licensed Rights, including |
||||||
|
technical modifications necessary to circumvent Effective |
||||||
|
Technological Measures. For purposes of this Public License, |
||||||
|
simply making modifications authorized by this Section 2(a) |
||||||
|
(4) never produces Adapted Material. |
||||||
|
|
||||||
|
5. Downstream recipients. |
||||||
|
|
||||||
|
a. Offer from the Licensor -- Licensed Material. Every |
||||||
|
recipient of the Licensed Material automatically |
||||||
|
receives an offer from the Licensor to exercise the |
||||||
|
Licensed Rights under the terms and conditions of this |
||||||
|
Public License. |
||||||
|
|
||||||
|
b. No downstream restrictions. You may not offer or impose |
||||||
|
any additional or different terms or conditions on, or |
||||||
|
apply any Effective Technological Measures to, the |
||||||
|
Licensed Material if doing so restricts exercise of the |
||||||
|
Licensed Rights by any recipient of the Licensed |
||||||
|
Material. |
||||||
|
|
||||||
|
6. No endorsement. Nothing in this Public License constitutes or |
||||||
|
may be construed as permission to assert or imply that You |
||||||
|
are, or that Your use of the Licensed Material is, connected |
||||||
|
with, or sponsored, endorsed, or granted official status by, |
||||||
|
the Licensor or others designated to receive attribution as |
||||||
|
provided in Section 3(a)(1)(A)(i). |
||||||
|
|
||||||
|
b. Other rights. |
||||||
|
|
||||||
|
1. Moral rights, such as the right of integrity, are not |
||||||
|
licensed under this Public License, nor are publicity, |
||||||
|
privacy, and/or other similar personality rights; however, to |
||||||
|
the extent possible, the Licensor waives and/or agrees not to |
||||||
|
assert any such rights held by the Licensor to the limited |
||||||
|
extent necessary to allow You to exercise the Licensed |
||||||
|
Rights, but not otherwise. |
||||||
|
|
||||||
|
2. Patent and trademark rights are not licensed under this |
||||||
|
Public License. |
||||||
|
|
||||||
|
3. To the extent possible, the Licensor waives any right to |
||||||
|
collect royalties from You for the exercise of the Licensed |
||||||
|
Rights, whether directly or through a collecting society |
||||||
|
under any voluntary or waivable statutory or compulsory |
||||||
|
licensing scheme. In all other cases the Licensor expressly |
||||||
|
reserves any right to collect such royalties. |
||||||
|
|
||||||
|
|
||||||
|
Section 3 -- License Conditions. |
||||||
|
|
||||||
|
Your exercise of the Licensed Rights is expressly made subject to the |
||||||
|
following conditions. |
||||||
|
|
||||||
|
a. Attribution. |
||||||
|
|
||||||
|
1. If You Share the Licensed Material (including in modified |
||||||
|
form), You must: |
||||||
|
|
||||||
|
a. retain the following if it is supplied by the Licensor |
||||||
|
with the Licensed Material: |
||||||
|
|
||||||
|
i. identification of the creator(s) of the Licensed |
||||||
|
Material and any others designated to receive |
||||||
|
attribution, in any reasonable manner requested by |
||||||
|
the Licensor (including by pseudonym if |
||||||
|
designated); |
||||||
|
|
||||||
|
ii. a copyright notice; |
||||||
|
|
||||||
|
iii. a notice that refers to this Public License; |
||||||
|
|
||||||
|
iv. a notice that refers to the disclaimer of |
||||||
|
warranties; |
||||||
|
|
||||||
|
v. a URI or hyperlink to the Licensed Material to the |
||||||
|
extent reasonably practicable; |
||||||
|
|
||||||
|
b. indicate if You modified the Licensed Material and |
||||||
|
retain an indication of any previous modifications; and |
||||||
|
|
||||||
|
c. indicate the Licensed Material is licensed under this |
||||||
|
Public License, and include the text of, or the URI or |
||||||
|
hyperlink to, this Public License. |
||||||
|
|
||||||
|
2. You may satisfy the conditions in Section 3(a)(1) in any |
||||||
|
reasonable manner based on the medium, means, and context in |
||||||
|
which You Share the Licensed Material. For example, it may be |
||||||
|
reasonable to satisfy the conditions by providing a URI or |
||||||
|
hyperlink to a resource that includes the required |
||||||
|
information. |
||||||
|
|
||||||
|
3. If requested by the Licensor, You must remove any of the |
||||||
|
information required by Section 3(a)(1)(A) to the extent |
||||||
|
reasonably practicable. |
||||||
|
|
||||||
|
4. If You Share Adapted Material You produce, the Adapter's |
||||||
|
License You apply must not prevent recipients of the Adapted |
||||||
|
Material from complying with this Public License. |
||||||
|
|
||||||
|
|
||||||
|
Section 4 -- Sui Generis Database Rights. |
||||||
|
|
||||||
|
Where the Licensed Rights include Sui Generis Database Rights that |
||||||
|
apply to Your use of the Licensed Material: |
||||||
|
|
||||||
|
a. for the avoidance of doubt, Section 2(a)(1) grants You the right |
||||||
|
to extract, reuse, reproduce, and Share all or a substantial |
||||||
|
portion of the contents of the database; |
||||||
|
|
||||||
|
b. if You include all or a substantial portion of the database |
||||||
|
contents in a database in which You have Sui Generis Database |
||||||
|
Rights, then the database in which You have Sui Generis Database |
||||||
|
Rights (but not its individual contents) is Adapted Material; and |
||||||
|
|
||||||
|
c. You must comply with the conditions in Section 3(a) if You Share |
||||||
|
all or a substantial portion of the contents of the database. |
||||||
|
|
||||||
|
For the avoidance of doubt, this Section 4 supplements and does not |
||||||
|
replace Your obligations under this Public License where the Licensed |
||||||
|
Rights include other Copyright and Similar Rights. |
||||||
|
|
||||||
|
|
||||||
|
Section 5 -- Disclaimer of Warranties and Limitation of Liability. |
||||||
|
|
||||||
|
a. UNLESS OTHERWISE SEPARATELY UNDERTAKEN BY THE LICENSOR, TO THE |
||||||
|
EXTENT POSSIBLE, THE LICENSOR OFFERS THE LICENSED MATERIAL AS-IS |
||||||
|
AND AS-AVAILABLE, AND MAKES NO REPRESENTATIONS OR WARRANTIES OF |
||||||
|
ANY KIND CONCERNING THE LICENSED MATERIAL, WHETHER EXPRESS, |
||||||
|
IMPLIED, STATUTORY, OR OTHER. THIS INCLUDES, WITHOUT LIMITATION, |
||||||
|
WARRANTIES OF TITLE, MERCHANTABILITY, FITNESS FOR A PARTICULAR |
||||||
|
PURPOSE, NON-INFRINGEMENT, ABSENCE OF LATENT OR OTHER DEFECTS, |
||||||
|
ACCURACY, OR THE PRESENCE OR ABSENCE OF ERRORS, WHETHER OR NOT |
||||||
|
KNOWN OR DISCOVERABLE. WHERE DISCLAIMERS OF WARRANTIES ARE NOT |
||||||
|
ALLOWED IN FULL OR IN PART, THIS DISCLAIMER MAY NOT APPLY TO YOU. |
||||||
|
|
||||||
|
b. TO THE EXTENT POSSIBLE, IN NO EVENT WILL THE LICENSOR BE LIABLE |
||||||
|
TO YOU ON ANY LEGAL THEORY (INCLUDING, WITHOUT LIMITATION, |
||||||
|
NEGLIGENCE) OR OTHERWISE FOR ANY DIRECT, SPECIAL, INDIRECT, |
||||||
|
INCIDENTAL, CONSEQUENTIAL, PUNITIVE, EXEMPLARY, OR OTHER LOSSES, |
||||||
|
COSTS, EXPENSES, OR DAMAGES ARISING OUT OF THIS PUBLIC LICENSE OR |
||||||
|
USE OF THE LICENSED MATERIAL, EVEN IF THE LICENSOR HAS BEEN |
||||||
|
ADVISED OF THE POSSIBILITY OF SUCH LOSSES, COSTS, EXPENSES, OR |
||||||
|
DAMAGES. WHERE A LIMITATION OF LIABILITY IS NOT ALLOWED IN FULL OR |
||||||
|
IN PART, THIS LIMITATION MAY NOT APPLY TO YOU. |
||||||
|
|
||||||
|
c. The disclaimer of warranties and limitation of liability provided |
||||||
|
above shall be interpreted in a manner that, to the extent |
||||||
|
possible, most closely approximates an absolute disclaimer and |
||||||
|
waiver of all liability. |
||||||
|
|
||||||
|
|
||||||
|
Section 6 -- Term and Termination. |
||||||
|
|
||||||
|
a. This Public License applies for the term of the Copyright and |
||||||
|
Similar Rights licensed here. However, if You fail to comply with |
||||||
|
this Public License, then Your rights under this Public License |
||||||
|
terminate automatically. |
||||||
|
|
||||||
|
b. Where Your right to use the Licensed Material has terminated under |
||||||
|
Section 6(a), it reinstates: |
||||||
|
|
||||||
|
1. automatically as of the date the violation is cured, provided |
||||||
|
it is cured within 30 days of Your discovery of the |
||||||
|
violation; or |
||||||
|
|
||||||
|
2. upon express reinstatement by the Licensor. |
||||||
|
|
||||||
|
For the avoidance of doubt, this Section 6(b) does not affect any |
||||||
|
right the Licensor may have to seek remedies for Your violations |
||||||
|
of this Public License. |
||||||
|
|
||||||
|
c. For the avoidance of doubt, the Licensor may also offer the |
||||||
|
Licensed Material under separate terms or conditions or stop |
||||||
|
distributing the Licensed Material at any time; however, doing so |
||||||
|
will not terminate this Public License. |
||||||
|
|
||||||
|
d. Sections 1, 5, 6, 7, and 8 survive termination of this Public |
||||||
|
License. |
||||||
|
|
||||||
|
|
||||||
|
Section 7 -- Other Terms and Conditions. |
||||||
|
|
||||||
|
a. The Licensor shall not be bound by any additional or different |
||||||
|
terms or conditions communicated by You unless expressly agreed. |
||||||
|
|
||||||
|
b. Any arrangements, understandings, or agreements regarding the |
||||||
|
Licensed Material not stated herein are separate from and |
||||||
|
independent of the terms and conditions of this Public License. |
||||||
|
|
||||||
|
|
||||||
|
Section 8 -- Interpretation. |
||||||
|
|
||||||
|
a. For the avoidance of doubt, this Public License does not, and |
||||||
|
shall not be interpreted to, reduce, limit, restrict, or impose |
||||||
|
conditions on any use of the Licensed Material that could lawfully |
||||||
|
be made without permission under this Public License. |
||||||
|
|
||||||
|
b. To the extent possible, if any provision of this Public License is |
||||||
|
deemed unenforceable, it shall be automatically reformed to the |
||||||
|
minimum extent necessary to make it enforceable. If the provision |
||||||
|
cannot be reformed, it shall be severed from this Public License |
||||||
|
without affecting the enforceability of the remaining terms and |
||||||
|
conditions. |
||||||
|
|
||||||
|
c. No term or condition of this Public License will be waived and no |
||||||
|
failure to comply consented to unless expressly agreed to by the |
||||||
|
Licensor. |
||||||
|
|
||||||
|
d. Nothing in this Public License constitutes or may be interpreted |
||||||
|
as a limitation upon, or waiver of, any privileges and immunities |
||||||
|
that apply to the Licensor or You, including from the legal |
||||||
|
processes of any jurisdiction or authority. |
||||||
|
|
||||||
|
|
||||||
|
======================================================================= |
||||||
|
|
||||||
|
Creative Commons is not a party to its public licenses. |
||||||
|
Notwithstanding, Creative Commons may elect to apply one of its public |
||||||
|
licenses to material it publishes and in those instances will be |
||||||
|
considered the "Licensor." Except for the limited purpose of indicating |
||||||
|
that material is shared under a Creative Commons public license or as |
||||||
|
otherwise permitted by the Creative Commons policies published at |
||||||
|
creativecommons.org/policies, Creative Commons does not authorize the |
||||||
|
use of the trademark "Creative Commons" or any other trademark or logo |
||||||
|
of Creative Commons without its prior written consent including, |
||||||
|
without limitation, in connection with any unauthorized modifications |
||||||
|
to any of its public licenses or any other arrangements, |
||||||
|
understandings, or agreements concerning use of licensed material. For |
||||||
|
the avoidance of doubt, this paragraph does not form part of the public |
||||||
|
licenses. |
||||||
|
|
||||||
|
Creative Commons may be contacted at creativecommons.org. |
@ -0,0 +1,70 @@ |
|||||||
|
<!-- 站点设置 --> |
||||||
|
<!-- 主题设置 --> |
||||||
|
<?php require_once(dirname(__DIR__).'/header.php'); ?> |
||||||
|
<?php include_once(dirname(__DIR__).'/left.php'); ?> |
||||||
|
<div class="layui-body"> |
||||||
|
<!-- 内容主体区域 --> |
||||||
|
<div class="layui-row content-body"> |
||||||
|
<!-- 说明提示框 --> |
||||||
|
<div class="layui-col-lg12"> |
||||||
|
<div class="setting-msg"> |
||||||
|
站点设置使用说明,请参考:<a href="https://dwz.ovh/un5rz" target = "_blank" title = "站点设置使用说明">https://dwz.ovh/un5rz</a> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<!-- 说明提示框END --> |
||||||
|
<div class="layui-col-lg6"> |
||||||
|
<form class="layui-form layui-form-pane" action=""> |
||||||
|
|
||||||
|
<div class="layui-form-item"> |
||||||
|
<label class="layui-form-label">网站标题</label> |
||||||
|
<div class="layui-input-block"> |
||||||
|
<input type="text" name="title" value = "<?php echo $site['title']; ?>" required lay-verify="required" autocomplete="off" placeholder="请输入网站标题" class="layui-input"> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="layui-form-item"> |
||||||
|
<label class="layui-form-label">网站logo</label> |
||||||
|
<div class="layui-input-block"> |
||||||
|
<input type="text" name="logo" value = "<?php echo $site['logo']; ?>" autocomplete="off" placeholder="网站logo地址,部分主题可能不支持" class="layui-input"> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="layui-form-item"> |
||||||
|
<label class="layui-form-label">副标题</label> |
||||||
|
<div class="layui-input-block"> |
||||||
|
<input type="text" name="subtitle" value = "<?php echo $site['subtitle']; ?>" autocomplete="off" placeholder="请输入副标题" class="layui-input"> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
|
||||||
|
<div class="layui-form-item"> |
||||||
|
<label class="layui-form-label">网站关键词</label> |
||||||
|
<div class="layui-input-block"> |
||||||
|
<input type="text" name="keywords" value = "<?php echo $site['keywords']; ?>" autocomplete="off" placeholder="输入网站关键词,用英文状态的逗号分隔" class="layui-input"> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="layui-form-item layui-form-text"> |
||||||
|
<label class="layui-form-label">网站描述</label> |
||||||
|
<div class="layui-input-block"> |
||||||
|
<textarea placeholder="网站描述,一般不超过200字符" name = "description" class="layui-textarea"><?php echo $site['description']; ?></textarea> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="layui-form-item layui-form-text"> |
||||||
|
<label class="layui-form-label">自定义header</label> |
||||||
|
<div class="layui-input-block"> |
||||||
|
<textarea name = "custom_header" placeholder="您可以自定义<header>...</header>之间的内容,如果您不清楚,请勿填写!" rows = "8" class="layui-textarea"><?php echo $site['custom_header']; ?></textarea> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="layui-form-item"> |
||||||
|
<button class="layui-btn" lay-submit="" lay-filter="set_site">保存设置</button> |
||||||
|
</div> |
||||||
|
|
||||||
|
</form> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<?php include_once(dirname(__DIR__).'/footer.php'); ?> |
@ -0,0 +1,71 @@ |
|||||||
|
<!-- 主题设置 --> |
||||||
|
<?php require_once(dirname(__DIR__).'/header.php'); ?> |
||||||
|
<?php include_once(dirname(__DIR__).'/left.php'); ?> |
||||||
|
<div class="layui-body"> |
||||||
|
<!-- 内容主体区域 --> |
||||||
|
<div class="layui-row content-body"> |
||||||
|
<!-- 说明提示框 --> |
||||||
|
<div class="layui-col-lg12"> |
||||||
|
<div class="setting-msg"> |
||||||
|
主题更换及设置说明,请参考:<a href="https://dwz.ovh/yoyaf" target = "_blank" title = "主题更换及设置说明">https://dwz.ovh/yoyaf</a> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<!-- 说明提示框END --> |
||||||
|
<div class="layui-col-lg12"> |
||||||
|
<div class="layui-row layui-col-space24"> |
||||||
|
<?php foreach ($themes as $key => $theme) { |
||||||
|
//var_dump($theme['info']->name); |
||||||
|
?> |
||||||
|
<!-- 主题列表 --> |
||||||
|
<div class="layui-col-lg3"> |
||||||
|
<fieldset style = "padding:1em;border:0px;height:170px;border:1px dashed #1E9FFF;box-shadow: 2px 2px 3px #888888;color:#666666"> |
||||||
|
<legend style = "font-size:32px;"><?php echo $key; ?></legend> |
||||||
|
<p><h2><?php echo $theme['info']->name ?></h2></p> |
||||||
|
<p>版本:<?php echo $theme['info']->version ?></p> |
||||||
|
<p>更新时间:<?php echo $theme['info']->update ?></p> |
||||||
|
<br /> |
||||||
|
<p> |
||||||
|
<div class="layui-btn-group"> |
||||||
|
<button type="button" class="layui-btn layui-btn-sm" onclick = "set_theme('<?php echo $key; ?>')">使用</button> |
||||||
|
<button type="button" class="layui-btn layui-btn-sm" onclick = "theme_detail('<?php echo $key; ?>')">详情</button> |
||||||
|
<?php if( $current_them == $key ) { ?> |
||||||
|
<button type="button" class="layui-btn layui-btn-sm layui-btn-danger">当前主题</button> |
||||||
|
<?php } ?> |
||||||
|
</div> |
||||||
|
</p> |
||||||
|
</fieldset> |
||||||
|
</div> |
||||||
|
<!-- 主题列表END --> |
||||||
|
<?php } ?> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<?php include_once(dirname(__DIR__).'/footer.php'); ?> |
||||||
|
<script> |
||||||
|
layui.use('layer', function(){ |
||||||
|
var layer = layui.layer; |
||||||
|
}); |
||||||
|
function theme_detail(name){ |
||||||
|
layer.open({ |
||||||
|
title: name, |
||||||
|
type:2, |
||||||
|
area: ['60%', '59%'], |
||||||
|
content:'/index.php?c=admin&page=setting/theme_detail&name=' + name |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
function set_theme(name) { |
||||||
|
$.post("/index.php?c=api&method=set_theme",{key:"theme",value:name},function(data,status){ |
||||||
|
if( data.code == 0 ) { |
||||||
|
layer.msg(data.data, {icon: 1}); |
||||||
|
setTimeout(() => { |
||||||
|
location.reload(); |
||||||
|
}, 2000); |
||||||
|
} |
||||||
|
else{ |
||||||
|
layer.msg(data.err_msg, {icon: 5}); |
||||||
|
} |
||||||
|
}); |
||||||
|
} |
||||||
|
</script> |
@ -0,0 +1,29 @@ |
|||||||
|
<!-- 主题详情页面 --> |
||||||
|
<html> |
||||||
|
<head> |
||||||
|
<meta charset="utf-8"> |
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> |
||||||
|
<title>OneNav后台管理</title> |
||||||
|
<link rel='stylesheet' href='static/layui/css/layui.css'> |
||||||
|
<link rel='stylesheet' href='templates/admin/static/style.css?v=v0.9.17-20220314'> |
||||||
|
</head> |
||||||
|
<body class="layui-fluid"> |
||||||
|
<div class="layui-row" style = "margin-top:1em;"> |
||||||
|
<div class="layui-col-sm9" style = "border-right:1px solid #e2e2e2;"> |
||||||
|
<div style = "margin-left:1em;margin-right:1em;"> |
||||||
|
<img src="<?php echo $theme->screenshot; ?>" alt="" style = "max-width:100%;"> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="layui-col-sm3"> |
||||||
|
<div style = "margin-left:1em;margin-right:1em;"> |
||||||
|
<h1><?php echo $theme->name; ?></h1> |
||||||
|
<p>描述:<?php echo $theme->description; ?></p> |
||||||
|
<p>版本:<?php echo $theme->version; ?></p> |
||||||
|
<p>更新时间:<?php echo $theme->update; ?></p> |
||||||
|
<p>作者:<?php echo $theme->author; ?></p> |
||||||
|
<p>主页:<a style = "color:#01AAED;" href="<?php echo $theme->homepage; ?>" target="_blank" rel = "nofollow"><?php echo $theme->homepage; ?></a></p> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</body> |
||||||
|
</html> |
@ -0,0 +1,51 @@ |
|||||||
|
<?php echo $transition_page['control']; ?> |
||||||
|
<!-- 过渡页面设置 --> |
||||||
|
<?php require_once(dirname(__DIR__).'/header.php'); ?> |
||||||
|
<?php include_once(dirname(__DIR__).'/left.php'); ?> |
||||||
|
<div class="layui-body"> |
||||||
|
<!-- 内容主体区域 --> |
||||||
|
<div class="layui-row content-body"> |
||||||
|
<!-- 说明提示框 --> |
||||||
|
<div class="layui-col-lg12"> |
||||||
|
<div class="setting-msg"> |
||||||
|
过渡页使用说明,请参考:<a href="https://dwz.ovh/yoyaf" target = "_blank" title = "过渡页使用说明">https://dwz.ovh/c7goi</a> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<!-- 说明提示框END --> |
||||||
|
<div class="layui-col-lg6"> |
||||||
|
<form class="layui-form layui-form-pane" action=""> |
||||||
|
|
||||||
|
<div class="layui-form-item"> |
||||||
|
<label class="layui-form-label" style = "width:130px;">过渡页</label> |
||||||
|
<div class="layui-input-block"> |
||||||
|
<input type="radio" name="control" value="off" <?php echo ( $transition_page['control'] == 'off' ) ? "checked" : ''; ?> title="关闭"> |
||||||
|
<input type="radio" name="control" value="on" <?php echo ( $transition_page['control'] == 'on' ) ? "checked" : ''; ?> title="开启"> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="layui-form-item"> |
||||||
|
<label class="layui-form-label" style = "width:130px;">访客停留时间</label> |
||||||
|
<div class="layui-input-inline"> |
||||||
|
<input type="number" min="0" max="86400" lay-verify="required|number" name="visitor_stay_time" value = "<?php echo $transition_page['visitor_stay_time']; ?>" autocomplete="off" placeholder="访客停留时间,单位s" class="layui-input"> |
||||||
|
</div> |
||||||
|
<div class="layui-form-mid layui-word-aux">访客停留时间,单位秒</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="layui-form-item"> |
||||||
|
<label class="layui-form-label" style = "width:130px;">管理员停留时间</label> |
||||||
|
<div class="layui-input-inline"> |
||||||
|
<input type="number" min="0" max="86400" lay-verify="required|number" name="admin_stay_time" value = "<?php echo $transition_page['admin_stay_time']; ?>" required lay-verify="required" autocomplete="off" placeholder="管理员停留时间,单位s" class="layui-input"> |
||||||
|
</div> |
||||||
|
<div class="layui-form-mid layui-word-aux">管理员停留时间,单位秒</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="layui-form-item"> |
||||||
|
<button class="layui-btn" lay-submit="" lay-filter="set_transition_page">保存设置</button> |
||||||
|
</div> |
||||||
|
|
||||||
|
</form> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<?php include_once(dirname(__DIR__).'/footer.php'); ?> |
@ -0,0 +1,9 @@ |
|||||||
|
{ |
||||||
|
"name":"百素主题2", |
||||||
|
"description":"适用于OneNav的百素主题2", |
||||||
|
"homepage":"https://gitee.com/baisucode/baisu-two", |
||||||
|
"version":"1.0.0", |
||||||
|
"update":"2022/04/15", |
||||||
|
"author":"baisu", |
||||||
|
"screenshot":"https://img.rss.ink/imgs/2022/03/cba9f1946776a8f0.png" |
||||||
|
} |
@ -1,29 +0,0 @@ |
|||||||
/** |
|
||||||
|
|
||||||
@Name: layui.code |
|
||||||
@Description:Classic modular front-end UI framework |
|
||||||
@License:MIT |
|
||||||
|
|
||||||
*/ |
|
||||||
|
|
||||||
/* 加载就绪标志 */ |
|
||||||
html #layuicss-skincodecss{display:none; position: absolute; width:1989px;} |
|
||||||
|
|
||||||
/* 默认风格 */ |
|
||||||
.layui-code-view{display: block; position: relative; margin: 10px 0; padding: 0; border: 1px solid #eee; border-left-width: 6px; background-color: #FAFAFA; color: #333; font-family: Courier New; font-size: 12px;} |
|
||||||
.layui-code-h3{position: relative; padding: 0 10px; height: 40px; line-height: 40px; border-bottom: 1px solid #eee; font-size: 12px;} |
|
||||||
.layui-code-h3 a{position: absolute; right: 10px; top: 0; color: #999;} |
|
||||||
.layui-code-view .layui-code-ol{position: relative; overflow: auto;} |
|
||||||
.layui-code-view .layui-code-ol li{position: relative; margin-left: 45px; line-height: 20px; padding: 0 10px; border-left: 1px solid #e2e2e2; list-style-type: decimal-leading-zero; *list-style-type: decimal; background-color: #fff;} |
|
||||||
.layui-code-view .layui-code-ol li:first-child{padding-top: 10px;} |
|
||||||
.layui-code-view .layui-code-ol li:last-child{padding-bottom: 10px;} |
|
||||||
.layui-code-view pre{margin: 0;} |
|
||||||
|
|
||||||
/* notepadd++风格 */ |
|
||||||
.layui-code-notepad{border: 1px solid #0C0C0C; border-left-color: #3F3F3F; background-color: #0C0C0C; color: #C2BE9E} |
|
||||||
.layui-code-notepad .layui-code-h3{border-bottom: none;} |
|
||||||
.layui-code-notepad .layui-code-ol li{background-color: #3F3F3F; border-left: none;} |
|
||||||
|
|
||||||
/* 代码预览 */ |
|
||||||
.layui-code-demo .layui-code{visibility: visible !important; margin: -15px; border-top: none; border-right: none; border-bottom: none;} |
|
||||||
.layui-code-demo .layui-tab-content{padding: 15px; border-top: none} |
|
@ -1,16 +0,0 @@ |
|||||||
/** 图标字体 **/ |
|
||||||
@font-face {font-family: 'laydate-icon'; |
|
||||||
src: url('./font/iconfont.eot'); |
|
||||||
src: url('./font/iconfont.eot#iefix') format('embedded-opentype'), |
|
||||||
url('./font/iconfont.svg#iconfont') format('svg'), |
|
||||||
url('./font/iconfont.woff') format('woff'), |
|
||||||
url('./font/iconfont.ttf') format('truetype'); |
|
||||||
} |
|
||||||
|
|
||||||
.laydate-icon{ |
|
||||||
font-family:"laydate-icon" !important; |
|
||||||
font-size: 16px; |
|
||||||
font-style: normal; |
|
||||||
-webkit-font-smoothing: antialiased; |
|
||||||
-moz-osx-font-smoothing: grayscale; |
|
||||||
} |
|
@ -1,152 +0,0 @@ |
|||||||
/** |
|
||||||
|
|
||||||
@Name: laydata |
|
||||||
|
|
||||||
**/ |
|
||||||
|
|
||||||
|
|
||||||
html #layuicss-laydate{display: none; position: absolute; width: 1989px;} |
|
||||||
|
|
||||||
/* 初始化 */ |
|
||||||
.layui-laydate *{margin: 0; padding: 0;} |
|
||||||
|
|
||||||
/* 主体结构 */ |
|
||||||
.layui-laydate, .layui-laydate *{box-sizing: border-box;} |
|
||||||
.layui-laydate{position: absolute; z-index: 66666666; margin: 5px 0; border-radius: 2px; font-size: 14px; -webkit-animation-duration: 0.2s; animation-duration: 0.2s; -webkit-animation-fill-mode: both; animation-fill-mode: both;} |
|
||||||
.layui-laydate-main{width: 272px;} |
|
||||||
.layui-laydate-header *, |
|
||||||
.layui-laydate-content td, |
|
||||||
.layui-laydate-list li{transition-duration: .3s; -webkit-transition-duration: .3s;} |
|
||||||
|
|
||||||
/* 微微往下滑入 */ |
|
||||||
@keyframes laydate-downbit { |
|
||||||
0% {opacity: 0.3; transform: translate3d(0, -5px, 0);} |
|
||||||
100% {opacity: 1; transform: translate3d(0, 0, 0);} |
|
||||||
} |
|
||||||
|
|
||||||
.layui-laydate{animation-name: laydate-downbit;} |
|
||||||
.layui-laydate-static{ position: relative; z-index: 0; display: inline-block; margin: 0; -webkit-animation: none; animation: none;} |
|
||||||
|
|
||||||
/* 展开年月列表时 */ |
|
||||||
.laydate-ym-show .laydate-prev-m, |
|
||||||
.laydate-ym-show .laydate-next-m{display: none !important;} |
|
||||||
.laydate-ym-show .laydate-prev-y, |
|
||||||
.laydate-ym-show .laydate-next-y{display: inline-block !important;} |
|
||||||
.laydate-ym-show .laydate-set-ym span[lay-type="month"]{display: none !important;} |
|
||||||
|
|
||||||
/* 展开时间列表时 */ |
|
||||||
.laydate-time-show .layui-laydate-header .layui-icon, |
|
||||||
.laydate-time-show .laydate-set-ym span[lay-type="year"], |
|
||||||
.laydate-time-show .laydate-set-ym span[lay-type="month"]{display: none !important;} |
|
||||||
|
|
||||||
/* 头部结构 */ |
|
||||||
.layui-laydate-header{position: relative; line-height:30px; padding: 10px 70px 5px;} |
|
||||||
.layui-laydate-header *{display: inline-block; vertical-align: bottom;} |
|
||||||
.layui-laydate-header i{position: absolute; top: 10px; padding: 0 5px; color: #999; font-size: 18px; cursor: pointer;} |
|
||||||
.layui-laydate-header i.laydate-prev-y{left: 15px;} |
|
||||||
.layui-laydate-header i.laydate-prev-m{left: 45px;} |
|
||||||
.layui-laydate-header i.laydate-next-y{right: 15px;} |
|
||||||
.layui-laydate-header i.laydate-next-m{right: 45px;} |
|
||||||
.laydate-set-ym{width: 100%; text-align: center; box-sizing: border-box; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;} |
|
||||||
.laydate-set-ym span{padding: 0 10px; cursor: pointer;} |
|
||||||
.laydate-time-text{cursor: default !important;} |
|
||||||
|
|
||||||
/* 主体结构 */ |
|
||||||
.layui-laydate-content{position: relative; padding: 10px; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none;} |
|
||||||
.layui-laydate-content table{border-collapse: collapse; border-spacing: 0;} |
|
||||||
.layui-laydate-content th, |
|
||||||
.layui-laydate-content td{width: 36px; height: 30px; padding: 5px; text-align: center;} |
|
||||||
.layui-laydate-content th{font-weight: 400;} |
|
||||||
.layui-laydate-content td{position: relative; cursor: pointer;} |
|
||||||
.laydate-day-mark{position: absolute; left: 0; top: 0; width: 100%; line-height: 30px; font-size: 12px; overflow: hidden;} |
|
||||||
.laydate-day-mark::after{position: absolute; content:''; right: 2px; top: 2px; width: 5px; height: 5px; border-radius: 50%;} |
|
||||||
|
|
||||||
/* 底部结构 */ |
|
||||||
.layui-laydate-footer{position: relative; height: 46px; line-height: 26px; padding: 10px;} |
|
||||||
.layui-laydate-footer span{display: inline-block; vertical-align: top; height: 26px; line-height: 24px; padding: 0 10px; border: 1px solid #C9C9C9; border-radius: 2px; background-color: #fff; font-size: 12px; cursor: pointer; white-space: nowrap; transition: all .3s;} |
|
||||||
.layui-laydate-footer span:hover{color: #5FB878;} |
|
||||||
.layui-laydate-footer span.layui-laydate-preview{cursor: default; border-color: transparent !important;} |
|
||||||
.layui-laydate-footer span.layui-laydate-preview:hover{color: #666;} |
|
||||||
.layui-laydate-footer span:first-child.layui-laydate-preview{padding-left: 0;} |
|
||||||
.laydate-footer-btns{position: absolute; right: 10px; top: 10px;} |
|
||||||
.laydate-footer-btns span{margin: 0 0 0 -1px;} |
|
||||||
|
|
||||||
/* 年月列表 */ |
|
||||||
.layui-laydate-list{position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 10px; box-sizing: border-box; background-color: #fff;} |
|
||||||
.layui-laydate-list>li{position: relative; display: inline-block; width: 33.3%; height: 36px; line-height: 36px; margin: 3px 0; vertical-align: middle; text-align: center; cursor: pointer;} |
|
||||||
.laydate-month-list>li{width: 25%; margin: 17px 0;} |
|
||||||
.laydate-time-list{} |
|
||||||
.laydate-time-list>li{height: 100%; margin: 0; line-height: normal; cursor: default;} |
|
||||||
.laydate-time-list p{position: relative; top: -4px; line-height: 29px;} |
|
||||||
.laydate-time-list ol{height: 181px; overflow: hidden;} |
|
||||||
.laydate-time-list>li:hover ol{overflow-y: auto;} |
|
||||||
.laydate-time-list ol li{width: 130%; padding-left: 33px; height: 30px; line-height: 30px; text-align: left; cursor: pointer;} |
|
||||||
|
|
||||||
/* 提示 */ |
|
||||||
.layui-laydate-hint{position: absolute; top: 115px; left: 50%; width: 250px; margin-left: -125px; line-height: 20px; padding: 15px; text-align: center; font-size: 12px; color: #FF5722;} |
|
||||||
|
|
||||||
|
|
||||||
/* 双日历 */ |
|
||||||
.layui-laydate-range{width: 546px;} |
|
||||||
.layui-laydate-range .layui-laydate-main{display: inline-block; vertical-align: middle;} |
|
||||||
.layui-laydate-range .laydate-main-list-1 .layui-laydate-header, |
|
||||||
.layui-laydate-range .laydate-main-list-1 .layui-laydate-content{border-left: 1px solid #e2e2e2;} |
|
||||||
|
|
||||||
|
|
||||||
/* 默认简约主题 */ |
|
||||||
.layui-laydate, .layui-laydate-hint{border: 1px solid #d2d2d2; box-shadow: 0 2px 4px rgba(0,0,0,.12); background-color: #fff; color: #666;} |
|
||||||
.layui-laydate-header{border-bottom: 1px solid #e2e2e2;} |
|
||||||
.layui-laydate-header i:hover, |
|
||||||
.layui-laydate-header span:hover{color: #5FB878;} |
|
||||||
.layui-laydate-content{border-top: none 0; border-bottom: none 0;} |
|
||||||
.layui-laydate-content th{color: #333;} |
|
||||||
.layui-laydate-content td{color: #666;} |
|
||||||
.layui-laydate-content td.laydate-selected{background-color: #B5FFF8;} |
|
||||||
.laydate-selected:hover{background-color: #00F7DE !important;} |
|
||||||
.layui-laydate-content td:hover, |
|
||||||
.layui-laydate-list li:hover{background-color: #eee; color: #333;} |
|
||||||
.laydate-time-list li ol{margin: 0; padding: 0; border: 1px solid #e2e2e2; border-left-width: 0;} |
|
||||||
.laydate-time-list li:first-child ol{border-left-width: 1px;} |
|
||||||
.laydate-time-list>li:hover{background: none;} |
|
||||||
.layui-laydate-content .laydate-day-prev, |
|
||||||
.layui-laydate-content .laydate-day-next{color: #d2d2d2;} |
|
||||||
.laydate-selected.laydate-day-prev, |
|
||||||
.laydate-selected.laydate-day-next{background-color: #f8f8f8 !important;} |
|
||||||
.layui-laydate-footer{border-top: 1px solid #e2e2e2;} |
|
||||||
.layui-laydate-hint{color: #FF5722;} |
|
||||||
.laydate-day-mark::after{background-color: #5FB878;} |
|
||||||
.layui-laydate-content td.layui-this .laydate-day-mark::after{display: none;} |
|
||||||
.layui-laydate-footer span[lay-type="date"]{color: #5FB878;} |
|
||||||
.layui-laydate .layui-this{background-color: #009688 !important; color: #fff !important;} |
|
||||||
.layui-laydate .laydate-disabled, |
|
||||||
.layui-laydate .laydate-disabled:hover{background:none !important; color: #d2d2d2 !important; cursor: not-allowed !important; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none;} |
|
||||||
|
|
||||||
/* 墨绿/自定义背景色主题 */ |
|
||||||
.laydate-theme-molv{border: none;} |
|
||||||
.laydate-theme-molv.layui-laydate-range{width: 548px} |
|
||||||
.laydate-theme-molv .layui-laydate-main{width: 274px;} |
|
||||||
.laydate-theme-molv .layui-laydate-header{border: none; background-color: #009688;} |
|
||||||
.laydate-theme-molv .layui-laydate-header i, |
|
||||||
.laydate-theme-molv .layui-laydate-header span{color: #f6f6f6;} |
|
||||||
.laydate-theme-molv .layui-laydate-header i:hover, |
|
||||||
.laydate-theme-molv .layui-laydate-header span:hover{color: #fff;} |
|
||||||
.laydate-theme-molv .layui-laydate-content{border: 1px solid #e2e2e2; border-top: none; border-bottom: none;} |
|
||||||
.laydate-theme-molv .laydate-main-list-1 .layui-laydate-content{border-left: none;} |
|
||||||
.laydate-theme-molv .layui-laydate-footer{border: 1px solid #e2e2e2;} |
|
||||||
|
|
||||||
/* 格子主题 */ |
|
||||||
.laydate-theme-grid .layui-laydate-content td, |
|
||||||
.laydate-theme-grid .layui-laydate-content thead, |
|
||||||
.laydate-theme-grid .laydate-year-list>li, |
|
||||||
.laydate-theme-grid .laydate-month-list>li{border: 1px solid #e2e2e2;} |
|
||||||
.laydate-theme-grid .laydate-selected, |
|
||||||
.laydate-theme-grid .laydate-selected:hover{background-color: #f2f2f2 !important; color: #009688 !important;} |
|
||||||
.laydate-theme-grid .laydate-selected.laydate-day-prev, |
|
||||||
.laydate-theme-grid .laydate-selected.laydate-day-next{color: #d2d2d2 !important;} |
|
||||||
.laydate-theme-grid .laydate-year-list, |
|
||||||
.laydate-theme-grid .laydate-month-list{margin: 1px 0 0 1px;} |
|
||||||
.laydate-theme-grid .laydate-year-list>li, |
|
||||||
.laydate-theme-grid .laydate-month-list>li{margin: 0 -1px -1px 0;} |
|
||||||
.laydate-theme-grid .laydate-year-list>li{height: 43px; line-height: 43px;} |
|
||||||
.laydate-theme-grid .laydate-month-list>li{height: 71px; line-height: 71px;} |
|
||||||
|
|
@ -1,179 +0,0 @@ |
|||||||
/** |
|
||||||
|
|
||||||
@Name: layer |
|
||||||
|
|
||||||
**/ |
|
||||||
|
|
||||||
/* *html{background-image: url(about:blank); background-attachment: fixed;} */ |
|
||||||
html #layuicss-layer{display: none; position: absolute; width: 1989px;} |
|
||||||
|
|
||||||
/* common */ |
|
||||||
.layui-layer-shade, .layui-layer{position:fixed; _position:absolute; pointer-events: auto;} |
|
||||||
.layui-layer-shade{top:0; left:0; width:100%; height:100%; _height:expression(document.body.offsetHeight+"px");} |
|
||||||
.layui-layer{-webkit-overflow-scrolling: touch;} |
|
||||||
.layui-layer{top:150px; left: 0; margin:0; padding:0; background-color:#fff; -webkit-background-clip: content; border-radius: 2px; box-shadow: 1px 1px 50px rgba(0,0,0,.3);} |
|
||||||
.layui-layer-close{position:absolute;} |
|
||||||
.layui-layer-content{position:relative;} |
|
||||||
.layui-layer-border{border: 1px solid #B2B2B2; border: 1px solid rgba(0,0,0,.1); box-shadow: 1px 1px 5px rgba(0,0,0,.2);} |
|
||||||
.layui-layer-load{background:url(loading-1.gif) #eee center center no-repeat;} |
|
||||||
.layui-layer-ico{ background:url(icon.png) no-repeat;} |
|
||||||
.layui-layer-dialog .layui-layer-ico, |
|
||||||
.layui-layer-setwin a, |
|
||||||
.layui-layer-btn a{display:inline-block; *display:inline; *zoom:1; vertical-align:top;} |
|
||||||
|
|
||||||
.layui-layer-move{display: none; position: fixed; *position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; cursor: move; opacity: 0; filter:alpha(opacity=0); background-color: #fff; z-index: 2147483647;} |
|
||||||
.layui-layer-resize{position: absolute; width: 15px; height: 15px; right: 0; bottom: 0; cursor: se-resize;} |
|
||||||
|
|
||||||
/* 动画 */ |
|
||||||
.layer-anim{-webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-duration:.3s; animation-duration:.3s;} |
|
||||||
|
|
||||||
@-webkit-keyframes layer-bounceIn { /* 默认 */ |
|
||||||
0% {opacity: 0; -webkit-transform: scale(.5); transform: scale(.5)} |
|
||||||
100% {opacity: 1; -webkit-transform: scale(1); transform: scale(1)} |
|
||||||
} |
|
||||||
@keyframes layer-bounceIn { |
|
||||||
0% {opacity: 0; -webkit-transform: scale(.5); -ms-transform: scale(.5); transform: scale(.5)} |
|
||||||
100% {opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1)} |
|
||||||
} |
|
||||||
.layer-anim-00{-webkit-animation-name: layer-bounceIn;animation-name: layer-bounceIn} |
|
||||||
|
|
||||||
@-webkit-keyframes layer-zoomInDown{0%{opacity:0;-webkit-transform:scale(.1) translateY(-2000px);transform:scale(.1) translateY(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateY(60px);transform:scale(.475) translateY(60px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes layer-zoomInDown{0%{opacity:0;-webkit-transform:scale(.1) translateY(-2000px);-ms-transform:scale(.1) translateY(-2000px);transform:scale(.1) translateY(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateY(60px);-ms-transform:scale(.475) translateY(60px);transform:scale(.475) translateY(60px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}.layer-anim-01{-webkit-animation-name:layer-zoomInDown;animation-name:layer-zoomInDown} |
|
||||||
|
|
||||||
@-webkit-keyframes layer-fadeInUpBig{0%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes layer-fadeInUpBig{0%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.layer-anim-02{-webkit-animation-name:layer-fadeInUpBig;animation-name:layer-fadeInUpBig} |
|
||||||
|
|
||||||
@-webkit-keyframes layer-zoomInLeft{0%{opacity:0;-webkit-transform:scale(.1) translateX(-2000px);transform:scale(.1) translateX(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateX(48px);transform:scale(.475) translateX(48px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes layer-zoomInLeft{0%{opacity:0;-webkit-transform:scale(.1) translateX(-2000px);-ms-transform:scale(.1) translateX(-2000px);transform:scale(.1) translateX(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateX(48px);-ms-transform:scale(.475) translateX(48px);transform:scale(.475) translateX(48px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}.layer-anim-03{-webkit-animation-name:layer-zoomInLeft;animation-name:layer-zoomInLeft} |
|
||||||
|
|
||||||
@-webkit-keyframes layer-rollIn{0%{opacity:0;-webkit-transform:translateX(-100%) rotate(-120deg);transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}}@keyframes layer-rollIn{0%{opacity:0;-webkit-transform:translateX(-100%) rotate(-120deg);-ms-transform:translateX(-100%) rotate(-120deg);transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);-ms-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}}.layer-anim-04{-webkit-animation-name:layer-rollIn;animation-name:layer-rollIn} |
|
||||||
|
|
||||||
@keyframes layer-fadeIn{0%{opacity:0}100%{opacity:1}}.layer-anim-05{-webkit-animation-name:layer-fadeIn;animation-name:layer-fadeIn} |
|
||||||
|
|
||||||
@-webkit-keyframes layer-shake{0%,100%{-webkit-transform:translateX(0);transform:translateX(0)}10%,30%,50%,70%,90%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}20%,40%,60%,80%{-webkit-transform:translateX(10px);transform:translateX(10px)}}@keyframes layer-shake{0%,100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}10%,30%,50%,70%,90%{-webkit-transform:translateX(-10px);-ms-transform:translateX(-10px);transform:translateX(-10px)}20%,40%,60%,80%{-webkit-transform:translateX(10px);-ms-transform:translateX(10px);transform:translateX(10px)}}.layer-anim-06{-webkit-animation-name:layer-shake;animation-name:layer-shake}@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}} |
|
||||||
|
|
||||||
/* 标题栏 */ |
|
||||||
.layui-layer-title{padding:0 80px 0 20px; height: 50px; line-height: 50px; border-bottom:1px solid #F0F0F0; font-size: 14px; color:#333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border-radius: 2px 2px 0 0;} |
|
||||||
.layui-layer-setwin{position:absolute; right: 15px; *right:0; top: 17px; font-size:0; line-height: initial;} |
|
||||||
.layui-layer-setwin a{position:relative; width: 16px; height:16px; margin-left:10px; font-size:12px; _overflow:hidden;} |
|
||||||
.layui-layer-setwin .layui-layer-min cite{position:absolute; width:14px; height:2px; left:0; top:50%; margin-top:-1px; background-color:#2E2D3C; cursor:pointer; _overflow:hidden;} |
|
||||||
.layui-layer-setwin .layui-layer-min:hover cite{background-color:#2D93CA; } |
|
||||||
.layui-layer-setwin .layui-layer-max{background-position:-32px -40px;} |
|
||||||
.layui-layer-setwin .layui-layer-max:hover{background-position:-16px -40px;} |
|
||||||
.layui-layer-setwin .layui-layer-maxmin{background-position:-65px -40px;} |
|
||||||
.layui-layer-setwin .layui-layer-maxmin:hover{background-position:-49px -40px;} |
|
||||||
.layui-layer-setwin .layui-layer-close1{background-position: 1px -40px; cursor: pointer;} |
|
||||||
.layui-layer-setwin .layui-layer-close1:hover{opacity:0.7;} |
|
||||||
.layui-layer-setwin .layui-layer-close2{position:absolute; right:-28px; top:-28px; width:30px; height:30px; margin-left:0; background-position:-149px -31px; *right:-18px; _display:none;} |
|
||||||
.layui-layer-setwin .layui-layer-close2:hover{ background-position:-180px -31px;} |
|
||||||
|
|
||||||
/* 按钮栏 */ |
|
||||||
.layui-layer-btn{text-align: right; padding: 0 15px 12px; pointer-events: auto; user-select: none; -webkit-user-select: none;} |
|
||||||
.layui-layer-btn a{height: 28px; line-height: 28px; margin: 5px 5px 0; padding: 0 15px; border: 1px solid #dedede; background-color:#fff; color: #333; border-radius: 2px; font-weight:400; cursor:pointer; text-decoration: none;} |
|
||||||
.layui-layer-btn a:hover{opacity: 0.9; text-decoration: none;} |
|
||||||
.layui-layer-btn a:active{opacity: 0.8;} |
|
||||||
.layui-layer-btn .layui-layer-btn0{border-color: #1E9FFF; background-color: #1E9FFF; color:#fff;} |
|
||||||
.layui-layer-btn-l{text-align: left;} |
|
||||||
.layui-layer-btn-c{text-align: center;} |
|
||||||
|
|
||||||
/* 定制化 */ |
|
||||||
.layui-layer-dialog{min-width: 300px;} |
|
||||||
.layui-layer-dialog .layui-layer-content{position: relative; padding:20px; line-height:24px; word-break: break-all; overflow:hidden; font-size:14px; overflow-x: hidden; overflow-y:auto;} |
|
||||||
.layui-layer-dialog .layui-layer-content .layui-layer-ico{position:absolute; top:16px; left:15px; _left:-40px; width:30px; height:30px;} |
|
||||||
.layui-layer-ico1{background-position:-30px 0 } |
|
||||||
.layui-layer-ico2{background-position:-60px 0;} |
|
||||||
.layui-layer-ico3{background-position:-90px 0;} |
|
||||||
.layui-layer-ico4{background-position:-120px 0;} |
|
||||||
.layui-layer-ico5{background-position:-150px 0;} |
|
||||||
.layui-layer-ico6{background-position:-180px 0;} |
|
||||||
.layui-layer-rim{border:6px solid #8D8D8D; border:6px solid rgba(0,0,0,.3); border-radius:5px; box-shadow: none;} |
|
||||||
.layui-layer-msg{min-width:180px; border:1px solid #D3D4D3; box-shadow: none;} |
|
||||||
.layui-layer-hui{min-width:100px; background-color: #000; filter:alpha(opacity=60); background-color: rgba(0,0,0,0.6); color: #fff; border:none;} |
|
||||||
.layui-layer-hui .layui-layer-content{padding:12px 25px; text-align:center;} |
|
||||||
.layui-layer-dialog .layui-layer-padding{padding: 20px 20px 20px 55px; text-align: left;} |
|
||||||
.layui-layer-page .layui-layer-content{position:relative; overflow:auto;} |
|
||||||
.layui-layer-page .layui-layer-btn,.layui-layer-iframe .layui-layer-btn{padding-top:10px;} |
|
||||||
.layui-layer-nobg{background:none;} |
|
||||||
.layui-layer-iframe iframe{display: block; width: 100%;} |
|
||||||
|
|
||||||
.layui-layer-loading{border-radius:100%; background:none; box-shadow:none; border:none;} |
|
||||||
.layui-layer-loading .layui-layer-content{width:60px; height:24px; background:url(loading-0.gif) no-repeat;} |
|
||||||
.layui-layer-loading .layui-layer-loading1{width:37px; height:37px; background:url(loading-1.gif) no-repeat;} |
|
||||||
.layui-layer-loading .layui-layer-loading2, .layui-layer-ico16{width:32px; height:32px; background:url(loading-2.gif) no-repeat;} |
|
||||||
.layui-layer-tips{background: none; box-shadow:none; border:none;} |
|
||||||
.layui-layer-tips .layui-layer-content{position: relative; line-height: 22px; min-width: 12px; padding: 8px 15px; font-size: 12px; _float:left; border-radius: 2px; box-shadow: 1px 1px 3px rgba(0,0,0,.2); background-color: #000; color: #fff;} |
|
||||||
.layui-layer-tips .layui-layer-close{right:-2px; top:-1px;} |
|
||||||
.layui-layer-tips i.layui-layer-TipsG{ position:absolute; width:0; height:0; border-width:8px; border-color:transparent; border-style:dashed; *overflow:hidden;} |
|
||||||
.layui-layer-tips i.layui-layer-TipsT, .layui-layer-tips i.layui-layer-TipsB{left:5px; border-right-style:solid; border-right-color: #000;} |
|
||||||
.layui-layer-tips i.layui-layer-TipsT{bottom:-8px;} |
|
||||||
.layui-layer-tips i.layui-layer-TipsB{top:-8px;} |
|
||||||
.layui-layer-tips i.layui-layer-TipsR, .layui-layer-tips i.layui-layer-TipsL{top: 5px; border-bottom-style:solid; border-bottom-color: #000;} |
|
||||||
.layui-layer-tips i.layui-layer-TipsR{left:-8px;} |
|
||||||
.layui-layer-tips i.layui-layer-TipsL{right:-8px;} |
|
||||||
|
|
||||||
/* skin */ |
|
||||||
.layui-layer-lan[type="dialog"]{min-width:280px;} |
|
||||||
.layui-layer-lan .layui-layer-title{background:#4476A7; color:#fff; border: none;} |
|
||||||
.layui-layer-lan .layui-layer-btn{padding: 5px 10px 10px; text-align: right; border-top:1px solid #E9E7E7} |
|
||||||
.layui-layer-lan .layui-layer-btn a{background: #fff; border-color: #E9E7E7; color: #333;} |
|
||||||
.layui-layer-lan .layui-layer-btn .layui-layer-btn1{background:#C9C5C5;} |
|
||||||
.layui-layer-molv .layui-layer-title{background: #009f95; color:#fff; border: none;} |
|
||||||
.layui-layer-molv .layui-layer-btn a{background: #009f95; border-color: #009f95;} |
|
||||||
.layui-layer-molv .layui-layer-btn .layui-layer-btn1{background:#92B8B1;} |
|
||||||
|
|
||||||
|
|
||||||
/** |
|
||||||
|
|
||||||
@Name: layer拓展样式 |
|
||||||
|
|
||||||
*/ |
|
||||||
|
|
||||||
.layui-layer-iconext{background:url(icon-ext.png) no-repeat;} |
|
||||||
|
|
||||||
/* prompt模式 */ |
|
||||||
.layui-layer-prompt .layui-layer-input{display: block; width: 260px; height: 36px; margin: 0 auto; line-height: 30px; padding-left: 10px; border: 1px solid #e6e6e6; color: #333;} |
|
||||||
.layui-layer-prompt textarea.layui-layer-input{width: 300px; height: 100px; line-height: 20px; padding: 6px 10px;} |
|
||||||
.layui-layer-prompt .layui-layer-content{padding: 20px;} |
|
||||||
.layui-layer-prompt .layui-layer-btn{padding-top: 0;} |
|
||||||
|
|
||||||
/* tab模式 */ |
|
||||||
.layui-layer-tab{box-shadow:1px 1px 50px rgba(0,0,0,.4);} |
|
||||||
.layui-layer-tab .layui-layer-title{padding-left:0; overflow: visible;} |
|
||||||
.layui-layer-tab .layui-layer-title span{position:relative; float:left; min-width:80px; max-width: 300px; padding:0 20px; text-align:center; cursor:default; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; cursor: pointer;} |
|
||||||
.layui-layer-tab .layui-layer-title span.layui-this{height: 51px; border-left: 1px solid #eee; border-right: 1px solid #eee; background-color: #fff; z-index: 10;} |
|
||||||
.layui-layer-tab .layui-layer-title span:first-child{border-left:none;} |
|
||||||
.layui-layer-tabmain{line-height:24px; clear:both;} |
|
||||||
.layui-layer-tabmain .layui-layer-tabli{display:none;} |
|
||||||
.layui-layer-tabmain .layui-layer-tabli.layui-this{display: block;} |
|
||||||
|
|
||||||
/* photo模式 */ |
|
||||||
.layui-layer-photos{background: none; box-shadow: none;} |
|
||||||
.layui-layer-photos .layui-layer-content{overflow:hidden; text-align: center;} |
|
||||||
.layui-layer-photos .layui-layer-phimg img{position: relative; width:100%; display: inline-block; *display:inline; *zoom:1; vertical-align:top;} |
|
||||||
.layui-layer-imgprev, .layui-layer-imgnext{position: fixed; top: 50%; width: 27px; _width: 44px; height: 44px; margin-top:-22px; outline:none;blr:expression(this.onFocus=this.blur());} |
|
||||||
.layui-layer-imgprev{left: 30px; background-position:-5px -5px; _background-position:-70px -5px;} |
|
||||||
.layui-layer-imgprev:hover{background-position:-33px -5px; _background-position:-120px -5px;} |
|
||||||
.layui-layer-imgnext{right: 30px; _right:8px; background-position:-5px -50px; _background-position:-70px -50px;} |
|
||||||
.layui-layer-imgnext:hover{background-position: -33px -50px; _background-position: -120px -50px;} |
|
||||||
.layui-layer-imgbar{position: fixed; left:0; right: 0; bottom:0; width:100%; height: 40px; line-height: 40px; background-color:#000\9; filter:Alpha(opacity=60); background-color: rgba(2,0,0,.35); color: #fff; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; font-size:0;} |
|
||||||
.layui-layer-imgtit{/*position:absolute; left:20px;*/} |
|
||||||
.layui-layer-imgtit *{display:inline-block; *display:inline; *zoom:1; vertical-align:top; font-size:12px;} |
|
||||||
.layui-layer-imgtit a{max-width:65%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; color:#fff;} |
|
||||||
.layui-layer-imgtit a:hover{color:#fff; text-decoration:underline;} |
|
||||||
.layui-layer-imgtit em{padding-left:10px; font-style: normal;} |
|
||||||
|
|
||||||
/* 关闭动画 */ |
|
||||||
@-webkit-keyframes layer-bounceOut { |
|
||||||
100% {opacity: 0; -webkit-transform: scale(.7); transform: scale(.7)} |
|
||||||
30% {-webkit-transform: scale(1.05); transform: scale(1.05)} |
|
||||||
0% {-webkit-transform: scale(1); transform: scale(1);} |
|
||||||
} |
|
||||||
@keyframes layer-bounceOut { |
|
||||||
100% {opacity: 0; -webkit-transform: scale(.7); -ms-transform: scale(.7); transform: scale(.7);} |
|
||||||
30% {-webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05);} |
|
||||||
0% {-webkit-transform: scale(1); -ms-transform: scale(1);transform: scale(1);} |
|
||||||
} |
|
||||||
.layer-anim-close{-webkit-animation-name: layer-bounceOut; animation-name: layer-bounceOut; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-duration:.2s; animation-duration:.2s;} |
|
||||||
|
|
||||||
@media screen and (max-width: 1100px) { |
|
||||||
.layui-layer-iframe{overflow-y: auto; -webkit-overflow-scrolling: touch;} |
|
||||||
} |
|
||||||
|
|
||||||
|
|
@ -1,754 +0,0 @@ |
|||||||
|
|
||||||
/*! |
|
||||||
* Layui |
|
||||||
* Classic modular Front-End UI library |
|
||||||
* MIT Licensed |
|
||||||
*/ |
|
||||||
|
|
||||||
;!function(win){ |
|
||||||
"use strict"; |
|
||||||
|
|
||||||
var doc = win.document, config = { |
|
||||||
modules: {} //记录模块物理路径
|
|
||||||
,status: {} //记录模块加载状态
|
|
||||||
,timeout: 10 //符合规范的模块请求最长等待秒数
|
|
||||||
,event: {} //记录模块自定义事件
|
|
||||||
} |
|
||||||
|
|
||||||
,Layui = function(){ |
|
||||||
this.v = '2.6.8'; // layui 版本号
|
|
||||||
} |
|
||||||
|
|
||||||
//识别预先可能定义的指定全局对象
|
|
||||||
,GLOBAL = win.LAYUI_GLOBAL || {} |
|
||||||
|
|
||||||
//获取 layui 所在目录
|
|
||||||
,getPath = function(){ |
|
||||||
var jsPath = doc.currentScript ? doc.currentScript.src : function(){ |
|
||||||
var js = doc.scripts |
|
||||||
,last = js.length - 1 |
|
||||||
,src; |
|
||||||
for(var i = last; i > 0; i--){ |
|
||||||
if(js[i].readyState === 'interactive'){ |
|
||||||
src = js[i].src; |
|
||||||
break; |
|
||||||
} |
|
||||||
} |
|
||||||
return src || js[last].src; |
|
||||||
}(); |
|
||||||
|
|
||||||
return config.dir = GLOBAL.dir || jsPath.substring(0, jsPath.lastIndexOf('/') + 1); |
|
||||||
}() |
|
||||||
|
|
||||||
//异常提示
|
|
||||||
,error = function(msg, type){ |
|
||||||
type = type || 'log'; |
|
||||||
win.console && console[type] && console[type]('layui error hint: ' + msg); |
|
||||||
} |
|
||||||
|
|
||||||
,isOpera = typeof opera !== 'undefined' && opera.toString() === '[object Opera]' |
|
||||||
|
|
||||||
//内置模块
|
|
||||||
,modules = config.builtin = { |
|
||||||
lay: 'lay' //基础 DOM 操作
|
|
||||||
,layer: 'layer' //弹层
|
|
||||||
,laydate: 'laydate' //日期
|
|
||||||
,laypage: 'laypage' //分页
|
|
||||||
,laytpl: 'laytpl' //模板引擎
|
|
||||||
,layedit: 'layedit' //富文本编辑器
|
|
||||||
,form: 'form' //表单集
|
|
||||||
,upload: 'upload' //上传
|
|
||||||
,dropdown: 'dropdown' //下拉菜单
|
|
||||||
,transfer: 'transfer' //穿梭框
|
|
||||||
,tree: 'tree' //树结构
|
|
||||||
,table: 'table' //表格
|
|
||||||
,element: 'element' //常用元素操作
|
|
||||||
,rate: 'rate' //评分组件
|
|
||||||
,colorpicker: 'colorpicker' //颜色选择器
|
|
||||||
,slider: 'slider' //滑块
|
|
||||||
,carousel: 'carousel' //轮播
|
|
||||||
,flow: 'flow' //流加载
|
|
||||||
,util: 'util' //工具块
|
|
||||||
,code: 'code' //代码修饰器
|
|
||||||
,jquery: 'jquery' //DOM 库(第三方)
|
|
||||||
|
|
||||||
,all: 'all' |
|
||||||
,'layui.all': 'layui.all' //聚合标识(功能性的,非真实模块)
|
|
||||||
}; |
|
||||||
|
|
||||||
//记录基础数据
|
|
||||||
Layui.prototype.cache = config; |
|
||||||
|
|
||||||
//定义模块
|
|
||||||
Layui.prototype.define = function(deps, factory){ |
|
||||||
var that = this |
|
||||||
,type = typeof deps === 'function' |
|
||||||
,callback = function(){ |
|
||||||
var setApp = function(app, exports){ |
|
||||||
layui[app] = exports; |
|
||||||
config.status[app] = true; |
|
||||||
}; |
|
||||||
typeof factory === 'function' && factory(function(app, exports){ |
|
||||||
setApp(app, exports); |
|
||||||
config.callback[app] = function(){ |
|
||||||
factory(setApp); |
|
||||||
} |
|
||||||
}); |
|
||||||
return this; |
|
||||||
}; |
|
||||||
|
|
||||||
type && ( |
|
||||||
factory = deps, |
|
||||||
deps = [] |
|
||||||
); |
|
||||||
|
|
||||||
that.use(deps, callback, null, 'define'); |
|
||||||
return that; |
|
||||||
}; |
|
||||||
|
|
||||||
//使用特定模块
|
|
||||||
Layui.prototype.use = function(apps, callback, exports, from){ |
|
||||||
var that = this |
|
||||||
,dir = config.dir = config.dir ? config.dir : getPath |
|
||||||
,head = doc.getElementsByTagName('head')[0]; |
|
||||||
|
|
||||||
apps = function(){ |
|
||||||
if(typeof apps === 'string'){ |
|
||||||
return [apps]; |
|
||||||
} |
|
||||||
//当第一个参数为 function 时,则自动加载所有内置模块,且执行的回调即为该 function 参数;
|
|
||||||
else if(typeof apps === 'function'){ |
|
||||||
callback = apps; |
|
||||||
return ['all']; |
|
||||||
} |
|
||||||
return apps; |
|
||||||
}(); |
|
||||||
|
|
||||||
//如果页面已经存在 jQuery 1.7+ 库且所定义的模块依赖 jQuery,则不加载内部 jquery 模块
|
|
||||||
if(win.jQuery && jQuery.fn.on){ |
|
||||||
that.each(apps, function(index, item){ |
|
||||||
if(item === 'jquery'){ |
|
||||||
apps.splice(index, 1); |
|
||||||
} |
|
||||||
}); |
|
||||||
layui.jquery = layui.$ = jQuery; |
|
||||||
} |
|
||||||
|
|
||||||
var item = apps[0] |
|
||||||
,timeout = 0; |
|
||||||
exports = exports || []; |
|
||||||
|
|
||||||
//静态资源host
|
|
||||||
config.host = config.host || (dir.match(/\/\/([\s\S]+?)\//)||['//'+ location.host +'/'])[0]; |
|
||||||
|
|
||||||
//加载完毕
|
|
||||||
function onScriptLoad(e, url){ |
|
||||||
var readyRegExp = navigator.platform === 'PLaySTATION 3' ? /^complete$/ : /^(complete|loaded)$/ |
|
||||||
if (e.type === 'load' || (readyRegExp.test((e.currentTarget || e.srcElement).readyState))) { |
|
||||||
config.modules[item] = url; |
|
||||||
head.removeChild(node); |
|
||||||
(function poll() { |
|
||||||
if(++timeout > config.timeout * 1000 / 4){ |
|
||||||
return error(item + ' is not a valid module', 'error'); |
|
||||||
}; |
|
||||||
config.status[item] ? onCallback() : setTimeout(poll, 4); |
|
||||||
}()); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
//回调
|
|
||||||
function onCallback(){ |
|
||||||
exports.push(layui[item]); |
|
||||||
apps.length > 1 ? |
|
||||||
that.use(apps.slice(1), callback, exports, from) |
|
||||||
: ( typeof callback === 'function' && function(){ |
|
||||||
//保证文档加载完毕再执行回调
|
|
||||||
if(layui.jquery && typeof layui.jquery === 'function' && from !== 'define'){ |
|
||||||
return layui.jquery(function(){ |
|
||||||
callback.apply(layui, exports); |
|
||||||
}); |
|
||||||
} |
|
||||||
callback.apply(layui, exports); |
|
||||||
}() ); |
|
||||||
} |
|
||||||
|
|
||||||
//如果引入了聚合板,内置的模块则不必重复加载
|
|
||||||
if( apps.length === 0 || (layui['layui.all'] && modules[item]) ){ |
|
||||||
return onCallback(), that; |
|
||||||
} |
|
||||||
|
|
||||||
//获取加载的模块 URL
|
|
||||||
//如果是内置模块,则按照 dir 参数拼接模块路径
|
|
||||||
//如果是扩展模块,则判断模块路径值是否为 {/} 开头,
|
|
||||||
//如果路径值是 {/} 开头,则模块路径即为后面紧跟的字符。
|
|
||||||
//否则,则按照 base 参数拼接模块路径
|
|
||||||
|
|
||||||
var url = ( modules[item] ? (dir + 'modules/') |
|
||||||
: (/^\{\/\}/.test(that.modules[item]) ? '' : (config.base || '')) |
|
||||||
) + (that.modules[item] || item) + '.js'; |
|
||||||
url = url.replace(/^\{\/\}/, ''); |
|
||||||
|
|
||||||
//如果扩展模块(即:非内置模块)对象已经存在,则不必再加载
|
|
||||||
if(!config.modules[item] && layui[item]){ |
|
||||||
config.modules[item] = url; //并记录起该扩展模块的 url
|
|
||||||
} |
|
||||||
|
|
||||||
//首次加载模块
|
|
||||||
if(!config.modules[item]){ |
|
||||||
var node = doc.createElement('script'); |
|
||||||
|
|
||||||
node.async = true; |
|
||||||
node.charset = 'utf-8'; |
|
||||||
node.src = url + function(){ |
|
||||||
var version = config.version === true |
|
||||||
? (config.v || (new Date()).getTime()) |
|
||||||
: (config.version||''); |
|
||||||
return version ? ('?v=' + version) : ''; |
|
||||||
}(); |
|
||||||
|
|
||||||
head.appendChild(node); |
|
||||||
|
|
||||||
if(node.attachEvent && !(node.attachEvent.toString && node.attachEvent.toString().indexOf('[native code') < 0) && !isOpera){ |
|
||||||
node.attachEvent('onreadystatechange', function(e){ |
|
||||||
onScriptLoad(e, url); |
|
||||||
}); |
|
||||||
} else { |
|
||||||
node.addEventListener('load', function(e){ |
|
||||||
onScriptLoad(e, url); |
|
||||||
}, false); |
|
||||||
} |
|
||||||
|
|
||||||
config.modules[item] = url; |
|
||||||
} else { //缓存
|
|
||||||
(function poll() { |
|
||||||
if(++timeout > config.timeout * 1000 / 4){ |
|
||||||
return error(item + ' is not a valid module', 'error'); |
|
||||||
}; |
|
||||||
(typeof config.modules[item] === 'string' && config.status[item]) |
|
||||||
? onCallback() |
|
||||||
: setTimeout(poll, 4); |
|
||||||
}()); |
|
||||||
} |
|
||||||
|
|
||||||
return that; |
|
||||||
}; |
|
||||||
|
|
||||||
//获取节点的 style 属性值
|
|
||||||
Layui.prototype.getStyle = function(node, name){ |
|
||||||
var style = node.currentStyle ? node.currentStyle : win.getComputedStyle(node, null); |
|
||||||
return style[style.getPropertyValue ? 'getPropertyValue' : 'getAttribute'](name); |
|
||||||
}; |
|
||||||
|
|
||||||
//css外部加载器
|
|
||||||
Layui.prototype.link = function(href, fn, cssname){ |
|
||||||
var that = this |
|
||||||
,head = doc.getElementsByTagName('head')[0] |
|
||||||
,link = doc.createElement('link'); |
|
||||||
|
|
||||||
if(typeof fn === 'string') cssname = fn; |
|
||||||
|
|
||||||
var app = (cssname || href).replace(/\.|\//g, '') |
|
||||||
,id = link.id = 'layuicss-'+ app |
|
||||||
,STAUTS_NAME = 'creating' |
|
||||||
,timeout = 0; |
|
||||||
|
|
||||||
link.rel = 'stylesheet'; |
|
||||||
link.href = href + (config.debug ? '?v='+new Date().getTime() : ''); |
|
||||||
link.media = 'all'; |
|
||||||
|
|
||||||
if(!doc.getElementById(id)){ |
|
||||||
head.appendChild(link); |
|
||||||
} |
|
||||||
|
|
||||||
if(typeof fn !== 'function') return that; |
|
||||||
|
|
||||||
//轮询 css 是否加载完毕
|
|
||||||
(function poll(status) { |
|
||||||
var delay = 100 |
|
||||||
,getLinkElem = doc.getElementById(id); //获取动态插入的 link 元素
|
|
||||||
|
|
||||||
//如果轮询超过指定秒数,则视为请求文件失败或 css 文件不符合规范
|
|
||||||
if(++timeout > config.timeout * 1000 / delay){ |
|
||||||
return error(href + ' timeout'); |
|
||||||
}; |
|
||||||
|
|
||||||
//css 加载就绪
|
|
||||||
if(parseInt(that.getStyle(getLinkElem, 'width')) === 1989){ |
|
||||||
//如果参数来自于初始轮询(即未加载就绪时的),则移除 link 标签状态
|
|
||||||
if(status === STAUTS_NAME) getLinkElem.removeAttribute('lay-status'); |
|
||||||
//如果 link 标签的状态仍为「创建中」,则继续进入轮询,直到状态改变,则执行回调
|
|
||||||
getLinkElem.getAttribute('lay-status') === STAUTS_NAME ? setTimeout(poll, delay) : fn(); |
|
||||||
} else { |
|
||||||
getLinkElem.setAttribute('lay-status', STAUTS_NAME); |
|
||||||
setTimeout(function(){ |
|
||||||
poll(STAUTS_NAME); |
|
||||||
}, delay); |
|
||||||
} |
|
||||||
}()); |
|
||||||
|
|
||||||
//轮询css是否加载完毕
|
|
||||||
/* |
|
||||||
(function poll() { |
|
||||||
if(++timeout > config.timeout * 1000 / 100){ |
|
||||||
return error(href + ' timeout'); |
|
||||||
}; |
|
||||||
parseInt(that.getStyle(doc.getElementById(id), 'width')) === 1989 ? function(){ |
|
||||||
fn(); |
|
||||||
}() : setTimeout(poll, 100); |
|
||||||
}()); |
|
||||||
*/ |
|
||||||
|
|
||||||
return that; |
|
||||||
}; |
|
||||||
|
|
||||||
//css 内部加载器
|
|
||||||
Layui.prototype.addcss = function(firename, fn, cssname){ |
|
||||||
return layui.link(config.dir + 'css/' + firename, fn, cssname); |
|
||||||
}; |
|
||||||
|
|
||||||
//存储模块的回调
|
|
||||||
config.callback = {}; |
|
||||||
|
|
||||||
//重新执行模块的工厂函数
|
|
||||||
Layui.prototype.factory = function(modName){ |
|
||||||
if(layui[modName]){ |
|
||||||
return typeof config.callback[modName] === 'function' |
|
||||||
? config.callback[modName] |
|
||||||
: null; |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
//图片预加载
|
|
||||||
Layui.prototype.img = function(url, callback, error) { |
|
||||||
var img = new Image(); |
|
||||||
img.src = url; |
|
||||||
if(img.complete){ |
|
||||||
return callback(img); |
|
||||||
} |
|
||||||
img.onload = function(){ |
|
||||||
img.onload = null; |
|
||||||
typeof callback === 'function' && callback(img); |
|
||||||
}; |
|
||||||
img.onerror = function(e){ |
|
||||||
img.onerror = null; |
|
||||||
typeof error === 'function' && error(e); |
|
||||||
}; |
|
||||||
}; |
|
||||||
|
|
||||||
//全局配置
|
|
||||||
Layui.prototype.config = function(options){ |
|
||||||
options = options || {}; |
|
||||||
for(var key in options){ |
|
||||||
config[key] = options[key]; |
|
||||||
} |
|
||||||
return this; |
|
||||||
}; |
|
||||||
|
|
||||||
//记录全部模块
|
|
||||||
Layui.prototype.modules = function(){ |
|
||||||
var clone = {}; |
|
||||||
for(var o in modules){ |
|
||||||
clone[o] = modules[o]; |
|
||||||
} |
|
||||||
return clone; |
|
||||||
}(); |
|
||||||
|
|
||||||
//拓展模块
|
|
||||||
Layui.prototype.extend = function(options){ |
|
||||||
var that = this; |
|
||||||
|
|
||||||
//验证模块是否被占用
|
|
||||||
options = options || {}; |
|
||||||
for(var o in options){ |
|
||||||
if(that[o] || that.modules[o]){ |
|
||||||
error(o+ ' Module already exists', 'error'); |
|
||||||
} else { |
|
||||||
that.modules[o] = options[o]; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
return that; |
|
||||||
}; |
|
||||||
|
|
||||||
// location.hash 路由解析
|
|
||||||
Layui.prototype.router = function(hash){ |
|
||||||
var that = this |
|
||||||
,hash = hash || location.hash |
|
||||||
,data = { |
|
||||||
path: [] |
|
||||||
,search: {} |
|
||||||
,hash: (hash.match(/[^#](#.*$)/) || [])[1] || '' |
|
||||||
}; |
|
||||||
|
|
||||||
if(!/^#\//.test(hash)) return data; //禁止非路由规范
|
|
||||||
hash = hash.replace(/^#\//, ''); |
|
||||||
data.href = '/' + hash; |
|
||||||
hash = hash.replace(/([^#])(#.*$)/, '$1').split('/') || []; |
|
||||||
|
|
||||||
//提取 Hash 结构
|
|
||||||
that.each(hash, function(index, item){ |
|
||||||
/^\w+=/.test(item) ? function(){ |
|
||||||
item = item.split('='); |
|
||||||
data.search[item[0]] = item[1]; |
|
||||||
}() : data.path.push(item); |
|
||||||
}); |
|
||||||
|
|
||||||
return data; |
|
||||||
}; |
|
||||||
|
|
||||||
//URL 解析
|
|
||||||
Layui.prototype.url = function(href){ |
|
||||||
var that = this |
|
||||||
,data = { |
|
||||||
//提取 url 路径
|
|
||||||
pathname: function(){ |
|
||||||
var pathname = href |
|
||||||
? function(){ |
|
||||||
var str = (href.match(/\.[^.]+?\/.+/) || [])[0] || ''; |
|
||||||
return str.replace(/^[^\/]+/, '').replace(/\?.+/, ''); |
|
||||||
}() |
|
||||||
: location.pathname; |
|
||||||
return pathname.replace(/^\//, '').split('/'); |
|
||||||
}() |
|
||||||
|
|
||||||
//提取 url 参数
|
|
||||||
,search: function(){ |
|
||||||
var obj = {} |
|
||||||
,search = (href |
|
||||||
? function(){ |
|
||||||
var str = (href.match(/\?.+/) || [])[0] || ''; |
|
||||||
return str.replace(/\#.+/, ''); |
|
||||||
}() |
|
||||||
: location.search |
|
||||||
).replace(/^\?+/, '').split('&'); //去除 ?,按 & 分割参数
|
|
||||||
|
|
||||||
//遍历分割后的参数
|
|
||||||
that.each(search, function(index, item){ |
|
||||||
var _index = item.indexOf('=') |
|
||||||
,key = function(){ //提取 key
|
|
||||||
if(_index < 0){ |
|
||||||
return item.substr(0, item.length); |
|
||||||
} else if(_index === 0){ |
|
||||||
return false; |
|
||||||
} else { |
|
||||||
return item.substr(0, _index); |
|
||||||
} |
|
||||||
}(); |
|
||||||
//提取 value
|
|
||||||
if(key){ |
|
||||||
obj[key] = _index > 0 ? item.substr(_index + 1) : null; |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
return obj; |
|
||||||
}() |
|
||||||
|
|
||||||
//提取 Hash
|
|
||||||
,hash: that.router(function(){ |
|
||||||
return href |
|
||||||
? ((href.match(/#.+/) || [])[0] || '/') |
|
||||||
: location.hash; |
|
||||||
}()) |
|
||||||
}; |
|
||||||
|
|
||||||
return data; |
|
||||||
}; |
|
||||||
|
|
||||||
//本地持久性存储
|
|
||||||
Layui.prototype.data = function(table, settings, storage){ |
|
||||||
table = table || 'layui'; |
|
||||||
storage = storage || localStorage; |
|
||||||
|
|
||||||
if(!win.JSON || !win.JSON.parse) return; |
|
||||||
|
|
||||||
//如果settings为null,则删除表
|
|
||||||
if(settings === null){ |
|
||||||
return delete storage[table]; |
|
||||||
} |
|
||||||
|
|
||||||
settings = typeof settings === 'object' |
|
||||||
? settings |
|
||||||
: {key: settings}; |
|
||||||
|
|
||||||
try{ |
|
||||||
var data = JSON.parse(storage[table]); |
|
||||||
} catch(e){ |
|
||||||
var data = {}; |
|
||||||
} |
|
||||||
|
|
||||||
if('value' in settings) data[settings.key] = settings.value; |
|
||||||
if(settings.remove) delete data[settings.key]; |
|
||||||
storage[table] = JSON.stringify(data); |
|
||||||
|
|
||||||
return settings.key ? data[settings.key] : data; |
|
||||||
}; |
|
||||||
|
|
||||||
//本地会话性存储
|
|
||||||
Layui.prototype.sessionData = function(table, settings){ |
|
||||||
return this.data(table, settings, sessionStorage); |
|
||||||
} |
|
||||||
|
|
||||||
//设备信息
|
|
||||||
Layui.prototype.device = function(key){ |
|
||||||
var agent = navigator.userAgent.toLowerCase() |
|
||||||
|
|
||||||
//获取版本号
|
|
||||||
,getVersion = function(label){ |
|
||||||
var exp = new RegExp(label + '/([^\\s\\_\\-]+)'); |
|
||||||
label = (agent.match(exp)||[])[1]; |
|
||||||
return label || false; |
|
||||||
} |
|
||||||
|
|
||||||
//返回结果集
|
|
||||||
,result = { |
|
||||||
os: function(){ //底层操作系统
|
|
||||||
if(/windows/.test(agent)){ |
|
||||||
return 'windows'; |
|
||||||
} else if(/linux/.test(agent)){ |
|
||||||
return 'linux'; |
|
||||||
} else if(/iphone|ipod|ipad|ios/.test(agent)){ |
|
||||||
return 'ios'; |
|
||||||
} else if(/mac/.test(agent)){ |
|
||||||
return 'mac'; |
|
||||||
} |
|
||||||
}() |
|
||||||
,ie: function(){ //ie版本
|
|
||||||
return (!!win.ActiveXObject || "ActiveXObject" in win) ? ( |
|
||||||
(agent.match(/msie\s(\d+)/) || [])[1] || '11' //由于ie11并没有msie的标识
|
|
||||||
) : false; |
|
||||||
}() |
|
||||||
,weixin: getVersion('micromessenger') //是否微信
|
|
||||||
}; |
|
||||||
|
|
||||||
//任意的key
|
|
||||||
if(key && !result[key]){ |
|
||||||
result[key] = getVersion(key); |
|
||||||
} |
|
||||||
|
|
||||||
//移动设备
|
|
||||||
result.android = /android/.test(agent); |
|
||||||
result.ios = result.os === 'ios'; |
|
||||||
result.mobile = (result.android || result.ios) ? true : false; |
|
||||||
|
|
||||||
return result; |
|
||||||
}; |
|
||||||
|
|
||||||
//提示
|
|
||||||
Layui.prototype.hint = function(){ |
|
||||||
return { |
|
||||||
error: error |
|
||||||
}; |
|
||||||
}; |
|
||||||
|
|
||||||
//typeof 类型细分 -> string/number/boolean/undefined/null、object/array/function/…
|
|
||||||
Layui.prototype._typeof = function(operand){ |
|
||||||
if(operand === null) return String(operand); |
|
||||||
|
|
||||||
//细分引用类型
|
|
||||||
return (typeof operand === 'object' || typeof operand === 'function') ? function(){ |
|
||||||
var type = Object.prototype.toString.call(operand).match(/\s(.+)\]$/) || [] //匹配类型字符
|
|
||||||
,classType = 'Function|Array|Date|RegExp|Object|Error|Symbol'; //常见类型字符
|
|
||||||
|
|
||||||
type = type[1] || 'Object'; |
|
||||||
|
|
||||||
//除匹配到的类型外,其他对象均返回 object
|
|
||||||
return new RegExp('\\b('+ classType + ')\\b').test(type) |
|
||||||
? type.toLowerCase() |
|
||||||
: 'object'; |
|
||||||
}() : typeof operand; |
|
||||||
}; |
|
||||||
|
|
||||||
//对象是否具备数组结构(此处为兼容 jQuery 对象)
|
|
||||||
Layui.prototype._isArray = function(obj){ |
|
||||||
var that = this |
|
||||||
,len |
|
||||||
,type = that._typeof(obj); |
|
||||||
|
|
||||||
if(!obj || (typeof obj !== 'object') || obj === win) return false; |
|
||||||
|
|
||||||
len = 'length' in obj && obj.length; //兼容 ie
|
|
||||||
return type === 'array' || len === 0 || ( |
|
||||||
typeof len === 'number' && len > 0 && (len - 1) in obj //兼容 jQuery 对象
|
|
||||||
); |
|
||||||
}; |
|
||||||
|
|
||||||
//遍历
|
|
||||||
Layui.prototype.each = function(obj, fn){ |
|
||||||
var key |
|
||||||
,that = this |
|
||||||
,callFn = function(key, obj){ //回调
|
|
||||||
return fn.call(obj[key], key, obj[key]) |
|
||||||
}; |
|
||||||
|
|
||||||
if(typeof fn !== 'function') return that; |
|
||||||
obj = obj || []; |
|
||||||
|
|
||||||
//优先处理数组结构
|
|
||||||
if(that._isArray(obj)){ |
|
||||||
for(key = 0; key < obj.length; key++){ |
|
||||||
if(callFn(key, obj)) break; |
|
||||||
} |
|
||||||
} else { |
|
||||||
for(key in obj){ |
|
||||||
if(callFn(key, obj)) break; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
return that; |
|
||||||
}; |
|
||||||
|
|
||||||
//将数组中的对象按其某个成员排序
|
|
||||||
Layui.prototype.sort = function(obj, key, desc){ |
|
||||||
var clone = JSON.parse( |
|
||||||
JSON.stringify(obj || []) |
|
||||||
); |
|
||||||
|
|
||||||
if(!key) return clone; |
|
||||||
|
|
||||||
//如果是数字,按大小排序;如果是非数字,则按字典序排序
|
|
||||||
clone.sort(function(o1, o2){ |
|
||||||
var v1 = o1[key] |
|
||||||
,v2 = o2[key] |
|
||||||
,isNum = [ |
|
||||||
!isNaN(v1) |
|
||||||
,!isNaN(v2) |
|
||||||
]; |
|
||||||
|
|
||||||
|
|
||||||
//若为数字比较
|
|
||||||
if(isNum[0] && isNum[1]){ |
|
||||||
if(v1 && (!v2 && v2 !== 0)){ //数字 vs 空
|
|
||||||
return 1; |
|
||||||
} else if((!v1 && v1 !== 0) && v2){ //空 vs 数字
|
|
||||||
return -1; |
|
||||||
} else { //数字 vs 数字
|
|
||||||
return v1 - v2; |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
/** |
|
||||||
* 字典序排序 |
|
||||||
*/ |
|
||||||
|
|
||||||
//若为非数字比较
|
|
||||||
if(!isNum[0] && !isNum[1]){ |
|
||||||
//字典序比较
|
|
||||||
if(v1 > v2){ |
|
||||||
return 1; |
|
||||||
} else if (v1 < v2) { |
|
||||||
return -1; |
|
||||||
} else { |
|
||||||
return 0; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
//若为混合比较
|
|
||||||
if(isNum[0] || !isNum[1]){ //数字 vs 非数字
|
|
||||||
return -1; |
|
||||||
} else if(!isNum[0] || isNum[1]) { //非数字 vs 数字
|
|
||||||
return 1; |
|
||||||
} |
|
||||||
|
|
||||||
/* |
|
||||||
//老版本
|
|
||||||
if(v1 && !v2){ |
|
||||||
return 1; |
|
||||||
} else if(!v1 && v2){ |
|
||||||
return -1; |
|
||||||
} |
|
||||||
|
|
||||||
if(v1 > v2){ |
|
||||||
return 1; |
|
||||||
} else if (v1 < v2) { |
|
||||||
return -1; |
|
||||||
} else { |
|
||||||
return 0; |
|
||||||
} |
|
||||||
*/ |
|
||||||
|
|
||||||
}); |
|
||||||
|
|
||||||
desc && clone.reverse(); //倒序
|
|
||||||
return clone; |
|
||||||
}; |
|
||||||
|
|
||||||
//阻止事件冒泡
|
|
||||||
Layui.prototype.stope = function(thisEvent){ |
|
||||||
thisEvent = thisEvent || win.event; |
|
||||||
try { thisEvent.stopPropagation() } catch(e){ |
|
||||||
thisEvent.cancelBubble = true; |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
//字符常理
|
|
||||||
var EV_REMOVE = 'LAYUI-EVENT-REMOVE'; |
|
||||||
|
|
||||||
//自定义模块事件
|
|
||||||
Layui.prototype.onevent = function(modName, events, callback){ |
|
||||||
if(typeof modName !== 'string' |
|
||||||
|| typeof callback !== 'function') return this; |
|
||||||
|
|
||||||
return Layui.event(modName, events, null, callback); |
|
||||||
}; |
|
||||||
|
|
||||||
//执行自定义模块事件
|
|
||||||
Layui.prototype.event = Layui.event = function(modName, events, params, fn){ |
|
||||||
var that = this |
|
||||||
,result = null |
|
||||||
,filter = (events || '').match(/\((.*)\)$/)||[] //提取事件过滤器字符结构,如:select(xxx)
|
|
||||||
,eventName = (modName + '.'+ events).replace(filter[0], '') //获取事件名称,如:form.select
|
|
||||||
,filterName = filter[1] || '' //获取过滤器名称,,如:xxx
|
|
||||||
,callback = function(_, item){ |
|
||||||
var res = item && item.call(that, params); |
|
||||||
res === false && result === null && (result = false); |
|
||||||
}; |
|
||||||
|
|
||||||
//如果参数传入特定字符,则执行移除事件
|
|
||||||
if(params === EV_REMOVE){ |
|
||||||
delete (that.cache.event[eventName] || {})[filterName]; |
|
||||||
return that; |
|
||||||
} |
|
||||||
|
|
||||||
//添加事件
|
|
||||||
if(fn){ |
|
||||||
config.event[eventName] = config.event[eventName] || {}; |
|
||||||
|
|
||||||
//这里不再对重复事件做支持
|
|
||||||
//config.event[eventName][filterName] ? config.event[eventName][filterName].push(fn) :
|
|
||||||
config.event[eventName][filterName] = [fn]; |
|
||||||
return this; |
|
||||||
} |
|
||||||
|
|
||||||
//执行事件回调
|
|
||||||
layui.each(config.event[eventName], function(key, item){ |
|
||||||
//执行当前模块的全部事件
|
|
||||||
if(filterName === '{*}'){ |
|
||||||
layui.each(item, callback); |
|
||||||
return; |
|
||||||
} |
|
||||||
|
|
||||||
//执行指定事件
|
|
||||||
key === '' && layui.each(item, callback); |
|
||||||
(filterName && key === filterName) && layui.each(item, callback); |
|
||||||
}); |
|
||||||
|
|
||||||
return result; |
|
||||||
}; |
|
||||||
|
|
||||||
//新增模块事件
|
|
||||||
Layui.prototype.on = function(events, modName, callback){ |
|
||||||
var that = this; |
|
||||||
return that.onevent.call(that, modName, events, callback); |
|
||||||
} |
|
||||||
|
|
||||||
//移除模块事件
|
|
||||||
Layui.prototype.off = function(events, modName){ |
|
||||||
var that = this; |
|
||||||
return that.event.call(that, modName, events, EV_REMOVE); |
|
||||||
}; |
|
||||||
|
|
||||||
//exports layui
|
|
||||||
win.layui = new Layui(); |
|
||||||
|
|
||||||
}(window); //gulp build: layui-footer
|
|
||||||
|
|
@ -1,313 +0,0 @@ |
|||||||
|
|
||||||
/*! |
|
||||||
* carousel 轮播模块 |
|
||||||
* MIT Licensed |
|
||||||
*/ |
|
||||||
|
|
||||||
layui.define('jquery', function(exports){ |
|
||||||
"use strict"; |
|
||||||
|
|
||||||
var $ = layui.$ |
|
||||||
,hint = layui.hint() |
|
||||||
,device = layui.device() |
|
||||||
|
|
||||||
//外部接口
|
|
||||||
,carousel = { |
|
||||||
config: {} //全局配置项
|
|
||||||
|
|
||||||
//设置全局项
|
|
||||||
,set: function(options){ |
|
||||||
var that = this; |
|
||||||
that.config = $.extend({}, that.config, options); |
|
||||||
return that; |
|
||||||
} |
|
||||||
|
|
||||||
//事件
|
|
||||||
,on: function(events, callback){ |
|
||||||
return layui.onevent.call(this, MOD_NAME, events, callback); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
//字符常量
|
|
||||||
,MOD_NAME = 'carousel', ELEM = '.layui-carousel', THIS = 'layui-this', SHOW = 'layui-show', HIDE = 'layui-hide', DISABLED = 'layui-disabled' |
|
||||||
|
|
||||||
,ELEM_ITEM = '>*[carousel-item]>*', ELEM_LEFT = 'layui-carousel-left', ELEM_RIGHT = 'layui-carousel-right', ELEM_PREV = 'layui-carousel-prev', ELEM_NEXT = 'layui-carousel-next', ELEM_ARROW = 'layui-carousel-arrow', ELEM_IND = 'layui-carousel-ind' |
|
||||||
|
|
||||||
//构造器
|
|
||||||
,Class = function(options){ |
|
||||||
var that = this; |
|
||||||
that.config = $.extend({}, that.config, carousel.config, options); |
|
||||||
that.render(); |
|
||||||
}; |
|
||||||
|
|
||||||
//默认配置
|
|
||||||
Class.prototype.config = { |
|
||||||
width: '600px' |
|
||||||
,height: '280px' |
|
||||||
,full: false //是否全屏
|
|
||||||
,arrow: 'hover' //切换箭头默认显示状态:hover/always/none
|
|
||||||
,indicator: 'inside' //指示器位置:inside/outside/none
|
|
||||||
,autoplay: true //是否自动切换
|
|
||||||
,interval: 3000 //自动切换的时间间隔,不能低于800ms
|
|
||||||
,anim: '' //动画类型:default/updown/fade
|
|
||||||
,trigger: 'click' //指示器的触发方式:click/hover
|
|
||||||
,index: 0 //初始开始的索引
|
|
||||||
}; |
|
||||||
|
|
||||||
//轮播渲染
|
|
||||||
Class.prototype.render = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config; |
|
||||||
|
|
||||||
options.elem = $(options.elem); |
|
||||||
if(!options.elem[0]) return; |
|
||||||
that.elemItem = options.elem.find(ELEM_ITEM); |
|
||||||
|
|
||||||
if(options.index < 0) options.index = 0; |
|
||||||
if(options.index >= that.elemItem.length) options.index = that.elemItem.length - 1; |
|
||||||
if(options.interval < 800) options.interval = 800; |
|
||||||
|
|
||||||
//是否全屏模式
|
|
||||||
if(options.full){ |
|
||||||
options.elem.css({ |
|
||||||
position: 'fixed' |
|
||||||
,width: '100%' |
|
||||||
,height: '100%' |
|
||||||
,zIndex: 9999 |
|
||||||
}); |
|
||||||
} else { |
|
||||||
options.elem.css({ |
|
||||||
width: options.width |
|
||||||
,height: options.height |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
options.elem.attr('lay-anim', options.anim); |
|
||||||
|
|
||||||
//初始焦点状态
|
|
||||||
that.elemItem.eq(options.index).addClass(THIS); |
|
||||||
|
|
||||||
//指示器等动作
|
|
||||||
if(that.elemItem.length <= 1) return; |
|
||||||
that.indicator(); |
|
||||||
that.arrow(); |
|
||||||
that.autoplay(); |
|
||||||
that.events(); |
|
||||||
}; |
|
||||||
|
|
||||||
//重置轮播
|
|
||||||
Class.prototype.reload = function(options){ |
|
||||||
var that = this; |
|
||||||
clearInterval(that.timer); |
|
||||||
that.config = $.extend({}, that.config, options); |
|
||||||
that.render(); |
|
||||||
}; |
|
||||||
|
|
||||||
//获取上一个等待条目的索引
|
|
||||||
Class.prototype.prevIndex = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config; |
|
||||||
|
|
||||||
var prevIndex = options.index - 1; |
|
||||||
if(prevIndex < 0){ |
|
||||||
prevIndex = that.elemItem.length - 1; |
|
||||||
} |
|
||||||
return prevIndex; |
|
||||||
}; |
|
||||||
|
|
||||||
//获取下一个等待条目的索引
|
|
||||||
Class.prototype.nextIndex = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config; |
|
||||||
|
|
||||||
var nextIndex = options.index + 1; |
|
||||||
if(nextIndex >= that.elemItem.length){ |
|
||||||
nextIndex = 0; |
|
||||||
} |
|
||||||
return nextIndex; |
|
||||||
}; |
|
||||||
|
|
||||||
//索引递增
|
|
||||||
Class.prototype.addIndex = function(num){ |
|
||||||
var that = this |
|
||||||
,options = that.config; |
|
||||||
|
|
||||||
num = num || 1; |
|
||||||
options.index = options.index + num; |
|
||||||
|
|
||||||
//index不能超过轮播总数量
|
|
||||||
if(options.index >= that.elemItem.length){ |
|
||||||
options.index = 0; |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
//索引递减
|
|
||||||
Class.prototype.subIndex = function(num){ |
|
||||||
var that = this |
|
||||||
,options = that.config; |
|
||||||
|
|
||||||
num = num || 1; |
|
||||||
options.index = options.index - num; |
|
||||||
|
|
||||||
//index不能超过轮播总数量
|
|
||||||
if(options.index < 0){ |
|
||||||
options.index = that.elemItem.length - 1; |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
//自动轮播
|
|
||||||
Class.prototype.autoplay = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config; |
|
||||||
|
|
||||||
if(!options.autoplay) return; |
|
||||||
clearInterval(that.timer); |
|
||||||
|
|
||||||
that.timer = setInterval(function(){ |
|
||||||
that.slide(); |
|
||||||
}, options.interval); |
|
||||||
}; |
|
||||||
|
|
||||||
//箭头
|
|
||||||
Class.prototype.arrow = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config; |
|
||||||
|
|
||||||
//模板
|
|
||||||
var tplArrow = $([ |
|
||||||
'<button class="layui-icon '+ ELEM_ARROW +'" lay-type="sub">'+ (options.anim === 'updown' ? '' : '') +'</button>' |
|
||||||
,'<button class="layui-icon '+ ELEM_ARROW +'" lay-type="add">'+ (options.anim === 'updown' ? '' : '') +'</button>' |
|
||||||
].join('')); |
|
||||||
|
|
||||||
//预设基础属性
|
|
||||||
options.elem.attr('lay-arrow', options.arrow); |
|
||||||
|
|
||||||
//避免重复插入
|
|
||||||
if(options.elem.find('.'+ELEM_ARROW)[0]){ |
|
||||||
options.elem.find('.'+ELEM_ARROW).remove(); |
|
||||||
}; |
|
||||||
options.elem.append(tplArrow); |
|
||||||
|
|
||||||
//事件
|
|
||||||
tplArrow.on('click', function(){ |
|
||||||
var othis = $(this) |
|
||||||
,type = othis.attr('lay-type') |
|
||||||
that.slide(type); |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
//指示器
|
|
||||||
Class.prototype.indicator = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config; |
|
||||||
|
|
||||||
//模板
|
|
||||||
var tplInd = that.elemInd = $(['<div class="'+ ELEM_IND +'"><ul>' |
|
||||||
,function(){ |
|
||||||
var li = []; |
|
||||||
layui.each(that.elemItem, function(index){ |
|
||||||
li.push('<li'+ (options.index === index ? ' class="layui-this"' : '') +'></li>'); |
|
||||||
}); |
|
||||||
return li.join(''); |
|
||||||
}() |
|
||||||
,'</ul></div>'].join('')); |
|
||||||
|
|
||||||
//预设基础属性
|
|
||||||
options.elem.attr('lay-indicator', options.indicator); |
|
||||||
|
|
||||||
//避免重复插入
|
|
||||||
if(options.elem.find('.'+ELEM_IND)[0]){ |
|
||||||
options.elem.find('.'+ELEM_IND).remove(); |
|
||||||
}; |
|
||||||
options.elem.append(tplInd); |
|
||||||
|
|
||||||
if(options.anim === 'updown'){ |
|
||||||
tplInd.css('margin-top', -(tplInd.height()/2)); |
|
||||||
} |
|
||||||
|
|
||||||
//事件
|
|
||||||
tplInd.find('li').on(options.trigger === 'hover' ? 'mouseover' : options.trigger, function(){ |
|
||||||
var othis = $(this) |
|
||||||
,index = othis.index(); |
|
||||||
if(index > options.index){ |
|
||||||
that.slide('add', index - options.index); |
|
||||||
} else if(index < options.index){ |
|
||||||
that.slide('sub', options.index - index); |
|
||||||
} |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
//滑动切换
|
|
||||||
Class.prototype.slide = function(type, num){ |
|
||||||
var that = this |
|
||||||
,elemItem = that.elemItem |
|
||||||
,options = that.config |
|
||||||
,thisIndex = options.index |
|
||||||
,filter = options.elem.attr('lay-filter'); |
|
||||||
|
|
||||||
if(that.haveSlide) return; |
|
||||||
|
|
||||||
//滑动方向
|
|
||||||
if(type === 'sub'){ |
|
||||||
that.subIndex(num); |
|
||||||
elemItem.eq(options.index).addClass(ELEM_PREV); |
|
||||||
setTimeout(function(){ |
|
||||||
elemItem.eq(thisIndex).addClass(ELEM_RIGHT); |
|
||||||
elemItem.eq(options.index).addClass(ELEM_RIGHT); |
|
||||||
}, 50); |
|
||||||
} else { //默认递增滑
|
|
||||||
that.addIndex(num); |
|
||||||
elemItem.eq(options.index).addClass(ELEM_NEXT); |
|
||||||
setTimeout(function(){ |
|
||||||
elemItem.eq(thisIndex).addClass(ELEM_LEFT); |
|
||||||
elemItem.eq(options.index).addClass(ELEM_LEFT); |
|
||||||
}, 50); |
|
||||||
}; |
|
||||||
|
|
||||||
//移除过度类
|
|
||||||
setTimeout(function(){ |
|
||||||
elemItem.removeClass(THIS + ' ' + ELEM_PREV + ' ' + ELEM_NEXT + ' ' + ELEM_LEFT + ' ' + ELEM_RIGHT); |
|
||||||
elemItem.eq(options.index).addClass(THIS); |
|
||||||
that.haveSlide = false; //解锁
|
|
||||||
}, 300); |
|
||||||
|
|
||||||
//指示器焦点
|
|
||||||
that.elemInd.find('li').eq(options.index).addClass(THIS) |
|
||||||
.siblings().removeClass(THIS); |
|
||||||
|
|
||||||
that.haveSlide = true; |
|
||||||
|
|
||||||
layui.event.call(this, MOD_NAME, 'change('+ filter +')', { |
|
||||||
index: options.index |
|
||||||
,prevIndex: thisIndex |
|
||||||
,item: elemItem.eq(options.index) |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
//事件处理
|
|
||||||
Class.prototype.events = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config; |
|
||||||
|
|
||||||
if(options.elem.data('haveEvents')) return; |
|
||||||
|
|
||||||
//移入移出容器
|
|
||||||
options.elem.on('mouseenter', function(){ |
|
||||||
clearInterval(that.timer); |
|
||||||
}).on('mouseleave', function(){ |
|
||||||
that.autoplay(); |
|
||||||
}); |
|
||||||
|
|
||||||
options.elem.data('haveEvents', true); |
|
||||||
}; |
|
||||||
|
|
||||||
//核心入口
|
|
||||||
carousel.render = function(options){ |
|
||||||
var inst = new Class(options); |
|
||||||
return inst; |
|
||||||
}; |
|
||||||
|
|
||||||
exports(MOD_NAME, carousel); |
|
||||||
}); |
|
||||||
|
|
||||||
|
|
@ -1,59 +0,0 @@ |
|||||||
|
|
||||||
/** |
|
||||||
* code 代码修饰器 |
|
||||||
* MIT Licensed |
|
||||||
*/ |
|
||||||
|
|
||||||
layui.define('jquery', function(exports){ |
|
||||||
"use strict"; |
|
||||||
|
|
||||||
var $ = layui.$; |
|
||||||
|
|
||||||
exports('code', function(options){ |
|
||||||
var elems = []; |
|
||||||
options = options || {}; |
|
||||||
options.elem = $(options.elem||'.layui-code'); |
|
||||||
options.lang = 'lang' in options ? options.lang : 'code'; |
|
||||||
|
|
||||||
options.elem.each(function(){ |
|
||||||
elems.push(this); |
|
||||||
}); |
|
||||||
|
|
||||||
layui.each(elems.reverse(), function(index, item){ |
|
||||||
var othis = $(item), html = othis.html(); |
|
||||||
|
|
||||||
//转义HTML标签
|
|
||||||
if(othis.attr('lay-encode') || options.encode){ |
|
||||||
html = html.replace(/&(?!#?[a-zA-Z0-9]+;)/g, '&') |
|
||||||
.replace(/</g, '<').replace(/>/g, '>').replace(/'/g, ''').replace(/"/g, '"') |
|
||||||
} |
|
||||||
|
|
||||||
othis.html('<ol class="layui-code-ol"><li>' + html.replace(/[\r\t\n]+/g, '</li><li>') + '</li></ol>') |
|
||||||
|
|
||||||
if(!othis.find('>.layui-code-h3')[0]){ |
|
||||||
othis.prepend('<h3 class="layui-code-h3">'+ (othis.attr('lay-title')||options.title||'</>') + '<a href="javascript:;">'+ (othis.attr('lay-lang')||options.lang||'') +'</a>' + '</h3>'); |
|
||||||
} |
|
||||||
|
|
||||||
var ol = othis.find('>.layui-code-ol'); |
|
||||||
othis.addClass('layui-box layui-code-view'); |
|
||||||
|
|
||||||
//识别皮肤
|
|
||||||
if(othis.attr('lay-skin') || options.skin){ |
|
||||||
othis.addClass('layui-code-' +(othis.attr('lay-skin') || options.skin)); |
|
||||||
} |
|
||||||
|
|
||||||
//按行数适配左边距
|
|
||||||
if((ol.find('li').length/100|0) > 0){ |
|
||||||
ol.css('margin-left', (ol.find('li').length/100|0) + 'px'); |
|
||||||
} |
|
||||||
|
|
||||||
//设置最大高度
|
|
||||||
if(othis.attr('lay-height') || options.height){ |
|
||||||
ol.css('max-height', othis.attr('lay-height') || options.height); |
|
||||||
} |
|
||||||
|
|
||||||
}); |
|
||||||
|
|
||||||
}); |
|
||||||
}).addcss('modules/code.css?v=2', 'skincodecss'); |
|
||||||
|
|
@ -1,691 +0,0 @@ |
|||||||
|
|
||||||
/*! |
|
||||||
* colorpicker |
|
||||||
* 颜色选择组件 |
|
||||||
*/ |
|
||||||
|
|
||||||
layui.define(['jquery', 'lay'], function(exports){ |
|
||||||
"use strict"; |
|
||||||
|
|
||||||
var $ = layui.jquery |
|
||||||
,lay = layui.lay |
|
||||||
,device = layui.device() |
|
||||||
,clickOrMousedown = (device.mobile ? 'click' : 'mousedown') |
|
||||||
|
|
||||||
//外部接口
|
|
||||||
,colorpicker = { |
|
||||||
config: {} |
|
||||||
,index: layui.colorpicker ? (layui.colorpicker.index + 10000) : 0 |
|
||||||
|
|
||||||
//设置全局项
|
|
||||||
,set: function(options){ |
|
||||||
var that = this; |
|
||||||
that.config = $.extend({}, that.config, options); |
|
||||||
return that; |
|
||||||
} |
|
||||||
|
|
||||||
//事件
|
|
||||||
,on: function(events, callback){ |
|
||||||
return layui.onevent.call(this, 'colorpicker', events, callback); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
//操作当前实例
|
|
||||||
,thisColorPicker = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config; |
|
||||||
|
|
||||||
return { |
|
||||||
config: options |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
//字符常量
|
|
||||||
,MOD_NAME = 'colorpicker', SHOW = 'layui-show', THIS = 'layui-this', ELEM = 'layui-colorpicker' |
|
||||||
|
|
||||||
,ELEM_MAIN = '.layui-colorpicker-main', ICON_PICKER_DOWN = 'layui-icon-down', ICON_PICKER_CLOSE = 'layui-icon-close' |
|
||||||
,PICKER_TRIG_SPAN = 'layui-colorpicker-trigger-span', PICKER_TRIG_I = 'layui-colorpicker-trigger-i', PICKER_SIDE = 'layui-colorpicker-side', PICKER_SIDE_SLIDER = 'layui-colorpicker-side-slider' |
|
||||||
,PICKER_BASIS = 'layui-colorpicker-basis', PICKER_ALPHA_BG = 'layui-colorpicker-alpha-bgcolor', PICKER_ALPHA_SLIDER = 'layui-colorpicker-alpha-slider', PICKER_BASIS_CUR = 'layui-colorpicker-basis-cursor', PICKER_INPUT = 'layui-colorpicker-main-input' |
|
||||||
|
|
||||||
//RGB转HSB
|
|
||||||
,RGBToHSB = function(rgb){ |
|
||||||
var hsb = {h:0, s:0, b:0}; |
|
||||||
var min = Math.min(rgb.r, rgb.g, rgb.b); |
|
||||||
var max = Math.max(rgb.r, rgb.g, rgb.b); |
|
||||||
var delta = max - min; |
|
||||||
hsb.b = max; |
|
||||||
hsb.s = max != 0 ? 255*delta/max : 0; |
|
||||||
if(hsb.s != 0){ |
|
||||||
if(rgb.r == max){ |
|
||||||
hsb.h = (rgb.g - rgb.b) / delta; |
|
||||||
}else if(rgb.g == max){ |
|
||||||
hsb.h = 2 + (rgb.b - rgb.r) / delta; |
|
||||||
}else{ |
|
||||||
hsb.h = 4 + (rgb.r - rgb.g) / delta; |
|
||||||
} |
|
||||||
}else{ |
|
||||||
hsb.h = -1; |
|
||||||
}; |
|
||||||
if(max == min){ |
|
||||||
hsb.h = 0; |
|
||||||
}; |
|
||||||
hsb.h *= 60; |
|
||||||
if(hsb.h < 0) { |
|
||||||
hsb.h += 360; |
|
||||||
}; |
|
||||||
hsb.s *= 100/255; |
|
||||||
hsb.b *= 100/255; |
|
||||||
return hsb; |
|
||||||
} |
|
||||||
|
|
||||||
//HEX转HSB
|
|
||||||
,HEXToHSB = function(hex){ |
|
||||||
var hex = hex.indexOf('#') > -1 ? hex.substring(1) : hex; |
|
||||||
if(hex.length == 3){ |
|
||||||
var num = hex.split(""); |
|
||||||
hex = num[0]+num[0]+num[1]+num[1]+num[2]+num[2] |
|
||||||
}; |
|
||||||
hex = parseInt(hex, 16); |
|
||||||
var rgb = {r:hex >> 16, g:(hex & 0x00FF00) >> 8, b:(hex & 0x0000FF)}; |
|
||||||
return RGBToHSB(rgb); |
|
||||||
} |
|
||||||
|
|
||||||
//HSB转RGB
|
|
||||||
,HSBToRGB = function(hsb){ |
|
||||||
var rgb = {}; |
|
||||||
var h = hsb.h; |
|
||||||
var s = hsb.s*255/100; |
|
||||||
var b = hsb.b*255/100; |
|
||||||
if(s == 0){ |
|
||||||
rgb.r = rgb.g = rgb.b = b; |
|
||||||
}else{ |
|
||||||
var t1 = b; |
|
||||||
var t2 = (255 - s) * b /255; |
|
||||||
var t3 = (t1 - t2) * (h % 60) /60; |
|
||||||
if(h == 360) h = 0; |
|
||||||
if(h < 60) {rgb.r=t1; rgb.b=t2; rgb.g=t2+t3} |
|
||||||
else if(h < 120) {rgb.g=t1; rgb.b=t2; rgb.r=t1-t3} |
|
||||||
else if(h < 180) {rgb.g=t1; rgb.r=t2; rgb.b=t2+t3} |
|
||||||
else if(h < 240) {rgb.b=t1; rgb.r=t2; rgb.g=t1-t3} |
|
||||||
else if(h < 300) {rgb.b=t1; rgb.g=t2; rgb.r=t2+t3} |
|
||||||
else if(h < 360) {rgb.r=t1; rgb.g=t2; rgb.b=t1-t3} |
|
||||||
else {rgb.r=0; rgb.g=0; rgb.b=0} |
|
||||||
} |
|
||||||
return {r:Math.round(rgb.r), g:Math.round(rgb.g), b:Math.round(rgb.b)}; |
|
||||||
} |
|
||||||
|
|
||||||
//HSB转HEX
|
|
||||||
,HSBToHEX = function(hsb){ |
|
||||||
var rgb = HSBToRGB(hsb); |
|
||||||
var hex = [ |
|
||||||
rgb.r.toString(16) |
|
||||||
,rgb.g.toString(16) |
|
||||||
,rgb.b.toString(16) |
|
||||||
]; |
|
||||||
$.each(hex, function(nr, val){ |
|
||||||
if(val.length == 1){ |
|
||||||
hex[nr] = '0' + val; |
|
||||||
} |
|
||||||
}); |
|
||||||
return hex.join(''); |
|
||||||
} |
|
||||||
|
|
||||||
//转化成所需rgb格式
|
|
||||||
,RGBSTo = function(rgbs){ |
|
||||||
var regexp = /[0-9]{1,3}/g; |
|
||||||
var re = rgbs.match(regexp) || []; |
|
||||||
return {r:re[0], g:re[1], b:re[2]}; |
|
||||||
} |
|
||||||
|
|
||||||
,$win = $(window) |
|
||||||
,$doc = $(document) |
|
||||||
|
|
||||||
//构造器
|
|
||||||
,Class = function(options){ |
|
||||||
var that = this; |
|
||||||
that.index = ++colorpicker.index; |
|
||||||
that.config = $.extend({}, that.config, colorpicker.config, options); |
|
||||||
that.render(); |
|
||||||
}; |
|
||||||
|
|
||||||
//默认配置
|
|
||||||
Class.prototype.config = { |
|
||||||
color: '' //默认颜色,默认没有
|
|
||||||
,size: null //选择器大小
|
|
||||||
,alpha: false //是否开启透明度
|
|
||||||
,format: 'hex' //颜色显示/输入格式,可选 rgb,hex
|
|
||||||
,predefine: false //预定义颜色是否开启
|
|
||||||
,colors: [ //默认预定义颜色列表
|
|
||||||
'#009688', '#5FB878', '#1E9FFF', '#FF5722', '#FFB800', '#01AAED', '#999', '#c00', '#ff8c00','#ffd700' |
|
||||||
,'#90ee90', '#00ced1', '#1e90ff', '#c71585', 'rgb(0, 186, 189)', 'rgb(255, 120, 0)', 'rgb(250, 212, 0)', '#393D49', 'rgba(0,0,0,.5)', 'rgba(255, 69, 0, 0.68)', 'rgba(144, 240, 144, 0.5)', 'rgba(31, 147, 255, 0.73)' |
|
||||||
] |
|
||||||
}; |
|
||||||
|
|
||||||
//初始颜色选择框
|
|
||||||
Class.prototype.render = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config |
|
||||||
|
|
||||||
//颜色选择框对象
|
|
||||||
,elemColorBox = $(['<div class="layui-unselect layui-colorpicker">' |
|
||||||
,'<span '+ (options.format == 'rgb' && options.alpha |
|
||||||
? 'class="layui-colorpicker-trigger-bgcolor"' |
|
||||||
: '') +'>' |
|
||||||
,'<span class="layui-colorpicker-trigger-span" ' |
|
||||||
,'lay-type="'+ (options.format == 'rgb' ? (options.alpha ? 'rgba' : 'torgb') : '') +'" ' |
|
||||||
,'style="'+ function(){ |
|
||||||
var bgstr = ''; |
|
||||||
if(options.color){ |
|
||||||
bgstr = options.color; |
|
||||||
|
|
||||||
if((options.color.match(/[0-9]{1,3}/g) || []).length > 3){ //需要优化
|
|
||||||
if(!(options.alpha && options.format == 'rgb')){ |
|
||||||
bgstr = '#' + HSBToHEX(RGBToHSB(RGBSTo(options.color))) |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
return 'background: '+ bgstr; |
|
||||||
} |
|
||||||
|
|
||||||
return bgstr; |
|
||||||
}() +'">' |
|
||||||
,'<i class="layui-icon layui-colorpicker-trigger-i '+ (options.color |
|
||||||
? ICON_PICKER_DOWN |
|
||||||
: ICON_PICKER_CLOSE) +'"></i>' |
|
||||||
,'</span>' |
|
||||||
,'</span>' |
|
||||||
,'</div>'].join('')) |
|
||||||
|
|
||||||
//初始化颜色选择框
|
|
||||||
var othis = $(options.elem); |
|
||||||
options.size && elemColorBox.addClass('layui-colorpicker-'+ options.size); //初始化颜色选择框尺寸
|
|
||||||
|
|
||||||
//插入颜色选择框
|
|
||||||
othis.addClass('layui-inline').html( |
|
||||||
that.elemColorBox = elemColorBox |
|
||||||
); |
|
||||||
|
|
||||||
//获取背景色值
|
|
||||||
that.color = that.elemColorBox.find('.'+ PICKER_TRIG_SPAN)[0].style.background; |
|
||||||
|
|
||||||
//相关事件
|
|
||||||
that.events(); |
|
||||||
}; |
|
||||||
|
|
||||||
//渲染颜色选择器
|
|
||||||
Class.prototype.renderPicker = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config |
|
||||||
,elemColorBox = that.elemColorBox[0] |
|
||||||
|
|
||||||
//颜色选择器对象
|
|
||||||
,elemPicker = that.elemPicker = $(['<div id="layui-colorpicker'+ that.index +'" data-index="'+ that.index +'" class="layui-anim layui-anim-downbit layui-colorpicker-main">' |
|
||||||
//颜色面板
|
|
||||||
,'<div class="layui-colorpicker-main-wrapper">' |
|
||||||
,'<div class="layui-colorpicker-basis">' |
|
||||||
,'<div class="layui-colorpicker-basis-white"></div>' |
|
||||||
,'<div class="layui-colorpicker-basis-black"></div>' |
|
||||||
,'<div class="layui-colorpicker-basis-cursor"></div>' |
|
||||||
,'</div>' |
|
||||||
,'<div class="layui-colorpicker-side">' |
|
||||||
,'<div class="layui-colorpicker-side-slider"></div>' |
|
||||||
,'</div>' |
|
||||||
,'</div>' |
|
||||||
|
|
||||||
//透明度条块
|
|
||||||
,'<div class="layui-colorpicker-main-alpha '+ (options.alpha ? SHOW : '') +'">' |
|
||||||
,'<div class="layui-colorpicker-alpha-bgcolor">' |
|
||||||
,'<div class="layui-colorpicker-alpha-slider"></div>' |
|
||||||
,'</div>' |
|
||||||
,'</div>' |
|
||||||
|
|
||||||
//预设颜色列表
|
|
||||||
,function(){ |
|
||||||
if(options.predefine){ |
|
||||||
var list = ['<div class="layui-colorpicker-main-pre">']; |
|
||||||
layui.each(options.colors, function(i, v){ |
|
||||||
list.push(['<div class="layui-colorpicker-pre'+ ((v.match(/[0-9]{1,3}/g) || []).length > 3 |
|
||||||
? ' layui-colorpicker-pre-isalpha' |
|
||||||
: '') +'">' |
|
||||||
,'<div style="background:'+ v +'"></div>' |
|
||||||
,'</div>'].join('')); |
|
||||||
}); |
|
||||||
list.push('</div>'); |
|
||||||
return list.join(''); |
|
||||||
} else { |
|
||||||
return ''; |
|
||||||
} |
|
||||||
}() |
|
||||||
|
|
||||||
//底部表单元素区域
|
|
||||||
,'<div class="layui-colorpicker-main-input">' |
|
||||||
,'<div class="layui-inline">' |
|
||||||
,'<input type="text" class="layui-input">' |
|
||||||
,'</div>' |
|
||||||
,'<div class="layui-btn-container">' |
|
||||||
,'<button class="layui-btn layui-btn-primary layui-btn-sm" colorpicker-events="clear">清空</button>' |
|
||||||
,'<button class="layui-btn layui-btn-sm" colorpicker-events="confirm">确定</button>' |
|
||||||
,'</div' |
|
||||||
,'</div>' |
|
||||||
,'</div>'].join('')) |
|
||||||
|
|
||||||
,elemColorBoxSpan = that.elemColorBox.find('.' + PICKER_TRIG_SPAN)[0]; |
|
||||||
|
|
||||||
//如果当前点击的颜色盒子已经存在选择器,则关闭
|
|
||||||
if($(ELEM_MAIN)[0] && $(ELEM_MAIN).data('index') == that.index){ |
|
||||||
that.removePicker(Class.thisElemInd); |
|
||||||
} else { //插入颜色选择器
|
|
||||||
that.removePicker(Class.thisElemInd); |
|
||||||
$('body').append(elemPicker); |
|
||||||
} |
|
||||||
|
|
||||||
Class.thisElemInd = that.index; //记录最新打开的选择器索引
|
|
||||||
Class.thisColor = elemColorBox.style.background //记录最新打开的选择器颜色选中值
|
|
||||||
|
|
||||||
that.position(); |
|
||||||
that.pickerEvents(); |
|
||||||
}; |
|
||||||
|
|
||||||
//颜色选择器移除
|
|
||||||
Class.prototype.removePicker = function(index){ |
|
||||||
var that = this |
|
||||||
,options = that.config; |
|
||||||
$('#layui-colorpicker'+ (index || that.index)).remove(); |
|
||||||
return that; |
|
||||||
}; |
|
||||||
|
|
||||||
//定位算法
|
|
||||||
Class.prototype.position = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config; |
|
||||||
lay.position(that.bindElem || that.elemColorBox[0], that.elemPicker[0], { |
|
||||||
position: options.position |
|
||||||
,align: 'center' |
|
||||||
}); |
|
||||||
return that; |
|
||||||
}; |
|
||||||
|
|
||||||
//颜色选择器赋值
|
|
||||||
Class.prototype.val = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config |
|
||||||
|
|
||||||
,elemColorBox = that.elemColorBox.find('.' + PICKER_TRIG_SPAN) |
|
||||||
,elemPickerInput = that.elemPicker.find('.' + PICKER_INPUT) |
|
||||||
,e = elemColorBox[0] |
|
||||||
,bgcolor = e.style.backgroundColor; |
|
||||||
|
|
||||||
//判断是否有背景颜色
|
|
||||||
if(bgcolor){ |
|
||||||
|
|
||||||
//转化成hsb格式
|
|
||||||
var hsb = RGBToHSB(RGBSTo(bgcolor)) |
|
||||||
,type = elemColorBox.attr('lay-type'); |
|
||||||
|
|
||||||
//同步滑块的位置及颜色选择器的选择
|
|
||||||
that.select(hsb.h, hsb.s, hsb.b); |
|
||||||
|
|
||||||
//如果格式要求为rgb
|
|
||||||
if(type === 'torgb'){ |
|
||||||
elemPickerInput.find('input').val(bgcolor); |
|
||||||
}; |
|
||||||
|
|
||||||
//如果格式要求为rgba
|
|
||||||
if(type === 'rgba'){ |
|
||||||
var rgb = RGBSTo(bgcolor); |
|
||||||
|
|
||||||
//如果开启透明度而没有设置,则给默认值
|
|
||||||
if((bgcolor.match(/[0-9]{1,3}/g) || []).length == 3){ |
|
||||||
elemPickerInput.find('input').val('rgba('+ rgb.r +', '+ rgb.g +', '+ rgb.b +', 1)'); |
|
||||||
that.elemPicker.find('.'+ PICKER_ALPHA_SLIDER).css("left", 280); |
|
||||||
} else { |
|
||||||
elemPickerInput.find('input').val(bgcolor); |
|
||||||
var left = bgcolor.slice(bgcolor.lastIndexOf(",") + 1, bgcolor.length - 1) * 280; |
|
||||||
that.elemPicker.find('.'+ PICKER_ALPHA_SLIDER).css("left", left); |
|
||||||
}; |
|
||||||
|
|
||||||
//设置span背景色
|
|
||||||
that.elemPicker.find('.'+ PICKER_ALPHA_BG)[0].style.background = 'linear-gradient(to right, rgba('+ rgb.r +', '+ rgb.g +', '+ rgb.b +', 0), rgb('+ rgb.r +', '+ rgb.g +', '+ rgb.b +'))'; |
|
||||||
}; |
|
||||||
|
|
||||||
}else{ |
|
||||||
//如果没有背景颜色则默认到最初始的状态
|
|
||||||
that.select(0,100,100); |
|
||||||
elemPickerInput.find('input').val(""); |
|
||||||
that.elemPicker.find('.'+ PICKER_ALPHA_BG)[0].style.background = ''; |
|
||||||
that.elemPicker.find('.'+ PICKER_ALPHA_SLIDER).css("left", 280); |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
//颜色选择器滑动 / 点击
|
|
||||||
Class.prototype.side = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config |
|
||||||
|
|
||||||
,span = that.elemColorBox.find('.' + PICKER_TRIG_SPAN) |
|
||||||
,type = span.attr('lay-type') |
|
||||||
|
|
||||||
,side = that.elemPicker.find('.' + PICKER_SIDE) |
|
||||||
,slider = that.elemPicker.find('.' + PICKER_SIDE_SLIDER) |
|
||||||
,basis = that.elemPicker.find('.' + PICKER_BASIS) |
|
||||||
,choose = that.elemPicker.find('.' + PICKER_BASIS_CUR) |
|
||||||
,alphacolor = that.elemPicker.find('.' + PICKER_ALPHA_BG) |
|
||||||
,alphaslider = that.elemPicker.find('.' + PICKER_ALPHA_SLIDER) |
|
||||||
|
|
||||||
,_h = slider[0].offsetTop/180*360 |
|
||||||
,_b = 100 - (choose[0].offsetTop + 3)/180*100 |
|
||||||
,_s = (choose[0].offsetLeft + 3)/260*100 |
|
||||||
,_a = Math.round(alphaslider[0].offsetLeft/280*100)/100 |
|
||||||
|
|
||||||
,i = that.elemColorBox.find('.' + PICKER_TRIG_I) |
|
||||||
,pre = that.elemPicker.find('.layui-colorpicker-pre').children('div') |
|
||||||
|
|
||||||
,change = function(x,y,z,a){ |
|
||||||
that.select(x, y, z); |
|
||||||
var rgb = HSBToRGB({h:x, s:y, b:z}); |
|
||||||
i.addClass(ICON_PICKER_DOWN).removeClass(ICON_PICKER_CLOSE); |
|
||||||
span[0].style.background = 'rgb('+ rgb.r +', '+ rgb.g +', '+ rgb.b +')'; |
|
||||||
|
|
||||||
if(type === 'torgb'){ |
|
||||||
that.elemPicker.find('.' + PICKER_INPUT).find('input').val('rgb('+ rgb.r +', '+ rgb.g +', '+ rgb.b +')'); |
|
||||||
}; |
|
||||||
|
|
||||||
if(type === 'rgba'){ |
|
||||||
var left = 0; |
|
||||||
left = a * 280; |
|
||||||
alphaslider.css("left", left); |
|
||||||
that.elemPicker.find('.' + PICKER_INPUT).find('input').val('rgba('+ rgb.r +', '+ rgb.g +', '+ rgb.b +', '+ a +')'); |
|
||||||
span[0].style.background = 'rgba('+ rgb.r +', '+ rgb.g +', '+ rgb.b +', '+ a +')'; |
|
||||||
alphacolor[0].style.background = 'linear-gradient(to right, rgba('+ rgb.r +', '+ rgb.g +', '+ rgb.b +', 0), rgb('+ rgb.r +', '+ rgb.g +', '+ rgb.b +'))' |
|
||||||
}; |
|
||||||
|
|
||||||
//回调更改的颜色
|
|
||||||
options.change && options.change(that.elemPicker.find('.' + PICKER_INPUT).find('input').val()); |
|
||||||
} |
|
||||||
|
|
||||||
//拖拽元素
|
|
||||||
,elemMove = $(['<div class="layui-auxiliar-moving" id="LAY-colorpicker-moving"></div>'].join('')) |
|
||||||
,createMoveElem = function(call){ |
|
||||||
$('#LAY-colorpicker-moving')[0] || $('body').append(elemMove); |
|
||||||
elemMove.on('mousemove', call); |
|
||||||
elemMove.on('mouseup', function(){ |
|
||||||
elemMove.remove(); |
|
||||||
}).on('mouseleave', function(){ |
|
||||||
elemMove.remove(); |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
//右侧主色选择
|
|
||||||
slider.on('mousedown', function(e){ |
|
||||||
var oldtop = this.offsetTop |
|
||||||
,oldy = e.clientY; |
|
||||||
var move = function(e){ |
|
||||||
var top = oldtop + (e.clientY - oldy) |
|
||||||
,maxh = side[0].offsetHeight; |
|
||||||
if(top < 0)top = 0; |
|
||||||
if(top > maxh)top = maxh; |
|
||||||
var h = top/180*360; |
|
||||||
_h = h; |
|
||||||
change(h, _s, _b, _a); |
|
||||||
e.preventDefault(); |
|
||||||
}; |
|
||||||
|
|
||||||
createMoveElem(move); |
|
||||||
//layui.stope(e);
|
|
||||||
e.preventDefault(); |
|
||||||
}); |
|
||||||
|
|
||||||
side.on('click', function(e){ |
|
||||||
var top = e.clientY - $(this).offset().top; |
|
||||||
if(top < 0)top = 0; |
|
||||||
if(top > this.offsetHeight)top = this.offsetHeight; |
|
||||||
var h = top/180*360; |
|
||||||
_h = h; |
|
||||||
change(h, _s, _b, _a); |
|
||||||
e.preventDefault(); |
|
||||||
}); |
|
||||||
|
|
||||||
//中间小圆点颜色选择
|
|
||||||
choose.on('mousedown', function(e){ |
|
||||||
var oldtop = this.offsetTop |
|
||||||
,oldleft = this.offsetLeft |
|
||||||
,oldy = e.clientY |
|
||||||
,oldx = e.clientX; |
|
||||||
var move = function(e){ |
|
||||||
var top = oldtop + (e.clientY - oldy) |
|
||||||
,left = oldleft + (e.clientX - oldx) |
|
||||||
,maxh = basis[0].offsetHeight - 3 |
|
||||||
,maxw = basis[0].offsetWidth - 3; |
|
||||||
if(top < -3)top = -3; |
|
||||||
if(top > maxh)top = maxh; |
|
||||||
if(left < -3)left = -3; |
|
||||||
if(left > maxw)left = maxw; |
|
||||||
var s = (left + 3)/260*100 |
|
||||||
,b = 100 - (top + 3)/180*100; |
|
||||||
_b = b; |
|
||||||
_s = s; |
|
||||||
change(_h, s, b, _a); |
|
||||||
e.preventDefault(); |
|
||||||
}; |
|
||||||
layui.stope(e); |
|
||||||
createMoveElem(move); |
|
||||||
e.preventDefault(); |
|
||||||
}); |
|
||||||
|
|
||||||
basis.on('mousedown', function(e){ |
|
||||||
var top = e.clientY - $(this).offset().top - 3 + $win.scrollTop() |
|
||||||
,left = e.clientX - $(this).offset().left - 3 + $win.scrollLeft() |
|
||||||
if(top < -3)top = -3; |
|
||||||
if(top > this.offsetHeight - 3)top = this.offsetHeight - 3; |
|
||||||
if(left < -3)left = -3; |
|
||||||
if(left > this.offsetWidth - 3)left = this.offsetWidth - 3; |
|
||||||
var s = (left + 3)/260*100 |
|
||||||
,b = 100 - (top + 3)/180*100; |
|
||||||
_b = b; |
|
||||||
_s = s; |
|
||||||
change(_h, s, b, _a); |
|
||||||
layui.stope(e); |
|
||||||
e.preventDefault(); |
|
||||||
choose.trigger(e, 'mousedown'); |
|
||||||
}); |
|
||||||
|
|
||||||
//底部透明度选择
|
|
||||||
alphaslider.on('mousedown', function(e){ |
|
||||||
var oldleft = this.offsetLeft |
|
||||||
,oldx = e.clientX; |
|
||||||
var move = function(e){ |
|
||||||
var left = oldleft + (e.clientX - oldx) |
|
||||||
,maxw = alphacolor[0].offsetWidth; |
|
||||||
if(left < 0)left = 0; |
|
||||||
if(left > maxw)left = maxw; |
|
||||||
var a = Math.round(left /280*100) /100; |
|
||||||
_a = a; |
|
||||||
change(_h, _s, _b, a); |
|
||||||
e.preventDefault(); |
|
||||||
}; |
|
||||||
|
|
||||||
createMoveElem(move); |
|
||||||
e.preventDefault(); |
|
||||||
}); |
|
||||||
alphacolor.on('click', function(e){ |
|
||||||
var left = e.clientX - $(this).offset().left |
|
||||||
if(left < 0)left = 0; |
|
||||||
if(left > this.offsetWidth)left = this.offsetWidth; |
|
||||||
var a = Math.round(left /280*100) /100; |
|
||||||
_a = a; |
|
||||||
change(_h, _s, _b, a); |
|
||||||
e.preventDefault(); |
|
||||||
}); |
|
||||||
|
|
||||||
//预定义颜色选择
|
|
||||||
pre.each(function(){ |
|
||||||
$(this).on('click', function(){ |
|
||||||
$(this).parent('.layui-colorpicker-pre').addClass('selected').siblings().removeClass('selected'); |
|
||||||
var color = this.style.backgroundColor |
|
||||||
,hsb = RGBToHSB(RGBSTo(color)) |
|
||||||
,a = color.slice(color.lastIndexOf(",") + 1, color.length - 1),left; |
|
||||||
_h = hsb.h; |
|
||||||
_s = hsb.s; |
|
||||||
_b = hsb.b; |
|
||||||
if((color.match(/[0-9]{1,3}/g) || []).length == 3) a = 1; |
|
||||||
_a = a; |
|
||||||
left = a * 280; |
|
||||||
change(hsb.h, hsb.s, hsb.b, a); |
|
||||||
}) |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
//颜色选择器hsb转换
|
|
||||||
Class.prototype.select = function(h, s, b, type){ |
|
||||||
var that = this |
|
||||||
,options = that.config |
|
||||||
,hex = HSBToHEX({h:h, s:100, b:100}) |
|
||||||
,color = HSBToHEX({h:h, s:s, b:b}) |
|
||||||
,sidetop = h/360*180 |
|
||||||
,top = 180 - b/100*180 - 3 |
|
||||||
,left = s/100*260 - 3; |
|
||||||
|
|
||||||
that.elemPicker.find('.' + PICKER_SIDE_SLIDER).css("top", sidetop); //滑块的top
|
|
||||||
that.elemPicker.find('.' + PICKER_BASIS)[0].style.background = '#' + hex; //颜色选择器的背景
|
|
||||||
|
|
||||||
//选择器的top left
|
|
||||||
that.elemPicker.find('.' + PICKER_BASIS_CUR).css({ |
|
||||||
"top": top |
|
||||||
,"left": left |
|
||||||
}); |
|
||||||
|
|
||||||
if(type === 'change') return; |
|
||||||
|
|
||||||
//选中的颜色
|
|
||||||
that.elemPicker.find('.' + PICKER_INPUT).find('input').val('#' + color); |
|
||||||
}; |
|
||||||
|
|
||||||
Class.prototype.pickerEvents = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config |
|
||||||
|
|
||||||
,elemColorBoxSpan = that.elemColorBox.find('.' + PICKER_TRIG_SPAN) //颜色盒子
|
|
||||||
,elemPickerInput = that.elemPicker.find('.' + PICKER_INPUT + ' input') //颜色选择器表单
|
|
||||||
|
|
||||||
,pickerEvents = { |
|
||||||
//清空
|
|
||||||
clear: function(othis){ |
|
||||||
elemColorBoxSpan[0].style.background =''; |
|
||||||
that.elemColorBox.find('.' + PICKER_TRIG_I).removeClass(ICON_PICKER_DOWN).addClass(ICON_PICKER_CLOSE); |
|
||||||
that.color = ''; |
|
||||||
|
|
||||||
options.done && options.done(''); |
|
||||||
that.removePicker(); |
|
||||||
} |
|
||||||
|
|
||||||
//确认
|
|
||||||
,confirm: function(othis, change){ |
|
||||||
var value = elemPickerInput.val() |
|
||||||
,colorValue = value |
|
||||||
,hsb = {}; |
|
||||||
|
|
||||||
if(value.indexOf(',') > -1){ |
|
||||||
hsb = RGBToHSB(RGBSTo(value)); |
|
||||||
that.select(hsb.h, hsb.s, hsb.b); |
|
||||||
elemColorBoxSpan[0].style.background = (colorValue = '#' + HSBToHEX(hsb)); |
|
||||||
|
|
||||||
if((value.match(/[0-9]{1,3}/g) || []).length > 3 && elemColorBoxSpan.attr('lay-type') === 'rgba'){ |
|
||||||
var left = value.slice(value.lastIndexOf(",") + 1, value.length - 1) * 280; |
|
||||||
that.elemPicker.find('.' + PICKER_ALPHA_SLIDER).css("left", left); |
|
||||||
elemColorBoxSpan[0].style.background = value; |
|
||||||
colorValue = value; |
|
||||||
}; |
|
||||||
} else { |
|
||||||
hsb = HEXToHSB(value); |
|
||||||
elemColorBoxSpan[0].style.background = (colorValue = '#' + HSBToHEX(hsb)); |
|
||||||
that.elemColorBox.find('.' + PICKER_TRIG_I).removeClass(ICON_PICKER_CLOSE).addClass(ICON_PICKER_DOWN); |
|
||||||
}; |
|
||||||
|
|
||||||
if(change === 'change'){ |
|
||||||
that.select(hsb.h, hsb.s, hsb.b, change); |
|
||||||
options.change && options.change(colorValue); |
|
||||||
return; |
|
||||||
} |
|
||||||
that.color = value; |
|
||||||
|
|
||||||
options.done && options.done(value); |
|
||||||
that.removePicker(); |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
//选择器面板点击事件
|
|
||||||
that.elemPicker.on('click', '*[colorpicker-events]', function(){ |
|
||||||
var othis = $(this) |
|
||||||
,attrEvent = othis.attr('colorpicker-events'); |
|
||||||
pickerEvents[attrEvent] && pickerEvents[attrEvent].call(this, othis); |
|
||||||
}); |
|
||||||
|
|
||||||
//输入框事件
|
|
||||||
elemPickerInput.on('keyup', function(e){ |
|
||||||
var othis = $(this) |
|
||||||
pickerEvents.confirm.call(this, othis, e.keyCode === 13 ? null : 'change'); |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
//颜色选择器输入
|
|
||||||
Class.prototype.events = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config |
|
||||||
|
|
||||||
,elemColorBoxSpan = that.elemColorBox.find('.' + PICKER_TRIG_SPAN) |
|
||||||
|
|
||||||
//弹出颜色选择器
|
|
||||||
that.elemColorBox.on('click' , function(){ |
|
||||||
that.renderPicker(); |
|
||||||
if($(ELEM_MAIN)[0]){ |
|
||||||
that.val(); |
|
||||||
that.side(); |
|
||||||
}; |
|
||||||
}); |
|
||||||
|
|
||||||
if(!options.elem[0] || that.elemColorBox[0].eventHandler) return; |
|
||||||
|
|
||||||
//绑定关闭控件事件
|
|
||||||
$doc.on(clickOrMousedown, function(e){ |
|
||||||
//如果点击的元素是颜色框
|
|
||||||
if($(e.target).hasClass(ELEM) |
|
||||||
|| $(e.target).parents('.'+ELEM)[0] |
|
||||||
) return; |
|
||||||
|
|
||||||
//如果点击的元素是选择器
|
|
||||||
if($(e.target).hasClass(ELEM_MAIN.replace(/\./g, '')) |
|
||||||
|| $(e.target).parents(ELEM_MAIN)[0] |
|
||||||
) return; |
|
||||||
|
|
||||||
if(!that.elemPicker) return; |
|
||||||
|
|
||||||
if(that.color){ |
|
||||||
var hsb = RGBToHSB(RGBSTo(that.color)); |
|
||||||
that.select(hsb.h, hsb.s, hsb.b); |
|
||||||
} else { |
|
||||||
that.elemColorBox.find('.' + PICKER_TRIG_I).removeClass(ICON_PICKER_DOWN).addClass(ICON_PICKER_CLOSE); |
|
||||||
} |
|
||||||
elemColorBoxSpan[0].style.background = that.color || ''; |
|
||||||
|
|
||||||
that.removePicker(); |
|
||||||
}); |
|
||||||
|
|
||||||
//自适应定位
|
|
||||||
$win.on('resize', function(){ |
|
||||||
if(!that.elemPicker || !$(ELEM_MAIN)[0]){ |
|
||||||
return false; |
|
||||||
} |
|
||||||
that.position(); |
|
||||||
}); |
|
||||||
|
|
||||||
that.elemColorBox[0].eventHandler = true; |
|
||||||
}; |
|
||||||
|
|
||||||
//核心入口
|
|
||||||
colorpicker.render = function(options){ |
|
||||||
var inst = new Class(options); |
|
||||||
return thisColorPicker.call(inst); |
|
||||||
}; |
|
||||||
|
|
||||||
exports(MOD_NAME, colorpicker); |
|
||||||
}); |
|
@ -1,135 +0,0 @@ |
|||||||
|
|
||||||
/*! |
|
||||||
* MODULE_DEMO_NAME 模块组件通用结构 |
|
||||||
* MIT Licensed |
|
||||||
*/ |
|
||||||
|
|
||||||
layui.define([''], function(exports){ |
|
||||||
"use strict"; |
|
||||||
|
|
||||||
var $ = layui.$ |
|
||||||
|
|
||||||
//模块名
|
|
||||||
,MOD_NAME = 'MODULE_DEMO_NAME' |
|
||||||
,MOD_INDEX = 'layui_'+ MOD_NAME +'_index' //模块索引名
|
|
||||||
|
|
||||||
//外部接口
|
|
||||||
,MODULE_DEMO_NAME = { |
|
||||||
config: {} |
|
||||||
,index: layui[MOD_NAME] ? (layui[MOD_NAME].index + 10000) : 0 |
|
||||||
|
|
||||||
//设置全局项
|
|
||||||
,set: function(options){ |
|
||||||
var that = this; |
|
||||||
that.config = $.extend({}, that.config, options); |
|
||||||
return that; |
|
||||||
} |
|
||||||
|
|
||||||
//事件
|
|
||||||
,on: function(events, callback){ |
|
||||||
return layui.onevent.call(this, MOD_NAME, events, callback); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
//操作当前实例
|
|
||||||
,thisModule = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config |
|
||||||
,id = options.id || that.index; |
|
||||||
|
|
||||||
thisModule.that[id] = that; //记录当前实例对象
|
|
||||||
|
|
||||||
return { |
|
||||||
config: options |
|
||||||
//重置实例
|
|
||||||
,reload: function(options){ |
|
||||||
that.reload.call(that, options); |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
//字符常量
|
|
||||||
,STR_ELEM = 'layui-MODULE_DEMO_NAME', STR_HIDE = 'layui-hide', STR_DISABLED = 'layui-disabled', STR_NONE = 'layui-none' |
|
||||||
|
|
||||||
//主模板
|
|
||||||
,TPL_MAIN = [''].join('') |
|
||||||
|
|
||||||
//构造器
|
|
||||||
,Class = function(options){ |
|
||||||
var that = this; |
|
||||||
that.index = ++MODULE_DEMO_NAME.index; |
|
||||||
that.config = $.extend({}, that.config, MODULE_DEMO_NAME.config, options); |
|
||||||
that.render(); |
|
||||||
}; |
|
||||||
|
|
||||||
//默认配置
|
|
||||||
Class.prototype.config = { |
|
||||||
|
|
||||||
}; |
|
||||||
|
|
||||||
//重载实例
|
|
||||||
Class.prototype.reload = function(options){ |
|
||||||
var that = this; |
|
||||||
|
|
||||||
//防止数组深度合并
|
|
||||||
layui.each(options, function(key, item){ |
|
||||||
if(layui._typeof(item) === 'array') delete that.config[key]; |
|
||||||
}); |
|
||||||
|
|
||||||
that.config = $.extend(true, {}, that.config, options); |
|
||||||
that.render(); |
|
||||||
}; |
|
||||||
|
|
||||||
//渲染
|
|
||||||
Class.prototype.render = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config; |
|
||||||
|
|
||||||
//解析模板
|
|
||||||
var thisElem = that.elem = $(laytpl(TPL_MAIN).render({ |
|
||||||
data: options |
|
||||||
,index: that.index //索引
|
|
||||||
})); |
|
||||||
|
|
||||||
var othis = options.elem = $(options.elem); |
|
||||||
if(!othis[0]) return; |
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
that.events(); //事件
|
|
||||||
}; |
|
||||||
|
|
||||||
//事件
|
|
||||||
Class.prototype.events = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config; |
|
||||||
|
|
||||||
|
|
||||||
}; |
|
||||||
|
|
||||||
//记录所有实例
|
|
||||||
thisModule.that = {}; //记录所有实例对象
|
|
||||||
|
|
||||||
//获取当前实例对象
|
|
||||||
thisModule.getThis = function(id){ |
|
||||||
var that = thisModule.that[id]; |
|
||||||
if(!that) hint.error(id ? (MOD_NAME +' instance with ID \''+ id +'\' not found') : 'ID argument required'); |
|
||||||
return that |
|
||||||
}; |
|
||||||
|
|
||||||
//重载实例
|
|
||||||
MODULE_DEMO_NAME.reload = function(id, options){ |
|
||||||
var that = thisModule.that[id]; |
|
||||||
that.reload(options); |
|
||||||
|
|
||||||
return thisModule.call(that); |
|
||||||
}; |
|
||||||
|
|
||||||
//核心入口
|
|
||||||
MODULE_DEMO_NAME.render = function(options){ |
|
||||||
var inst = new Class(options); |
|
||||||
return thisModule.call(inst); |
|
||||||
}; |
|
||||||
|
|
||||||
exports(MOD_NAME, MODULE_DEMO_NAME); |
|
||||||
}); |
|
@ -1,528 +0,0 @@ |
|||||||
/** |
|
||||||
|
|
||||||
@Name:dropdown 下拉菜单组件 |
|
||||||
@License:MIT |
|
||||||
|
|
||||||
*/ |
|
||||||
|
|
||||||
layui.define(['jquery', 'laytpl', 'lay'], function(exports){ |
|
||||||
"use strict"; |
|
||||||
|
|
||||||
var $ = layui.$ |
|
||||||
,laytpl = layui.laytpl |
|
||||||
,hint = layui.hint() |
|
||||||
,device = layui.device() |
|
||||||
,clickOrMousedown = (device.mobile ? 'click' : 'mousedown') |
|
||||||
|
|
||||||
//模块名
|
|
||||||
,MOD_NAME = 'dropdown' |
|
||||||
,MOD_INDEX = 'layui_'+ MOD_NAME +'_index' //模块索引名
|
|
||||||
|
|
||||||
//外部接口
|
|
||||||
,dropdown = { |
|
||||||
config: {} |
|
||||||
,index: layui[MOD_NAME] ? (layui[MOD_NAME].index + 10000) : 0 |
|
||||||
|
|
||||||
//设置全局项
|
|
||||||
,set: function(options){ |
|
||||||
var that = this; |
|
||||||
that.config = $.extend({}, that.config, options); |
|
||||||
return that; |
|
||||||
} |
|
||||||
|
|
||||||
//事件
|
|
||||||
,on: function(events, callback){ |
|
||||||
return layui.onevent.call(this, MOD_NAME, events, callback); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
//操作当前实例
|
|
||||||
,thisModule = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config |
|
||||||
,id = options.id; |
|
||||||
|
|
||||||
thisModule.that[id] = that; //记录当前实例对象
|
|
||||||
|
|
||||||
return { |
|
||||||
config: options |
|
||||||
//重置实例
|
|
||||||
,reload: function(options){ |
|
||||||
that.reload.call(that, options); |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
//字符常量
|
|
||||||
,STR_ELEM = 'layui-dropdown', STR_HIDE = 'layui-hide', STR_DISABLED = 'layui-disabled', STR_NONE = 'layui-none' |
|
||||||
,STR_ITEM_UP = 'layui-menu-item-up', STR_ITEM_DOWN = 'layui-menu-item-down', STR_MENU_TITLE = 'layui-menu-body-title', STR_ITEM_GROUP = 'layui-menu-item-group', STR_ITEM_PARENT = 'layui-menu-item-parent', STR_ITEM_DIV = 'layui-menu-item-divider', STR_ITEM_CHECKED = 'layui-menu-item-checked', STR_ITEM_CHECKED2 = 'layui-menu-item-checked2', STR_MENU_PANEL = 'layui-menu-body-panel', STR_MENU_PANEL_L = 'layui-menu-body-panel-left' |
|
||||||
|
|
||||||
,STR_GROUP_TITLE = '.'+ STR_ITEM_GROUP + '>.'+ STR_MENU_TITLE |
|
||||||
|
|
||||||
//构造器
|
|
||||||
,Class = function(options){ |
|
||||||
var that = this; |
|
||||||
that.index = ++dropdown.index; |
|
||||||
that.config = $.extend({}, that.config, dropdown.config, options); |
|
||||||
that.init(); |
|
||||||
}; |
|
||||||
|
|
||||||
//默认配置
|
|
||||||
Class.prototype.config = { |
|
||||||
trigger: 'click' //事件类型
|
|
||||||
,content: '' //自定义菜单内容
|
|
||||||
,className: '' //自定义样式类名
|
|
||||||
,style: '' //设置面板 style 属性
|
|
||||||
,show: false //是否初始即显示菜单面板
|
|
||||||
,isAllowSpread: true //是否允许菜单组展开收缩
|
|
||||||
,isSpreadItem: true //是否初始展开子菜单
|
|
||||||
,data: [] //菜单数据结构
|
|
||||||
,delay: 300 //延迟关闭的毫秒数,若 trigger 为 hover 时才生效
|
|
||||||
}; |
|
||||||
|
|
||||||
//重载实例
|
|
||||||
Class.prototype.reload = function(options){ |
|
||||||
var that = this; |
|
||||||
that.config = $.extend({}, that.config, options); |
|
||||||
that.init(true); |
|
||||||
}; |
|
||||||
|
|
||||||
//初始化准备
|
|
||||||
Class.prototype.init = function(rerender){ |
|
||||||
var that = this |
|
||||||
,options = that.config |
|
||||||
,elem = options.elem = $(options.elem); |
|
||||||
|
|
||||||
//若 elem 非唯一
|
|
||||||
if(elem.length > 1){ |
|
||||||
layui.each(elem, function(){ |
|
||||||
dropdown.render($.extend({}, options, { |
|
||||||
elem: this |
|
||||||
})); |
|
||||||
}); |
|
||||||
return that; |
|
||||||
} |
|
||||||
|
|
||||||
//若重复执行 render,则视为 reload 处理
|
|
||||||
if(!rerender && elem[0] && elem.data(MOD_INDEX)){; |
|
||||||
var newThat = thisModule.getThis(elem.data(MOD_INDEX)); |
|
||||||
if(!newThat) return; |
|
||||||
|
|
||||||
return newThat.reload(options); |
|
||||||
}; |
|
||||||
|
|
||||||
//初始化 id 参数
|
|
||||||
options.id = ('id' in options) ? options.id : that.index; |
|
||||||
|
|
||||||
if(options.show) that.render(rerender); //初始即显示
|
|
||||||
that.events(); //事件
|
|
||||||
}; |
|
||||||
|
|
||||||
//渲染
|
|
||||||
Class.prototype.render = function(rerender){ |
|
||||||
var that = this |
|
||||||
,options = that.config |
|
||||||
,elemBody = $('body') |
|
||||||
|
|
||||||
//默认菜单内容
|
|
||||||
,getDefaultView = function(){ |
|
||||||
var elemUl = $('<ul class="layui-menu layui-dropdown-menu"></ul>'); |
|
||||||
if(options.data.length > 0 ){ |
|
||||||
eachItemView(elemUl, options.data) |
|
||||||
} else { |
|
||||||
elemUl.html('<li class="layui-menu-item-none">no menu</li>'); |
|
||||||
} |
|
||||||
return elemUl; |
|
||||||
} |
|
||||||
|
|
||||||
//遍历菜单项
|
|
||||||
,eachItemView = function(views, data){ |
|
||||||
//var views = [];
|
|
||||||
layui.each(data, function(index, item){ |
|
||||||
//是否存在子级
|
|
||||||
var isChild = item.child && item.child.length > 0 |
|
||||||
,isSpreadItem = ('isSpreadItem' in item) ? item.isSpreadItem : options.isSpreadItem |
|
||||||
,title = item.templet |
|
||||||
? laytpl(item.templet).render(item) |
|
||||||
: (options.templet ? laytpl(options.templet).render(item) : item.title) |
|
||||||
|
|
||||||
//初始类型
|
|
||||||
,type = function(){ |
|
||||||
if(isChild){ |
|
||||||
item.type = item.type || 'parent'; |
|
||||||
} |
|
||||||
if(item.type){ |
|
||||||
return ({ |
|
||||||
group: 'group' |
|
||||||
,parent: 'parent' |
|
||||||
,'-': '-' |
|
||||||
})[item.type] || 'parent'; |
|
||||||
} |
|
||||||
return ''; |
|
||||||
}(); |
|
||||||
|
|
||||||
if(type !== '-' && (!item.title && !item.id && !isChild)) return; |
|
||||||
|
|
||||||
//列表元素
|
|
||||||
var viewLi = $(['<li'+ function(){ |
|
||||||
var className = { |
|
||||||
group: 'layui-menu-item-group'+ ( |
|
||||||
options.isAllowSpread ? ( |
|
||||||
isSpreadItem ? ' layui-menu-item-down' : ' layui-menu-item-up' |
|
||||||
) : '' |
|
||||||
) |
|
||||||
,parent: STR_ITEM_PARENT |
|
||||||
,'-': 'layui-menu-item-divider' |
|
||||||
}; |
|
||||||
if(isChild || type){ |
|
||||||
return ' class="'+ className[type] +'"'; |
|
||||||
} |
|
||||||
return ''; |
|
||||||
}() +'>' |
|
||||||
|
|
||||||
//标题区
|
|
||||||
,function(){ |
|
||||||
//是否超文本
|
|
||||||
var viewText = ('href' in item) ? ( |
|
||||||
'<a href="'+ item.href +'" target="'+ (item.target || '_self') +'">'+ title +'</a>' |
|
||||||
) : title; |
|
||||||
|
|
||||||
//是否存在子级
|
|
||||||
if(isChild){ |
|
||||||
return '<div class="'+ STR_MENU_TITLE +'">'+ viewText + function(){ |
|
||||||
if(type === 'parent'){ |
|
||||||
return '<i class="layui-icon layui-icon-right"></i>'; |
|
||||||
} else if(type === 'group' && options.isAllowSpread){ |
|
||||||
return '<i class="layui-icon layui-icon-'+ (isSpreadItem ? 'up' : 'down') +'"></i>'; |
|
||||||
} else { |
|
||||||
return ''; |
|
||||||
} |
|
||||||
}() +'</div>' |
|
||||||
|
|
||||||
} |
|
||||||
return '<div class="'+ STR_MENU_TITLE +'">'+ viewText +'</div>'; |
|
||||||
}() |
|
||||||
,'</li>'].join('')); |
|
||||||
|
|
||||||
viewLi.data('item', item); |
|
||||||
|
|
||||||
//子级区
|
|
||||||
if(isChild){ |
|
||||||
var elemPanel = $('<div class="layui-panel layui-menu-body-panel"></div>') |
|
||||||
,elemUl = $('<ul></ul>'); |
|
||||||
|
|
||||||
if(type === 'parent'){ |
|
||||||
elemPanel.append(eachItemView(elemUl, item.child)); |
|
||||||
viewLi.append(elemPanel); |
|
||||||
} else { |
|
||||||
viewLi.append(eachItemView(elemUl, item.child)); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
views.append(viewLi); |
|
||||||
}); |
|
||||||
return views; |
|
||||||
} |
|
||||||
|
|
||||||
//主模板
|
|
||||||
,TPL_MAIN = ['<div class="layui-dropdown layui-border-box layui-panel layui-anim layui-anim-downbit">' |
|
||||||
,'</div>'].join(''); |
|
||||||
|
|
||||||
//如果是右键事件,则每次触发事件时,将允许重新渲染
|
|
||||||
if(options.trigger === 'contextmenu' || lay.isTopElem(options.elem[0])) rerender = true; |
|
||||||
|
|
||||||
//判断是否已经打开了下拉菜单面板
|
|
||||||
if(!rerender && options.elem.data(MOD_INDEX +'_opened')) return; |
|
||||||
|
|
||||||
//记录模板对象
|
|
||||||
that.elemView = $(TPL_MAIN); |
|
||||||
that.elemView.append(options.content || getDefaultView()); |
|
||||||
|
|
||||||
//初始化某些属性
|
|
||||||
if(options.className) that.elemView.addClass(options.className); |
|
||||||
if(options.style) that.elemView.attr('style', options.style); |
|
||||||
|
|
||||||
|
|
||||||
//记录当前执行的实例索引
|
|
||||||
dropdown.thisId = options.id; |
|
||||||
|
|
||||||
//插入视图
|
|
||||||
that.remove(); //移除非当前绑定元素的面板
|
|
||||||
elemBody.append(that.elemView); |
|
||||||
options.elem.data(MOD_INDEX +'_opened', true); |
|
||||||
|
|
||||||
//坐标定位
|
|
||||||
that.position(); |
|
||||||
thisModule.prevElem = that.elemView; //记录当前打开的元素,以便在下次关闭
|
|
||||||
thisModule.prevElem.data('prevElem', options.elem); //将当前绑定的元素,记录在打开元素的 data 对象中
|
|
||||||
|
|
||||||
//阻止全局事件
|
|
||||||
that.elemView.find('.layui-menu').on(clickOrMousedown, function(e){ |
|
||||||
layui.stope(e); |
|
||||||
}); |
|
||||||
|
|
||||||
//触发菜单列表事件
|
|
||||||
that.elemView.find('.layui-menu li').on('click', function(e){ |
|
||||||
var othis = $(this) |
|
||||||
,data = othis.data('item') || {} |
|
||||||
,isChild = data.child && data.child.length > 0; |
|
||||||
|
|
||||||
if(!isChild && data.type !== '-'){ |
|
||||||
that.remove(); |
|
||||||
typeof options.click === 'function' && options.click(data, othis); |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
//触发菜单组展开收缩
|
|
||||||
that.elemView.find(STR_GROUP_TITLE).on('click', function(e){ |
|
||||||
var othis = $(this) |
|
||||||
,elemGroup = othis.parent() |
|
||||||
,data = elemGroup.data('item') || {} |
|
||||||
|
|
||||||
if(data.type === 'group' && options.isAllowSpread){ |
|
||||||
thisModule.spread(elemGroup); |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
//如果是鼠标移入事件,则鼠标移出时自动关闭
|
|
||||||
if(options.trigger === 'mouseenter'){ |
|
||||||
that.elemView.on('mouseenter', function(){ |
|
||||||
clearTimeout(thisModule.timer); |
|
||||||
}).on('mouseleave', function(){ |
|
||||||
that.delayRemove(); |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
}; |
|
||||||
|
|
||||||
//位置定位
|
|
||||||
Class.prototype.position = function(obj){ |
|
||||||
var that = this |
|
||||||
,options = that.config; |
|
||||||
|
|
||||||
lay.position(options.elem[0], that.elemView[0], { |
|
||||||
position: options.position |
|
||||||
,e: that.e |
|
||||||
,clickType: options.trigger === 'contextmenu' ? 'right' : null |
|
||||||
,align: options.align || null |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
//删除视图
|
|
||||||
Class.prototype.remove = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config |
|
||||||
,elemPrev = thisModule.prevElem; |
|
||||||
|
|
||||||
//若存在已打开的面板元素,则移除
|
|
||||||
if(elemPrev){ |
|
||||||
elemPrev.data('prevElem') && ( |
|
||||||
elemPrev.data('prevElem').data(MOD_INDEX +'_opened', false) |
|
||||||
); |
|
||||||
elemPrev.remove(); |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
//延迟删除视图
|
|
||||||
Class.prototype.delayRemove = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config; |
|
||||||
clearTimeout(thisModule.timer); |
|
||||||
|
|
||||||
thisModule.timer = setTimeout(function(){ |
|
||||||
that.remove(); |
|
||||||
}, options.delay); |
|
||||||
}; |
|
||||||
|
|
||||||
//事件
|
|
||||||
Class.prototype.events = function(){ |
|
||||||
var that = this |
|
||||||
,options = that.config; |
|
||||||
|
|
||||||
//如果传入 hover,则解析为 mouseenter
|
|
||||||
if(options.trigger === 'hover') options.trigger = 'mouseenter'; |
|
||||||
|
|
||||||
//解除上一个事件
|
|
||||||
if(that.prevElem) that.prevElem.off(options.trigger, that.prevElemCallback); |
|
||||||
|
|
||||||
//记录被绑定的元素及回调
|
|
||||||
that.prevElem = options.elem; |
|
||||||
that.prevElemCallback = function(e){ |
|
||||||
clearTimeout(thisModule.timer); |
|
||||||
that.e = e; |
|
||||||
that.render(); |
|
||||||
e.preventDefault(); |
|
||||||
|
|
||||||
//组件打开完毕的时间
|
|
||||||
typeof options.ready === 'function' && options.ready(that.elemView, options.elem, that.e.target); |
|
||||||
}; |
|
||||||
|
|
||||||
//触发元素事件
|
|
||||||
options.elem.on(options.trigger, that.prevElemCallback); |
|
||||||
|
|
||||||
//如果是鼠标移入事件
|
|
||||||
if(options.trigger === 'mouseenter'){ |
|
||||||
//直行鼠标移出事件
|
|
||||||
options.elem.on('mouseleave', function(){ |
|
||||||
that.delayRemove(); |
|
||||||
}); |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
//记录所有实例
|
|
||||||
thisModule.that = {}; //记录所有实例对象
|
|
||||||
|
|
||||||
//获取当前实例对象
|
|
||||||
thisModule.getThis = function(id){ |
|
||||||
var that = thisModule.that[id]; |
|
||||||
if(!that) hint.error(id ? (MOD_NAME +' instance with ID \''+ id +'\' not found') : 'ID argument required'); |
|
||||||
return that; |
|
||||||
}; |
|
||||||
|
|
||||||
//设置菜单组展开和收缩状态
|
|
||||||
thisModule.spread = function(othis){ |
|
||||||
//菜单组展开和收缩
|
|
||||||
var elemIcon = othis.children('.'+ STR_MENU_TITLE).find('.layui-icon'); |
|
||||||
if(othis.hasClass(STR_ITEM_UP)){ |
|
||||||
othis.removeClass(STR_ITEM_UP).addClass(STR_ITEM_DOWN); |
|
||||||
elemIcon.removeClass('layui-icon-down').addClass('layui-icon-up'); |
|
||||||
} else { |
|
||||||
othis.removeClass(STR_ITEM_DOWN).addClass(STR_ITEM_UP); |
|
||||||
elemIcon.removeClass('layui-icon-up').addClass('layui-icon-down') |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
//全局事件
|
|
||||||
;!function(){ |
|
||||||
var _WIN = $(window) |
|
||||||
,_DOC = $(document); |
|
||||||
|
|
||||||
//自适应定位
|
|
||||||
_WIN.on('resize', function(){ |
|
||||||
if(!dropdown.thisId) return; |
|
||||||
var that = thisModule.getThis(dropdown.thisId); |
|
||||||
if(!that) return; |
|
||||||
|
|
||||||
if(!that.elemView[0] || !$('.'+ STR_ELEM)[0]){ |
|
||||||
return false; |
|
||||||
} |
|
||||||
|
|
||||||
var options = that.config; |
|
||||||
|
|
||||||
if(options.trigger === 'contextmenu'){ |
|
||||||
that.remove(); |
|
||||||
} else { |
|
||||||
that.position(); |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
//点击任意处关闭
|
|
||||||
_DOC.on(clickOrMousedown, function(e){ |
|
||||||
if(!dropdown.thisId) return; |
|
||||||
var that = thisModule.getThis(dropdown.thisId) |
|
||||||
if(!that) return; |
|
||||||
|
|
||||||
var options = that.config; |
|
||||||
|
|
||||||
//如果触发的是绑定的元素,或者属于绑定元素的子元素,则不关闭
|
|
||||||
//满足条件:当前绑定的元素不是 body document,或者不是鼠标右键事件
|
|
||||||
if(!(lay.isTopElem(options.elem[0]) || options.trigger === 'contextmenu')){ |
|
||||||
if( |
|
||||||
e.target === options.elem[0] || |
|
||||||
options.elem.find(e.target)[0] || |
|
||||||
e.target === that.elemView[0] || |
|
||||||
(that.elemView && that.elemView.find(e.target)[0]) |
|
||||||
) return; |
|
||||||
} |
|
||||||
|
|
||||||
that.remove(); |
|
||||||
}); |
|
||||||
|
|
||||||
//基础菜单的静态元素事件
|
|
||||||
var ELEM_LI = '.layui-menu:not(.layui-dropdown-menu) li'; |
|
||||||
_DOC.on('click', ELEM_LI, function(e){ |
|
||||||
var othis = $(this) |
|
||||||
,parent = othis.parents('.layui-menu').eq(0) |
|
||||||
,isChild = othis.hasClass(STR_ITEM_GROUP) || othis.hasClass(STR_ITEM_PARENT) |
|
||||||
,filter = parent.attr('lay-filter') || parent.attr('id') |
|
||||||
,options = lay.options(this); |
|
||||||
|
|
||||||
//非触发元素
|
|
||||||
if(othis.hasClass(STR_ITEM_DIV)) return; |
|
||||||
|
|
||||||
//非菜单组
|
|
||||||
if(!isChild){ |
|
||||||
//选中
|
|
||||||
parent.find('.'+ STR_ITEM_CHECKED).removeClass(STR_ITEM_CHECKED); //清除选中样式
|
|
||||||
parent.find('.'+ STR_ITEM_CHECKED2).removeClass(STR_ITEM_CHECKED2); //清除父级菜单选中样式
|
|
||||||
othis.addClass(STR_ITEM_CHECKED); //添加选中样式
|
|
||||||
othis.parents('.'+ STR_ITEM_PARENT).addClass(STR_ITEM_CHECKED2); //添加父级菜单选中样式
|
|
||||||
|
|
||||||
//触发事件
|
|
||||||
layui.event.call(this, MOD_NAME, 'click('+ filter +')', options); |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
//基础菜单的展开收缩事件
|
|
||||||
_DOC.on('click', (ELEM_LI + STR_GROUP_TITLE), function(e){ |
|
||||||
var othis = $(this) |
|
||||||
,elemGroup = othis.parents('.'+ STR_ITEM_GROUP +':eq(0)') |
|
||||||
,options = lay.options(elemGroup[0]); |
|
||||||
|
|
||||||
if(('isAllowSpread' in options) ? options.isAllowSpread : true){ |
|
||||||
thisModule.spread(elemGroup); |
|
||||||
}; |
|
||||||
}); |
|
||||||
|
|
||||||
//判断子级菜单是否超出屏幕
|
|
||||||
var ELEM_LI_PAR = '.layui-menu .'+ STR_ITEM_PARENT |
|
||||||
_DOC.on('mouseenter', ELEM_LI_PAR, function(e){ |
|
||||||
var othis = $(this) |
|
||||||
,elemPanel = othis.find('.'+ STR_MENU_PANEL); |
|
||||||
|
|
||||||
if(!elemPanel[0]) return; |
|
||||||
var rect = elemPanel[0].getBoundingClientRect(); |
|
||||||
|
|
||||||
//是否超出右侧屏幕
|
|
||||||
if(rect.right > _WIN.width()){ |
|
||||||
elemPanel.addClass(STR_MENU_PANEL_L); |
|
||||||
//不允许超出左侧屏幕
|
|
||||||
rect = elemPanel[0].getBoundingClientRect(); |
|
||||||
if(rect.left < 0){ |
|
||||||
elemPanel.removeClass(STR_MENU_PANEL_L); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
//是否超出底部屏幕
|
|
||||||
if(rect.bottom > _WIN.height()){ |
|
||||||
elemPanel.eq(0).css('margin-top', -(rect.bottom - _WIN.height())); |
|
||||||
}; |
|
||||||
}).on('mouseleave', ELEM_LI_PAR, function(e){ |
|
||||||
var othis = $(this) |
|
||||||
,elemPanel = othis.children('.'+ STR_MENU_PANEL); |
|
||||||
|
|
||||||
elemPanel.removeClass(STR_MENU_PANEL_L); |
|
||||||
elemPanel.css('margin-top', 0); |
|
||||||
}); |
|
||||||
|
|
||||||
}(); |
|
||||||
|
|
||||||
//重载实例
|
|
||||||
dropdown.reload = function(id, options){ |
|
||||||
var that = thisModule.getThis(id); |
|
||||||
if(!that) return this; |
|
||||||
|
|
||||||
that.reload(options); |
|
||||||
return thisModule.call(that); |
|
||||||
}; |
|
||||||
|
|
||||||
//核心入口
|
|
||||||
dropdown.render = function(options){ |
|
||||||
var inst = new Class(options); |
|
||||||
return thisModule.call(inst); |
|
||||||
}; |
|
||||||
|
|
||||||
exports(MOD_NAME, dropdown); |
|
||||||
}); |
|
@ -1,510 +0,0 @@ |
|||||||
|
|
||||||
/*! |
|
||||||
* element 常用元素操作 |
|
||||||
* MIT Licensed |
|
||||||
*/ |
|
||||||
|
|
||||||
layui.define('jquery', function(exports){ |
|
||||||
"use strict"; |
|
||||||
|
|
||||||
var $ = layui.$ |
|
||||||
,hint = layui.hint() |
|
||||||
,device = layui.device() |
|
||||||
|
|
||||||
,MOD_NAME = 'element', THIS = 'layui-this', SHOW = 'layui-show' |
|
||||||
|
|
||||||
,Element = function(){ |
|
||||||
this.config = {}; |
|
||||||
}; |
|
||||||
|
|
||||||
//全局设置
|
|
||||||
Element.prototype.set = function(options){ |
|
||||||
var that = this; |
|
||||||
$.extend(true, that.config, options); |
|
||||||
return that; |
|
||||||
}; |
|
||||||
|
|
||||||
//表单事件
|
|
||||||
Element.prototype.on = function(events, callback){ |
|
||||||
return layui.onevent.call(this, MOD_NAME, events, callback); |
|
||||||
}; |
|
||||||
|
|
||||||
//外部Tab新增
|
|
||||||
Element.prototype.tabAdd = function(filter, options){ |
|
||||||
var TITLE = '.layui-tab-title' |
|
||||||
,tabElem = $('.layui-tab[lay-filter='+ filter +']') |
|
||||||
,titElem = tabElem.children(TITLE) |
|
||||||
,barElem = titElem.children('.layui-tab-bar') |
|
||||||
,contElem = tabElem.children('.layui-tab-content') |
|
||||||
,li = '<li'+ function(){ |
|
||||||
var layAttr = []; |
|
||||||
layui.each(options, function(key, value){ |
|
||||||
if(/^(title|content)$/.test(key)) return; |
|
||||||
layAttr.push('lay-'+ key +'="'+ value +'"'); |
|
||||||
}); |
|
||||||
if(layAttr.length > 0) layAttr.unshift(''); //向前插,预留空格
|
|
||||||
return layAttr.join(' '); |
|
||||||
}() +'>'+ (options.title || 'unnaming') +'</li>'; |
|
||||||
|
|
||||||
barElem[0] ? barElem.before(li) : titElem.append(li); |
|
||||||
contElem.append('<div class="layui-tab-item">'+ (options.content || '') +'</div>'); |
|
||||||
call.hideTabMore(true); |
|
||||||
call.tabAuto(); |
|
||||||
return this; |
|
||||||
}; |
|
||||||
|
|
||||||
//外部Tab删除
|
|
||||||
Element.prototype.tabDelete = function(filter, layid){ |
|
||||||
var TITLE = '.layui-tab-title' |
|
||||||
,tabElem = $('.layui-tab[lay-filter='+ filter +']') |
|
||||||
,titElem = tabElem.children(TITLE) |
|
||||||
,liElem = titElem.find('>li[lay-id="'+ layid +'"]'); |
|
||||||
call.tabDelete(null, liElem); |
|
||||||
return this; |
|
||||||
}; |
|
||||||
|
|
||||||
//外部Tab切换
|
|
||||||
Element.prototype.tabChange = function(filter, layid){ |
|
||||||
var TITLE = '.layui-tab-title' |
|
||||||
,tabElem = $('.layui-tab[lay-filter='+ filter +']') |
|
||||||
,titElem = tabElem.children(TITLE) |
|
||||||
,liElem = titElem.find('>li[lay-id="'+ layid +'"]'); |
|
||||||
call.tabClick.call(liElem[0], null, null, liElem); |
|
||||||
return this; |
|
||||||
}; |
|
||||||
|
|
||||||
//自定义Tab选项卡
|
|
||||||
Element.prototype.tab = function(options){ |
|
||||||
options = options || {}; |
|
||||||
dom.on('click', options.headerElem, function(e){ |
|
||||||
var index = $(this).index(); |
|
||||||
call.tabClick.call(this, e, index, null, options); |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
|
|
||||||
//动态改变进度条
|
|
||||||
Element.prototype.progress = function(filter, percent){ |
|
||||||
var ELEM = 'layui-progress' |
|
||||||
,elem = $('.'+ ELEM +'[lay-filter='+ filter +']') |
|
||||||
,elemBar = elem.find('.'+ ELEM +'-bar') |
|
||||||
,text = elemBar.find('.'+ ELEM +'-text'); |
|
||||||
elemBar.css('width', percent).attr('lay-percent', percent); |
|
||||||
text.text(percent); |
|
||||||
return this; |
|
||||||
}; |
|
||||||
|
|
||||||
var NAV_ELEM = '.layui-nav', NAV_ITEM = 'layui-nav-item', NAV_BAR = 'layui-nav-bar' |
|
||||||
,NAV_TREE = 'layui-nav-tree', NAV_CHILD = 'layui-nav-child', NAV_CHILD_C = 'layui-nav-child-c' |
|
||||||
,NAV_MORE = 'layui-nav-more', NAV_DOWN = 'layui-icon-down', NAV_ANIM = 'layui-anim layui-anim-upbit' |
|
||||||
|
|
||||||
//基础事件体
|
|
||||||
,call = { |
|
||||||
//Tab 点击
|
|
||||||
tabClick: function(e, index, liElem, options){ |
|
||||||
options = options || {}; |
|
||||||
var othis = liElem || $(this) |
|
||||||
,index = index || othis.parent().children('li').index(othis) |
|
||||||
,parents = options.headerElem ? othis.parent() : othis.parents('.layui-tab').eq(0) |
|
||||||
,item = options.bodyElem ? $(options.bodyElem) : parents.children('.layui-tab-content').children('.layui-tab-item') |
|
||||||
,elemA = othis.find('a') |
|
||||||
,isJump = elemA.attr('href') !== 'javascript:;' && elemA.attr('target') === '_blank' //是否存在跳转
|
|
||||||
,unselect = typeof othis.attr('lay-unselect') === 'string' //是否禁用选中
|
|
||||||
,filter = parents.attr('lay-filter'); |
|
||||||
|
|
||||||
//执行切换
|
|
||||||
if(!(isJump || unselect)){ |
|
||||||
othis.addClass(THIS).siblings().removeClass(THIS); |
|
||||||
item.eq(index).addClass(SHOW).siblings().removeClass(SHOW); |
|
||||||
} |
|
||||||
|
|
||||||
layui.event.call(this, MOD_NAME, 'tab('+ filter +')', { |
|
||||||
elem: parents |
|
||||||
,index: index |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
//Tab删除
|
|
||||||
,tabDelete: function(e, othis){ |
|
||||||
var li = othis || $(this).parent(), index = li.index() |
|
||||||
,parents = li.parents('.layui-tab').eq(0) |
|
||||||
,item = parents.children('.layui-tab-content').children('.layui-tab-item') |
|
||||||
,filter = parents.attr('lay-filter'); |
|
||||||
|
|
||||||
if(li.hasClass(THIS)){ |
|
||||||
if(li.next()[0]){ |
|
||||||
call.tabClick.call(li.next()[0], null, index + 1); |
|
||||||
} else if(li.prev()[0]){ |
|
||||||
call.tabClick.call(li.prev()[0], null, index - 1); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
li.remove(); |
|
||||||
item.eq(index).remove(); |
|
||||||
setTimeout(function(){ |
|
||||||
call.tabAuto(); |
|
||||||
}, 50); |
|
||||||
|
|
||||||
layui.event.call(this, MOD_NAME, 'tabDelete('+ filter +')', { |
|
||||||
elem: parents |
|
||||||
,index: index |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
//Tab自适应
|
|
||||||
,tabAuto: function(){ |
|
||||||
var SCROLL = 'layui-tab-scroll', MORE = 'layui-tab-more', BAR = 'layui-tab-bar' |
|
||||||
,CLOSE = 'layui-tab-close', that = this; |
|
||||||
|
|
||||||
$('.layui-tab').each(function(){ |
|
||||||
var othis = $(this) |
|
||||||
,title = othis.children('.layui-tab-title') |
|
||||||
,item = othis.children('.layui-tab-content').children('.layui-tab-item') |
|
||||||
,STOPE = 'lay-stope="tabmore"' |
|
||||||
,span = $('<span class="layui-unselect layui-tab-bar" '+ STOPE +'><i '+ STOPE +' class="layui-icon"></i></span>'); |
|
||||||
|
|
||||||
if(that === window && device.ie != 8){ |
|
||||||
call.hideTabMore(true) |
|
||||||
} |
|
||||||
|
|
||||||
//允许关闭
|
|
||||||
if(othis.attr('lay-allowClose')){ |
|
||||||
title.find('li').each(function(){ |
|
||||||
var li = $(this); |
|
||||||
if(!li.find('.'+CLOSE)[0]){ |
|
||||||
var close = $('<i class="layui-icon layui-icon-close layui-unselect '+ CLOSE +'"></i>'); |
|
||||||
close.on('click', call.tabDelete); |
|
||||||
li.append(close); |
|
||||||
} |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
if(typeof othis.attr('lay-unauto') === 'string') return; |
|
||||||
|
|
||||||
//响应式
|
|
||||||
if(title.prop('scrollWidth') > title.outerWidth()+1){ |
|
||||||
if(title.find('.'+BAR)[0]) return; |
|
||||||
title.append(span); |
|
||||||
othis.attr('overflow', ''); |
|
||||||
span.on('click', function(e){ |
|
||||||
title[this.title ? 'removeClass' : 'addClass'](MORE); |
|
||||||
this.title = this.title ? '' : '收缩'; |
|
||||||
}); |
|
||||||
} else { |
|
||||||
title.find('.'+BAR).remove(); |
|
||||||
othis.removeAttr('overflow'); |
|
||||||
} |
|
||||||
}); |
|
||||||
} |
|
||||||
//隐藏更多Tab
|
|
||||||
,hideTabMore: function(e){ |
|
||||||
var tsbTitle = $('.layui-tab-title'); |
|
||||||
if(e === true || $(e.target).attr('lay-stope') !== 'tabmore'){ |
|
||||||
tsbTitle.removeClass('layui-tab-more'); |
|
||||||
tsbTitle.find('.layui-tab-bar').attr('title',''); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
//点击一级菜单
|
|
||||||
/* |
|
||||||
,clickThis: function(){ |
|
||||||
var othis = $(this), parents = othis.parents(NAV_ELEM) |
|
||||||
,filter = parents.attr('lay-filter') |
|
||||||
,elemA = othis.find('a') |
|
||||||
,unselect = typeof othis.attr('lay-unselect') === 'string'; |
|
||||||
|
|
||||||
if(othis.find('.'+NAV_CHILD)[0]) return; |
|
||||||
|
|
||||||
if(!(elemA.attr('href') !== 'javascript:;' && elemA.attr('target') === '_blank') && !unselect){ |
|
||||||
parents.find('.'+THIS).removeClass(THIS); |
|
||||||
othis.addClass(THIS); |
|
||||||
} |
|
||||||
|
|
||||||
layui.event.call(this, MOD_NAME, 'nav('+ filter +')', othis); |
|
||||||
} |
|
||||||
) |
|
||||||
*/ |
|
||||||
|
|
||||||
//点击菜单 - a标签触发
|
|
||||||
,clickThis: function(){ |
|
||||||
var othis = $(this) |
|
||||||
,parents = othis.parents(NAV_ELEM) |
|
||||||
,filter = parents.attr('lay-filter') |
|
||||||
,parent = othis.parent() |
|
||||||
,child = othis.siblings('.'+NAV_CHILD) |
|
||||||
,unselect = typeof parent.attr('lay-unselect') === 'string'; //是否禁用选中
|
|
||||||
|
|
||||||
if(!(othis.attr('href') !== 'javascript:;' && othis.attr('target') === '_blank') && !unselect){ |
|
||||||
if(!child[0]){ |
|
||||||
parents.find('.'+THIS).removeClass(THIS); |
|
||||||
parent.addClass(THIS); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
//如果是垂直菜单
|
|
||||||
if(parents.hasClass(NAV_TREE)){ |
|
||||||
child.removeClass(NAV_ANIM); |
|
||||||
|
|
||||||
//如果有子菜单,则展开
|
|
||||||
if(child[0]){ |
|
||||||
parent[child.css('display') === 'none' ? 'addClass': 'removeClass'](NAV_ITEM+'ed'); |
|
||||||
if(parents.attr('lay-shrink') === 'all'){ |
|
||||||
parent.siblings().removeClass(NAV_ITEM + 'ed'); |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
layui.event.call(this, MOD_NAME, 'nav('+ filter +')', othis); |
|
||||||
} |
|
||||||
|
|
||||||
//点击子菜单选中
|
|
||||||
/* |
|
||||||
,clickChild: function(){ |
|
||||||
var othis = $(this), parents = othis.parents(NAV_ELEM) |
|
||||||
,filter = parents.attr('lay-filter'); |
|
||||||
parents.find('.'+THIS).removeClass(THIS); |
|
||||||
othis.addClass(THIS); |
|
||||||
layui.event.call(this, MOD_NAME, 'nav('+ filter +')', othis); |
|
||||||
} |
|
||||||
*/ |
|
||||||
|
|
||||||
//折叠面板
|
|
||||||
,collapse: function(){ |
|
||||||
var othis = $(this), icon = othis.find('.layui-colla-icon') |
|
||||||
,elemCont = othis.siblings('.layui-colla-content') |
|
||||||
,parents = othis.parents('.layui-collapse').eq(0) |
|
||||||
,filter = parents.attr('lay-filter') |
|
||||||
,isNone = elemCont.css('display') === 'none'; |
|
||||||
|
|
||||||
//是否手风琴
|
|
||||||
if(typeof parents.attr('lay-accordion') === 'string'){ |
|
||||||
var show = parents.children('.layui-colla-item').children('.'+SHOW); |
|
||||||
show.siblings('.layui-colla-title').children('.layui-colla-icon').html(''); |
|
||||||
show.removeClass(SHOW); |
|
||||||
} |
|
||||||
|
|
||||||
elemCont[isNone ? 'addClass' : 'removeClass'](SHOW); |
|
||||||
icon.html(isNone ? '' : ''); |
|
||||||
|
|
||||||
layui.event.call(this, MOD_NAME, 'collapse('+ filter +')', { |
|
||||||
title: othis |
|
||||||
,content: elemCont |
|
||||||
,show: isNone |
|
||||||
}); |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
//初始化元素操作
|
|
||||||
Element.prototype.init = function(type, filter){ |
|
||||||
var that = this, elemFilter = function(){ |
|
||||||
return filter ? ('[lay-filter="' + filter +'"]') : ''; |
|
||||||
}(), items = { |
|
||||||
|
|
||||||
//Tab选项卡
|
|
||||||
tab: function(){ |
|
||||||
call.tabAuto.call({}); |
|
||||||
} |
|
||||||
|
|
||||||
//导航菜单
|
|
||||||
,nav: function(){ |
|
||||||
var TIME = 200, timer = {}, timerMore = {}, timeEnd = {}, NAV_TITLE = 'layui-nav-title' |
|
||||||
|
|
||||||
//滑块跟随
|
|
||||||
,follow = function(bar, nav, index){ |
|
||||||
var othis = $(this), child = othis.find('.'+NAV_CHILD); |
|
||||||
if(nav.hasClass(NAV_TREE)){ |
|
||||||
//无子菜单时跟随
|
|
||||||
if(!child[0]){ |
|
||||||
var thisA = othis.children('.'+ NAV_TITLE); |
|
||||||
bar.css({ |
|
||||||
top: othis.offset().top - nav.offset().top |
|
||||||
,height: (thisA[0] ? thisA : othis).outerHeight() |
|
||||||
,opacity: 1 |
|
||||||
}); |
|
||||||
} |
|
||||||
} else { |
|
||||||
child.addClass(NAV_ANIM); |
|
||||||
|
|
||||||
//若居中对齐
|
|
||||||
if(child.hasClass(NAV_CHILD_C)) child.css({ |
|
||||||
left: -(child.outerWidth() - othis.width())/2 |
|
||||||
}); |
|
||||||
|
|
||||||
//滑块定位
|
|
||||||
if(child[0]){ //若有子菜单,则滑块消失
|
|
||||||
bar.css({ |
|
||||||
left: bar.position().left + bar.width()/2 |
|
||||||
,width: 0 |
|
||||||
,opacity: 0 |
|
||||||
}); |
|
||||||
} else { //bar 跟随
|
|
||||||
bar.css({ |
|
||||||
left: othis.position().left + parseFloat(othis.css('marginLeft')) |
|
||||||
,top: othis.position().top + othis.height() - bar.height() |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
//渐显滑块并适配宽度
|
|
||||||
timer[index] = setTimeout(function(){ |
|
||||||
bar.css({ |
|
||||||
width: child[0] ? 0 : othis.width() |
|
||||||
,opacity: child[0] ? 0 : 1 |
|
||||||
}); |
|
||||||
}, device.ie && device.ie < 10 ? 0 : TIME); |
|
||||||
|
|
||||||
//显示子菜单
|
|
||||||
clearTimeout(timeEnd[index]); |
|
||||||
if(child.css('display') === 'block'){ |
|
||||||
clearTimeout(timerMore[index]); |
|
||||||
} |
|
||||||
timerMore[index] = setTimeout(function(){ |
|
||||||
child.addClass(SHOW); |
|
||||||
othis.find('.'+NAV_MORE).addClass(NAV_MORE+'d'); |
|
||||||
}, 300); |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
//遍历导航
|
|
||||||
$(NAV_ELEM + elemFilter).each(function(index){ |
|
||||||
var othis = $(this) |
|
||||||
,bar = $('<span class="'+ NAV_BAR +'"></span>') |
|
||||||
,itemElem = othis.find('.'+NAV_ITEM); |
|
||||||
|
|
||||||
//hover 滑动效果
|
|
||||||
if(!othis.find('.'+NAV_BAR)[0]){ |
|
||||||
othis.append(bar); |
|
||||||
(othis.hasClass(NAV_TREE) |
|
||||||
? itemElem.find('dd,>.'+ NAV_TITLE) |
|
||||||
: itemElem).on('mouseenter', function(){ |
|
||||||
follow.call(this, bar, othis, index); |
|
||||||
}).on('mouseleave', function(){ //鼠标移出
|
|
||||||
//是否为垂直导航
|
|
||||||
if(othis.hasClass(NAV_TREE)){ |
|
||||||
bar.css({ |
|
||||||
height: 0 |
|
||||||
,opacity: 0 |
|
||||||
}); |
|
||||||
} else { |
|
||||||
//隐藏子菜单
|
|
||||||
clearTimeout(timerMore[index]); |
|
||||||
timerMore[index] = setTimeout(function(){ |
|
||||||
othis.find('.'+NAV_CHILD).removeClass(SHOW); |
|
||||||
othis.find('.'+NAV_MORE).removeClass(NAV_MORE+'d'); |
|
||||||
}, 300); |
|
||||||
} |
|
||||||
}); |
|
||||||
othis.on('mouseleave', function(){ |
|
||||||
clearTimeout(timer[index]) |
|
||||||
timeEnd[index] = setTimeout(function(){ |
|
||||||
if(!othis.hasClass(NAV_TREE)){ |
|
||||||
bar.css({ |
|
||||||
width: 0 |
|
||||||
,left: bar.position().left + bar.width()/2 |
|
||||||
,opacity: 0 |
|
||||||
}); |
|
||||||
} |
|
||||||
}, TIME); |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
//展开子菜单
|
|
||||||
itemElem.find('a').each(function(){ |
|
||||||
var thisA = $(this) |
|
||||||
,parent = thisA.parent() |
|
||||||
,child = thisA.siblings('.'+NAV_CHILD); |
|
||||||
|
|
||||||
//输出小箭头
|
|
||||||
if(child[0] && !thisA.children('.'+NAV_MORE)[0]){ |
|
||||||
thisA.append('<i class="layui-icon '+ NAV_DOWN +' '+ NAV_MORE +'"></i>'); |
|
||||||
} |
|
||||||
|
|
||||||
thisA.off('click', call.clickThis).on('click', call.clickThis); //点击菜单
|
|
||||||
}); |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
//面包屑
|
|
||||||
,breadcrumb: function(){ |
|
||||||
var ELEM = '.layui-breadcrumb'; |
|
||||||
|
|
||||||
$(ELEM + elemFilter).each(function(){ |
|
||||||
var othis = $(this) |
|
||||||
,ATTE_SPR = 'lay-separator' |
|
||||||
,separator = othis.attr(ATTE_SPR) || '/' |
|
||||||
,aNode = othis.find('a'); |
|
||||||
if(aNode.next('span['+ ATTE_SPR +']')[0]) return; |
|
||||||
aNode.each(function(index){ |
|
||||||
if(index === aNode.length - 1) return; |
|
||||||
$(this).after('<span '+ ATTE_SPR +'>'+ separator +'</span>'); |
|
||||||
}); |
|
||||||
othis.css('visibility', 'visible'); |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
//进度条
|
|
||||||
,progress: function(){ |
|
||||||
var ELEM = 'layui-progress'; |
|
||||||
$('.' + ELEM + elemFilter).each(function(){ |
|
||||||
var othis = $(this) |
|
||||||
,elemBar = othis.find('.layui-progress-bar') |
|
||||||
,percent = elemBar.attr('lay-percent'); |
|
||||||
|
|
||||||
elemBar.css('width', function(){ |
|
||||||
return /^.+\/.+$/.test(percent) |
|
||||||
? (new Function('return '+ percent)() * 100) + '%' |
|
||||||
: percent; |
|
||||||
}()); |
|
||||||
|
|
||||||
if(othis.attr('lay-showPercent')){ |
|
||||||
setTimeout(function(){ |
|
||||||
elemBar.html('<span class="'+ ELEM +'-text">'+ percent +'</span>'); |
|
||||||
},350); |
|
||||||
} |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
//折叠面板
|
|
||||||
,collapse: function(){ |
|
||||||
var ELEM = 'layui-collapse'; |
|
||||||
|
|
||||||
$('.' + ELEM + elemFilter).each(function(){ |
|
||||||
var elemItem = $(this).find('.layui-colla-item') |
|
||||||
elemItem.each(function(){ |
|
||||||
var othis = $(this) |
|
||||||
,elemTitle = othis.find('.layui-colla-title') |
|
||||||
,elemCont = othis.find('.layui-colla-content') |
|
||||||
,isNone = elemCont.css('display') === 'none'; |
|
||||||
|
|
||||||
//初始状态
|
|
||||||
elemTitle.find('.layui-colla-icon').remove(); |
|
||||||
elemTitle.append('<i class="layui-icon layui-colla-icon">'+ (isNone ? '' : '') +'</i>'); |
|
||||||
|
|
||||||
//点击标题
|
|
||||||
elemTitle.off('click', call.collapse).on('click', call.collapse); |
|
||||||
}); |
|
||||||
|
|
||||||
}); |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
return items[type] ? items[type]() : layui.each(items, function(index, item){ |
|
||||||
item(); |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
Element.prototype.render = Element.prototype.init; |
|
||||||
|
|
||||||
var element = new Element(), dom = $(document); |
|
||||||
|
|
||||||
$(function(){ |
|
||||||
element.render(); |
|
||||||
}); |
|
||||||
|
|
||||||
var TITLE = '.layui-tab-title li'; |
|
||||||
dom.on('click', TITLE, call.tabClick); //Tab切换
|
|
||||||
dom.on('click', call.hideTabMore); //隐藏展开的Tab
|
|
||||||
$(window).on('resize', call.tabAuto); //自适应
|
|
||||||
|
|
||||||
exports(MOD_NAME, element); |
|
||||||
}); |
|
||||||
|
|
@ -1,179 +0,0 @@ |
|||||||
/** |
|
||||||
|
|
||||||
@Name flow 流加载组件 |
|
||||||
@License:MIT |
|
||||||
|
|
||||||
*/ |
|
||||||
|
|
||||||
|
|
||||||
layui.define('jquery', function(exports){ |
|
||||||
"use strict"; |
|
||||||
|
|
||||||
var $ = layui.$, Flow = function(options){} |
|
||||||
,ELEM_MORE = 'layui-flow-more' |
|
||||||
,ELEM_LOAD = '<i class="layui-anim layui-anim-rotate layui-anim-loop layui-icon "></i>'; |
|
||||||
|
|
||||||
//主方法
|
|
||||||
Flow.prototype.load = function(options){ |
|
||||||
var that = this, page = 0, lock, isOver, lazyimg, timer; |
|
||||||
options = options || {}; |
|
||||||
|
|
||||||
var elem = $(options.elem); if(!elem[0]) return; |
|
||||||
var scrollElem = $(options.scrollElem || document); //滚动条所在元素
|
|
||||||
var mb = options.mb || 50; //与底部的临界距离
|
|
||||||
var isAuto = 'isAuto' in options ? options.isAuto : true; //是否自动滚动加载
|
|
||||||
var end = options.end || '没有更多了'; //“末页”显示文案
|
|
||||||
|
|
||||||
//滚动条所在元素是否为document
|
|
||||||
var notDocment = options.scrollElem && options.scrollElem !== document; |
|
||||||
|
|
||||||
//加载更多
|
|
||||||
var ELEM_TEXT = '<cite>加载更多</cite>' |
|
||||||
,more = $('<div class="layui-flow-more"><a href="javascript:;">'+ ELEM_TEXT +'</a></div>'); |
|
||||||
|
|
||||||
if(!elem.find('.layui-flow-more')[0]){ |
|
||||||
elem.append(more); |
|
||||||
} |
|
||||||
|
|
||||||
//加载下一个元素
|
|
||||||
var next = function(html, over){ |
|
||||||
html = $(html); |
|
||||||
more.before(html); |
|
||||||
over = over == 0 ? true : null; |
|
||||||
over ? more.html(end) : more.find('a').html(ELEM_TEXT); |
|
||||||
isOver = over; |
|
||||||
lock = null; |
|
||||||
lazyimg && lazyimg(); |
|
||||||
}; |
|
||||||
|
|
||||||
//触发请求
|
|
||||||
var done = function(){ |
|
||||||
lock = true; |
|
||||||
more.find('a').html(ELEM_LOAD); |
|
||||||
typeof options.done === 'function' && options.done(++page, next); |
|
||||||
}; |
|
||||||
|
|
||||||
done(); |
|
||||||
|
|
||||||
//不自动滚动加载
|
|
||||||
more.find('a').on('click', function(){ |
|
||||||
var othis = $(this); |
|
||||||
if(isOver) return; |
|
||||||
lock || done(); |
|
||||||
}); |
|
||||||
|
|
||||||
//如果允许图片懒加载
|
|
||||||
if(options.isLazyimg){ |
|
||||||
var lazyimg = that.lazyimg({ |
|
||||||
elem: options.elem + ' img' |
|
||||||
,scrollElem: options.scrollElem |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
if(!isAuto) return that; |
|
||||||
|
|
||||||
scrollElem.on('scroll', function(){ |
|
||||||
var othis = $(this), top = othis.scrollTop(); |
|
||||||
|
|
||||||
if(timer) clearTimeout(timer); |
|
||||||
if(isOver || !elem.width()) return; //如果已经结束,或者元素处于隐藏状态,则不执行滚动加载
|
|
||||||
|
|
||||||
timer = setTimeout(function(){ |
|
||||||
//计算滚动所在容器的可视高度
|
|
||||||
var height = notDocment ? othis.height() : $(window).height(); |
|
||||||
|
|
||||||
//计算滚动所在容器的实际高度
|
|
||||||
var scrollHeight = notDocment |
|
||||||
? othis.prop('scrollHeight') |
|
||||||
: document.documentElement.scrollHeight; |
|
||||||
|
|
||||||
//临界点
|
|
||||||
if(scrollHeight - top - height <= mb){ |
|
||||||
lock || done(); |
|
||||||
} |
|
||||||
}, 100); |
|
||||||
}); |
|
||||||
|
|
||||||
return that; |
|
||||||
}; |
|
||||||
|
|
||||||
//图片懒加载
|
|
||||||
Flow.prototype.lazyimg = function(options){ |
|
||||||
var that = this, index = 0, haveScroll; |
|
||||||
options = options || {}; |
|
||||||
|
|
||||||
var scrollElem = $(options.scrollElem || document); //滚动条所在元素
|
|
||||||
var elem = options.elem || 'img'; |
|
||||||
|
|
||||||
//滚动条所在元素是否为document
|
|
||||||
var notDocment = options.scrollElem && options.scrollElem !== document; |
|
||||||
|
|
||||||
//显示图片
|
|
||||||
var show = function(item, height){ |
|
||||||
var start = scrollElem.scrollTop(), end = start + height; |
|
||||||
var elemTop = notDocment ? function(){ |
|
||||||
return item.offset().top - scrollElem.offset().top + start; |
|
||||||
}() : item.offset().top; |
|
||||||
|
|
||||||
/* 始终只加载在当前屏范围内的图片 */ |
|
||||||
if(elemTop >= start && elemTop <= end){ |
|
||||||
if(item.attr('lay-src')){ |
|
||||||
var src = item.attr('lay-src'); |
|
||||||
layui.img(src, function(){ |
|
||||||
var next = that.lazyimg.elem.eq(index); |
|
||||||
item.attr('src', src).removeAttr('lay-src'); |
|
||||||
|
|
||||||
/* 当前图片加载就绪后,检测下一个图片是否在当前屏 */ |
|
||||||
next[0] && render(next); |
|
||||||
index++; |
|
||||||
}, function(){ |
|
||||||
var next = that.lazyimg.elem.eq(index); |
|
||||||
item.removeAttr('lay-src'); |
|
||||||
}); |
|
||||||
} |
|
||||||
} |
|
||||||
}, render = function(othis, scroll){ |
|
||||||
|
|
||||||
//计算滚动所在容器的可视高度
|
|
||||||
var height = notDocment ? (scroll||scrollElem).height() : $(window).height(); |
|
||||||
var start = scrollElem.scrollTop(), end = start + height; |
|
||||||
|
|
||||||
that.lazyimg.elem = $(elem); |
|
||||||
|
|
||||||
if(othis){ |
|
||||||
show(othis, height); |
|
||||||
} else { |
|
||||||
//计算未加载过的图片
|
|
||||||
for(var i = 0; i < that.lazyimg.elem.length; i++){ |
|
||||||
var item = that.lazyimg.elem.eq(i), elemTop = notDocment ? function(){ |
|
||||||
return item.offset().top - scrollElem.offset().top + start; |
|
||||||
}() : item.offset().top; |
|
||||||
|
|
||||||
show(item, height); |
|
||||||
index = i; |
|
||||||
|
|
||||||
//如果图片的top坐标,超出了当前屏,则终止后续图片的遍历
|
|
||||||
if(elemTop > end) break; |
|
||||||
} |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
render(); |
|
||||||
|
|
||||||
if(!haveScroll){ |
|
||||||
var timer; |
|
||||||
scrollElem.on('scroll', function(){ |
|
||||||
var othis = $(this); |
|
||||||
if(timer) clearTimeout(timer) |
|
||||||
timer = setTimeout(function(){ |
|
||||||
render(null, othis); |
|
||||||
}, 50); |
|
||||||
}); |
|
||||||
haveScroll = true; |
|
||||||
} |
|
||||||
return render; |
|
||||||
}; |
|
||||||
|
|
||||||
//暴露接口
|
|
||||||
exports('flow', new Flow()); |
|
||||||
}); |
|
@ -1,742 +0,0 @@ |
|||||||
|
|
||||||
/*! |
|
||||||
* form 表单组件 |
|
||||||
* MIT Licensed |
|
||||||
*/ |
|
||||||
|
|
||||||
layui.define('layer', function(exports){ |
|
||||||
"use strict"; |
|
||||||
|
|
||||||
var $ = layui.$ |
|
||||||
,layer = layui.layer |
|
||||||
,hint = layui.hint() |
|
||||||
,device = layui.device() |
|
||||||
|
|
||||||
,MOD_NAME = 'form', ELEM = '.layui-form', THIS = 'layui-this' |
|
||||||
,SHOW = 'layui-show', HIDE = 'layui-hide', DISABLED = 'layui-disabled' |
|
||||||
|
|
||||||
,Form = function(){ |
|
||||||
this.config = { |
|
||||||
verify: { |
|
||||||
required: [ |
|
||||||
/[\S]+/ |
|
||||||
,'必填项不能为空' |
|
||||||
] |
|
||||||
,phone: [ |
|
||||||
/^1\d{10}$/ |
|
||||||
,'请输入正确的手机号' |
|
||||||
] |
|
||||||
,email: [ |
|
||||||
/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/ |
|
||||||
,'邮箱格式不正确' |
|
||||||
] |
|
||||||
,url: [ |
|
||||||
/^(#|(http(s?)):\/\/|\/\/)[^\s]+\.[^\s]+$/ |
|
||||||
,'链接格式不正确' |
|
||||||
] |
|
||||||
,number: function(value){ |
|
||||||
if(!value || isNaN(value)) return '只能填写数字' |
|
||||||
} |
|
||||||
,date: [ |
|
||||||
/^(\d{4})[-\/](\d{1}|0\d{1}|1[0-2])([-\/](\d{1}|0\d{1}|[1-2][0-9]|3[0-1]))*$/ |
|
||||||
,'日期格式不正确' |
|
||||||
] |
|
||||||
,identity: [ |
|
||||||
/(^\d{15}$)|(^\d{17}(x|X|\d)$)/ |
|
||||||
,'请输入正确的身份证号' |
|
||||||
] |
|
||||||
} |
|
||||||
,autocomplete: null //全局 autocomplete 状态。null 表示不干预
|
|
||||||
}; |
|
||||||
}; |
|
||||||
|
|
||||||
//全局设置
|
|
||||||
Form.prototype.set = function(options){ |
|
||||||
var that = this; |
|
||||||
$.extend(true, that.config, options); |
|
||||||
return that; |
|
||||||
}; |
|
||||||
|
|
||||||
//验证规则设定
|
|
||||||
Form.prototype.verify = function(settings){ |
|
||||||
var that = this; |
|
||||||
$.extend(true, that.config.verify, settings); |
|
||||||
return that; |
|
||||||
}; |
|
||||||
|
|
||||||
//表单事件
|
|
||||||
Form.prototype.on = function(events, callback){ |
|
||||||
return layui.onevent.call(this, MOD_NAME, events, callback); |
|
||||||
}; |
|
||||||
|
|
||||||
//赋值/取值
|
|
||||||
Form.prototype.val = function(filter, object){ |
|
||||||
var that = this |
|
||||||
,formElem = $(ELEM + '[lay-filter="' + filter +'"]'); |
|
||||||
|
|
||||||
//遍历
|
|
||||||
formElem.each(function(index, item){ |
|
||||||
var itemForm = $(this); |
|
||||||
|
|
||||||
//赋值
|
|
||||||
layui.each(object, function(key, value){ |
|
||||||
var itemElem = itemForm.find('[name="'+ key +'"]') |
|
||||||
,type; |
|
||||||
|
|
||||||
//如果对应的表单不存在,则不执行
|
|
||||||
if(!itemElem[0]) return; |
|
||||||
type = itemElem[0].type; |
|
||||||
|
|
||||||
//如果为复选框
|
|
||||||
if(type === 'checkbox'){ |
|
||||||
itemElem[0].checked = value; |
|
||||||
} else if(type === 'radio') { //如果为单选框
|
|
||||||
itemElem.each(function(){ |
|
||||||
if(this.value == value ){ |
|
||||||
this.checked = true |
|
||||||
} |
|
||||||
}); |
|
||||||
} else { //其它类型的表单
|
|
||||||
itemElem.val(value); |
|
||||||
} |
|
||||||
}); |
|
||||||
}); |
|
||||||
|
|
||||||
form.render(null, filter); |
|
||||||
|
|
||||||
//返回值
|
|
||||||
return that.getValue(filter); |
|
||||||
}; |
|
||||||
|
|
||||||
//取值
|
|
||||||
Form.prototype.getValue = function(filter, itemForm){ |
|
||||||
itemForm = itemForm || $(ELEM + '[lay-filter="' + filter +'"]').eq(0); |
|
||||||
|
|
||||||
var nameIndex = {} //数组 name 索引
|
|
||||||
,field = {} |
|
||||||
,fieldElem = itemForm.find('input,select,textarea') //获取所有表单域
|
|
||||||
|
|
||||||
layui.each(fieldElem, function(_, item){ |
|
||||||
var othis = $(this) |
|
||||||
,init_name; //初始 name
|
|
||||||
|
|
||||||
item.name = (item.name || '').replace(/^\s*|\s*&/, ''); |
|
||||||
if(!item.name) return; |
|
||||||
|
|
||||||
//用于支持数组 name
|
|
||||||
if(/^.*\[\]$/.test(item.name)){ |
|
||||||
var key = item.name.match(/^(.*)\[\]$/g)[0]; |
|
||||||
nameIndex[key] = nameIndex[key] | 0; |
|
||||||
init_name = item.name.replace(/^(.*)\[\]$/, '$1['+ (nameIndex[key]++) +']'); |
|
||||||
} |
|
||||||
|
|
||||||
if(/^checkbox|radio$/.test(item.type) && !item.checked) return; //复选框和单选框未选中,不记录字段
|
|
||||||
field[init_name || item.name] = item.value; |
|
||||||
}); |
|
||||||
|
|
||||||
return field; |
|
||||||
}; |
|
||||||
|
|
||||||
//表单控件渲染
|
|
||||||
Form.prototype.render = function(type, filter){ |
|
||||||
var that = this |
|
||||||
,options = that.config |
|
||||||
,elemForm = $(ELEM + function(){ |
|
||||||
return filter ? ('[lay-filter="' + filter +'"]') : ''; |
|
||||||
}()) |
|
||||||
,items = { |
|
||||||
//输入框
|
|
||||||
input: function(){ |
|
||||||
var inputs = elemForm.find('input,textarea'); |
|
||||||
|
|
||||||
//初始化全局的 autocomplete
|
|
||||||
options.autocomplete && inputs.attr('autocomplete', options.autocomplete); |
|
||||||
} |
|
||||||
|
|
||||||
//下拉选择框
|
|
||||||
,select: function(){ |
|
||||||
var TIPS = '请选择', CLASS = 'layui-form-select', TITLE = 'layui-select-title' |
|
||||||
,NONE = 'layui-select-none', initValue = '', thatInput |
|
||||||
,selects = elemForm.find('select') |
|
||||||
|
|
||||||
//隐藏 select
|
|
||||||
,hide = function(e, clear){ |
|
||||||
if(!$(e.target).parent().hasClass(TITLE) || clear){ |
|
||||||
$('.'+CLASS).removeClass(CLASS+'ed ' + CLASS+'up'); |
|
||||||
thatInput && initValue && thatInput.val(initValue); |
|
||||||
} |
|
||||||
thatInput = null; |
|
||||||
} |
|
||||||
|
|
||||||
//各种事件
|
|
||||||
,events = function(reElem, disabled, isSearch){ |
|
||||||
var select = $(this) |
|
||||||
,title = reElem.find('.' + TITLE) |
|
||||||
,input = title.find('input') |
|
||||||
,dl = reElem.find('dl') |
|
||||||
,dds = dl.children('dd') |
|
||||||
,index = this.selectedIndex //当前选中的索引
|
|
||||||
,nearElem; //select 组件当前选中的附近元素,用于辅助快捷键功能
|
|
||||||
|
|
||||||
if(disabled) return; |
|
||||||
|
|
||||||
//展开下拉
|
|
||||||
var showDown = function(){ |
|
||||||
var top = reElem.offset().top + reElem.outerHeight() + 5 - $win.scrollTop() |
|
||||||
,dlHeight = dl.outerHeight(); |
|
||||||
|
|
||||||
index = select[0].selectedIndex; //获取最新的 selectedIndex
|
|
||||||
reElem.addClass(CLASS+'ed'); |
|
||||||
dds.removeClass(HIDE); |
|
||||||
nearElem = null; |
|
||||||
|
|
||||||
//初始选中样式
|
|
||||||
dds.eq(index).addClass(THIS).siblings().removeClass(THIS); |
|
||||||
|
|
||||||
//上下定位识别
|
|
||||||
if(top + dlHeight > $win.height() && top >= dlHeight){ |
|
||||||
reElem.addClass(CLASS + 'up'); |
|
||||||
} |
|
||||||
|
|
||||||
followScroll(); |
|
||||||
} |
|
||||||
|
|
||||||
//隐藏下拉
|
|
||||||
,hideDown = function(choose){ |
|
||||||
reElem.removeClass(CLASS+'ed ' + CLASS+'up'); |
|
||||||
input.blur(); |
|
||||||
nearElem = null; |
|
||||||
|
|
||||||
if(choose) return; |
|
||||||
|
|
||||||
notOption(input.val(), function(none){ |
|
||||||
var selectedIndex = select[0].selectedIndex; |
|
||||||
|
|
||||||
//未查询到相关值
|
|
||||||
if(none){ |
|
||||||
initValue = $(select[0].options[selectedIndex]).html(); //重新获得初始选中值
|
|
||||||
|
|
||||||
//如果是第一项,且文本值等于 placeholder,则清空初始值
|
|
||||||
if(selectedIndex === 0 && initValue === input.attr('placeholder')){ |
|
||||||
initValue = ''; |
|
||||||
}; |
|
||||||
|
|
||||||
//如果有选中值,则将输入框纠正为该值。否则清空输入框
|
|
||||||
input.val(initValue || ''); |
|
||||||
} |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
//定位下拉滚动条
|
|
||||||
,followScroll = function(){ |
|
||||||
var thisDd = dl.children('dd.'+ THIS); |
|
||||||
|
|
||||||
if(!thisDd[0]) return; |
|
||||||
|
|
||||||
var posTop = thisDd.position().top |
|
||||||
,dlHeight = dl.height() |
|
||||||
,ddHeight = thisDd.height(); |
|
||||||
|
|
||||||
//若选中元素在滚动条不可见底部
|
|
||||||
if(posTop > dlHeight){ |
|
||||||
dl.scrollTop(posTop + dl.scrollTop() - dlHeight + ddHeight - 5); |
|
||||||
} |
|
||||||
|
|
||||||
//若选择玄素在滚动条不可见顶部
|
|
||||||
if(posTop < 0){ |
|
||||||
dl.scrollTop(posTop + dl.scrollTop() - 5); |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
//点击标题区域
|
|
||||||
title.on('click', function(e){ |
|
||||||
reElem.hasClass(CLASS+'ed') ? ( |
|
||||||
hideDown() |
|
||||||
) : ( |
|
||||||
hide(e, true), |
|
||||||
showDown() |
|
||||||
); |
|
||||||
dl.find('.'+NONE).remove(); |
|
||||||
}); |
|
||||||
|
|
||||||
//点击箭头获取焦点
|
|
||||||
title.find('.layui-edge').on('click', function(){ |
|
||||||
input.focus(); |
|
||||||
}); |
|
||||||
|
|
||||||
//select 中 input 键盘事件
|
|
||||||
input.on('keyup', function(e){ //键盘松开
|
|
||||||
var keyCode = e.keyCode; |
|
||||||
|
|
||||||
//Tab键展开
|
|
||||||
if(keyCode === 9){ |
|
||||||
showDown(); |
|
||||||
} |
|
||||||
}).on('keydown', function(e){ //键盘按下
|
|
||||||
var keyCode = e.keyCode; |
|
||||||
|
|
||||||
//Tab键隐藏
|
|
||||||
if(keyCode === 9){ |
|
||||||
hideDown(); |
|
||||||
} |
|
||||||
|
|
||||||
//标注 dd 的选中状态
|
|
||||||
var setThisDd = function(prevNext, thisElem1){ |
|
||||||
var nearDd, cacheNearElem |
|
||||||
e.preventDefault(); |
|
||||||
|
|
||||||
//得到当前队列元素
|
|
||||||
var thisElem = function(){ |
|
||||||
var thisDd = dl.children('dd.'+ THIS); |
|
||||||
|
|
||||||
//如果是搜索状态,且按 Down 键,且当前可视 dd 元素在选中元素之前,
|
|
||||||
//则将当前可视 dd 元素的上一个元素作为虚拟的当前选中元素,以保证递归不中断
|
|
||||||
if(dl.children('dd.'+ HIDE)[0] && prevNext === 'next'){ |
|
||||||
var showDd = dl.children('dd:not(.'+ HIDE +',.'+ DISABLED +')') |
|
||||||
,firstIndex = showDd.eq(0).index(); |
|
||||||
if(firstIndex >=0 && firstIndex < thisDd.index() && !showDd.hasClass(THIS)){ |
|
||||||
return showDd.eq(0).prev()[0] ? showDd.eq(0).prev() : dl.children(':last'); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
if(thisElem1 && thisElem1[0]){ |
|
||||||
return thisElem1; |
|
||||||
} |
|
||||||
if(nearElem && nearElem[0]){ |
|
||||||
return nearElem; |
|
||||||
} |
|
||||||
|
|
||||||
return thisDd; |
|
||||||
//return dds.eq(index);
|
|
||||||
}(); |
|
||||||
|
|
||||||
cacheNearElem = thisElem[prevNext](); //当前元素的附近元素
|
|
||||||
nearDd = thisElem[prevNext]('dd:not(.'+ HIDE +')'); //当前可视元素的 dd 元素
|
|
||||||
|
|
||||||
//如果附近的元素不存在,则停止执行,并清空 nearElem
|
|
||||||
if(!cacheNearElem[0]) return nearElem = null; |
|
||||||
|
|
||||||
//记录附近的元素,让其成为下一个当前元素
|
|
||||||
nearElem = thisElem[prevNext](); |
|
||||||
|
|
||||||
//如果附近不是 dd ,或者附近的 dd 元素是禁用状态,则进入递归查找
|
|
||||||
if((!nearDd[0] || nearDd.hasClass(DISABLED)) && nearElem[0]){ |
|
||||||
return setThisDd(prevNext, nearElem); |
|
||||||
} |
|
||||||
|
|
||||||
nearDd.addClass(THIS).siblings().removeClass(THIS); //标注样式
|
|
||||||
followScroll(); //定位滚动条
|
|
||||||
}; |
|
||||||
|
|
||||||
if(keyCode === 38) setThisDd('prev'); //Up 键
|
|
||||||
if(keyCode === 40) setThisDd('next'); //Down 键
|
|
||||||
|
|
||||||
//Enter 键
|
|
||||||
if(keyCode === 13){ |
|
||||||
e.preventDefault(); |
|
||||||
dl.children('dd.'+THIS).trigger('click'); |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
//检测值是否不属于 select 项
|
|
||||||
var notOption = function(value, callback, origin){ |
|
||||||
var num = 0; |
|
||||||
layui.each(dds, function(){ |
|
||||||
var othis = $(this) |
|
||||||
,text = othis.text() |
|
||||||
,not = text.indexOf(value) === -1; |
|
||||||
if(value === '' || (origin === 'blur') ? value !== text : not) num++; |
|
||||||
origin === 'keyup' && othis[not ? 'addClass' : 'removeClass'](HIDE); |
|
||||||
}); |
|
||||||
var none = num === dds.length; |
|
||||||
return callback(none), none; |
|
||||||
}; |
|
||||||
|
|
||||||
//搜索匹配
|
|
||||||
var search = function(e){ |
|
||||||
var value = this.value, keyCode = e.keyCode; |
|
||||||
|
|
||||||
if(keyCode === 9 || keyCode === 13 |
|
||||||
|| keyCode === 37 || keyCode === 38 |
|
||||||
|| keyCode === 39 || keyCode === 40 |
|
||||||
){ |
|
||||||
return false; |
|
||||||
} |
|
||||||
|
|
||||||
notOption(value, function(none){ |
|
||||||
if(none){ |
|
||||||
dl.find('.'+NONE)[0] || dl.append('<p class="'+ NONE +'">无匹配项</p>'); |
|
||||||
} else { |
|
||||||
dl.find('.'+NONE).remove(); |
|
||||||
} |
|
||||||
}, 'keyup'); |
|
||||||
|
|
||||||
if(value === ''){ |
|
||||||
dl.find('.'+NONE).remove(); |
|
||||||
} |
|
||||||
|
|
||||||
followScroll(); //定位滚动条
|
|
||||||
}; |
|
||||||
|
|
||||||
if(isSearch){ |
|
||||||
input.on('keyup', search).on('blur', function(e){ |
|
||||||
var selectedIndex = select[0].selectedIndex; |
|
||||||
|
|
||||||
thatInput = input; //当前的 select 中的 input 元素
|
|
||||||
initValue = $(select[0].options[selectedIndex]).html(); //重新获得初始选中值
|
|
||||||
|
|
||||||
//如果是第一项,且文本值等于 placeholder,则清空初始值
|
|
||||||
if(selectedIndex === 0 && initValue === input.attr('placeholder')){ |
|
||||||
initValue = ''; |
|
||||||
}; |
|
||||||
|
|
||||||
setTimeout(function(){ |
|
||||||
notOption(input.val(), function(none){ |
|
||||||
initValue || input.val(''); //none && !initValue
|
|
||||||
}, 'blur'); |
|
||||||
}, 200); |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
//选择
|
|
||||||
dds.on('click', function(){ |
|
||||||
var othis = $(this), value = othis.attr('lay-value'); |
|
||||||
var filter = select.attr('lay-filter'); //获取过滤器
|
|
||||||
|
|
||||||
if(othis.hasClass(DISABLED)) return false; |
|
||||||
|
|
||||||
if(othis.hasClass('layui-select-tips')){ |
|
||||||
input.val(''); |
|
||||||
} else { |
|
||||||
input.val(othis.text()); |
|
||||||
othis.addClass(THIS); |
|
||||||
} |
|
||||||
|
|
||||||
othis.siblings().removeClass(THIS); |
|
||||||
select.val(value).removeClass('layui-form-danger') |
|
||||||
layui.event.call(this, MOD_NAME, 'select('+ filter +')', { |
|
||||||
elem: select[0] |
|
||||||
,value: value |
|
||||||
,othis: reElem |
|
||||||
}); |
|
||||||
|
|
||||||
hideDown(true); |
|
||||||
return false; |
|
||||||
}); |
|
||||||
|
|
||||||
reElem.find('dl>dt').on('click', function(e){ |
|
||||||
return false; |
|
||||||
}); |
|
||||||
|
|
||||||
$(document).off('click', hide).on('click', hide); //点击其它元素关闭 select
|
|
||||||
} |
|
||||||
|
|
||||||
selects.each(function(index, select){ |
|
||||||
var othis = $(this) |
|
||||||
,hasRender = othis.next('.'+CLASS) |
|
||||||
,disabled = this.disabled |
|
||||||
,value = select.value |
|
||||||
,selected = $(select.options[select.selectedIndex]) //获取当前选中项
|
|
||||||
,optionsFirst = select.options[0]; |
|
||||||
|
|
||||||
if(typeof othis.attr('lay-ignore') === 'string') return othis.show(); |
|
||||||
|
|
||||||
var isSearch = typeof othis.attr('lay-search') === 'string' |
|
||||||
,placeholder = optionsFirst ? ( |
|
||||||
optionsFirst.value ? TIPS : (optionsFirst.innerHTML || TIPS) |
|
||||||
) : TIPS; |
|
||||||
|
|
||||||
//替代元素
|
|
||||||
var reElem = $(['<div class="'+ (isSearch ? '' : 'layui-unselect ') + CLASS |
|
||||||
,(disabled ? ' layui-select-disabled' : '') +'">' |
|
||||||
,'<div class="'+ TITLE +'">' |
|
||||||
,('<input type="text" placeholder="'+ $.trim(placeholder) +'" ' |
|
||||||
+('value="'+ $.trim(value ? selected.html() : '') +'"') //默认值
|
|
||||||
+((!disabled && isSearch) ? '' : ' readonly') //是否开启搜索
|
|
||||||
+' class="layui-input' |
|
||||||
+(isSearch ? '' : ' layui-unselect') |
|
||||||
+ (disabled ? (' ' + DISABLED) : '') +'">') //禁用状态
|
|
||||||
,'<i class="layui-edge"></i></div>' |
|
||||||
,'<dl class="layui-anim layui-anim-upbit'+ (othis.find('optgroup')[0] ? ' layui-select-group' : '') +'">' |
|
||||||
,function(options){ |
|
||||||
var arr = []; |
|
||||||
layui.each(options, function(index, item){ |
|
||||||
if(index === 0 && !item.value){ |
|
||||||
arr.push('<dd lay-value="" class="layui-select-tips">'+ $.trim(item.innerHTML || TIPS) +'</dd>'); |
|
||||||
} else if(item.tagName.toLowerCase() === 'optgroup'){ |
|
||||||
arr.push('<dt>'+ item.label +'</dt>'); |
|
||||||
} else { |
|
||||||
arr.push('<dd lay-value="'+ item.value +'" class="'+ (value === item.value ? THIS : '') + (item.disabled ? (' '+DISABLED) : '') +'">'+ $.trim(item.innerHTML) +'</dd>'); |
|
||||||
} |
|
||||||
}); |
|
||||||
arr.length === 0 && arr.push('<dd lay-value="" class="'+ DISABLED +'">没有选项</dd>'); |
|
||||||
return arr.join(''); |
|
||||||
}(othis.find('*')) +'</dl>' |
|
||||||
,'</div>'].join('')); |
|
||||||
|
|
||||||
hasRender[0] && hasRender.remove(); //如果已经渲染,则Rerender
|
|
||||||
othis.after(reElem); |
|
||||||
events.call(this, reElem, disabled, isSearch); |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
//复选框/开关
|
|
||||||
,checkbox: function(){ |
|
||||||
var CLASS = { |
|
||||||
checkbox: ['layui-form-checkbox', 'layui-form-checked', 'checkbox'] |
|
||||||
,_switch: ['layui-form-switch', 'layui-form-onswitch', 'switch'] |
|
||||||
} |
|
||||||
,checks = elemForm.find('input[type=checkbox]') |
|
||||||
|
|
||||||
,events = function(reElem, RE_CLASS){ |
|
||||||
var check = $(this); |
|
||||||
|
|
||||||
//勾选
|
|
||||||
reElem.on('click', function(){ |
|
||||||
var filter = check.attr('lay-filter') //获取过滤器
|
|
||||||
,text = (check.attr('lay-text')||'').split('|'); |
|
||||||
|
|
||||||
if(check[0].disabled) return; |
|
||||||
|
|
||||||
check[0].checked ? ( |
|
||||||
check[0].checked = false |
|
||||||
,reElem.removeClass(RE_CLASS[1]).find('em').text(text[1]) |
|
||||||
) : ( |
|
||||||
check[0].checked = true |
|
||||||
,reElem.addClass(RE_CLASS[1]).find('em').text(text[0]) |
|
||||||
); |
|
||||||
|
|
||||||
layui.event.call(check[0], MOD_NAME, RE_CLASS[2]+'('+ filter +')', { |
|
||||||
elem: check[0] |
|
||||||
,value: check[0].value |
|
||||||
,othis: reElem |
|
||||||
}); |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
checks.each(function(index, check){ |
|
||||||
var othis = $(this), skin = othis.attr('lay-skin') |
|
||||||
,text = (othis.attr('lay-text') || '').split('|'), disabled = this.disabled; |
|
||||||
if(skin === 'switch') skin = '_'+skin; |
|
||||||
var RE_CLASS = CLASS[skin] || CLASS.checkbox; |
|
||||||
|
|
||||||
if(typeof othis.attr('lay-ignore') === 'string') return othis.show(); |
|
||||||
|
|
||||||
//替代元素
|
|
||||||
var hasRender = othis.next('.' + RE_CLASS[0]) |
|
||||||
,reElem = $(['<div class="layui-unselect '+ RE_CLASS[0] |
|
||||||
,(check.checked ? (' '+ RE_CLASS[1]) : '') //选中状态
|
|
||||||
,(disabled ? ' layui-checkbox-disabled '+ DISABLED : '') //禁用状态
|
|
||||||
,'"' |
|
||||||
,(skin ? ' lay-skin="'+ skin +'"' : '') //风格
|
|
||||||
,'>' |
|
||||||
,function(){ //不同风格的内容
|
|
||||||
var title = check.title.replace(/\s/g, '') |
|
||||||
,type = { |
|
||||||
//复选框
|
|
||||||
checkbox: [ |
|
||||||
(title ? ('<span>'+ check.title +'</span>') : '') |
|
||||||
,'<i class="layui-icon layui-icon-ok"></i>' |
|
||||||
].join('') |
|
||||||
|
|
||||||
//开关
|
|
||||||
,_switch: '<em>'+ ((check.checked ? text[0] : text[1]) || '') +'</em><i></i>' |
|
||||||
}; |
|
||||||
return type[skin] || type['checkbox']; |
|
||||||
}() |
|
||||||
,'</div>'].join('')); |
|
||||||
|
|
||||||
hasRender[0] && hasRender.remove(); //如果已经渲染,则Rerender
|
|
||||||
othis.after(reElem); |
|
||||||
events.call(this, reElem, RE_CLASS); |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
//单选框
|
|
||||||
,radio: function(){ |
|
||||||
var CLASS = 'layui-form-radio', ICON = ['', ''] |
|
||||||
,radios = elemForm.find('input[type=radio]') |
|
||||||
|
|
||||||
,events = function(reElem){ |
|
||||||
var radio = $(this), ANIM = 'layui-anim-scaleSpring'; |
|
||||||
|
|
||||||
reElem.on('click', function(){ |
|
||||||
var name = radio[0].name, forms = radio.parents(ELEM); |
|
||||||
var filter = radio.attr('lay-filter'); //获取过滤器
|
|
||||||
var sameRadio = forms.find('input[name='+ name.replace(/(\.|#|\[|\])/g, '\\$1') +']'); //找到相同name的兄弟
|
|
||||||
|
|
||||||
if(radio[0].disabled) return; |
|
||||||
|
|
||||||
layui.each(sameRadio, function(){ |
|
||||||
var next = $(this).next('.'+CLASS); |
|
||||||
this.checked = false; |
|
||||||
next.removeClass(CLASS+'ed'); |
|
||||||
next.find('.layui-icon').removeClass(ANIM).html(ICON[1]); |
|
||||||
}); |
|
||||||
|
|
||||||
radio[0].checked = true; |
|
||||||
reElem.addClass(CLASS+'ed'); |
|
||||||
reElem.find('.layui-icon').addClass(ANIM).html(ICON[0]); |
|
||||||
|
|
||||||
layui.event.call(radio[0], MOD_NAME, 'radio('+ filter +')', { |
|
||||||
elem: radio[0] |
|
||||||
,value: radio[0].value |
|
||||||
,othis: reElem |
|
||||||
}); |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
radios.each(function(index, radio){ |
|
||||||
var othis = $(this), hasRender = othis.next('.' + CLASS), disabled = this.disabled; |
|
||||||
|
|
||||||
if(typeof othis.attr('lay-ignore') === 'string') return othis.show(); |
|
||||||
hasRender[0] && hasRender.remove(); //如果已经渲染,则Rerender
|
|
||||||
|
|
||||||
//替代元素
|
|
||||||
var reElem = $(['<div class="layui-unselect '+ CLASS |
|
||||||
,(radio.checked ? (' '+CLASS+'ed') : '') //选中状态
|
|
||||||
,(disabled ? ' layui-radio-disabled '+DISABLED : '') +'">' //禁用状态
|
|
||||||
,'<i class="layui-anim layui-icon">'+ ICON[radio.checked ? 0 : 1] +'</i>' |
|
||||||
,'<div>'+ function(){ |
|
||||||
var title = radio.title || ''; |
|
||||||
if(typeof othis.next().attr('lay-radio') === 'string'){ |
|
||||||
title = othis.next().html(); |
|
||||||
//othis.next().remove();
|
|
||||||
} |
|
||||||
return title |
|
||||||
}() +'</div>' |
|
||||||
,'</div>'].join('')); |
|
||||||
|
|
||||||
othis.after(reElem); |
|
||||||
events.call(this, reElem); |
|
||||||
}); |
|
||||||
} |
|
||||||
}; |
|
||||||
type ? ( |
|
||||||
items[type] ? items[type]() : hint.error('不支持的 "'+ type + '" 表单渲染') |
|
||||||
) : layui.each(items, function(index, item){ |
|
||||||
item(); |
|
||||||
}); |
|
||||||
return that; |
|
||||||
}; |
|
||||||
|
|
||||||
//表单提交校验
|
|
||||||
var submit = function(){ |
|
||||||
var stop = null //验证不通过状态
|
|
||||||
,verify = form.config.verify //验证规则
|
|
||||||
,DANGER = 'layui-form-danger' //警示样式
|
|
||||||
,field = {} //字段集合
|
|
||||||
,button = $(this) //当前触发的按钮
|
|
||||||
,elem = button.parents(ELEM).eq(0) //当前所在表单域
|
|
||||||
,verifyElem = elem.find('*[lay-verify]') //获取需要校验的元素
|
|
||||||
,formElem = button.parents('form')[0] //获取当前所在的 form 元素,如果存在的话
|
|
||||||
,filter = button.attr('lay-filter'); //获取过滤器
|
|
||||||
|
|
||||||
|
|
||||||
//开始校验
|
|
||||||
layui.each(verifyElem, function(_, item){ |
|
||||||
var othis = $(this) |
|
||||||
,vers = othis.attr('lay-verify').split('|') |
|
||||||
,verType = othis.attr('lay-verType') //提示方式
|
|
||||||
,value = othis.val(); |
|
||||||
|
|
||||||
othis.removeClass(DANGER); //移除警示样式
|
|
||||||
|
|
||||||
//遍历元素绑定的验证规则
|
|
||||||
layui.each(vers, function(_, thisVer){ |
|
||||||
var isTrue //是否命中校验
|
|
||||||
,errorText = '' //错误提示文本
|
|
||||||
,isFn = typeof verify[thisVer] === 'function'; |
|
||||||
|
|
||||||
//匹配验证规则
|
|
||||||
if(verify[thisVer]){ |
|
||||||
var isTrue = isFn ? errorText = verify[thisVer](value, item) : !verify[thisVer][0].test(value) |
|
||||||
//是否属于美化替换后的表单元素
|
|
||||||
,isForm2Elem = item.tagName.toLowerCase() === 'select' || /^checkbox|radio$/.test(item.type); |
|
||||||
|
|
||||||
errorText = errorText || verify[thisVer][1]; |
|
||||||
|
|
||||||
if(thisVer === 'required'){ |
|
||||||
errorText = othis.attr('lay-reqText') || errorText; |
|
||||||
} |
|
||||||
|
|
||||||
//如果是必填项或者非空命中校验,则阻止提交,弹出提示
|
|
||||||
if(isTrue){ |
|
||||||
//提示层风格
|
|
||||||
if(verType === 'tips'){ |
|
||||||
layer.tips(errorText, function(){ |
|
||||||
if(typeof othis.attr('lay-ignore') !== 'string'){ |
|
||||||
if(isForm2Elem){ |
|
||||||
return othis.next(); |
|
||||||
} |
|
||||||
} |
|
||||||
return othis; |
|
||||||
}(), {tips: 1}); |
|
||||||
} else if(verType === 'alert') { |
|
||||||
layer.alert(errorText, {title: '提示', shadeClose: true}); |
|
||||||
} |
|
||||||
//如果返回的为字符或数字,则自动弹出默认提示框;否则由 verify 方法中处理提示
|
|
||||||
else if(/\bstring|number\b/.test(typeof errorText)){ |
|
||||||
layer.msg(errorText, {icon: 5, shift: 6}); |
|
||||||
} |
|
||||||
|
|
||||||
//非移动设备自动定位焦点
|
|
||||||
if(!device.mobile){ |
|
||||||
setTimeout(function(){ |
|
||||||
(isForm2Elem ? othis.next().find('input') : item).focus(); |
|
||||||
}, 7); |
|
||||||
} else { //移动设备定位
|
|
||||||
$dom.scrollTop(function(){ |
|
||||||
try { |
|
||||||
return (isForm2Elem ? othis.next() : othis).offset().top - 15 |
|
||||||
} catch(e){ |
|
||||||
return 0; |
|
||||||
} |
|
||||||
}()); |
|
||||||
} |
|
||||||
|
|
||||||
othis.addClass(DANGER); |
|
||||||
return stop = true; |
|
||||||
} |
|
||||||
} |
|
||||||
}); |
|
||||||
if(stop) return stop; |
|
||||||
}); |
|
||||||
|
|
||||||
if(stop) return false; |
|
||||||
|
|
||||||
//获取当前表单值
|
|
||||||
field = form.getValue(null, elem); |
|
||||||
|
|
||||||
//返回字段
|
|
||||||
return layui.event.call(this, MOD_NAME, 'submit('+ filter +')', { |
|
||||||
elem: this |
|
||||||
,form: formElem |
|
||||||
,field: field |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
//自动完成渲染
|
|
||||||
var form = new Form() |
|
||||||
,$dom = $(document), $win = $(window); |
|
||||||
|
|
||||||
$(function(){ |
|
||||||
form.render(); |
|
||||||
}); |
|
||||||
|
|
||||||
//表单reset重置渲染
|
|
||||||
$dom.on('reset', ELEM, function(){ |
|
||||||
var filter = $(this).attr('lay-filter'); |
|
||||||
setTimeout(function(){ |
|
||||||
form.render(null, filter); |
|
||||||
}, 50); |
|
||||||
}); |
|
||||||
|
|
||||||
//表单提交事件
|
|
||||||
$dom.on('submit', ELEM, submit) |
|
||||||
.on('click', '*[lay-submit]', submit); |
|
||||||
|
|
||||||
exports(MOD_NAME, form); |
|
||||||
}); |
|
||||||
|
|
||||||
|
|
@ -1,418 +0,0 @@ |
|||||||
|
|
||||||
/*! lay 基础 DOM 操作 | MIT Licensed */ |
|
||||||
|
|
||||||
;!function(window){ //gulp build: lay-header
|
|
||||||
"use strict"; |
|
||||||
|
|
||||||
var MOD_NAME = 'lay' //模块名
|
|
||||||
,document = window.document |
|
||||||
|
|
||||||
//DOM查找
|
|
||||||
,lay = function(selector){ |
|
||||||
return new LAY(selector); |
|
||||||
} |
|
||||||
|
|
||||||
//DOM构造器
|
|
||||||
,LAY = function(selector){ |
|
||||||
var index = 0 |
|
||||||
,nativeDOM = typeof selector === 'object' ? [selector] : ( |
|
||||||
this.selector = selector |
|
||||||
,document.querySelectorAll(selector || null) |
|
||||||
); |
|
||||||
for(; index < nativeDOM.length; index++){ |
|
||||||
this.push(nativeDOM[index]); |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
/* |
|
||||||
lay 对象操作 |
|
||||||
*/ |
|
||||||
|
|
||||||
LAY.prototype = []; |
|
||||||
LAY.prototype.constructor = LAY; |
|
||||||
|
|
||||||
//普通对象深度扩展
|
|
||||||
lay.extend = function(){ |
|
||||||
var ai = 1, args = arguments |
|
||||||
,clone = function(target, obj){ |
|
||||||
target = target || (layui._typeof(obj) === 'array' ? [] : {}); //目标对象
|
|
||||||
for(var i in obj){ |
|
||||||
//如果值为普通对象,则进入递归,继续深度合并
|
|
||||||
target[i] = (obj[i] && obj[i].constructor === Object) |
|
||||||
? clone(target[i], obj[i]) |
|
||||||
: obj[i]; |
|
||||||
} |
|
||||||
return target; |
|
||||||
} |
|
||||||
|
|
||||||
args[0] = typeof args[0] === 'object' ? args[0] : {}; |
|
||||||
|
|
||||||
for(; ai < args.length; ai++){ |
|
||||||
if(typeof args[ai] === 'object'){ |
|
||||||
clone(args[0], args[ai]); |
|
||||||
} |
|
||||||
} |
|
||||||
return args[0]; |
|
||||||
}; |
|
||||||
|
|
||||||
//lay 模块版本
|
|
||||||
lay.v = '1.0.8'; |
|
||||||
|
|
||||||
//ie版本
|
|
||||||
lay.ie = function(){ |
|
||||||
var agent = navigator.userAgent.toLowerCase(); |
|
||||||
return (!!window.ActiveXObject || "ActiveXObject" in window) ? ( |
|
||||||
(agent.match(/msie\s(\d+)/) || [])[1] || '11' //由于 ie11 并没有 msie 的标识
|
|
||||||
) : false; |
|
||||||
}(); |
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/** |
|
||||||
* 获取 layui 常见方法,以便用于组件单独版 |
|
||||||
*/ |
|
||||||
|
|
||||||
lay.layui = layui || {}; |
|
||||||
lay.getPath = layui.cache.dir; //获取当前 JS 所在目录
|
|
||||||
lay.stope = layui.stope; //中止冒泡
|
|
||||||
lay.each = function(){ //遍历
|
|
||||||
layui.each.apply(layui, arguments); |
|
||||||
return this; |
|
||||||
}; |
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
//数字前置补零
|
|
||||||
lay.digit = function(num, length, end){ |
|
||||||
var str = ''; |
|
||||||
num = String(num); |
|
||||||
length = length || 2; |
|
||||||
for(var i = num.length; i < length; i++){ |
|
||||||
str += '0'; |
|
||||||
} |
|
||||||
return num < Math.pow(10, length) ? str + (num|0) : num; |
|
||||||
}; |
|
||||||
|
|
||||||
//创建元素
|
|
||||||
lay.elem = function(elemName, attr){ |
|
||||||
var elem = document.createElement(elemName); |
|
||||||
lay.each(attr || {}, function(key, value){ |
|
||||||
elem.setAttribute(key, value); |
|
||||||
}); |
|
||||||
return elem; |
|
||||||
}; |
|
||||||
|
|
||||||
//当前页面是否存在滚动条
|
|
||||||
lay.hasScrollbar = function(){ |
|
||||||
return document.body.scrollHeight > (window.innerHeight || document.documentElement.clientHeight); |
|
||||||
}; |
|
||||||
|
|
||||||
//元素定位
|
|
||||||
lay.position = function(elem, elemView, obj){ |
|
||||||
if(!elemView) return; |
|
||||||
obj = obj || {}; |
|
||||||
|
|
||||||
//如果绑定的是 document 或 body 元素,则直接获取鼠标坐标
|
|
||||||
if(elem === document || elem === lay('body')[0]){ |
|
||||||
obj.clickType = 'right'; |
|
||||||
} |
|
||||||
|
|
||||||
//绑定绑定元素的坐标
|
|
||||||
var rect = obj.clickType === 'right' ? function(){ |
|
||||||
var e = obj.e || window.event || {}; |
|
||||||
return { |
|
||||||
left: e.clientX |
|
||||||
,top: e.clientY |
|
||||||
,right: e.clientX |
|
||||||
,bottom: e.clientY |
|
||||||
} |
|
||||||
}() : elem.getBoundingClientRect() |
|
||||||
,elemWidth = elemView.offsetWidth //控件的宽度
|
|
||||||
,elemHeight = elemView.offsetHeight //控件的高度
|
|
||||||
|
|
||||||
//滚动条高度
|
|
||||||
,scrollArea = function(type){ |
|
||||||
type = type ? 'scrollLeft' : 'scrollTop'; |
|
||||||
return document.body[type] | document.documentElement[type]; |
|
||||||
} |
|
||||||
|
|
||||||
//窗口宽高
|
|
||||||
,winArea = function(type){ |
|
||||||
return document.documentElement[type ? 'clientWidth' : 'clientHeight'] |
|
||||||
}, margin = 5, left = rect.left, top = rect.bottom; |
|
||||||
|
|
||||||
//相对元素居中
|
|
||||||
if(obj.align === 'center'){ |
|
||||||
left = left - (elemWidth - elem.offsetWidth)/2; |
|
||||||
} else if(obj.align === 'right'){ |
|
||||||
left = left - elemWidth + elem.offsetWidth; |
|
||||||
} |
|
||||||
|
|
||||||
//判断右侧是否超出边界
|
|
||||||
if(left + elemWidth + margin > winArea('width')){ |
|
||||||
left = winArea('width') - elemWidth - margin; //如果超出右侧,则将面板向右靠齐
|
|
||||||
} |
|
||||||
//左侧是否超出边界
|
|
||||||
if(left < margin) left = margin; |
|
||||||
|
|
||||||
//判断底部和顶部是否超出边界
|
|
||||||
if(top + elemHeight + margin > winArea()){ |
|
||||||
//优先顶部是否有足够区域显示完全
|
|
||||||
if(rect.top > elemHeight + margin){ |
|
||||||
top = rect.top - elemHeight - margin*2; //顶部有足够的区域显示
|
|
||||||
} else { |
|
||||||
//如果面板是鼠标右键弹出,且顶部没有足够区域显示,则将面板向底部靠齐
|
|
||||||
if(obj.clickType === 'right'){ |
|
||||||
top = winArea() - elemHeight - margin*2; |
|
||||||
if(top < 0) top = 0; //不能溢出窗口顶部
|
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
//定位类型
|
|
||||||
var position = obj.position; |
|
||||||
if(position) elemView.style.position = position; |
|
||||||
|
|
||||||
//设置坐标
|
|
||||||
elemView.style.left = left + (position === 'fixed' ? 0 : scrollArea(1)) + 'px'; |
|
||||||
elemView.style.top = top + (position === 'fixed' ? 0 : scrollArea()) + 'px'; |
|
||||||
|
|
||||||
//防止页面无滚动条时,又因为弹出面板而出现滚动条导致的坐标计算偏差
|
|
||||||
if(!lay.hasScrollbar()){ |
|
||||||
var rect1 = elemView.getBoundingClientRect(); |
|
||||||
//如果弹出面板的溢出窗口底部,则表示将出现滚动条,此时需要重新计算坐标
|
|
||||||
if(!obj.SYSTEM_RELOAD && (rect1.bottom + margin) > winArea()){ |
|
||||||
obj.SYSTEM_RELOAD = true; |
|
||||||
setTimeout(function(){ |
|
||||||
lay.position(elem, elemView, obj); |
|
||||||
}, 50); |
|
||||||
} |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
//获取元素上的参数配置上
|
|
||||||
lay.options = function(elem, attr){ |
|
||||||
var othis = lay(elem) |
|
||||||
,attrName = attr || 'lay-options'; |
|
||||||
try { |
|
||||||
return new Function('return '+ (othis.attr(attrName) || '{}'))(); |
|
||||||
} catch(ev) { |
|
||||||
hint.error('parseerror:'+ ev, 'error'); |
|
||||||
return {}; |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
//元素是否属于顶级元素(document 或 body)
|
|
||||||
lay.isTopElem = function(elem){ |
|
||||||
var topElems = [document, lay('body')[0]] |
|
||||||
,matched = false; |
|
||||||
lay.each(topElems, function(index, item){ |
|
||||||
if(item === elem){ |
|
||||||
return matched = true |
|
||||||
} |
|
||||||
}); |
|
||||||
return matched; |
|
||||||
}; |
|
||||||
|
|
||||||
//追加字符
|
|
||||||
LAY.addStr = function(str, new_str){ |
|
||||||
str = str.replace(/\s+/, ' '); |
|
||||||
new_str = new_str.replace(/\s+/, ' ').split(' '); |
|
||||||
lay.each(new_str, function(ii, item){ |
|
||||||
if(!new RegExp('\\b'+ item + '\\b').test(str)){ |
|
||||||
str = str + ' ' + item; |
|
||||||
} |
|
||||||
}); |
|
||||||
return str.replace(/^\s|\s$/, ''); |
|
||||||
}; |
|
||||||
|
|
||||||
//移除值
|
|
||||||
LAY.removeStr = function(str, new_str){ |
|
||||||
str = str.replace(/\s+/, ' '); |
|
||||||
new_str = new_str.replace(/\s+/, ' ').split(' '); |
|
||||||
lay.each(new_str, function(ii, item){ |
|
||||||
var exp = new RegExp('\\b'+ item + '\\b') |
|
||||||
if(exp.test(str)){ |
|
||||||
str = str.replace(exp, ''); |
|
||||||
} |
|
||||||
}); |
|
||||||
return str.replace(/\s+/, ' ').replace(/^\s|\s$/, ''); |
|
||||||
}; |
|
||||||
|
|
||||||
//查找子元素
|
|
||||||
LAY.prototype.find = function(selector){ |
|
||||||
var that = this; |
|
||||||
var index = 0, arr = [] |
|
||||||
,isObject = typeof selector === 'object'; |
|
||||||
|
|
||||||
this.each(function(i, item){ |
|
||||||
var nativeDOM = isObject ? item.contains(selector) : item.querySelectorAll(selector || null); |
|
||||||
for(; index < nativeDOM.length; index++){ |
|
||||||
arr.push(nativeDOM[index]); |
|
||||||
} |
|
||||||
that.shift(); |
|
||||||
}); |
|
||||||
|
|
||||||
if(!isObject){ |
|
||||||
that.selector = (that.selector ? that.selector + ' ' : '') + selector |
|
||||||
} |
|
||||||
|
|
||||||
lay.each(arr, function(i, item){ |
|
||||||
that.push(item); |
|
||||||
}); |
|
||||||
|
|
||||||
return that; |
|
||||||
}; |
|
||||||
|
|
||||||
//DOM遍历
|
|
||||||
LAY.prototype.each = function(fn){ |
|
||||||
return lay.each.call(this, this, fn); |
|
||||||
}; |
|
||||||
|
|
||||||
//添加css类
|
|
||||||
LAY.prototype.addClass = function(className, type){ |
|
||||||
return this.each(function(index, item){ |
|
||||||
item.className = LAY[type ? 'removeStr' : 'addStr'](item.className, className) |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
//移除 css 类
|
|
||||||
LAY.prototype.removeClass = function(className){ |
|
||||||
return this.addClass(className, true); |
|
||||||
}; |
|
||||||
|
|
||||||
//是否包含 css 类
|
|
||||||
LAY.prototype.hasClass = function(className){ |
|
||||||
var has = false; |
|
||||||
this.each(function(index, item){ |
|
||||||
if(new RegExp('\\b'+ className +'\\b').test(item.className)){ |
|
||||||
has = true; |
|
||||||
} |
|
||||||
}); |
|
||||||
return has; |
|
||||||
}; |
|
||||||
|
|
||||||
//添加或获取 css style
|
|
||||||
LAY.prototype.css = function(key, value){ |
|
||||||
var that = this |
|
||||||
,parseValue = function(v){ |
|
||||||
return isNaN(v) ? v : (v +'px'); |
|
||||||
}; |
|
||||||
return (typeof key === 'string' && value === undefined) ? function(){ |
|
||||||
if(that.length > 0) return that[0].style[key]; |
|
||||||
}() : that.each(function(index, item){ |
|
||||||
typeof key === 'object' ? lay.each(key, function(thisKey, thisValue){ |
|
||||||
item.style[thisKey] = parseValue(thisValue); |
|
||||||
}) : item.style[key] = parseValue(value); |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
//添加或获取宽度
|
|
||||||
LAY.prototype.width = function(value){ |
|
||||||
var that = this; |
|
||||||
return value === undefined ? function(){ |
|
||||||
if(that.length > 0) return that[0].offsetWidth; //此处还需做兼容
|
|
||||||
}() : that.each(function(index, item){ |
|
||||||
that.css('width', value); |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
//添加或获取高度
|
|
||||||
LAY.prototype.height = function(value){ |
|
||||||
var that = this; |
|
||||||
return value === undefined ? function(){ |
|
||||||
if(that.length > 0) return that[0].offsetHeight; //此处还需做兼容
|
|
||||||
}() : that.each(function(index, item){ |
|
||||||
that.css('height', value); |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
//添加或获取属性
|
|
||||||
LAY.prototype.attr = function(key, value){ |
|
||||||
var that = this; |
|
||||||
return value === undefined ? function(){ |
|
||||||
if(that.length > 0) return that[0].getAttribute(key); |
|
||||||
}() : that.each(function(index, item){ |
|
||||||
item.setAttribute(key, value); |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
//移除属性
|
|
||||||
LAY.prototype.removeAttr = function(key){ |
|
||||||
return this.each(function(index, item){ |
|
||||||
item.removeAttribute(key); |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
//设置或获取 HTML 内容
|
|
||||||
LAY.prototype.html = function(html){ |
|
||||||
var that = this; |
|
||||||
return html === undefined ? function(){ |
|
||||||
if(that.length > 0) return that[0].innerHTML; |
|
||||||
}() : this.each(function(index, item){ |
|
||||||
item.innerHTML = html; |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
//设置或获取值
|
|
||||||
LAY.prototype.val = function(value){ |
|
||||||
var that = this; |
|
||||||
return value === undefined ? function(){ |
|
||||||
if(that.length > 0) return that[0].value; |
|
||||||
}() : this.each(function(index, item){ |
|
||||||
item.value = value; |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
//追加内容
|
|
||||||
LAY.prototype.append = function(elem){ |
|
||||||
return this.each(function(index, item){ |
|
||||||
typeof elem === 'object' |
|
||||||
? item.appendChild(elem) |
|
||||||
: item.innerHTML = item.innerHTML + elem; |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
//移除内容
|
|
||||||
LAY.prototype.remove = function(elem){ |
|
||||||
return this.each(function(index, item){ |
|
||||||
elem ? item.removeChild(elem) : item.parentNode.removeChild(item); |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
//事件绑定
|
|
||||||
LAY.prototype.on = function(eventName, fn){ |
|
||||||
return this.each(function(index, item){ |
|
||||||
item.attachEvent ? item.attachEvent('on' + eventName, function(e){ |
|
||||||
e.target = e.srcElement; |
|
||||||
fn.call(item, e); |
|
||||||
}) : item.addEventListener(eventName, fn, false); |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
//解除事件
|
|
||||||
LAY.prototype.off = function(eventName, fn){ |
|
||||||
return this.each(function(index, item){ |
|
||||||
item.detachEvent |
|
||||||
? item.detachEvent('on'+ eventName, fn) |
|
||||||
: item.removeEventListener(eventName, fn, false); |
|
||||||
}); |
|
||||||
}; |
|
||||||
|
|
||||||
//暴露 lay 到全局作用域
|
|
||||||
window.lay = lay; |
|
||||||
|
|
||||||
//如果在 layui 体系中
|
|
||||||
if(window.layui && layui.define){ |
|
||||||
layui.define(function(exports){ //layui 加载
|
|
||||||
exports(MOD_NAME, lay); |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
}(window, window.document); |
|
||||||
|
|
@ -1,648 +0,0 @@ |
|||||||
/** |
|
||||||
|
|
||||||
@Name:layedit 富文本编辑器 |
|
||||||
@License:MIT |
|
||||||
|
|
||||||
*/ |
|
||||||
|
|
||||||
layui.define(['layer', 'form'], function(exports){ |
|
||||||
"use strict"; |
|
||||||
|
|
||||||
var $ = layui.$ |
|
||||||
,layer = layui.layer |
|
||||||
,form = layui.form |
|
||||||
,hint = layui.hint() |
|
||||||
,device = layui.device() |
|
||||||
|
|
||||||
,MOD_NAME = 'layedit', THIS = 'layui-this', SHOW = 'layui-show', ABLED = 'layui-disabled' |
|
||||||
|
|
||||||
,Edit = function(){ |
|
||||||
var that = this; |
|
||||||
that.index = 0; |
|
||||||
|
|
||||||
//全局配置
|
|
||||||
that.config = { |
|
||||||
//默认工具bar
|
|
||||||
tool: [ |
|
||||||
'strong', 'italic', 'underline', 'del' |
|
||||||
,'|' |
|
||||||
,'left', 'center', 'right' |
|
||||||
,'|' |
|
||||||
,'link', 'unlink', 'face', 'image' |
|
||||||
] |
|
||||||
,hideTool: [] |
|
||||||
,height: 280 //默认高
|
|
||||||
}; |
|
||||||
}; |
|
||||||
|
|
||||||
//全局设置
|
|
||||||
Edit.prototype.set = function(options){ |
|
||||||
var that = this; |
|
||||||
$.extend(true, that.config, options); |
|
||||||
return that; |
|
||||||
}; |
|
||||||
|
|
||||||
//事件
|
|
||||||
Edit.prototype.on = function(events, callback){ |
|
||||||
return layui.onevent(MOD_NAME, events, callback); |
|
||||||
}; |
|
||||||
|
|
||||||
//建立编辑器
|
|
||||||
Edit.prototype.build = function(id, settings){ |
|
||||||
settings = settings || {}; |
|
||||||
|
|
||||||
var that = this |
|
||||||
,config = that.config |
|
||||||
,ELEM = 'layui-layedit', textArea = $(typeof(id)=='string'?'#'+id:id) |
|
||||||
,name = 'LAY_layedit_'+ (++that.index) |
|
||||||
,haveBuild = textArea.next('.'+ELEM) |
|
||||||
|
|
||||||
,set = $.extend({}, config, settings) |
|
||||||
|
|
||||||
,tool = function(){ |
|
||||||
var node = [], hideTools = {}; |
|
||||||
layui.each(set.hideTool, function(_, item){ |
|
||||||
hideTools[item] = true; |
|
||||||
}); |
|
||||||
layui.each(set.tool, function(_, item){ |
|
||||||
if(tools[item] && !hideTools[item]){ |
|
||||||
node.push(tools[item]); |
|
||||||
} |
|
||||||
}); |
|
||||||
return node.join(''); |
|
||||||
}() |
|
||||||
|
|
||||||
|
|
||||||
,editor = $(['<div class="'+ ELEM +'">' |
|
||||||
,'<div class="layui-unselect layui-layedit-tool">'+ tool +'</div>' |
|
||||||
,'<div class="layui-layedit-iframe">' |
|
||||||
,'<iframe id="'+ name +'" name="'+ name +'" textarea="'+ id +'" frameborder="0"></iframe>' |
|
||||||
,'</div>' |
|
||||||
,'</div>'].join('')) |
|
||||||
|
|
||||||
//编辑器不兼容ie8以下
|
|
||||||
if(device.ie && device.ie < 8){ |
|
||||||
return textArea.removeClass('layui-hide').addClass(SHOW); |
|
||||||
} |
|
||||||
|
|
||||||
haveBuild[0] && (haveBuild.remove()); |
|
||||||
|
|
||||||
setIframe.call(that, editor, textArea[0], set) |
|
||||||
textArea.addClass('layui-hide').after(editor); |
|
||||||
|
|
||||||
return that.index; |
|
||||||
}; |
|
||||||
|
|
||||||
//获得编辑器中内容
|
|
||||||
Edit.prototype.getContent = function(index){ |
|
||||||
var iframeWin = getWin(index); |
|
||||||
if(!iframeWin[0]) return; |
|
||||||
return toLower(iframeWin[0].document.body.innerHTML); |
|
||||||
}; |
|
||||||
|
|
||||||
//获得编辑器中纯文本内容
|
|
||||||
Edit.prototype.getText = function(index){ |
|
||||||
var iframeWin = getWin(index); |
|
||||||
if(!iframeWin[0]) return; |
|
||||||
return $(iframeWin[0].document.body).text(); |
|
||||||
}; |
|
||||||
/** |
|
||||||
* 设置编辑器内容 |
|
||||||
* @param {[type]} index 编辑器索引 |
|
||||||
* @param {[type]} content 要设置的内容 |
|
||||||
* @param {[type]} flag 是否追加模式 |
|
||||||
*/ |
|
||||||
Edit.prototype.setContent = function(index, content, flag){ |
|
||||||
var iframeWin = getWin(index); |
|
||||||
if(!iframeWin[0]) return; |
|
||||||
if(flag){ |
|
||||||
$(iframeWin[0].document.body).append(content) |
|
||||||
}else{ |
|
||||||
$(iframeWin[0].document.body).html(content) |
|
||||||
}; |
|
||||||
layedit.sync(index) |
|
||||||
}; |
|
||||||
//将编辑器内容同步到textarea(一般用于异步提交时)
|
|
||||||
Edit.prototype.sync = function(index){ |
|
||||||
var iframeWin = getWin(index); |
|
||||||
if(!iframeWin[0]) return; |
|
||||||
var textarea = $('#'+iframeWin[1].attr('textarea')); |
|
||||||
textarea.val(toLower(iframeWin[0].document.body.innerHTML)); |
|
||||||
}; |
|
||||||
|
|
||||||
//获取编辑器选中内容
|
|
||||||
Edit.prototype.getSelection = function(index){ |
|
||||||
var iframeWin = getWin(index); |
|
||||||
if(!iframeWin[0]) return; |
|
||||||
var range = Range(iframeWin[0].document); |
|
||||||
return document.selection ? range.text : range.toString(); |
|
||||||
}; |
|
||||||
|
|
||||||
//iframe初始化
|
|
||||||
var setIframe = function(editor, textArea, set){ |
|
||||||
var that = this, iframe = editor.find('iframe'); |
|
||||||
|
|
||||||
iframe.css({ |
|
||||||
height: set.height |
|
||||||
}).on('load', function(){ |
|
||||||
var conts = iframe.contents() |
|
||||||
,iframeWin = iframe.prop('contentWindow') |
|
||||||
,head = conts.find('head') |
|
||||||
,style = $(['<style>' |
|
||||||
,'*{margin: 0; padding: 0;}' |
|
||||||
,'body{padding: 10px; line-height: 20px; overflow-x: hidden; word-wrap: break-word; font: 14px Helvetica Neue,Helvetica,PingFang SC,Microsoft YaHei,Tahoma,Arial,sans-serif; -webkit-box-sizing: border-box !important; -moz-box-sizing: border-box !important; box-sizing: border-box !important;}' |
|
||||||
,'a{color:#01AAED; text-decoration:none;}a:hover{color:#c00}' |
|
||||||
,'p{margin-bottom: 10px;}' |
|
||||||
,'img{display: inline-block; border: none; vertical-align: middle;}' |
|
||||||
,'pre{margin: 10px 0; padding: 10px; line-height: 20px; border: 1px solid #ddd; border-left-width: 6px; background-color: #F2F2F2; color: #333; font-family: Courier New; font-size: 12px;}' |
|
||||||
,'</style>'].join('')) |
|
||||||
,body = conts.find('body'); |
|
||||||
|
|
||||||
head.append(style); |
|
||||||
body.attr('contenteditable', 'true').css({ |
|
||||||
'min-height': set.height |
|
||||||
}).html(textArea.value||''); |
|
||||||
|
|
||||||
hotkey.apply(that, [iframeWin, iframe, textArea, set]); //快捷键处理
|
|
||||||
toolActive.call(that, iframeWin, editor, set); //触发工具
|
|
||||||
|
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
//获得iframe窗口对象
|
|
||||||
,getWin = function(index){ |
|
||||||
var iframe = $('#LAY_layedit_'+ index) |
|
||||||
,iframeWin = iframe.prop('contentWindow'); |
|
||||||
return [iframeWin, iframe]; |
|
||||||
} |
|
||||||
|
|
||||||
//IE8下将标签处理成小写
|
|
||||||
,toLower = function(html){ |
|
||||||
if(device.ie == 8){ |
|
||||||
html = html.replace(/<.+>/g, function(str){ |
|
||||||
return str.toLowerCase(); |
|
||||||
}); |
|
||||||
} |
|
||||||
return html; |
|
||||||
} |
|
||||||
|
|
||||||
//快捷键处理
|
|
||||||
,hotkey = function(iframeWin, iframe, textArea, set){ |
|
||||||
var iframeDOM = iframeWin.document, body = $(iframeDOM.body); |
|
||||||
body.on('keydown', function(e){ |
|
||||||
var keycode = e.keyCode; |
|
||||||
//处理回车
|
|
||||||
if(keycode === 13){ |
|
||||||
var range = Range(iframeDOM); |
|
||||||
var container = getContainer(range) |
|
||||||
,parentNode = container.parentNode; |
|
||||||
|
|
||||||
if(parentNode.tagName.toLowerCase() === 'pre'){ |
|
||||||
if(e.shiftKey) return |
|
||||||
layer.msg('请暂时用shift+enter'); |
|
||||||
return false; |
|
||||||
} |
|
||||||
iframeDOM.execCommand('formatBlock', false, '<p>'); |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
//给textarea同步内容
|
|
||||||
$(textArea).parents('form').on('submit', function(){ |
|
||||||
var html = body.html(); |
|
||||||
//IE8下将标签处理成小写
|
|
||||||
if(device.ie == 8){ |
|
||||||
html = html.replace(/<.+>/g, function(str){ |
|
||||||
return str.toLowerCase(); |
|
||||||
}); |
|
||||||
} |
|
||||||
textArea.value = html; |
|
||||||
}); |
|
||||||
|
|
||||||
//处理粘贴
|
|
||||||
body.on('paste', function(e){ |
|
||||||
iframeDOM.execCommand('formatBlock', false, '<p>'); |
|
||||||
setTimeout(function(){ |
|
||||||
filter.call(iframeWin, body); |
|
||||||
textArea.value = body.html(); |
|
||||||
}, 100); |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
//标签过滤
|
|
||||||
,filter = function(body){ |
|
||||||
var iframeWin = this |
|
||||||
,iframeDOM = iframeWin.document; |
|
||||||
|
|
||||||
//清除影响版面的css属性
|
|
||||||
body.find('*[style]').each(function(){ |
|
||||||
var textAlign = this.style.textAlign; |
|
||||||
this.removeAttribute('style'); |
|
||||||
$(this).css({ |
|
||||||
'text-align': textAlign || '' |
|
||||||
}) |
|
||||||
}); |
|
||||||
|
|
||||||
//修饰表格
|
|
||||||
body.find('table').addClass('layui-table'); |
|
||||||
|
|
||||||
//移除不安全的标签
|
|
||||||
body.find('script,link').remove(); |
|
||||||
} |
|
||||||
|
|
||||||
//Range对象兼容性处理
|
|
||||||
,Range = function(iframeDOM){ |
|
||||||
return iframeDOM.selection |
|
||||||
? iframeDOM.selection.createRange() |
|
||||||
: iframeDOM.getSelection().getRangeAt(0); |
|
||||||
} |
|
||||||
|
|
||||||
//当前Range对象的endContainer兼容性处理
|
|
||||||
,getContainer = function(range){ |
|
||||||
return range.endContainer || range.parentElement().childNodes[0] |
|
||||||
} |
|
||||||
|
|
||||||
//在选区插入内联元素
|
|
||||||
,insertInline = function(tagName, attr, range){ |
|
||||||
var iframeDOM = this.document |
|
||||||
,elem = document.createElement(tagName) |
|
||||||
for(var key in attr){ |
|
||||||
elem.setAttribute(key, attr[key]); |
|
||||||
} |
|
||||||
elem.removeAttribute('text'); |
|
||||||
|
|
||||||
if(iframeDOM.selection){ //IE
|
|
||||||
var text = range.text || attr.text; |
|
||||||
if(tagName === 'a' && !text) return; |
|
||||||
if(text){ |
|
||||||
elem.innerHTML = text; |
|
||||||
} |
|
||||||
range.pasteHTML($(elem).prop('outerHTML')); |
|
||||||
range.select(); |
|
||||||
} else { //非IE
|
|
||||||
var text = range.toString() || attr.text; |
|
||||||
if(tagName === 'a' && !text) return; |
|
||||||
if(text){ |
|
||||||
elem.innerHTML = text; |
|
||||||
} |
|
||||||
range.deleteContents(); |
|
||||||
range.insertNode(elem); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
//工具选中
|
|
||||||
,toolCheck = function(tools, othis){ |
|
||||||
var iframeDOM = this.document |
|
||||||
,CHECK = 'layedit-tool-active' |
|
||||||
,container = getContainer(Range(iframeDOM)) |
|
||||||
,item = function(type){ |
|
||||||
return tools.find('.layedit-tool-'+type) |
|
||||||
} |
|
||||||
|
|
||||||
if(othis){ |
|
||||||
othis[othis.hasClass(CHECK) ? 'removeClass' : 'addClass'](CHECK); |
|
||||||
} |
|
||||||
|
|
||||||
tools.find('>i').removeClass(CHECK); |
|
||||||
item('unlink').addClass(ABLED); |
|
||||||
|
|
||||||
$(container).parents().each(function(){ |
|
||||||
var tagName = this.tagName.toLowerCase() |
|
||||||
,textAlign = this.style.textAlign; |
|
||||||
|
|
||||||
//文字
|
|
||||||
if(tagName === 'b' || tagName === 'strong'){ |
|
||||||
item('b').addClass(CHECK) |
|
||||||
} |
|
||||||
if(tagName === 'i' || tagName === 'em'){ |
|
||||||
item('i').addClass(CHECK) |
|
||||||
} |
|
||||||
if(tagName === 'u'){ |
|
||||||
item('u').addClass(CHECK) |
|
||||||
} |
|
||||||
if(tagName === 'strike'){ |
|
||||||
item('d').addClass(CHECK) |
|
||||||
} |
|
||||||
|
|
||||||
//对齐
|
|
||||||
if(tagName === 'p'){ |
|
||||||
if(textAlign === 'center'){ |
|
||||||
item('center').addClass(CHECK); |
|
||||||
} else if(textAlign === 'right'){ |
|
||||||
item('right').addClass(CHECK); |
|
||||||
} else { |
|
||||||
item('left').addClass(CHECK); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
//超链接
|
|
||||||
if(tagName === 'a'){ |
|
||||||
item('link').addClass(CHECK); |
|
||||||
item('unlink').removeClass(ABLED); |
|
||||||
} |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
//触发工具
|
|
||||||
,toolActive = function(iframeWin, editor, set){ |
|
||||||
var iframeDOM = iframeWin.document |
|
||||||
,body = $(iframeDOM.body) |
|
||||||
,toolEvent = { |
|
||||||
//超链接
|
|
||||||
link: function(range){ |
|
||||||
var container = getContainer(range) |
|
||||||
,parentNode = $(container).parent(); |
|
||||||
|
|
||||||
link.call(body, { |
|
||||||
href: parentNode.attr('href') |
|
||||||
,target: parentNode.attr('target') |
|
||||||
}, function(field){ |
|
||||||
var parent = parentNode[0]; |
|
||||||
if(parent.tagName === 'A'){ |
|
||||||
parent.href = field.url; |
|
||||||
} else { |
|
||||||
insertInline.call(iframeWin, 'a', { |
|
||||||
target: field.target |
|
||||||
,href: field.url |
|
||||||
,text: field.url |
|
||||||
}, range); |
|
||||||
} |
|
||||||
}); |
|
||||||
} |
|
||||||
//清除超链接
|
|
||||||
,unlink: function(range){ |
|
||||||
iframeDOM.execCommand('unlink'); |
|
||||||
} |
|
||||||
//表情
|
|
||||||
,face: function(range){ |
|
||||||
face.call(this, function(img){ |
|
||||||
insertInline.call(iframeWin, 'img', { |
|
||||||
src: img.src |
|
||||||
,alt: img.alt |
|
||||||
}, range); |
|
||||||
}); |
|
||||||
} |
|
||||||
//图片
|
|
||||||
,image: function(range){ |
|
||||||
var that = this; |
|
||||||
layui.use('upload', function(upload){ |
|
||||||
var uploadImage = set.uploadImage || {}; |
|
||||||
upload.render({ |
|
||||||
url: uploadImage.url |
|
||||||
,method: uploadImage.type |
|
||||||
,elem: $(that).find('input')[0] |
|
||||||
,done: function(res){ |
|
||||||
if(res.code == 0){ |
|
||||||
res.data = res.data || {}; |
|
||||||
insertInline.call(iframeWin, 'img', { |
|
||||||
src: res.data.src |
|
||||||
,alt: res.data.title |
|
||||||
}, range); |
|
||||||
} else { |
|
||||||
layer.msg(res.msg||'上传失败'); |
|
||||||
} |
|
||||||
} |
|
||||||
}); |
|
||||||
}); |
|
||||||
} |
|
||||||
//插入代码
|
|
||||||
,code: function(range){ |
|
||||||
code.call(body, function(pre){ |
|
||||||
insertInline.call(iframeWin, 'pre', { |
|
||||||
text: pre.code |
|
||||||
,'lay-lang': pre.lang |
|
||||||
}, range); |
|
||||||
}); |
|
||||||
} |
|
||||||
//帮助
|
|
||||||
,help: function(){ |
|
||||||
layer.open({ |
|
||||||
type: 2 |
|
||||||
,title: '帮助' |
|
||||||
,area: ['600px', '380px'] |
|
||||||
,shadeClose: true |
|
||||||
,shade: 0.1 |
|
||||||
,skin: 'layui-layer-msg' |
|
||||||
,content: ['', 'no'] |
|
||||||
}); |
|
||||||
} |
|
||||||
} |
|
||||||
,tools = editor.find('.layui-layedit-tool') |
|
||||||
|
|
||||||
,click = function(){ |
|
||||||
var othis = $(this) |
|
||||||
,events = othis.attr('layedit-event') |
|
||||||
,command = othis.attr('lay-command'); |
|
||||||
|
|
||||||
if(othis.hasClass(ABLED)) return; |
|
||||||
|
|
||||||
body.focus(); |
|
||||||
|
|
||||||
var range = Range(iframeDOM) |
|
||||||
,container = range.commonAncestorContainer |
|
||||||
|
|
||||||
if(command){ |
|
||||||
iframeDOM.execCommand(command); |
|
||||||
if(/justifyLeft|justifyCenter|justifyRight/.test(command)){ |
|
||||||
iframeDOM.execCommand('formatBlock', false, '<p>'); |
|
||||||
} |
|
||||||
setTimeout(function(){ |
|
||||||
body.focus(); |
|
||||||
}, 10); |
|
||||||
} else { |
|
||||||
toolEvent[events] && toolEvent[events].call(this, range); |
|
||||||
} |
|
||||||
toolCheck.call(iframeWin, tools, othis); |
|
||||||
} |
|
||||||
|
|
||||||
,isClick = /image/ |
|
||||||
|
|
||||||
tools.find('>i').on('mousedown', function(){ |
|
||||||
var othis = $(this) |
|
||||||
,events = othis.attr('layedit-event'); |
|
||||||
if(isClick.test(events)) return; |
|
||||||
click.call(this) |
|
||||||
}).on('click', function(){ |
|
||||||
var othis = $(this) |
|
||||||
,events = othis.attr('layedit-event'); |
|
||||||
if(!isClick.test(events)) return; |
|
||||||
click.call(this) |
|
||||||
}); |
|
||||||
|
|
||||||
//触发内容区域
|
|
||||||
body.on('click', function(){ |
|
||||||
toolCheck.call(iframeWin, tools); |
|
||||||
layer.close(face.index); |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
//超链接面板
|
|
||||||
,link = function(options, callback){ |
|
||||||
var body = this, index = layer.open({ |
|
||||||
type: 1 |
|
||||||
,id: 'LAY_layedit_link' |
|
||||||
,area: '350px' |
|
||||||
,shade: 0.05 |
|
||||||
,shadeClose: true |
|
||||||
,moveType: 1 |
|
||||||
,title: '超链接' |
|
||||||
,skin: 'layui-layer-msg' |
|
||||||
,content: ['<ul class="layui-form" style="margin: 15px;">' |
|
||||||
,'<li class="layui-form-item">' |
|
||||||
,'<label class="layui-form-label" style="width: 60px;">URL</label>' |
|
||||||
,'<div class="layui-input-block" style="margin-left: 90px">' |
|
||||||
,'<input name="url" lay-verify="url" value="'+ (options.href||'') +'" autofocus="true" autocomplete="off" class="layui-input">' |
|
||||||
,'</div>' |
|
||||||
,'</li>' |
|
||||||
,'<li class="layui-form-item">' |
|
||||||
,'<label class="layui-form-label" style="width: 60px;">打开方式</label>' |
|
||||||
,'<div class="layui-input-block" style="margin-left: 90px">' |
|
||||||
,'<input type="radio" name="target" value="_self" class="layui-input" title="当前窗口"' |
|
||||||
+ ((options.target==='_self' || !options.target) ? 'checked' : '') +'>' |
|
||||||
,'<input type="radio" name="target" value="_blank" class="layui-input" title="新窗口" ' |
|
||||||
+ (options.target==='_blank' ? 'checked' : '') +'>' |
|
||||||
,'</div>' |
|
||||||
,'</li>' |
|
||||||
,'<li class="layui-form-item" style="text-align: center;">' |
|
||||||
,'<button type="button" lay-submit lay-filter="layedit-link-yes" class="layui-btn"> 确定 </button>' |
|
||||||
,'<button style="margin-left: 20px;" type="button" class="layui-btn layui-btn-primary"> 取消 </button>' |
|
||||||
,'</li>' |
|
||||||
,'</ul>'].join('') |
|
||||||
,success: function(layero, index){ |
|
||||||
var eventFilter = 'submit(layedit-link-yes)'; |
|
||||||
form.render('radio'); |
|
||||||
layero.find('.layui-btn-primary').on('click', function(){ |
|
||||||
layer.close(index); |
|
||||||
body.focus(); |
|
||||||
}); |
|
||||||
form.on(eventFilter, function(data){ |
|
||||||
layer.close(link.index); |
|
||||||
callback && callback(data.field); |
|
||||||
}); |
|
||||||
} |
|
||||||
}); |
|
||||||
link.index = index; |
|
||||||
} |
|
||||||
|
|
||||||
//表情面板
|
|
||||||
,face = function(callback){ |
|
||||||
//表情库
|
|
||||||
var faces = function(){ |
|
||||||
var alt = ["[微笑]", "[嘻嘻]", "[哈哈]", "[可爱]", "[可怜]", "[挖鼻]", "[吃惊]", "[害羞]", "[挤眼]", "[闭嘴]", "[鄙视]", "[爱你]", "[泪]", "[偷笑]", "[亲亲]", "[生病]", "[太开心]", "[白眼]", "[右哼哼]", "[左哼哼]", "[嘘]", "[衰]", "[委屈]", "[吐]", "[哈欠]", "[抱抱]", "[怒]", "[疑问]", "[馋嘴]", "[拜拜]", "[思考]", "[汗]", "[困]", "[睡]", "[钱]", "[失望]", "[酷]", "[色]", "[哼]", "[鼓掌]", "[晕]", "[悲伤]", "[抓狂]", "[黑线]", "[阴险]", "[怒骂]", "[互粉]", "[心]", "[伤心]", "[猪头]", "[熊猫]", "[兔子]", "[ok]", "[耶]", "[good]", "[NO]", "[赞]", "[来]", "[弱]", "[草泥马]", "[神马]", "[囧]", "[浮云]", "[给力]", "[围观]", "[威武]", "[奥特曼]", "[礼物]", "[钟]", "[话筒]", "[蜡烛]", "[蛋糕]"], arr = {}; |
|
||||||
layui.each(alt, function(index, item){ |
|
||||||
arr[item] = layui.cache.dir + 'images/face/'+ index + '.gif'; |
|
||||||
}); |
|
||||||
return arr; |
|
||||||
}(); |
|
||||||
face.hide = face.hide || function(e){ |
|
||||||
if($(e.target).attr('layedit-event') !== 'face'){ |
|
||||||
layer.close(face.index); |
|
||||||
} |
|
||||||
} |
|
||||||
return face.index = layer.tips(function(){ |
|
||||||
var content = []; |
|
||||||
layui.each(faces, function(key, item){ |
|
||||||
content.push('<li title="'+ key +'"><img src="'+ item +'" alt="'+ key +'"></li>'); |
|
||||||
}); |
|
||||||
return '<ul class="layui-clear">' + content.join('') + '</ul>'; |
|
||||||
}(), this, { |
|
||||||
tips: 1 |
|
||||||
,time: 0 |
|
||||||
,skin: 'layui-box layui-util-face' |
|
||||||
,maxWidth: 500 |
|
||||||
,success: function(layero, index){ |
|
||||||
layero.css({ |
|
||||||
marginTop: -4 |
|
||||||
,marginLeft: -10 |
|
||||||
}).find('.layui-clear>li').on('click', function(){ |
|
||||||
callback && callback({ |
|
||||||
src: faces[this.title] |
|
||||||
,alt: this.title |
|
||||||
}); |
|
||||||
layer.close(index); |
|
||||||
}); |
|
||||||
$(document).off('click', face.hide).on('click', face.hide); |
|
||||||
} |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
//插入代码面板
|
|
||||||
,code = function(callback){ |
|
||||||
var body = this, index = layer.open({ |
|
||||||
type: 1 |
|
||||||
,id: 'LAY_layedit_code' |
|
||||||
,area: '550px' |
|
||||||
,shade: 0.05 |
|
||||||
,shadeClose: true |
|
||||||
,moveType: 1 |
|
||||||
,title: '插入代码' |
|
||||||
,skin: 'layui-layer-msg' |
|
||||||
,content: ['<ul class="layui-form layui-form-pane" style="margin: 15px;">' |
|
||||||
,'<li class="layui-form-item">' |
|
||||||
,'<label class="layui-form-label">请选择语言</label>' |
|
||||||
,'<div class="layui-input-block">' |
|
||||||
,'<select name="lang">' |
|
||||||
,'<option value="JavaScript">JavaScript</option>' |
|
||||||
,'<option value="HTML">HTML</option>' |
|
||||||
,'<option value="CSS">CSS</option>' |
|
||||||
,'<option value="Java">Java</option>' |
|
||||||
,'<option value="PHP">PHP</option>' |
|
||||||
,'<option value="C#">C#</option>' |
|
||||||
,'<option value="Python">Python</option>' |
|
||||||
,'<option value="Ruby">Ruby</option>' |
|
||||||
,'<option value="Go">Go</option>' |
|
||||||
,'</select>' |
|
||||||
,'</div>' |
|
||||||
,'</li>' |
|
||||||
,'<li class="layui-form-item layui-form-text">' |
|
||||||
,'<label class="layui-form-label">代码</label>' |
|
||||||
,'<div class="layui-input-block">' |
|
||||||
,'<textarea name="code" lay-verify="required" autofocus="true" class="layui-textarea" style="height: 200px;"></textarea>' |
|
||||||
,'</div>' |
|
||||||
,'</li>' |
|
||||||
,'<li class="layui-form-item" style="text-align: center;">' |
|
||||||
,'<button type="button" lay-submit lay-filter="layedit-code-yes" class="layui-btn"> 确定 </button>' |
|
||||||
,'<button style="margin-left: 20px;" type="button" class="layui-btn layui-btn-primary"> 取消 </button>' |
|
||||||
,'</li>' |
|
||||||
,'</ul>'].join('') |
|
||||||
,success: function(layero, index){ |
|
||||||
var eventFilter = 'submit(layedit-code-yes)'; |
|
||||||
form.render('select'); |
|
||||||
layero.find('.layui-btn-primary').on('click', function(){ |
|
||||||
layer.close(index); |
|
||||||
body.focus(); |
|
||||||
}); |
|
||||||
form.on(eventFilter, function(data){ |
|
||||||
layer.close(code.index); |
|
||||||
callback && callback(data.field); |
|
||||||
}); |
|
||||||
} |
|
||||||
}); |
|
||||||
code.index = index; |
|
||||||
} |
|
||||||
|
|
||||||
//全部工具
|
|
||||||
,tools = { |
|
||||||
html: '<i class="layui-icon layedit-tool-html" title="HTML源代码" lay-command="html" layedit-event="html""></i><span class="layedit-tool-mid"></span>' |
|
||||||
,strong: '<i class="layui-icon layedit-tool-b" title="加粗" lay-command="Bold" layedit-event="b""></i>' |
|
||||||
,italic: '<i class="layui-icon layedit-tool-i" title="斜体" lay-command="italic" layedit-event="i""></i>' |
|
||||||
,underline: '<i class="layui-icon layedit-tool-u" title="下划线" lay-command="underline" layedit-event="u""></i>' |
|
||||||
,del: '<i class="layui-icon layedit-tool-d" title="删除线" lay-command="strikeThrough" layedit-event="d""></i>' |
|
||||||
|
|
||||||
,'|': '<span class="layedit-tool-mid"></span>' |
|
||||||
|
|
||||||
,left: '<i class="layui-icon layedit-tool-left" title="左对齐" lay-command="justifyLeft" layedit-event="left""></i>' |
|
||||||
,center: '<i class="layui-icon layedit-tool-center" title="居中对齐" lay-command="justifyCenter" layedit-event="center""></i>' |
|
||||||
,right: '<i class="layui-icon layedit-tool-right" title="右对齐" lay-command="justifyRight" layedit-event="right""></i>' |
|
||||||
,link: '<i class="layui-icon layedit-tool-link" title="插入链接" layedit-event="link""></i>' |
|
||||||
,unlink: '<i class="layui-icon layedit-tool-unlink layui-disabled" title="清除链接" lay-command="unlink" layedit-event="unlink""></i>' |
|
||||||
,face: '<i class="layui-icon layedit-tool-face" title="表情" layedit-event="face""></i>' |
|
||||||
,image: '<i class="layui-icon layedit-tool-image" title="图片" layedit-event="image"><input type="file" name="file"></i>' |
|
||||||
,code: '<i class="layui-icon layedit-tool-code" title="插入代码" layedit-event="code"></i>' |
|
||||||
|
|
||||||
,help: '<i class="layui-icon layedit-tool-help" title="帮助" layedit-event="help"></i>' |
|
||||||
} |
|
||||||
|
|
||||||
,edit = new Edit(); |
|
||||||
|
|
||||||
exports(MOD_NAME, edit); |
|
||||||
}); |
|