You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
176 lines
5.9 KiB
176 lines
5.9 KiB
1 year ago
|
PPTXjs
|
||
|
==========
|
||
|
[![MIT License][license-image]][license-url]
|
||
|
|
||
|
[license-image]: http://img.shields.io/badge/license-MIT-blue.svg?style=flat
|
||
|
[license-url]: LICENSE
|
||
|
|
||
|
### jQuery plugin for convertation pptx to html using pure javascript.
|
||
|
### Demo: https://pptx.js.org/pages/demos.html
|
||
|
|
||
|
# environment
|
||
|
### browsers:
|
||
|
- IE11
|
||
|
- Edge
|
||
|
- FireFox
|
||
|
- chrome
|
||
|
### Support:
|
||
|
----
|
||
|
* Text
|
||
|
* Font size
|
||
|
* Font family
|
||
|
* Font style: bold, italic, underline, stoke
|
||
|
* Color
|
||
|
* hyperlink
|
||
|
* bullets (include numeric)
|
||
|
* Text block (convert to Div)
|
||
|
* Align (Horizontal and Vertical)
|
||
|
* Background color (single color)
|
||
|
* Border (borderColor, borderWidth, borderType, strokeDasharray)
|
||
|
* Shapes (support most of shapes)
|
||
|
* Background color (single color, gradient colors)
|
||
|
* Background image
|
||
|
* Rotations
|
||
|
* Align
|
||
|
* Border
|
||
|
* Custom shape
|
||
|
* Media
|
||
|
* Picture (jpg/jpeg,png,gif,svg)
|
||
|
* Video (html5 video player: mp4,ogg,WebM)
|
||
|
* IE:MP4.
|
||
|
* Chrome:MP4, WebM,Ogg.
|
||
|
* Firefox:MP4,WebM,Ogg.
|
||
|
* YouTube (v1.11.0)
|
||
|
* vimeo (v1.11.0)
|
||
|
* Audio (html5 audio player:mp3,ogg,Wav)
|
||
|
* IE:mp3.
|
||
|
* Chrome:mp3,Wav,Ogg.
|
||
|
* Firefox:mp3,Wav,Ogg
|
||
|
* Graph
|
||
|
* Bar chart
|
||
|
* Line chart
|
||
|
* Pie chart
|
||
|
* Scatter chart
|
||
|
* SmartArt diagrams
|
||
|
* Tables
|
||
|
* Custom table
|
||
|
* Theme table
|
||
|
* Theme
|
||
|
* Equations and formulas
|
||
|
* display Equations and formulas as image
|
||
|
* and more ...
|
||
|
|
||
|
### usage:
|
||
|
----
|
||
|
include necessary css files:
|
||
|
```
|
||
|
<link rel="stylesheet" href="./css/pptxjs.css">
|
||
|
<link rel="stylesheet" href="./css/nv.d3.min.css"> <!-- for charts graphs -->
|
||
|
```
|
||
|
include necessary js files:
|
||
|
```
|
||
|
<script type="text/javascript" src="./js/jquery-1.11.3.min.js"></script>
|
||
|
<script type="text/javascript" src="./js/jszip.min.js"></script> <!-- v2.. , NOT v.3.. -->
|
||
|
<script type="text/javascript" src="./js/filereader.js"></script> <!--https://github.com/meshesha/filereader.js -->
|
||
|
<script type="text/javascript" src="./js/d3.min.js"></script> <!-- for charts graphs -->
|
||
|
<script type="text/javascript" src="./js/nv.d3.min.js"></script> <!-- for charts graphs -->
|
||
|
<script type="text/javascript" src="./js/dingbat.js"></script> <!--for bullets -->
|
||
|
<script type="text/javascript" src="./js/pptxjs.js"></script>
|
||
|
<script type="text/javascript" src="./js/divs2slides.js"></script> <!-- for slide show -->
|
||
|
```
|
||
|
html body :
|
||
|
```
|
||
|
...
|
||
|
<div id="your_div_id_result"></div>
|
||
|
optional:
|
||
|
<input id="upload_pptx_fiile" type="file" />
|
||
|
...
|
||
|
```
|
||
|
add javascript:
|
||
|
```
|
||
|
<script type="text/javascript">
|
||
|
$("#your_div_id_result").pptxToHtml({
|
||
|
pptxFileUrl: "path/to/yore_pptx_file.pptx",
|
||
|
fileInputId: "upload_pptx_fiile",
|
||
|
slidesScale: "", //Change Slides scale by percent
|
||
|
slideMode: false,
|
||
|
keyBoardShortCut: false,
|
||
|
mediaProcess: true, /** true,false: if true then process video and audio files */
|
||
|
jsZipV2: "./js/jszip.min.js", /*flase or 'path/to/jsZip.V2.js' */
|
||
|
themeProcess: true, /*true (default) , false, "colorsAndImageOnly"*/
|
||
|
incSlide:{height: 2,width:2 }, /*increase height or/and width by 2 px*/
|
||
|
slideType: "divs2slidesjs", /*'divs2slidesjs' (default) , 'revealjs'(https://revealjs.com)
|
||
|
slideModeConfig: { //divs2slidesjs - on slide mode (slideMode: true)
|
||
|
first: 1,
|
||
|
nav: false, /** true,false : show or not nav buttons*/
|
||
|
navTxtColor: "white", /** color */
|
||
|
showPlayPauseBtn: false,/** true,false */
|
||
|
keyBoardShortCut: false, /** true,false */
|
||
|
showSlideNum: false, /** true,false */
|
||
|
showTotalSlideNum: false, /** true,false */
|
||
|
autoSlide: false, /** false or seconds (the pause time between slides) , F8 to active(keyBoardShortCut: true) */
|
||
|
randomAutoSlide: false, /** true,false ,autoSlide:true */
|
||
|
loop: false, /** true,false */
|
||
|
background: "black", /** false or color*/
|
||
|
transition: "default", /** transition type: "slid","fade","default","random" , to show transition efects :transitionTime > 0.5 */
|
||
|
transitionTime: 1 /** transition time in seconds */
|
||
|
},
|
||
|
revealjsConfig: { /* for 'revealjs' settings (https://revealjs.com) */
|
||
|
transition: 'zoom',
|
||
|
// backgroundTransition: 'zoom',
|
||
|
// autoSlide: 5000,
|
||
|
// loop: true
|
||
|
slideNumber: true
|
||
|
}
|
||
|
});
|
||
|
</script>
|
||
|
```
|
||
|
# Changelog
|
||
|
* v1.21.1
|
||
|
* fixed issues:
|
||
|
- [#16](https://github.com/meshesha/PPTXjs/issues/16)
|
||
|
|
||
|
* v1.21.00
|
||
|
* add theme (background) support
|
||
|
* improved tables
|
||
|
* improved bullets (add ./js/dingbat.js)
|
||
|
* fixed issues:
|
||
|
- [#5](https://github.com/meshesha/PPTXjs/issues/5)
|
||
|
- [#7](https://github.com/meshesha/PPTXjs/issues/7)
|
||
|
- [#8](https://github.com/meshesha/PPTXjs/issues/8)
|
||
|
- [#9](https://github.com/meshesha/PPTXjs/issues/9)
|
||
|
- [#10](https://github.com/meshesha/PPTXjs/issues/10)
|
||
|
- [#11](https://github.com/meshesha/PPTXjs/issues/11)
|
||
|
- [#13](https://github.com/meshesha/PPTXjs/issues/13)
|
||
|
- [#15](https://github.com/meshesha/PPTXjs/issues/15)
|
||
|
* more documentation coming soon ...
|
||
|
|
||
|
* v1.11.0
|
||
|
* Support for embedding video from a link (tested youtube and vimeo links)
|
||
|
* support 'revealjs'(https://revealjs.com) (It is not recommended to add a theme because it distorts some of the elements like tables )
|
||
|
* I think i fix issue [officetohtml/issues/7](https://github.com/meshesha/officetohtml/issues/7) (not tested)
|
||
|
* Change loading view
|
||
|
* Fix center slides in fullscreen mode - (https://github.com/meshesha/divs2slides v1.3.3)
|
||
|
* Support emf and wmf files - microsoft files, supported only in Internet Explorer (test in IE11)
|
||
|
|
||
|
* V.1.10.4
|
||
|
* fixed security issue : [#3](https://github.com/meshesha/PPTXjs/issues/3)
|
||
|
|
||
|
* V.1.10.3
|
||
|
* new divs2slides (v.1.3.2)
|
||
|
* fixed div width issue
|
||
|
* V.1.10.2
|
||
|
* new divs2slides v.1.3.1
|
||
|
* fixed some issues
|
||
|
* V.1.10.0
|
||
|
* added the ability to load jsZip v.2 in case jsZip v.3 is loaded for another use.
|
||
|
* (note: using this method will reload the page)
|
||
|
* and fixed some errors issue.
|
||
|
* V.1.9.3
|
||
|
* support Equations and formulas as Image
|
||
|
* Added an ability to scale Slides in percent
|
||
|
* and fixed background color issue.
|
||
|
# License
|
||
|
- Copyright © 2017 Meshesha
|
||
|
- MIT
|