#631 add dialog polyfill for firefox and safari

This commit is contained in:
Mario Romano
2016-10-05 22:39:17 +01:00
parent dbf734fe3c
commit 5d1d7cf30d
5 changed files with 51 additions and 1 deletions

View File

@@ -9,4 +9,4 @@
}
.user-profile{
margin-right: 3px;
}
}

View File

@@ -35,3 +35,7 @@ body, html {
text-align: center;
position: relative;
}
._dialog_overlay {
position: static !important;
}

View File

@@ -45,6 +45,26 @@ Also make sure you include these dependencies in your `index.html` file:
<script src="node_modules/material-design-lite/material.min.js"></script>
<link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
```
#### Dialogs Polyfill
To make the dialog working with all the browser you have to add the dialog polyfill to you project:
```sh
npm install --save dialog-polyfill
```
Also make sure you include these dependencies in your `index.html` file:
```html
<!-- Polyfill(s) for dialogs -->
<script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script>
<link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" />
<style>
._dialog_overlay {
position: static !important;
}
</style>
```
## Basic usage examples

View File

@@ -24,6 +24,7 @@ import { FormFieldModel } from '../core/form-field.model';
declare let __moduleName: string;
declare var componentHandler;
declare let dialogPolyfill: any;
@Component({
moduleId: __moduleName,
@@ -122,6 +123,11 @@ export class AttachWidget extends WidgetComponent implements OnInit {
public showDialog() {
this.setupFileBrowser();
this.getExternalContentNodes();
if (!this.dialog.nativeElement.showModal) {
dialogPolyfill.registerDialog(this.dialog.nativeElement);
}
if (this.dialog) {
this.dialog.nativeElement.showModal();
}

View File

@@ -47,6 +47,26 @@ Also make sure you include these dependencies in your `index.html` file:
<script src="node_modules/material-design-lite/material.min.js"></script>
<link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
```
#### Dialogs Polyfill
To make the dialog working with all the browser you have to add the dialog polyfill to you project:
```sh
npm install --save dialog-polyfill
```
Also make sure you include these dependencies in your `index.html` file:
```html
<!-- Polyfill(s) for dialogs -->
<script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script>
<link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" />
<style>
._dialog_overlay {
position: static !important;
}
</style>
```
## Basic usage example Activiti Task List
The component shows the list of all the tasks filter by the