Browse Source

*Updated documentation

Babel and cssminify now are optional dependencies (Only required for builders)
pull/633/head
EKOO20 6 years ago
parent
commit
eadf0d67ea
7 changed files with 1728 additions and 4205 deletions
  1. +1
    -15
      build/RequestAnimationFrame.js
  2. +1
    -11
      build/index.js
  3. +1
    -1220
      build/libpannellum.js
  4. +1
    -2948
      build/pannellum.js
  5. +1686
    -0
      package-lock.json
  6. +9
    -2
      package.json
  7. +29
    -9
      readme.md

+ 1
- 15
build/RequestAnimationFrame.js View File

@@ -1,15 +1 @@
/**
* Provides requestAnimationFrame in a cross browser way.
* http://paulirish.com/2011/requestanimationframe-for-smart-animating/
*/

if (!window.requestAnimationFrame) {

window.requestAnimationFrame = function () {

return window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function ( /* function FrameRequestCallback */callback, /* DOMElement Element */element) {

window.setTimeout(callback, 1000 / 60);
};
}();
}
window.requestAnimationFrame||(window.requestAnimationFrame=function(){return window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.oRequestAnimationFrame||window.msRequestAnimationFrame||function(a){window.setTimeout(a,1e3/60)}}());

+ 1
- 11
build/index.js View File

@@ -1,11 +1 @@
'use strict';

require("./requestAnimationFrame");
require("./libpannellum");
require("./pannellum");

Object.defineProperty(exports, "__esModule", {
value: true
});

exports.default = pannellum;
"use strict";require("./requestAnimationFrame"),require("./libpannellum"),require("./pannellum"),Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=pannellum;

+ 1
- 1220
build/libpannellum.js
File diff suppressed because it is too large
View File


+ 1
- 2948
build/pannellum.js
File diff suppressed because it is too large
View File


+ 1686
- 0
package-lock.json
File diff suppressed because it is too large
View File


+ 9
- 2
package.json View File

@@ -14,7 +14,9 @@
"url": "https://github.com/mpetroff/pannellum.git"
},
"scripts": {
"build": "babel -d build/ src/js",
"buildjs": "babel -d build/ src/js --presets minify",
"buildcss": "cleancss -o build/pannellum.css src/css/pannellum.css",
"build": "npm run buildjs && npm run buildcss",
"prepublish": "npm run build"
},
"license": "MIT",
@@ -23,5 +25,10 @@
"keywords": [
"panorama",
"viewer"
]
],
"optionalDependencies": {
"babel-cli": "^6.26.0",
"babel-preset-minify": "^0.4.3",
"clean-css-cli": "^4.1.11"
}
}

+ 29
- 9
readme.md View File

@@ -4,20 +4,25 @@

Pannellum is a lightweight, free, and open source panorama viewer for the web. Built using HTML5, CSS3, JavaScript, and WebGL, it is plug-in free. It can be deployed easily as a single file, just 15kB gzipped, and then embedded into pages as an `<iframe>`. A configuration utility is included to generate the required code for embedding.

## How to use
1. Upload `build/pannellum.htm` and a full equirectangular panorama to a web server.
* Due to browser security restrictions, a web server must be used locally as well. With Python 2, one can use `python -m SimpleHTTPServer`, and with Python 3, one can use `python -m http.server`, but any other web server will work as well.
2. Use the included multi-resolution generator (`utils/multires/generate.py`) or configuration tool (`utils/config/configuration.htm`).
3. Insert the generated `<iframe>` code into a page.
## Documentation
* [Live Examples](https://pannellum.org/documentation/examples/simple-example/)
* [Configuration](https://pannellum.org/documentation/reference/)
* [API](https://pannellum.org/documentation/api/)

### Using `generate.py` to create multires panoramas
To be able to create multiresolution panoramas, you need to have the `nona` program installed, which is available as part of [Hugin](http://hugin.sourceforge.net/), as well as Python with the [Pillow](https://pillow.readthedocs.org/) package. Then, run
## Using with NPM
```
npm i --save github:saidmoya12/pannellum
```

### Usage of npm module
```
python generate.py pano_image.jpg
import pannellum from 'pannellum';
...
let viewer = pannellum.viewer('elementID', [configuration]);
```

in the `utils/multires` directory. This will generate all the image tiles and the `config.json` file in the `./output` folder by default. For this to work, `nona` needs to be on the system path; otherwise, the location of `nona` can be specified using the `-n` flag, e.g. `python generate.py -n /path/to/nona pano_image.jpg`.
Tested with React
*Node SERVER is not required!*

## Examples

@@ -54,8 +59,23 @@ Mobile / app frameworks are not officially supported. They may work, but they're
All user-facing strings can be changed using the `strings` configuration parameter. There exists a [third-party respository of user-contributed translations](https://github.com/DanielBiegler/pannellum-translation) that can be used with this configuration option.

## Building
### using python
The `utils` folder contains the required build tools, with the exception of Python 3.2+ and Java installations. To build a minified version of Pannellum, run either `build.sh` or `build.bat` depending on your platform.

### using npm
1. Clone the repository

2. In pannellum folder use:
```
npm install
```
3. Enjoy your code

4. Compile your modifications (Babelify and compression)
```
npm run build
```

## License
Pannellum is distributed under the MIT License. For more information, read the file `COPYING` or peruse the license [online](https://github.com/mpetroff/pannellum/blob/master/COPYING).



Loading…
Cancel
Save