Mathias Markl
8 years ago
15 changed files with 1974 additions and 0 deletions
-
619muk_web_preview_image/LICENSE
-
24muk_web_preview_image/README.md
-
20muk_web_preview_image/__init__.py
-
78muk_web_preview_image/__manifest__.py
-
BINmuk_web_preview_image/static/description/banner.png
-
BINmuk_web_preview_image/static/description/icon.png
-
67muk_web_preview_image/static/description/index.html
-
BINmuk_web_preview_image/static/description/logo.png
-
BINmuk_web_preview_image/static/description/screenshot.png
-
226muk_web_preview_image/static/lib/imageviewer/imageviewer.css
-
788muk_web_preview_image/static/lib/imageviewer/imageviewer.js
-
64muk_web_preview_image/static/src/js/preview_generator.js
-
34muk_web_preview_image/static/src/less/preview_content.less
-
24muk_web_preview_image/static/src/xml/preview_content.xml
-
30muk_web_preview_image/template/assets.xml
@ -0,0 +1,619 @@ |
|||
GNU AFFERO GENERAL PUBLIC LICENSE |
|||
Version 3, 19 November 2007 |
|||
|
|||
Copyright (C) 2007 Free Software Foundation, Inc. <http://fsf.org/> |
|||
Everyone is permitted to copy and distribute verbatim copies |
|||
of this license document, but changing it is not allowed. |
|||
|
|||
Preamble |
|||
|
|||
The GNU Affero General Public License is a free, copyleft license for |
|||
software and other kinds of works, specifically designed to ensure |
|||
cooperation with the community in the case of network server software. |
|||
|
|||
The licenses for most software and other practical works are designed |
|||
to take away your freedom to share and change the works. By contrast, |
|||
our General Public Licenses are intended to guarantee your freedom to |
|||
share and change all versions of a program--to make sure it remains free |
|||
software for all its users. |
|||
|
|||
When we speak of free software, we are referring to freedom, not |
|||
price. Our General Public Licenses are designed to make sure that you |
|||
have the freedom to distribute copies of free software (and charge for |
|||
them if you wish), that you receive source code or can get it if you |
|||
want it, that you can change the software or use pieces of it in new |
|||
free programs, and that you know you can do these things. |
|||
|
|||
Developers that use our General Public Licenses protect your rights |
|||
with two steps: (1) assert copyright on the software, and (2) offer |
|||
you this License which gives you legal permission to copy, distribute |
|||
and/or modify the software. |
|||
|
|||
A secondary benefit of defending all users' freedom is that |
|||
improvements made in alternate versions of the program, if they |
|||
receive widespread use, become available for other developers to |
|||
incorporate. Many developers of free software are heartened and |
|||
encouraged by the resulting cooperation. However, in the case of |
|||
software used on network servers, this result may fail to come about. |
|||
The GNU General Public License permits making a modified version and |
|||
letting the public access it on a server without ever releasing its |
|||
source code to the public. |
|||
|
|||
The GNU Affero General Public License is designed specifically to |
|||
ensure that, in such cases, the modified source code becomes available |
|||
to the community. It requires the operator of a network server to |
|||
provide the source code of the modified version running there to the |
|||
users of that server. Therefore, public use of a modified version, on |
|||
a publicly accessible server, gives the public access to the source |
|||
code of the modified version. |
|||
|
|||
An older license, called the Affero General Public License and |
|||
published by Affero, was designed to accomplish similar goals. This is |
|||
a different license, not a version of the Affero GPL, but Affero has |
|||
released a new version of the Affero GPL which permits relicensing under |
|||
this license. |
|||
|
|||
The precise terms and conditions for copying, distribution and |
|||
modification follow. |
|||
|
|||
TERMS AND CONDITIONS |
|||
|
|||
0. Definitions. |
|||
|
|||
"This License" refers to version 3 of the GNU Affero General Public License. |
|||
|
|||
"Copyright" also means copyright-like laws that apply to other kinds of |
|||
works, such as semiconductor masks. |
|||
|
|||
"The Program" refers to any copyrightable work licensed under this |
|||
License. Each licensee is addressed as "you". "Licensees" and |
|||
"recipients" may be individuals or organizations. |
|||
|
|||
To "modify" a work means to copy from or adapt all or part of the work |
|||
in a fashion requiring copyright permission, other than the making of an |
|||
exact copy. The resulting work is called a "modified version" of the |
|||
earlier work or a work "based on" the earlier work. |
|||
|
|||
A "covered work" means either the unmodified Program or a work based |
|||
on the Program. |
|||
|
|||
To "propagate" a work means to do anything with it that, without |
|||
permission, would make you directly or secondarily liable for |
|||
infringement under applicable copyright law, except executing it on a |
|||
computer or modifying a private copy. Propagation includes copying, |
|||
distribution (with or without modification), making available to the |
|||
public, and in some countries other activities as well. |
|||
|
|||
To "convey" a work means any kind of propagation that enables other |
|||
parties to make or receive copies. Mere interaction with a user through |
|||
a computer network, with no transfer of a copy, is not conveying. |
|||
|
|||
An interactive user interface displays "Appropriate Legal Notices" |
|||
to the extent that it includes a convenient and prominently visible |
|||
feature that (1) displays an appropriate copyright notice, and (2) |
|||
tells the user that there is no warranty for the work (except to the |
|||
extent that warranties are provided), that licensees may convey the |
|||
work under this License, and how to view a copy of this License. If |
|||
the interface presents a list of user commands or options, such as a |
|||
menu, a prominent item in the list meets this criterion. |
|||
|
|||
1. Source Code. |
|||
|
|||
The "source code" for a work means the preferred form of the work |
|||
for making modifications to it. "Object code" means any non-source |
|||
form of a work. |
|||
|
|||
A "Standard Interface" means an interface that either is an official |
|||
standard defined by a recognized standards body, or, in the case of |
|||
interfaces specified for a particular programming language, one that |
|||
is widely used among developers working in that language. |
|||
|
|||
The "System Libraries" of an executable work include anything, other |
|||
than the work as a whole, that (a) is included in the normal form of |
|||
packaging a Major Component, but which is not part of that Major |
|||
Component, and (b) serves only to enable use of the work with that |
|||
Major Component, or to implement a Standard Interface for which an |
|||
implementation is available to the public in source code form. A |
|||
"Major Component", in this context, means a major essential component |
|||
(kernel, window system, and so on) of the specific operating system |
|||
(if any) on which the executable work runs, or a compiler used to |
|||
produce the work, or an object code interpreter used to run it. |
|||
|
|||
The "Corresponding Source" for a work in object code form means all |
|||
the source code needed to generate, install, and (for an executable |
|||
work) run the object code and to modify the work, including scripts to |
|||
control those activities. However, it does not include the work's |
|||
System Libraries, or general-purpose tools or generally available free |
|||
programs which are used unmodified in performing those activities but |
|||
which are not part of the work. For example, Corresponding Source |
|||
includes interface definition files associated with source files for |
|||
the work, and the source code for shared libraries and dynamically |
|||
linked subprograms that the work is specifically designed to require, |
|||
such as by intimate data communication or control flow between those |
|||
subprograms and other parts of the work. |
|||
|
|||
The Corresponding Source need not include anything that users |
|||
can regenerate automatically from other parts of the Corresponding |
|||
Source. |
|||
|
|||
The Corresponding Source for a work in source code form is that |
|||
same work. |
|||
|
|||
2. Basic Permissions. |
|||
|
|||
All rights granted under this License are granted for the term of |
|||
copyright on the Program, and are irrevocable provided the stated |
|||
conditions are met. This License explicitly affirms your unlimited |
|||
permission to run the unmodified Program. The output from running a |
|||
covered work is covered by this License only if the output, given its |
|||
content, constitutes a covered work. This License acknowledges your |
|||
rights of fair use or other equivalent, as provided by copyright law. |
|||
|
|||
You may make, run and propagate covered works that you do not |
|||
convey, without conditions so long as your license otherwise remains |
|||
in force. You may convey covered works to others for the sole purpose |
|||
of having them make modifications exclusively for you, or provide you |
|||
with facilities for running those works, provided that you comply with |
|||
the terms of this License in conveying all material for which you do |
|||
not control copyright. Those thus making or running the covered works |
|||
for you must do so exclusively on your behalf, under your direction |
|||
and control, on terms that prohibit them from making any copies of |
|||
your copyrighted material outside their relationship with you. |
|||
|
|||
Conveying under any other circumstances is permitted solely under |
|||
the conditions stated below. Sublicensing is not allowed; section 10 |
|||
makes it unnecessary. |
|||
|
|||
3. Protecting Users' Legal Rights From Anti-Circumvention Law. |
|||
|
|||
No covered work shall be deemed part of an effective technological |
|||
measure under any applicable law fulfilling obligations under article |
|||
11 of the WIPO copyright treaty adopted on 20 December 1996, or |
|||
similar laws prohibiting or restricting circumvention of such |
|||
measures. |
|||
|
|||
When you convey a covered work, you waive any legal power to forbid |
|||
circumvention of technological measures to the extent such circumvention |
|||
is effected by exercising rights under this License with respect to |
|||
the covered work, and you disclaim any intention to limit operation or |
|||
modification of the work as a means of enforcing, against the work's |
|||
users, your or third parties' legal rights to forbid circumvention of |
|||
technological measures. |
|||
|
|||
4. Conveying Verbatim Copies. |
|||
|
|||
You may convey verbatim copies of the Program's source code as you |
|||
receive it, in any medium, provided that you conspicuously and |
|||
appropriately publish on each copy an appropriate copyright notice; |
|||
keep intact all notices stating that this License and any |
|||
non-permissive terms added in accord with section 7 apply to the code; |
|||
keep intact all notices of the absence of any warranty; and give all |
|||
recipients a copy of this License along with the Program. |
|||
|
|||
You may charge any price or no price for each copy that you convey, |
|||
and you may offer support or warranty protection for a fee. |
|||
|
|||
5. Conveying Modified Source Versions. |
|||
|
|||
You may convey a work based on the Program, or the modifications to |
|||
produce it from the Program, in the form of source code under the |
|||
terms of section 4, provided that you also meet all of these conditions: |
|||
|
|||
a) The work must carry prominent notices stating that you modified |
|||
it, and giving a relevant date. |
|||
|
|||
b) The work must carry prominent notices stating that it is |
|||
released under this License and any conditions added under section |
|||
7. This requirement modifies the requirement in section 4 to |
|||
"keep intact all notices". |
|||
|
|||
c) You must license the entire work, as a whole, under this |
|||
License to anyone who comes into possession of a copy. This |
|||
License will therefore apply, along with any applicable section 7 |
|||
additional terms, to the whole of the work, and all its parts, |
|||
regardless of how they are packaged. This License gives no |
|||
permission to license the work in any other way, but it does not |
|||
invalidate such permission if you have separately received it. |
|||
|
|||
d) If the work has interactive user interfaces, each must display |
|||
Appropriate Legal Notices; however, if the Program has interactive |
|||
interfaces that do not display Appropriate Legal Notices, your |
|||
work need not make them do so. |
|||
|
|||
A compilation of a covered work with other separate and independent |
|||
works, which are not by their nature extensions of the covered work, |
|||
and which are not combined with it such as to form a larger program, |
|||
in or on a volume of a storage or distribution medium, is called an |
|||
"aggregate" if the compilation and its resulting copyright are not |
|||
used to limit the access or legal rights of the compilation's users |
|||
beyond what the individual works permit. Inclusion of a covered work |
|||
in an aggregate does not cause this License to apply to the other |
|||
parts of the aggregate. |
|||
|
|||
6. Conveying Non-Source Forms. |
|||
|
|||
You may convey a covered work in object code form under the terms |
|||
of sections 4 and 5, provided that you also convey the |
|||
machine-readable Corresponding Source under the terms of this License, |
|||
in one of these ways: |
|||
|
|||
a) Convey the object code in, or embodied in, a physical product |
|||
(including a physical distribution medium), accompanied by the |
|||
Corresponding Source fixed on a durable physical medium |
|||
customarily used for software interchange. |
|||
|
|||
b) Convey the object code in, or embodied in, a physical product |
|||
(including a physical distribution medium), accompanied by a |
|||
written offer, valid for at least three years and valid for as |
|||
long as you offer spare parts or customer support for that product |
|||
model, to give anyone who possesses the object code either (1) a |
|||
copy of the Corresponding Source for all the software in the |
|||
product that is covered by this License, on a durable physical |
|||
medium customarily used for software interchange, for a price no |
|||
more than your reasonable cost of physically performing this |
|||
conveying of source, or (2) access to copy the |
|||
Corresponding Source from a network server at no charge. |
|||
|
|||
c) Convey individual copies of the object code with a copy of the |
|||
written offer to provide the Corresponding Source. This |
|||
alternative is allowed only occasionally and noncommercially, and |
|||
only if you received the object code with such an offer, in accord |
|||
with subsection 6b. |
|||
|
|||
d) Convey the object code by offering access from a designated |
|||
place (gratis or for a charge), and offer equivalent access to the |
|||
Corresponding Source in the same way through the same place at no |
|||
further charge. You need not require recipients to copy the |
|||
Corresponding Source along with the object code. If the place to |
|||
copy the object code is a network server, the Corresponding Source |
|||
may be on a different server (operated by you or a third party) |
|||
that supports equivalent copying facilities, provided you maintain |
|||
clear directions next to the object code saying where to find the |
|||
Corresponding Source. Regardless of what server hosts the |
|||
Corresponding Source, you remain obligated to ensure that it is |
|||
available for as long as needed to satisfy these requirements. |
|||
|
|||
e) Convey the object code using peer-to-peer transmission, provided |
|||
you inform other peers where the object code and Corresponding |
|||
Source of the work are being offered to the general public at no |
|||
charge under subsection 6d. |
|||
|
|||
A separable portion of the object code, whose source code is excluded |
|||
from the Corresponding Source as a System Library, need not be |
|||
included in conveying the object code work. |
|||
|
|||
A "User Product" is either (1) a "consumer product", which means any |
|||
tangible personal property which is normally used for personal, family, |
|||
or household purposes, or (2) anything designed or sold for incorporation |
|||
into a dwelling. In determining whether a product is a consumer product, |
|||
doubtful cases shall be resolved in favor of coverage. For a particular |
|||
product received by a particular user, "normally used" refers to a |
|||
typical or common use of that class of product, regardless of the status |
|||
of the particular user or of the way in which the particular user |
|||
actually uses, or expects or is expected to use, the product. A product |
|||
is a consumer product regardless of whether the product has substantial |
|||
commercial, industrial or non-consumer uses, unless such uses represent |
|||
the only significant mode of use of the product. |
|||
|
|||
"Installation Information" for a User Product means any methods, |
|||
procedures, authorization keys, or other information required to install |
|||
and execute modified versions of a covered work in that User Product from |
|||
a modified version of its Corresponding Source. The information must |
|||
suffice to ensure that the continued functioning of the modified object |
|||
code is in no case prevented or interfered with solely because |
|||
modification has been made. |
|||
|
|||
If you convey an object code work under this section in, or with, or |
|||
specifically for use in, a User Product, and the conveying occurs as |
|||
part of a transaction in which the right of possession and use of the |
|||
User Product is transferred to the recipient in perpetuity or for a |
|||
fixed term (regardless of how the transaction is characterized), the |
|||
Corresponding Source conveyed under this section must be accompanied |
|||
by the Installation Information. But this requirement does not apply |
|||
if neither you nor any third party retains the ability to install |
|||
modified object code on the User Product (for example, the work has |
|||
been installed in ROM). |
|||
|
|||
The requirement to provide Installation Information does not include a |
|||
requirement to continue to provide support service, warranty, or updates |
|||
for a work that has been modified or installed by the recipient, or for |
|||
the User Product in which it has been modified or installed. Access to a |
|||
network may be denied when the modification itself materially and |
|||
adversely affects the operation of the network or violates the rules and |
|||
protocols for communication across the network. |
|||
|
|||
Corresponding Source conveyed, and Installation Information provided, |
|||
in accord with this section must be in a format that is publicly |
|||
documented (and with an implementation available to the public in |
|||
source code form), and must require no special password or key for |
|||
unpacking, reading or copying. |
|||
|
|||
7. Additional Terms. |
|||
|
|||
"Additional permissions" are terms that supplement the terms of this |
|||
License by making exceptions from one or more of its conditions. |
|||
Additional permissions that are applicable to the entire Program shall |
|||
be treated as though they were included in this License, to the extent |
|||
that they are valid under applicable law. If additional permissions |
|||
apply only to part of the Program, that part may be used separately |
|||
under those permissions, but the entire Program remains governed by |
|||
this License without regard to the additional permissions. |
|||
|
|||
When you convey a copy of a covered work, you may at your option |
|||
remove any additional permissions from that copy, or from any part of |
|||
it. (Additional permissions may be written to require their own |
|||
removal in certain cases when you modify the work.) You may place |
|||
additional permissions on material, added by you to a covered work, |
|||
for which you have or can give appropriate copyright permission. |
|||
|
|||
Notwithstanding any other provision of this License, for material you |
|||
add to a covered work, you may (if authorized by the copyright holders of |
|||
that material) supplement the terms of this License with terms: |
|||
|
|||
a) Disclaiming warranty or limiting liability differently from the |
|||
terms of sections 15 and 16 of this License; or |
|||
|
|||
b) Requiring preservation of specified reasonable legal notices or |
|||
author attributions in that material or in the Appropriate Legal |
|||
Notices displayed by works containing it; or |
|||
|
|||
c) Prohibiting misrepresentation of the origin of that material, or |
|||
requiring that modified versions of such material be marked in |
|||
reasonable ways as different from the original version; or |
|||
|
|||
d) Limiting the use for publicity purposes of names of licensors or |
|||
authors of the material; or |
|||
|
|||
e) Declining to grant rights under trademark law for use of some |
|||
trade names, trademarks, or service marks; or |
|||
|
|||
f) Requiring indemnification of licensors and authors of that |
|||
material by anyone who conveys the material (or modified versions of |
|||
it) with contractual assumptions of liability to the recipient, for |
|||
any liability that these contractual assumptions directly impose on |
|||
those licensors and authors. |
|||
|
|||
All other non-permissive additional terms are considered "further |
|||
restrictions" within the meaning of section 10. If the Program as you |
|||
received it, or any part of it, contains a notice stating that it is |
|||
governed by this License along with a term that is a further |
|||
restriction, you may remove that term. If a license document contains |
|||
a further restriction but permits relicensing or conveying under this |
|||
License, you may add to a covered work material governed by the terms |
|||
of that license document, provided that the further restriction does |
|||
not survive such relicensing or conveying. |
|||
|
|||
If you add terms to a covered work in accord with this section, you |
|||
must place, in the relevant source files, a statement of the |
|||
additional terms that apply to those files, or a notice indicating |
|||
where to find the applicable terms. |
|||
|
|||
Additional terms, permissive or non-permissive, may be stated in the |
|||
form of a separately written license, or stated as exceptions; |
|||
the above requirements apply either way. |
|||
|
|||
8. Termination. |
|||
|
|||
You may not propagate or modify a covered work except as expressly |
|||
provided under this License. Any attempt otherwise to propagate or |
|||
modify it is void, and will automatically terminate your rights under |
|||
this License (including any patent licenses granted under the third |
|||
paragraph of section 11). |
|||
|
|||
However, if you cease all violation of this License, then your |
|||
license from a particular copyright holder is reinstated (a) |
|||
provisionally, unless and until the copyright holder explicitly and |
|||
finally terminates your license, and (b) permanently, if the copyright |
|||
holder fails to notify you of the violation by some reasonable means |
|||
prior to 60 days after the cessation. |
|||
|
|||
Moreover, your license from a particular copyright holder is |
|||
reinstated permanently if the copyright holder notifies you of the |
|||
violation by some reasonable means, this is the first time you have |
|||
received notice of violation of this License (for any work) from that |
|||
copyright holder, and you cure the violation prior to 30 days after |
|||
your receipt of the notice. |
|||
|
|||
Termination of your rights under this section does not terminate the |
|||
licenses of parties who have received copies or rights from you under |
|||
this License. If your rights have been terminated and not permanently |
|||
reinstated, you do not qualify to receive new licenses for the same |
|||
material under section 10. |
|||
|
|||
9. Acceptance Not Required for Having Copies. |
|||
|
|||
You are not required to accept this License in order to receive or |
|||
run a copy of the Program. Ancillary propagation of a covered work |
|||
occurring solely as a consequence of using peer-to-peer transmission |
|||
to receive a copy likewise does not require acceptance. However, |
|||
nothing other than this License grants you permission to propagate or |
|||
modify any covered work. These actions infringe copyright if you do |
|||
not accept this License. Therefore, by modifying or propagating a |
|||
covered work, you indicate your acceptance of this License to do so. |
|||
|
|||
10. Automatic Licensing of Downstream Recipients. |
|||
|
|||
Each time you convey a covered work, the recipient automatically |
|||
receives a license from the original licensors, to run, modify and |
|||
propagate that work, subject to this License. You are not responsible |
|||
for enforcing compliance by third parties with this License. |
|||
|
|||
An "entity transaction" is a transaction transferring control of an |
|||
organization, or substantially all assets of one, or subdividing an |
|||
organization, or merging organizations. If propagation of a covered |
|||
work results from an entity transaction, each party to that |
|||
transaction who receives a copy of the work also receives whatever |
|||
licenses to the work the party's predecessor in interest had or could |
|||
give under the previous paragraph, plus a right to possession of the |
|||
Corresponding Source of the work from the predecessor in interest, if |
|||
the predecessor has it or can get it with reasonable efforts. |
|||
|
|||
You may not impose any further restrictions on the exercise of the |
|||
rights granted or affirmed under this License. For example, you may |
|||
not impose a license fee, royalty, or other charge for exercise of |
|||
rights granted under this License, and you may not initiate litigation |
|||
(including a cross-claim or counterclaim in a lawsuit) alleging that |
|||
any patent claim is infringed by making, using, selling, offering for |
|||
sale, or importing the Program or any portion of it. |
|||
|
|||
11. Patents. |
|||
|
|||
A "contributor" is a copyright holder who authorizes use under this |
|||
License of the Program or a work on which the Program is based. The |
|||
work thus licensed is called the contributor's "contributor version". |
|||
|
|||
A contributor's "essential patent claims" are all patent claims |
|||
owned or controlled by the contributor, whether already acquired or |
|||
hereafter acquired, that would be infringed by some manner, permitted |
|||
by this License, of making, using, or selling its contributor version, |
|||
but do not include claims that would be infringed only as a |
|||
consequence of further modification of the contributor version. For |
|||
purposes of this definition, "control" includes the right to grant |
|||
patent sublicenses in a manner consistent with the requirements of |
|||
this License. |
|||
|
|||
Each contributor grants you a non-exclusive, worldwide, royalty-free |
|||
patent license under the contributor's essential patent claims, to |
|||
make, use, sell, offer for sale, import and otherwise run, modify and |
|||
propagate the contents of its contributor version. |
|||
|
|||
In the following three paragraphs, a "patent license" is any express |
|||
agreement or commitment, however denominated, not to enforce a patent |
|||
(such as an express permission to practice a patent or covenant not to |
|||
sue for patent infringement). To "grant" such a patent license to a |
|||
party means to make such an agreement or commitment not to enforce a |
|||
patent against the party. |
|||
|
|||
If you convey a covered work, knowingly relying on a patent license, |
|||
and the Corresponding Source of the work is not available for anyone |
|||
to copy, free of charge and under the terms of this License, through a |
|||
publicly available network server or other readily accessible means, |
|||
then you must either (1) cause the Corresponding Source to be so |
|||
available, or (2) arrange to deprive yourself of the benefit of the |
|||
patent license for this particular work, or (3) arrange, in a manner |
|||
consistent with the requirements of this License, to extend the patent |
|||
license to downstream recipients. "Knowingly relying" means you have |
|||
actual knowledge that, but for the patent license, your conveying the |
|||
covered work in a country, or your recipient's use of the covered work |
|||
in a country, would infringe one or more identifiable patents in that |
|||
country that you have reason to believe are valid. |
|||
|
|||
If, pursuant to or in connection with a single transaction or |
|||
arrangement, you convey, or propagate by procuring conveyance of, a |
|||
covered work, and grant a patent license to some of the parties |
|||
receiving the covered work authorizing them to use, propagate, modify |
|||
or convey a specific copy of the covered work, then the patent license |
|||
you grant is automatically extended to all recipients of the covered |
|||
work and works based on it. |
|||
|
|||
A patent license is "discriminatory" if it does not include within |
|||
the scope of its coverage, prohibits the exercise of, or is |
|||
conditioned on the non-exercise of one or more of the rights that are |
|||
specifically granted under this License. You may not convey a covered |
|||
work if you are a party to an arrangement with a third party that is |
|||
in the business of distributing software, under which you make payment |
|||
to the third party based on the extent of your activity of conveying |
|||
the work, and under which the third party grants, to any of the |
|||
parties who would receive the covered work from you, a discriminatory |
|||
patent license (a) in connection with copies of the covered work |
|||
conveyed by you (or copies made from those copies), or (b) primarily |
|||
for and in connection with specific products or compilations that |
|||
contain the covered work, unless you entered into that arrangement, |
|||
or that patent license was granted, prior to 28 March 2007. |
|||
|
|||
Nothing in this License shall be construed as excluding or limiting |
|||
any implied license or other defenses to infringement that may |
|||
otherwise be available to you under applicable patent law. |
|||
|
|||
12. No Surrender of Others' Freedom. |
|||
|
|||
If conditions are imposed on you (whether by court order, agreement or |
|||
otherwise) that contradict the conditions of this License, they do not |
|||
excuse you from the conditions of this License. If you cannot convey a |
|||
covered work so as to satisfy simultaneously your obligations under this |
|||
License and any other pertinent obligations, then as a consequence you may |
|||
not convey it at all. For example, if you agree to terms that obligate you |
|||
to collect a royalty for further conveying from those to whom you convey |
|||
the Program, the only way you could satisfy both those terms and this |
|||
License would be to refrain entirely from conveying the Program. |
|||
|
|||
13. Remote Network Interaction; Use with the GNU General Public License. |
|||
|
|||
Notwithstanding any other provision of this License, if you modify the |
|||
Program, your modified version must prominently offer all users |
|||
interacting with it remotely through a computer network (if your version |
|||
supports such interaction) an opportunity to receive the Corresponding |
|||
Source of your version by providing access to the Corresponding Source |
|||
from a network server at no charge, through some standard or customary |
|||
means of facilitating copying of software. This Corresponding Source |
|||
shall include the Corresponding Source for any work covered by version 3 |
|||
of the GNU General Public License that is incorporated pursuant to the |
|||
following paragraph. |
|||
|
|||
Notwithstanding any other provision of this License, you have |
|||
permission to link or combine any covered work with a work licensed |
|||
under version 3 of the GNU General Public License into a single |
|||
combined work, and to convey the resulting work. The terms of this |
|||
License will continue to apply to the part which is the covered work, |
|||
but the work with which it is combined will remain governed by version |
|||
3 of the GNU General Public License. |
|||
|
|||
14. Revised Versions of this License. |
|||
|
|||
The Free Software Foundation may publish revised and/or new versions of |
|||
the GNU Affero General Public License from time to time. Such new versions |
|||
will be similar in spirit to the present version, but may differ in detail to |
|||
address new problems or concerns. |
|||
|
|||
Each version is given a distinguishing version number. If the |
|||
Program specifies that a certain numbered version of the GNU Affero General |
|||
Public License "or any later version" applies to it, you have the |
|||
option of following the terms and conditions either of that numbered |
|||
version or of any later version published by the Free Software |
|||
Foundation. If the Program does not specify a version number of the |
|||
GNU Affero General Public License, you may choose any version ever published |
|||
by the Free Software Foundation. |
|||
|
|||
If the Program specifies that a proxy can decide which future |
|||
versions of the GNU Affero General Public License can be used, that proxy's |
|||
public statement of acceptance of a version permanently authorizes you |
|||
to choose that version for the Program. |
|||
|
|||
Later license versions may give you additional or different |
|||
permissions. However, no additional obligations are imposed on any |
|||
author or copyright holder as a result of your choosing to follow a |
|||
later version. |
|||
|
|||
15. Disclaimer of Warranty. |
|||
|
|||
THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY |
|||
APPLICABLE LAW. EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT |
|||
HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY |
|||
OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, |
|||
THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR |
|||
PURPOSE. THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM |
|||
IS WITH YOU. SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF |
|||
ALL NECESSARY SERVICING, REPAIR OR CORRECTION. |
|||
|
|||
16. Limitation of Liability. |
|||
|
|||
IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING |
|||
WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR CONVEYS |
|||
THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY |
|||
GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE |
|||
USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF |
|||
DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD |
|||
PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS), |
|||
EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF |
|||
SUCH DAMAGES. |
|||
|
|||
17. Interpretation of Sections 15 and 16. |
|||
|
|||
If the disclaimer of warranty and limitation of liability provided |
|||
above cannot be given local legal effect according to their terms, |
|||
reviewing courts shall apply local law that most closely approximates |
|||
an absolute waiver of all civil liability in connection with the |
|||
Program, unless a warranty or assumption of liability accompanies a |
|||
copy of the Program in return for a fee. |
|||
|
|||
END OF TERMS AND CONDITIONS |
@ -0,0 +1,24 @@ |
|||
# MuK Preview Image |
|||
|
|||
Extendes the Preview Dialog to support images. Currently the following image extensions are supported: |
|||
|
|||
* CIS-Cod-Dateien (*.cod, image/cis-cod) |
|||
* CMU-Raster-Dateien (*.ras, image/cmu-raster) |
|||
* FIF-Dateien (*.fif, image/fif) |
|||
* GIF-Dateien (*.gif, image/gif) |
|||
* IEF-Dateien (*.ief, image/ief) |
|||
* JPEG-Dateien (*.jpeg *.jpg *.jpe, image/jpeg) |
|||
* PNG-Dateien (*.png, image/png) |
|||
* TIFF-Dateien (*.tiff *.tif, image/tiff) |
|||
* Vasa-Dateien (*.mcf, image/vasa) |
|||
* Bitmap-Dateien (WAP) (*.wbmp, image/vnd.wap.wbmp) |
|||
* Freehand-Dateien (*.fh4 *.fh5 *.fhc, image/x-freehand) |
|||
* Icon-Dateien (*.ico, image/x-icon) |
|||
* PBM Anymap Dateien (*.pnm, image/x-portable-anymap) |
|||
* PBM Bitmap Dateien (*.pbm, image/x-portable-bitmap) |
|||
* PBM Graymap Dateien (*.pgm, image/x-portable-graymap) |
|||
* PBM Pixmap Dateien (*.ppm, image/x-portable-pixmap) |
|||
* RGB-Dateien (*.rgb, image/x-rgb) |
|||
* X-Windows Dump (*.xwd, image/x-windowdump) |
|||
* XBM-Dateien (*.xbm, image/x-xbitmap) |
|||
* XPM-Dateien (*.xpm, image/x-xpixmap) |
@ -0,0 +1,20 @@ |
|||
# -*- coding: utf-8 -*- |
|||
|
|||
################################################################################### |
|||
# |
|||
# Copyright (C) 2017 MuK IT GmbH |
|||
# |
|||
# This program is free software: you can redistribute it and/or modify |
|||
# it under the terms of the GNU Affero General Public License as |
|||
# published by the Free Software Foundation, either version 3 of the |
|||
# License, or (at your option) any later version. |
|||
# |
|||
# This program is distributed in the hope that it will be useful, |
|||
# but WITHOUT ANY WARRANTY; without even the implied warranty of |
|||
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
|||
# GNU Affero General Public License for more details. |
|||
# |
|||
# You should have received a copy of the GNU Affero General Public License |
|||
# along with this program. If not, see <http://www.gnu.org/licenses/>. |
|||
# |
|||
################################################################################### |
@ -0,0 +1,78 @@ |
|||
# -*- coding: utf-8 -*- |
|||
|
|||
################################################################################### |
|||
# |
|||
# Copyright (C) 2017 MuK IT GmbH |
|||
# |
|||
# This program is free software: you can redistribute it and/or modify |
|||
# it under the terms of the GNU Affero General Public License as |
|||
# published by the Free Software Foundation, either version 3 of the |
|||
# License, or (at your option) any later version. |
|||
# |
|||
# This program is distributed in the hope that it will be useful, |
|||
# but WITHOUT ANY WARRANTY; without even the implied warranty of |
|||
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
|||
# GNU Affero General Public License for more details. |
|||
# |
|||
# You should have received a copy of the GNU Affero General Public License |
|||
# along with this program. If not, see <http://www.gnu.org/licenses/>. |
|||
# |
|||
################################################################################### |
|||
|
|||
{ |
|||
"name": "MuK Preview Image", |
|||
"summary": """Image Preview""", |
|||
"description": """ |
|||
Extendes the Preview Dialog to support images. |
|||
Currently the following image extensions are supported: |
|||
- CIS-Cod-Dateien (*.cod, image/cis-cod) |
|||
- CMU-Raster-Dateien (*.ras, image/cmu-raster) |
|||
- FIF-Dateien (*.fif, image/fif) |
|||
- GIF-Dateien (*.gif, image/gif) |
|||
- IEF-Dateien (*.ief, image/ief) |
|||
- JPEG-Dateien (*.jpeg *.jpg *.jpe, image/jpeg) |
|||
- PNG-Dateien (*.png, image/png) |
|||
- TIFF-Dateien (*.tiff *.tif, image/tiff) |
|||
- Vasa-Dateien (*.mcf, image/vasa) |
|||
- Bitmap-Dateien (WAP) (*.wbmp, image/vnd.wap.wbmp) |
|||
- Freehand-Dateien (*.fh4 *.fh5 *.fhc, image/x-freehand) |
|||
- Icon-Dateien (*.ico, image/x-icon) |
|||
- PBM Anymap Dateien (*.pnm, image/x-portable-anymap) |
|||
- PBM Bitmap Dateien (*.pbm, image/x-portable-bitmap) |
|||
- PBM Graymap Dateien (*.pgm, image/x-portable-graymap) |
|||
- PBM Pixmap Dateien (*.ppm, image/x-portable-pixmap) |
|||
- RGB-Dateien (*.rgb, image/x-rgb) |
|||
- X-Windows Dump (*.xwd, image/x-windowdump) |
|||
- XBM-Dateien (*.xbm, image/x-xbitmap) |
|||
- XPM-Dateien (*.xpm, image/x-xpixmap) |
|||
""", |
|||
"version": "10.0.1.0.0", |
|||
"category": "Extra Tools", |
|||
"license": "AGPL-3", |
|||
"website": "http://www.mukit.at", |
|||
"author": "MuK IT", |
|||
"contributors": [ |
|||
"Mathias Markl <mathias.markl@mukit.at>", |
|||
], |
|||
"depends": [ |
|||
"muk_web_preview", |
|||
], |
|||
"data": [ |
|||
"template/assets.xml", |
|||
], |
|||
"demo": [ |
|||
], |
|||
"qweb": [ |
|||
"static/src/xml/*.xml", |
|||
], |
|||
"images": [ |
|||
'static/description/banner.png' |
|||
], |
|||
"external_dependencies": { |
|||
"python": [], |
|||
"bin": [], |
|||
}, |
|||
"application": False, |
|||
"installable": True, |
|||
|
|||
} |
After Width: 1760 | Height: 880 | Size: 106 KiB |
After Width: 500 | Height: 500 | Size: 25 KiB |
@ -0,0 +1,67 @@ |
|||
<section class="oe_container"> |
|||
<div class="oe_row oe_spaced"> |
|||
<h2 class="oe_slogan">Preview Image</h2> |
|||
<h3 class="oe_slogan">Preview your images directly in Odoo.</h3> |
|||
<h4 class="oe_slogan" style="font-size: 23px;">MuK IT GmbH - |
|||
www.mukit.at</h4> |
|||
<div class="oe_demo oe_picture oe_screenshot"> |
|||
<img src="screenshot.png"> |
|||
</div> |
|||
</div> |
|||
</section> |
|||
|
|||
<section class="oe_container" style="padding-top: 25px;"> |
|||
<div class="oe_row oe_spaced"> |
|||
<div class="oe_picture"> |
|||
<h3 class="oe_slogan">Overview</h3> |
|||
<p class="oe_mt32">Extendes the Preview Dialog to support images. |
|||
Currently the following image extensions are supported:</p> |
|||
<p> |
|||
<span style="color: green;"> ☑ </span> CIS-Cod-Dateien (*.cod, |
|||
image/cis-cod) <br /> <span style="color: green;"> ☑ </span> |
|||
CMU-Raster-Dateien (*.ras, image/cmu-raster) <br /> <span |
|||
style="color: green;"> ☑ </span> FIF-Dateien (*.fif, |
|||
image/fif) <br /> <span style="color: green;"> ☑ </span> |
|||
GIF-Dateien (*.gif, image/gif) <br /> <span style="color: green;"> |
|||
☑ </span> IEF-Dateien (*.ief, image/ief) <br /> <span |
|||
style="color: green;"> ☑ </span> JPEG-Dateien (*.jpeg *.jpg |
|||
*.jpe, image/jpeg) <br /> <span style="color: green;"> |
|||
☑ </span> PNG-Dateien (*.png, image/png) <br /> <span |
|||
style="color: green;"> ☑ </span> TIFF-Dateien (*.tiff *.tif, |
|||
image/tiff) <br /> <span style="color: green;"> ☑ </span> |
|||
Vasa-Dateien (*.mcf, image/vasa) <br /> <span style="color: green;"> |
|||
☑ </span> Bitmap-Dateien (WAP) (*.wbmp, image/vnd.wap.wbmp) <br /> |
|||
<span style="color: green;"> ☑ </span> Freehand-Dateien (*.fh4 |
|||
*.fh5 *.fhc, image/x-freehand) <br /> <span style="color: green;"> |
|||
☑ </span> Icon-Dateien (*.ico, image/x-icon) <br /> <span |
|||
style="color: green;"> ☑ </span> PBM Anymap Dateien (*.pnm, |
|||
image/x-portable-anymap) <br /> <span style="color: green;"> |
|||
☑ </span> PBM Bitmap Dateien (*.pbm, image/x-portable-bitmap) <br /> |
|||
<span style="color: green;"> ☑ </span> PBM Graymap Dateien |
|||
(*.pgm, image/x-portable-graymap) <br /> <span |
|||
style="color: green;"> ☑ </span> PBM Pixmap Dateien (*.ppm, |
|||
image/x-portable-pixmap) <br /> <span style="color: green;"> |
|||
☑ </span> RGB-Dateien (*.rgb, image/x-rgb) <br /> <span |
|||
style="color: green;"> ☑ </span> X-Windows Dump (*.xwd, |
|||
image/x-windowdump) <br /> <span style="color: green;"> |
|||
☑ </span> XBM-Dateien (*.xbm, image/x-xbitmap) <br /> <span |
|||
style="color: green;"> ☑ </span> XPM-Dateien (*.xpm, |
|||
image/x-xpixmap) <br /> |
|||
</p> |
|||
</div> |
|||
</div> |
|||
</section> |
|||
|
|||
<section class="oe_container oe_dark"> |
|||
<h3 class="oe_slogan">Help and Support</h3> |
|||
<div class="oe_slogan"> |
|||
<a class="btn btn-primary btn-lg mt8" href="mailto:sale@mukit.at"> |
|||
<i class="fa fa-envelope"></i> Email |
|||
</a> |
|||
<a class="btn btn-primary btn-lg mt8" href="https://mukit.at/page/contactus"> |
|||
<i class="fa fa-phone"></i> Contact |
|||
</a> |
|||
</div> |
|||
<img src="logo.png" style="width: 200px; margin-bottom: 20px;" |
|||
class="center-block"> |
|||
</section> |
After Width: 500 | Height: 500 | Size: 37 KiB |
After Width: 993 | Height: 577 | Size: 53 KiB |
@ -0,0 +1,226 @@ |
|||
/* |
|||
ImageViewer v 1.1.0 |
|||
Author: Sudhanshu Yadav |
|||
Copyright (c) 2015 to Sudhanshu Yadav - ignitersworld.com , released under the MIT license. |
|||
Demo on: http://ignitersworld.com/lab/imageViewer.html |
|||
*/ |
|||
|
|||
/***** image viewer css *****/ |
|||
#iv-container { |
|||
position: fixed; |
|||
background: #0d0d0d; |
|||
width: 100%; |
|||
height: 100%; |
|||
top: 0; |
|||
left: 0; |
|||
display: none; |
|||
z-index: 1000; |
|||
} |
|||
|
|||
.iv-container { |
|||
overflow: hidden; |
|||
} |
|||
|
|||
.iv-close { |
|||
width: 32px; |
|||
height: 32px; |
|||
position: absolute; |
|||
right: 20px; |
|||
top: 20px; |
|||
cursor: pointer; |
|||
text-align: center; |
|||
overflow: hidden; |
|||
text-shadow: 0px 0px 3px #6d6d6d; |
|||
-webkit-transition: all ease 200ms; |
|||
-moz-transition: all ease 200ms; |
|||
-o-transition: all ease 200ms; |
|||
transition: all ease 200ms; |
|||
} |
|||
.iv-close:after, |
|||
.iv-close:before { |
|||
content: ""; |
|||
height: 4px; |
|||
width: 32px; |
|||
background: #FFF; |
|||
position: absolute; |
|||
left: 0; |
|||
top: 50%; |
|||
margin-top: -2px; |
|||
} |
|||
.iv-close:before { |
|||
-webkit-transform: rotate(45deg); |
|||
-moz-transform: rotate(45deg); |
|||
-ms-transform: rotate(45deg); |
|||
-o-transform: rotate(45deg); |
|||
transform: rotate(45deg); |
|||
} |
|||
.iv-close:after { |
|||
-webkit-transform: rotate(-45deg); |
|||
-moz-transform: rotate(-45deg); |
|||
-ms-transform: rotate(-45deg); |
|||
-o-transform: rotate(-45deg); |
|||
transform: rotate(-45deg); |
|||
} |
|||
.iv-close:hover { |
|||
-webkit-transform: rotate(90deg); |
|||
-moz-transform: rotate(90deg); |
|||
-ms-transform: rotate(90deg); |
|||
-o-transform: rotate(90deg); |
|||
transform: rotate(90deg); |
|||
} |
|||
/***** snap view css *****/ |
|||
.iv-snap-view { |
|||
width: 150px; |
|||
height: 150px; |
|||
position: absolute; |
|||
top: 20px; |
|||
left: 20px; |
|||
border: 1px solid #666; |
|||
background: black; |
|||
z-index: 100; |
|||
-webkit-box-sizing: content-box; |
|||
-moz-box-sizing: content-box; |
|||
box-sizing: content-box; |
|||
-webkit-transition: all ease 400ms; |
|||
-moz-transition: all ease 400ms; |
|||
-o-transition: all ease 400ms; |
|||
transition: all ease 400ms; |
|||
opacity: 0; |
|||
} |
|||
|
|||
.iv-snap-image-wrap { |
|||
display: inline-block; |
|||
position: absolute; |
|||
max-width: 150px; |
|||
max-height: 150px; |
|||
top: 50%; |
|||
left: 50%; |
|||
-webkit-transform: translate(-50%, -50%); |
|||
-moz-transform: translate(-50%, -50%); |
|||
-ms-transform: translate(-50%, -50%); |
|||
-o-transform: translate(-50%, -50%); |
|||
transform: translate(-50%, -50%); |
|||
overflow: hidden; |
|||
} |
|||
|
|||
.iv-snap-image { |
|||
position: relative; |
|||
} |
|||
|
|||
.iv-snap-handle { |
|||
position: absolute; |
|||
border: 1px solid #ccc; |
|||
-webkit-transform: translate3d(0, 0, 0); |
|||
-moz-transform: translate3d(0, 0, 0); |
|||
-ms-transform: translate3d(0, 0, 0); |
|||
-o-transform: translate3d(0, 0, 0); |
|||
transform: translate3d(0, 0, 0); |
|||
-webkit-box-shadow: 0px 0px 0px 200px rgba(0, 0, 0, 0.5); |
|||
-moz-box-shadow: 0px 0px 0px 200px rgba(0, 0, 0, 0.5); |
|||
box-shadow: 0px 0px 0px 200px rgba(0, 0, 0, 0.5); |
|||
} |
|||
|
|||
/*** zoom slider ***/ |
|||
.iv-zoom-slider { |
|||
width: 100%; |
|||
-webkit-box-sizing: content-box; |
|||
-moz-box-sizing: content-box; |
|||
box-sizing: content-box; |
|||
border: 1px solid #666; |
|||
border-top: 0; |
|||
background: rgba(204, 204, 204, 0.1); |
|||
height: 15px; |
|||
position: absolute; |
|||
top: 150px; |
|||
left: -1px; |
|||
} |
|||
|
|||
.iv-zoom-handle { |
|||
width: 20px; |
|||
height: 15px; |
|||
background: #ccc; |
|||
position: absolute; |
|||
} |
|||
|
|||
/**** snap view css end *****/ |
|||
.iv-image-view { |
|||
position: absolute; |
|||
height: 100%; |
|||
width: 100%; |
|||
} |
|||
|
|||
.iv-image-wrap { |
|||
display: inline-block; |
|||
} |
|||
|
|||
.iv-image-wrap:active { |
|||
cursor: move; |
|||
} |
|||
|
|||
.iv-large-image { |
|||
max-width: 100%; |
|||
max-height: 100%; |
|||
position: absolute; |
|||
-webkit-transform: translate3d(0, 0, 0); |
|||
-moz-transform: translate3d(0, 0, 0); |
|||
-ms-transform: translate3d(0, 0, 0); |
|||
-o-transform: translate3d(0, 0, 0); |
|||
transform: translate3d(0, 0, 0); |
|||
} |
|||
|
|||
/****** CSS loader by http://projects.lukehaas.me/css-loaders/ *****/ |
|||
.iv-loader { |
|||
top: 50%; |
|||
left: 50%; |
|||
border-radius: 50%; |
|||
width: 32px; |
|||
height: 32px; |
|||
z-index: 100; |
|||
margin-top: -16px; |
|||
margin-left: -16px; |
|||
font-size: 5px; |
|||
position: absolute; |
|||
text-indent: -9999em; |
|||
border-top: 1.1em solid rgba(255, 255, 255, 0.2); |
|||
border-right: 1.1em solid rgba(255, 255, 255, 0.2); |
|||
border-bottom: 1.1em solid rgba(255, 255, 255, 0.2); |
|||
border-left: 1.1em solid #ffffff; |
|||
-webkit-transform: translateZ(0); |
|||
-ms-transform: translateZ(0); |
|||
transform: translateZ(0); |
|||
-webkit-animation: load8 1.1s infinite linear; |
|||
animation: load8 1.1s infinite linear; |
|||
} |
|||
.iv-loader:after { |
|||
width: 10em; |
|||
height: 10em; |
|||
border-radius: 50%; |
|||
} |
|||
@-webkit-keyframes load8 { |
|||
0% { |
|||
-webkit-transform: rotate(0deg); |
|||
transform: rotate(0deg); |
|||
} |
|||
100% { |
|||
-webkit-transform: rotate(360deg); |
|||
transform: rotate(360deg); |
|||
} |
|||
} |
|||
@keyframes load8 { |
|||
0% { |
|||
-webkit-transform: rotate(0deg); |
|||
transform: rotate(0deg); |
|||
} |
|||
100% { |
|||
-webkit-transform: rotate(360deg); |
|||
transform: rotate(360deg); |
|||
} |
|||
} |
|||
|
|||
|
|||
@media screen and (max-width: 767px) { |
|||
.iv-snap-view { |
|||
z-index: -1; |
|||
visibility: hidden; |
|||
} |
|||
} |
@ -0,0 +1,788 @@ |
|||
/* |
|||
ImageViewer v 1.1.3 |
|||
Author: Sudhanshu Yadav |
|||
Copyright (c) 2015-2016 to Sudhanshu Yadav - ignitersworld.com , released under the MIT license. |
|||
Demo on: http://ignitersworld.com/lab/imageViewer.html
|
|||
*/ |
|||
|
|||
/*** picture view plugin ****/ |
|||
(function ($, window, document, undefined) { |
|||
"use strict"; |
|||
|
|||
//an empty function
|
|||
var noop = function () {}; |
|||
|
|||
var $body = $('body'), |
|||
$window = $(window), |
|||
$document = $(document); |
|||
|
|||
|
|||
//constants
|
|||
var ZOOM_CONSTANT = 15; //increase or decrease value for zoom on mouse wheel
|
|||
var MOUSE_WHEEL_COUNT = 5; //A mouse delta after which it should stop preventing default behaviour of mouse wheel
|
|||
|
|||
//ease out method
|
|||
/* |
|||
t : current time, |
|||
b : intial value, |
|||
c : changed value, |
|||
d : duration |
|||
*/ |
|||
function easeOutQuart(t, b, c, d) { |
|||
t /= d; |
|||
t--; |
|||
return -c * (t * t * t * t - 1) + b; |
|||
}; |
|||
|
|||
|
|||
// http://paulirish.com/2011/requestanimationframe-for-smart-animating/
|
|||
// http://my.opera.com/emoller/blog/2011/12/20/requestanimationframe-for-smart-er-animating
|
|||
|
|||
// requestAnimationFrame polyfill by Erik Möller
|
|||
// fixes from Paul Irish and Tino Zijdel
|
|||
|
|||
(function () { |
|||
var lastTime = 0; |
|||
var vendors = ['ms', 'moz', 'webkit', 'o']; |
|||
for (var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) { |
|||
window.requestAnimationFrame = window[vendors[x] + 'RequestAnimationFrame']; |
|||
window.cancelAnimationFrame = window[vendors[x] + 'CancelAnimationFrame'] || window[vendors[x] + 'CancelRequestAnimationFrame']; |
|||
} |
|||
|
|||
if (!window.requestAnimationFrame) |
|||
window.requestAnimationFrame = function (callback, element) { |
|||
var currTime = new Date().getTime(); |
|||
var timeToCall = Math.max(0, 16 - (currTime - lastTime)); |
|||
var id = window.setTimeout(function () { |
|||
callback(currTime + timeToCall); |
|||
}, |
|||
timeToCall); |
|||
lastTime = currTime + timeToCall; |
|||
return id; |
|||
}; |
|||
|
|||
if (!window.cancelAnimationFrame) |
|||
window.cancelAnimationFrame = function (id) { |
|||
clearTimeout(id); |
|||
}; |
|||
}()); |
|||
|
|||
//function to check if image is loaded
|
|||
function imageLoaded(img) { |
|||
return img.complete && (typeof img.naturalWidth === 'undefined' || img.naturalWidth !== 0); |
|||
} |
|||
|
|||
var imageViewHtml = '<div class="iv-loader"></div> <div class="iv-snap-view">' + '<div class="iv-snap-image-wrap">' + '<div class="iv-snap-handle"></div>' + '</div>' + '<div class="iv-zoom-slider"><div class="iv-zoom-handle"></div></div></div>' + '<div class="iv-image-view" ><div class="iv-image-wrap" ></div></div>'; |
|||
|
|||
//add a full screen view
|
|||
$(function () { |
|||
if(!$body.length) $body = $('body'); |
|||
$body.append('<div id="iv-container">' + imageViewHtml + '<div class="iv-close"></div><div>'); |
|||
}); |
|||
|
|||
function Slider(container, options) { |
|||
this.container = container; |
|||
this.onStart = options.onStart || noop; |
|||
this.onMove = options.onMove || noop; |
|||
this.onEnd = options.onEnd || noop; |
|||
this.sliderId = options.sliderId || 'slider' + Math.ceil(Math.random() * 1000000); |
|||
} |
|||
|
|||
Slider.prototype.init = function () { |
|||
var self = this, |
|||
container = this.container, |
|||
eventSuffix = '.' + this.sliderId; |
|||
|
|||
//assign event on snap image wrap
|
|||
this.container.on('touchstart' + eventSuffix + ' mousedown' + eventSuffix, function (estart) { |
|||
estart.preventDefault(); |
|||
var touchMove = (estart.type == "touchstart" ? "touchmove" : "mousemove") + eventSuffix, |
|||
touchEnd = (estart.type == "touchstart" ? "touchend" : "mouseup") + eventSuffix, |
|||
eOrginal = estart.originalEvent, |
|||
sx = eOrginal.clientX || eOrginal.touches[0].clientX, |
|||
sy = eOrginal.clientY || eOrginal.touches[0].clientY; |
|||
|
|||
var start = self.onStart(estart, { |
|||
x: sx, |
|||
y: sy |
|||
}); |
|||
|
|||
if (start === false) return; |
|||
|
|||
var moveListener = function (emove) { |
|||
emove.preventDefault(); |
|||
|
|||
eOrginal = emove.originalEvent; |
|||
|
|||
//get the cordinates
|
|||
var mx = eOrginal.clientX || eOrginal.touches[0].clientX, |
|||
my = eOrginal.clientY || eOrginal.touches[0].clientY; |
|||
|
|||
self.onMove(emove, { |
|||
dx: mx - sx, |
|||
dy: my - sy, |
|||
mx: mx, |
|||
my: my |
|||
}); |
|||
|
|||
}; |
|||
|
|||
var endListener = function () { |
|||
$document.off(touchMove, moveListener); |
|||
$document.off(touchEnd, endListener); |
|||
self.onEnd(); |
|||
}; |
|||
|
|||
$document.on(touchMove, moveListener); |
|||
$document.on(touchEnd, endListener); |
|||
}); |
|||
|
|||
return this; |
|||
} |
|||
|
|||
|
|||
function ImageViewer(container, options) { |
|||
var self = this; |
|||
|
|||
if (container.is('#iv-container')) { |
|||
self._fullPage = true; |
|||
} |
|||
|
|||
self.container = container; |
|||
options = self.options = $.extend({}, ImageViewer.defaults, options); |
|||
|
|||
self.zoomValue = 100; |
|||
|
|||
if (!container.find('.snap-view').length) { |
|||
container.prepend(imageViewHtml); |
|||
} |
|||
|
|||
container.addClass('iv-container'); |
|||
|
|||
if (container.css('position') == 'static') container.css('position', 'relative'); |
|||
|
|||
self.snapView = container.find('.iv-snap-view'); |
|||
self.snapImageWrap = container.find('.iv-snap-image-wrap'); |
|||
self.imageWrap = container.find('.iv-image-wrap'); |
|||
self.snapHandle = container.find('.iv-snap-handle'); |
|||
self.zoomHandle = container.find('.iv-zoom-handle'); |
|||
self._viewerId = 'iv' + Math.floor(Math.random() * 1000000); |
|||
} |
|||
|
|||
|
|||
ImageViewer.prototype = { |
|||
constructor: ImageViewer, |
|||
_init: function () { |
|||
var viewer = this, |
|||
options = viewer.options, |
|||
zooming = false, // tell weather we are zooming trough touch
|
|||
container = this.container; |
|||
|
|||
var eventSuffix = '.' + viewer._viewerId; |
|||
|
|||
//cache dom refrence
|
|||
var snapHandle = this.snapHandle; |
|||
var snapImgWrap = this.snapImageWrap; |
|||
var imageWrap = this.imageWrap; |
|||
|
|||
var snapSlider = new Slider(snapImgWrap, { |
|||
sliderId: viewer._viewerId, |
|||
onStart: function () { |
|||
|
|||
if (!viewer.loaded) return false; |
|||
|
|||
var handleStyle = snapHandle[0].style; |
|||
|
|||
this.curHandleTop = parseFloat(handleStyle.top); |
|||
this.curHandleLeft = parseFloat(handleStyle.left); |
|||
this.handleWidth = parseFloat(handleStyle.width); |
|||
this.handleHeight = parseFloat(handleStyle.height); |
|||
this.width = snapImgWrap.width(); |
|||
this.height = snapImgWrap.height(); |
|||
|
|||
//stop momentum on image
|
|||
clearInterval(imageSlider.slideMomentumCheck); |
|||
cancelAnimationFrame(imageSlider.sliderMomentumFrame); |
|||
}, |
|||
onMove: function (e, position) { |
|||
var xPerc = this.curHandleLeft + position.dx * 100 / this.width, |
|||
yPerc = this.curHandleTop + position.dy * 100 / this.height; |
|||
|
|||
xPerc = Math.max(0, xPerc); |
|||
xPerc = Math.min(100 - this.handleWidth, xPerc); |
|||
|
|||
yPerc = Math.max(0, yPerc); |
|||
yPerc = Math.min(100 - this.handleHeight, yPerc); |
|||
|
|||
|
|||
var containerDim = viewer.containerDim, |
|||
imgWidth = viewer.imageDim.w * (viewer.zoomValue / 100), |
|||
imgHeight = viewer.imageDim.h * (viewer.zoomValue / 100), |
|||
imgLeft = imgWidth < containerDim.w ? (containerDim.w - imgWidth) / 2 : -imgWidth * xPerc / 100, |
|||
imgTop = imgHeight < containerDim.h ? (containerDim.h - imgHeight) / 2 : -imgHeight * yPerc / 100; |
|||
|
|||
snapHandle.css({ |
|||
top: yPerc + '%', |
|||
left: xPerc + '%' |
|||
}) |
|||
|
|||
viewer.currentImg.css({ |
|||
left: imgLeft, |
|||
top: imgTop |
|||
}) |
|||
} |
|||
}).init(); |
|||
|
|||
|
|||
/*Add slide interaction to image*/ |
|||
var imageSlider = viewer._imageSlider = new Slider(imageWrap, { |
|||
sliderId: viewer._viewerId, |
|||
onStart: function (e, position) { |
|||
if (!viewer.loaded) return false; |
|||
if (zooming) return; |
|||
var self = this; |
|||
snapSlider.onStart(); |
|||
self.imgWidth = viewer.imageDim.w * viewer.zoomValue / 100; |
|||
self.imgHeight = viewer.imageDim.h * viewer.zoomValue / 100; |
|||
|
|||
self.positions = [position, position]; |
|||
|
|||
self.startPosition = position; |
|||
|
|||
//clear all animation frame and interval
|
|||
viewer._clearFrames(); |
|||
|
|||
self.slideMomentumCheck = setInterval(function () { |
|||
if (!self.currentPos) return; |
|||
self.positions.shift(); |
|||
self.positions.push({ |
|||
x: self.currentPos.mx, |
|||
y: self.currentPos.my |
|||
}) |
|||
}, 50); |
|||
}, |
|||
onMove: function (e, position) { |
|||
if (zooming) return; |
|||
this.currentPos = position; |
|||
|
|||
snapSlider.onMove(e, { |
|||
dx: -position.dx * snapSlider.width / this.imgWidth, |
|||
dy: -position.dy * snapSlider.height / this.imgHeight |
|||
}); |
|||
}, |
|||
onEnd: function () { |
|||
if (zooming) return; |
|||
var self = this; |
|||
|
|||
var xDiff = this.positions[1].x - this.positions[0].x, |
|||
yDiff = this.positions[1].y - this.positions[0].y; |
|||
|
|||
function momentum() { |
|||
if (step <= 60) { |
|||
self.sliderMomentumFrame = requestAnimationFrame(momentum); |
|||
} |
|||
|
|||
positionX = positionX + easeOutQuart(step, xDiff / 3, -xDiff / 3, 60); |
|||
positionY = positionY + easeOutQuart(step, yDiff / 3, -yDiff / 3, 60) |
|||
|
|||
|
|||
snapSlider.onMove(null, { |
|||
dx: -((positionX) * snapSlider.width / self.imgWidth), |
|||
dy: -((positionY) * snapSlider.height / self.imgHeight) |
|||
}); |
|||
step++; |
|||
} |
|||
|
|||
if (Math.abs(xDiff) > 30 || Math.abs(yDiff) > 30) { |
|||
var step = 1, |
|||
positionX = self.currentPos.dx, |
|||
positionY = self.currentPos.dy; |
|||
|
|||
momentum(); |
|||
} |
|||
} |
|||
}).init(); |
|||
|
|||
|
|||
/*Add zoom interation in mouse wheel*/ |
|||
var changedDelta = 0; |
|||
imageWrap.on("mousewheel" + eventSuffix + " DOMMouseScroll" + eventSuffix, function (e) { |
|||
if(!options.zoomOnMouseWheel) return; |
|||
|
|||
if (!viewer.loaded) return; |
|||
|
|||
|
|||
//clear all animation frame and interval
|
|||
viewer._clearFrames(); |
|||
|
|||
// cross-browser wheel delta
|
|||
var delta = Math.max(-1, Math.min(1, (e.originalEvent.wheelDelta || -e.originalEvent.detail))), |
|||
zoomValue = viewer.zoomValue * (100 + delta * ZOOM_CONSTANT) / 100; |
|||
|
|||
if(!(zoomValue >= 100 && zoomValue <= options.maxZoom)){ |
|||
changedDelta += Math.abs(delta); |
|||
} |
|||
else{ |
|||
changedDelta = 0; |
|||
} |
|||
|
|||
if(changedDelta > MOUSE_WHEEL_COUNT) return; |
|||
|
|||
e.preventDefault(); |
|||
|
|||
var contOffset = container.offset(), |
|||
x = (e.pageX || e.originalEvent.pageX) - contOffset.left, |
|||
y = (e.pageY || e.originalEvent.pageY) - contOffset.top; |
|||
|
|||
|
|||
|
|||
viewer.zoom(zoomValue, { |
|||
x: x, |
|||
y: y |
|||
}); |
|||
|
|||
//show the snap viewer
|
|||
showSnapView(); |
|||
}); |
|||
|
|||
|
|||
//apply pinch and zoom feature
|
|||
imageWrap.on('touchstart' + eventSuffix, function (estart) { |
|||
if (!viewer.loaded) return; |
|||
var touch0 = estart.originalEvent.touches[0], |
|||
touch1 = estart.originalEvent.touches[1]; |
|||
|
|||
if (!(touch0 && touch1)) { |
|||
return; |
|||
} |
|||
|
|||
|
|||
zooming = true; |
|||
|
|||
var contOffset = container.offset(); |
|||
|
|||
var startdist = Math.sqrt(Math.pow(touch1.pageX - touch0.pageX, 2) + Math.pow(touch1.pageY - touch0.pageY, 2)), |
|||
startZoom = viewer.zoomValue, |
|||
center = { |
|||
x: ((touch1.pageX + touch0.pageX) / 2) - contOffset.left, |
|||
y: ((touch1.pageY + touch0.pageY) / 2) - contOffset.top |
|||
} |
|||
|
|||
var moveListener = function (emove) { |
|||
emove.preventDefault(); |
|||
|
|||
var touch0 = emove.originalEvent.touches[0], |
|||
touch1 = emove.originalEvent.touches[1], |
|||
newDist = Math.sqrt(Math.pow(touch1.pageX - touch0.pageX, 2) + Math.pow(touch1.pageY - touch0.pageY, 2)), |
|||
zoomValue = startZoom + (newDist - startdist) / 2; |
|||
|
|||
viewer.zoom(zoomValue, center); |
|||
}; |
|||
|
|||
var endListener = function () { |
|||
$document.off('touchmove', moveListener); |
|||
$document.off('touchend', endListener); |
|||
zooming = false; |
|||
}; |
|||
|
|||
$document.on('touchmove', moveListener); |
|||
$document.on('touchend', endListener); |
|||
|
|||
}); |
|||
|
|||
|
|||
//handle double tap for zoom in and zoom out
|
|||
var touchtime = 0, |
|||
point; |
|||
imageWrap.on('click' + eventSuffix, function (e) { |
|||
if (touchtime == 0) { |
|||
touchtime = Date.now(); |
|||
point = { |
|||
x: e.pageX, |
|||
y: e.pageY |
|||
}; |
|||
} else { |
|||
if ((Date.now() - touchtime) < 500 && Math.abs(e.pageX - point.x) < 50 && Math.abs(e.pageY - point.y) < 50) { |
|||
if (viewer.zoomValue == options.zoomValue) { |
|||
viewer.zoom(200) |
|||
} else { |
|||
viewer.resetZoom() |
|||
} |
|||
touchtime = 0; |
|||
} else { |
|||
touchtime = 0; |
|||
} |
|||
} |
|||
}); |
|||
|
|||
//zoom in zoom out using zoom handle
|
|||
var slider = viewer.snapView.find('.iv-zoom-slider'); |
|||
var zoomSlider = new Slider(slider, { |
|||
sliderId: viewer._viewerId, |
|||
onStart: function (eStart) { |
|||
|
|||
if (!viewer.loaded) return false; |
|||
|
|||
this.leftOffset = slider.offset().left; |
|||
this.handleWidth = viewer.zoomHandle.width(); |
|||
this.onMove(eStart); |
|||
|
|||
}, |
|||
onMove: function (e, position) { |
|||
var newLeft = (e.pageX || e.originalEvent.touches[0].pageX) - this.leftOffset - this.handleWidth / 2; |
|||
|
|||
newLeft = Math.max(0, newLeft); |
|||
newLeft = Math.min(viewer._zoomSliderLength, newLeft); |
|||
|
|||
var zoomValue = 100 + (options.maxZoom - 100) * newLeft / viewer._zoomSliderLength; |
|||
|
|||
viewer.zoom(zoomValue); |
|||
} |
|||
}).init(); |
|||
|
|||
|
|||
//display snapView on interaction
|
|||
var snapViewTimeout, snapViewVisible; |
|||
|
|||
function showSnapView(noTimeout) { |
|||
if(!options.snapView) return; |
|||
|
|||
if (snapViewVisible || viewer.zoomValue <= 100 || !viewer.loaded) return; |
|||
clearTimeout(snapViewTimeout); |
|||
snapViewVisible = true; |
|||
viewer.snapView.css('opacity', 1); |
|||
if (!noTimeout) { |
|||
snapViewTimeout = setTimeout(function () { |
|||
viewer.snapView.css('opacity', 0); |
|||
snapViewVisible = false; |
|||
}, 4000); |
|||
} |
|||
} |
|||
|
|||
imageWrap.on('touchmove' + eventSuffix + ' mousemove' + eventSuffix, function () { |
|||
showSnapView(); |
|||
}); |
|||
|
|||
var snapEventsCallback = {}; |
|||
snapEventsCallback['mouseenter' + eventSuffix + ' touchstart' + eventSuffix] = function () { |
|||
snapViewVisible = false; |
|||
showSnapView(true); |
|||
}; |
|||
|
|||
snapEventsCallback['mouseleave' + eventSuffix + ' touchend' + eventSuffix] = function () { |
|||
snapViewVisible = false; |
|||
showSnapView(); |
|||
}; |
|||
|
|||
viewer.snapView.on(snapEventsCallback); |
|||
|
|||
|
|||
//calculate elments size on window resize
|
|||
if (options.refreshOnResize) $window.on('resize' + eventSuffix, function () { |
|||
viewer.refresh() |
|||
}); |
|||
|
|||
if (viewer._fullPage) { |
|||
//prevent scrolling the backside if container if fixed positioned
|
|||
container.on('touchmove' + eventSuffix + ' mousewheel' + eventSuffix + ' DOMMouseScroll' + eventSuffix, function (e) { |
|||
e.preventDefault(); |
|||
}); |
|||
|
|||
//assign event on close button
|
|||
container.find('.iv-close').on('click' + eventSuffix, function () { |
|||
viewer.hide(); |
|||
}); |
|||
} |
|||
}, |
|||
|
|||
//method to zoom images
|
|||
zoom: function (perc, point) { |
|||
perc = Math.round(Math.max(100, perc)); |
|||
perc = Math.min(this.options.maxZoom, perc); |
|||
|
|||
point = point || { |
|||
x: this.containerDim.w / 2, |
|||
y: this.containerDim.h / 2 |
|||
}; |
|||
|
|||
var self = this, |
|||
maxZoom = this.options.maxZoom, |
|||
curPerc = this.zoomValue, |
|||
curImg = this.currentImg, |
|||
containerDim = this.containerDim, |
|||
curLeft = parseFloat(curImg.css('left')), |
|||
curTop = parseFloat(curImg.css('top')); |
|||
|
|||
self._clearFrames(); |
|||
|
|||
var step = 0; |
|||
|
|||
//calculate base top,left,bottom,right
|
|||
var containerDim = self.containerDim, |
|||
imageDim = self.imageDim; |
|||
var baseLeft = (containerDim.w - imageDim.w) / 2, |
|||
baseTop = (containerDim.h - imageDim.h) / 2, |
|||
baseRight = containerDim.w - baseLeft, |
|||
baseBottom = containerDim.h - baseTop; |
|||
|
|||
function zoom() { |
|||
step++; |
|||
|
|||
if (step < 20) { |
|||
self._zoomFrame = requestAnimationFrame(zoom); |
|||
} |
|||
|
|||
var tickZoom = easeOutQuart(step, curPerc, perc - curPerc, 20); |
|||
|
|||
|
|||
var ratio = tickZoom / curPerc, |
|||
imgWidth = self.imageDim.w * tickZoom / 100, |
|||
imgHeight = self.imageDim.h * tickZoom / 100, |
|||
newLeft = -((point.x - curLeft) * ratio - point.x), |
|||
newTop = -((point.y - curTop) * ratio - point.y); |
|||
|
|||
//fix for left and top
|
|||
newLeft = Math.min(newLeft, baseLeft); |
|||
newTop = Math.min(newTop, baseTop); |
|||
|
|||
//fix for right and bottom
|
|||
if((newLeft + imgWidth) < baseRight){ |
|||
newLeft = baseRight - imgWidth; //newLeft - (newLeft + imgWidth - baseRight)
|
|||
} |
|||
|
|||
if((newTop + imgHeight) < baseBottom){ |
|||
newTop = baseBottom - imgHeight; //newTop + (newTop + imgHeight - baseBottom)
|
|||
} |
|||
|
|||
|
|||
curImg.css({ |
|||
height: imgHeight + 'px', |
|||
width: imgWidth + 'px', |
|||
left: newLeft + 'px', |
|||
top: newTop + 'px' |
|||
}); |
|||
|
|||
self.zoomValue = tickZoom; |
|||
|
|||
self._resizeHandle(imgWidth, imgHeight, newLeft, newTop); |
|||
|
|||
//update zoom handle position
|
|||
self.zoomHandle.css('left', ((tickZoom - 100) * self._zoomSliderLength) / (maxZoom - 100) + 'px'); |
|||
} |
|||
|
|||
zoom(); |
|||
}, |
|||
_clearFrames: function () { |
|||
clearInterval(this._imageSlider.slideMomentumCheck); |
|||
cancelAnimationFrame(this._imageSlider.sliderMomentumFrame); |
|||
cancelAnimationFrame(this._zoomFrame) |
|||
}, |
|||
resetZoom: function () { |
|||
this.zoom(this.options.zoomValue); |
|||
}, |
|||
//calculate dimensions of image, container and reset the image
|
|||
_calculateDimensions: function () { |
|||
//calculate content width of image and snap image
|
|||
var self = this, |
|||
curImg = self.currentImg, |
|||
container = self.container, |
|||
snapView = self.snapView, |
|||
imageWidth = curImg.width(), |
|||
imageHeight = curImg.height(), |
|||
contWidth = container.width(), |
|||
contHeight = container.height(), |
|||
snapViewWidth = snapView.innerWidth(), |
|||
snapViewHeight = snapView.innerHeight(); |
|||
|
|||
//set the container dimension
|
|||
self.containerDim = { |
|||
w: contWidth, |
|||
h: contHeight |
|||
} |
|||
|
|||
//set the image dimension
|
|||
var imgWidth, imgHeight, ratio = imageWidth / imageHeight; |
|||
|
|||
imgWidth = (imageWidth > imageHeight && contHeight >= contWidth) || ratio * contHeight > contWidth ? contWidth : ratio * contHeight; |
|||
|
|||
imgHeight = imgWidth / ratio; |
|||
|
|||
self.imageDim = { |
|||
w: imgWidth, |
|||
h: imgHeight |
|||
} |
|||
|
|||
//reset image position and zoom
|
|||
curImg.css({ |
|||
width: imgWidth + 'px', |
|||
height: imgHeight + 'px', |
|||
left: (contWidth - imgWidth) / 2 + 'px', |
|||
top: (contHeight - imgHeight) / 2 + 'px', |
|||
'max-width': 'none', |
|||
'max-height': 'none' |
|||
}); |
|||
|
|||
//set the snap Image dimension
|
|||
var snapWidth = imgWidth > imgHeight ? snapViewWidth : imgWidth * snapViewHeight / imgHeight, |
|||
snapHeight = imgHeight > imgWidth ? snapViewHeight : imgHeight * snapViewWidth / imgWidth; |
|||
|
|||
self.snapImageDim = { |
|||
w: snapWidth, |
|||
h: snapHeight |
|||
} |
|||
|
|||
self.snapImg.css({ |
|||
width: snapWidth, |
|||
height: snapHeight |
|||
}); |
|||
|
|||
//calculate zoom slider area
|
|||
self._zoomSliderLength = snapViewWidth - self.zoomHandle.outerWidth(); |
|||
|
|||
}, |
|||
refresh: function () { |
|||
if (!this.loaded) return; |
|||
this._calculateDimensions(); |
|||
this.resetZoom(); |
|||
}, |
|||
_resizeHandle: function (imgWidth, imgHeight, imgLeft, imgTop) { |
|||
var curImg = this.currentImg, |
|||
imageWidth = imgWidth || this.imageDim.w * this.zoomValue / 100, |
|||
imageHeight = imgHeight || this.imageDim.h * this.zoomValue / 100, |
|||
left = Math.max(-(imgLeft || parseFloat(curImg.css('left'))) * 100 / imageWidth, 0), |
|||
top = Math.max(-(imgTop || parseFloat(curImg.css('top'))) * 100 / imageHeight, 0), |
|||
handleWidth = Math.min(this.containerDim.w * 100 / imageWidth, 100), |
|||
handleHeight = Math.min(this.containerDim.h * 100 / imageHeight, 100); |
|||
|
|||
|
|||
this.snapHandle.css({ |
|||
top: top + '%', |
|||
left: left + '%', |
|||
width: handleWidth + '%', |
|||
height: handleHeight + '%' |
|||
}); |
|||
}, |
|||
show: function (image, hiResImg) { |
|||
if (this._fullPage) { |
|||
this.container.show(); |
|||
if (image) this.load(image, hiResImg); |
|||
} |
|||
}, |
|||
hide: function () { |
|||
if (this._fullPage) { |
|||
this.container.hide(); |
|||
} |
|||
}, |
|||
options: function (key, value) { |
|||
if (!value) return this.options[key]; |
|||
|
|||
this.options[key] = value; |
|||
}, |
|||
destroy: function (key, value) { |
|||
var eventSuffix = '.' + this._viewerId; |
|||
if (this._fullPage) { |
|||
container.off(eventSuffix); |
|||
container.find('[class^="iv"]').off(eventSuffix); |
|||
} else { |
|||
this.container.remove('[class^="iv"]'); |
|||
} |
|||
$window.off(eventSuffix); |
|||
return null; |
|||
}, |
|||
load: function (image, hiResImg) { |
|||
var self = this, |
|||
container = this.container; |
|||
|
|||
container.find('.iv-snap-image,.iv-large-image').remove(); |
|||
var snapImageWrap = this.container.find('.iv-snap-image-wrap'); |
|||
snapImageWrap.prepend('<img class="iv-snap-image" src="' + image + '" />'); |
|||
this.imageWrap.prepend('<img class="iv-large-image" src="' + image + '" />'); |
|||
|
|||
if (hiResImg) { |
|||
this.imageWrap.append('<img class="iv-large-image" src="' + hiResImg + '" />') |
|||
} |
|||
|
|||
var currentImg = this.currentImg = this.container.find('.iv-large-image'); |
|||
this.snapImg = this.container.find('.iv-snap-image'); |
|||
self.loaded = false; |
|||
|
|||
//show loader
|
|||
container.find('.iv-loader').show(); |
|||
currentImg.hide(); |
|||
self.snapImg.hide(); |
|||
|
|||
//refresh the view
|
|||
function refreshView() { |
|||
self.loaded = true; |
|||
self.zoomValue = 100; |
|||
|
|||
//reset zoom of images
|
|||
currentImg.show(); |
|||
self.snapImg.show(); |
|||
self.refresh(); |
|||
self.resetZoom(); |
|||
|
|||
//hide loader
|
|||
container.find('.iv-loader').hide(); |
|||
} |
|||
|
|||
if (imageLoaded(currentImg[0])) { |
|||
refreshView(); |
|||
} else { |
|||
$(currentImg[0]).on('load', refreshView); |
|||
} |
|||
|
|||
} |
|||
} |
|||
|
|||
ImageViewer.defaults = { |
|||
zoomValue: 100, |
|||
snapView: true, |
|||
maxZoom: 500, |
|||
refreshOnResize: true, |
|||
zoomOnMouseWheel : true |
|||
} |
|||
|
|||
window.ImageViewer = function (container, options) { |
|||
var imgElm, imgSrc, hiResImg; |
|||
if (!(container && (typeof container == "string" || container instanceof Element || container[0] instanceof Element))) { |
|||
options = container; |
|||
container = $('#iv-container'); |
|||
} |
|||
|
|||
container = $(container); |
|||
|
|||
if (container.is('img')) { |
|||
imgElm = container; |
|||
imgSrc = imgElm[0].src; |
|||
hiResImg = imgElm.attr('high-res-src') || imgElm.attr('data-high-res-src'); |
|||
container = imgElm.wrap('<div class="iv-container" style="display:inline-block; overflow:hidden"></div>').parent(); |
|||
imgElm.css({ |
|||
opacity: 0, |
|||
position: 'relative', |
|||
zIndex: -1 |
|||
}); |
|||
} else { |
|||
imgSrc = container.attr('src') || container.attr('data-src'); |
|||
hiResImg = container.attr('high-res-src') || container.attr('data-high-res-src'); |
|||
} |
|||
|
|||
|
|||
var viewer = new ImageViewer(container, options); |
|||
viewer._init(); |
|||
|
|||
if (imgSrc) viewer.load(imgSrc, hiResImg); |
|||
|
|||
return viewer; |
|||
}; |
|||
|
|||
|
|||
$.fn.ImageViewer = function (options) { |
|||
return this.each(function () { |
|||
var $this = $(this); |
|||
var viewer = window.ImageViewer($this, options); |
|||
$this.data('ImageViewer', viewer); |
|||
}); |
|||
} |
|||
|
|||
}((window.jQuery), window, document)); |
@ -0,0 +1,64 @@ |
|||
/********************************************************************************** |
|||
* |
|||
* Copyright (C) 2017 MuK IT GmbH |
|||
* |
|||
* This program is free software: you can redistribute it and/or modify |
|||
* it under the terms of the GNU Affero General Public License as |
|||
* published by the Free Software Foundation, either version 3 of the |
|||
* License, or (at your option) any later version. |
|||
* |
|||
* This program is distributed in the hope that it will be useful, |
|||
* but WITHOUT ANY WARRANTY; without even the implied warranty of |
|||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
|||
* GNU Affero General Public License for more details. |
|||
* |
|||
* You should have received a copy of the GNU Affero General Public License |
|||
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|||
* |
|||
**********************************************************************************/ |
|||
|
|||
odoo.define('muk_preview_image.PreviewGenerator', function (require) { |
|||
"use strict"; |
|||
|
|||
var core = require('web.core'); |
|||
|
|||
var PreviewHandler = require('muk_preview.PreviewHandler'); |
|||
var PreviewGenerator = require('muk_preview.PreviewGenerator'); |
|||
|
|||
var QWeb = core.qweb; |
|||
var _t = core._t; |
|||
|
|||
var ImageHandler = PreviewHandler.extend({ |
|||
checkExtension: function(extension) { |
|||
return ['.cod', '.ras', '.fif', '.gif', '.ief', '.jpeg', '.jpg', '.jpe', '.png', '.tiff', |
|||
'.tif', '.mcf', '.wbmp', '.fh4', '.fh5', '.fhc', '.ico', '.pnm', '.pbm', '.pgm', |
|||
'.ppm', '.rgb', '.xwd', '.xbm', '.xpm'].includes(extension); |
|||
}, |
|||
checkType: function(mimetype) { |
|||
return ['image/cis-cod', 'image/cmu-raster', 'image/fif', 'image/gif', 'image/ief', 'image/jpeg', |
|||
'image/png', 'image/tiff', 'image/vasa', 'image/vnd.wap.wbmp', 'image/x-freehand', 'image/x-icon', |
|||
'image/x-portable-anymap', 'image/x-portable-bitmap', 'image/x-portable-graymap', 'image/x-portable-pixmap', |
|||
'image/x-rgb', 'image/x-windowdump', 'image/x-xbitmap', 'image/x-xpixmap'].includes(mimetype); |
|||
}, |
|||
createHtml: function(url, mimetype, extension, title) { |
|||
var result = $.Deferred(); |
|||
var $content = $(QWeb.render('ImageHTMLContent', {url: url, alt: title})); |
|||
$content.find('img').click(function (e) { |
|||
ImageViewer().show(this.src, this.src); |
|||
}); |
|||
result.resolve($content); |
|||
return $.when(result); |
|||
}, |
|||
}); |
|||
|
|||
PreviewGenerator.include({ |
|||
imageHandler: { |
|||
"ImageHandler": new ImageHandler(), |
|||
}, |
|||
init: function(additional_handler) { |
|||
additional_handler = _.extend(this.imageHandler, additional_handler); |
|||
this._super(additional_handler); |
|||
}, |
|||
}); |
|||
|
|||
}); |
@ -0,0 +1,34 @@ |
|||
/********************************************************************************** |
|||
* |
|||
* Copyright (C) 2017 MuK IT GmbH |
|||
* |
|||
* This program is free software: you can redistribute it and/or modify |
|||
* it under the terms of the GNU Affero General Public License as |
|||
* published by the Free Software Foundation, either version 3 of the |
|||
* License, or (at your option) any later version. |
|||
* |
|||
* This program is distributed in the hope that it will be useful, |
|||
* but WITHOUT ANY WARRANTY; without even the implied warranty of |
|||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
|||
* GNU Affero General Public License for more details. |
|||
* |
|||
* You should have received a copy of the GNU Affero General Public License |
|||
* along with this program. If not, see <http://www.gnu.org/licenses/>. |
|||
* |
|||
**********************************************************************************/ |
|||
|
|||
.o_preview_image img { |
|||
position: absolute; |
|||
height: 100%; |
|||
width: auto; |
|||
margin: auto; |
|||
top: 0; |
|||
bottom:0; |
|||
left: 0; |
|||
right:0; |
|||
} |
|||
|
|||
.iv-container { |
|||
z-index: 9999 ! important; |
|||
} |
|||
|
@ -0,0 +1,24 @@ |
|||
<?xml version="1.0" encoding="UTF-8"?> |
|||
|
|||
<!-- |
|||
Copyright (C) 2017 MuK IT GmbH |
|||
|
|||
This program is free software: you can redistribute it and/or modify |
|||
it under the terms of the GNU Affero General Public License as |
|||
published by the Free Software Foundation, either version 3 of the |
|||
License, or (at your option) any later version. |
|||
|
|||
This program is distributed in the hope that it will be useful, |
|||
but WITHOUT ANY WARRANTY; without even the implied warranty of |
|||
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
|||
GNU Affero General Public License for more details. |
|||
|
|||
You should have received a copy of the GNU Affero General Public License |
|||
along with this program. If not, see <http://www.gnu.org/licenses/>. |
|||
--> |
|||
|
|||
<templates> |
|||
<div t-name="ImageHTMLContent" class="o_preview_image"> |
|||
<img t-att-src="url" t-att-alt="alt" /> |
|||
</div> |
|||
</templates> |
@ -0,0 +1,30 @@ |
|||
<?xml version="1.0" encoding="UTF-8"?> |
|||
|
|||
<!-- |
|||
Copyright (C) 2017 MuK IT GmbH |
|||
|
|||
This program is free software: you can redistribute it and/or modify |
|||
it under the terms of the GNU Affero General Public License as |
|||
published by the Free Software Foundation, either version 3 of the |
|||
License, or (at your option) any later version. |
|||
|
|||
This program is distributed in the hope that it will be useful, |
|||
but WITHOUT ANY WARRANTY; without even the implied warranty of |
|||
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
|||
GNU Affero General Public License for more details. |
|||
|
|||
You should have received a copy of the GNU Affero General Public License |
|||
along with this program. If not, see <http://www.gnu.org/licenses/>. |
|||
--> |
|||
|
|||
<odoo> |
|||
<template id="assets_backend" inherit_id="web.assets_backend"> |
|||
<xpath expr="."> |
|||
<link rel="stylesheet" href="/muk_web_preview_image/static/lib/imageviewer/imageviewer.css" /> |
|||
<script type="text/javascript" src="/muk_web_preview_image/static/lib/imageviewer/imageviewer.js"/> |
|||
|
|||
<link rel="stylesheet" href="/muk_web_preview_image/static/src/less/preview_content.less" /> |
|||
<script type="text/javascript" src="/muk_web_preview_image/static/src/js/preview_generator.js"/> |
|||
</xpath> |
|||
</template> |
|||
</odoo> |
Write
Preview
Loading…
Cancel
Save
Reference in new issue