File indexing completed on 2025-01-05 04:01:15 

0001 /*
0002  * SPDX-FileCopyrightText: 2019-2023 Mattia Basaglia <dev@dragon.best>
0003  *
0004  * SPDX-License-Identifier: GPL-3.0-or-later
0005  */
0006 
0007 #include "lottie_html_format.hpp"
0008 #include "lottie_exporter.hpp"
0009 #include "cbor_write_json.hpp"
0010 
0011 QByteArray glaxnimate::io::lottie::LottieHtmlFormat::html_head(ImportExport* ie,  model::Composition* comp, const QString& extra)
0012 {
0013     return QString(
0014 R"(<!DOCTYPE html>
0015 <html>
0016 <head>
0017     <meta charset="utf-8" />
0018     <title>%4: %5</title>
0019     <style>
0020         html, body { width: 100%; height: 100%; margin: 0; }
0021         body { display: flex; }
0022         #animation { width: %1px; height: %2px; margin: auto;
0023             background-color: white;
0024             background-size: 64px 64px;
0025             background-image:
0026                 linear-gradient(to right, rgba(0, 0, 0, .3) 50%, transparent 50%),
0027                 linear-gradient(to bottom, rgba(0, 0, 0, .3) 50%, transparent 50%),
0028                 linear-gradient(to bottom, white 50%, transparent 50%),
0029                 linear-gradient(to right, transparent 50%, rgba(0, 0, 0, .5) 50%);
0030         }
0031     </style>
0032     %3
0033 </head>
0034 )")
0035     .arg(comp->width.get())
0036     .arg(comp->height.get())
0037     .arg(extra)
0038     .arg(comp->object_name())
0039     .arg(ie->name())
0040     .toUtf8()
0041     ;
0042 }
0043 
0044 bool glaxnimate::io::lottie::LottieHtmlFormat::on_save(QIODevice& file, const QString&,
0045                                                        model::Composition* comp, const QVariantMap& settings)
0046 {
0047     const char* lottie_web_version = "5.12.2";
0048     file.write(html_head(this, comp,
0049         QString("<script src='https://cdnjs.cloudflare.com/ajax/libs/bodymovin/%1/lottie.js'></script>").arg(lottie_web_version)
0050     ));
0051     file.write(R"(
0052 <body>
0053 <div id="animation"></div>
0054 
0055 <script>
0056     var lottie_json = )");
0057     detail::LottieExporterState exp(this, comp, false, false, {{"auto_embed", true}});
0058     file.write(cbor_write_json(exp.to_json(), false));
0059 
0060 file.write(QString(R"(
0061     ;
0062 
0063     var anim = null;
0064 
0065     function reload()
0066     {
0067         var animData = {
0068             container: document.getElementById('animation'),
0069             renderer: '%1',
0070             loop: true,
0071             autoplay: true,
0072             animationData: lottie_json
0073         };
0074         if ( anim != null )
0075             anim = anim.destroy();
0076         anim = bodymovin.loadAnimation(animData);
0077     }
0078 
0079     reload();
0080 </script>
0081 </body></html>
0082 )")
0083         .arg(settings["renderer"].toString())
0084         .toUtf8()
0085     );
0086 
0087     return true;
0088 }