Skip to content

Commit

Permalink
fix: spellcheck attribute binding
Browse files Browse the repository at this point in the history
  • Loading branch information
@sibiraj-s
sibiraj-s committed Oct 1, 2017
1 parent 74d519e commit af66d69
Show file tree
Hide file tree
Showing 18 changed files with 58 additions and 117 deletions.
2 changes: 1 addition & 1 deletion README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ Import [font-awesome](https://github.com/FortAwesome/Font-Awesome) into your app
Then in HTML

```html
<app-ngx-editor [placeholder]="'Enter text here...'" [(html)]="htmlContent"></app-ngx-editor>
<app-ngx-editor [placeholder]="'Enter text here...'" [spellcheck]="true" [(html)]="htmlContent"></app-ngx-editor>
```

[npm]: https://www.npmjs.com/
Expand Down
2 changes: 1 addition & 1 deletion docs/index.html
View file
Original file line number Diff line number Diff line change
@@ -1 +1 @@
<!doctype html><html lang="en"><head><meta charset="utf-8"><title>NgxEditor</title><base href="ngx-editor"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" type="image/x-icon" href="favicon.ico"><link href="styles.f6a07fb204943f53af55.bundle.css" rel="stylesheet"/></head><body><app-root></app-root><script type="text/javascript" src="inline.4f5d3011c8b14a8bf896.bundle.js"></script><script type="text/javascript" src="polyfills.d8d3d78a4deb2ab66856.bundle.js"></script><script type="text/javascript" src="vendor.c44f4e84d8761a397bba.bundle.js"></script><script type="text/javascript" src="main.12b93310a0915dff6038.bundle.js"></script></body></html>
<!doctype html><html lang="en"><head><meta charset="utf-8"><title>NgxEditor</title><base href="ngx-editor"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" type="image/x-icon" href="favicon.ico"><link href="styles.f6a07fb204943f53af55.bundle.css" rel="stylesheet"/></head><body><app-root></app-root><script async defer="defer" src="https://buttons.github.io/buttons.js"></script><script type="text/javascript" src="inline.38a71599d339a1d5b2ba.bundle.js"></script><script type="text/javascript" src="polyfills.d8d3d78a4deb2ab66856.bundle.js"></script><script type="text/javascript" src="vendor.1888c7c68d355a7353fd.bundle.js"></script><script type="text/javascript" src="main.2f9b53e4f57897b2c08e.bundle.js"></script></body></html>
1 change: 1 addition & 0 deletions docs/inline.38a71599d339a1d5b2ba.bundle.js
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 0 additions & 1 deletion docs/inline.4f5d3011c8b14a8bf896.bundle.js
View file

This file was deleted.

1 change: 0 additions & 1 deletion docs/main.12b93310a0915dff6038.bundle.js
View file

This file was deleted.

1 change: 1 addition & 0 deletions docs/main.2f9b53e4f57897b2c08e.bundle.js
View file

Large diffs are not rendered by default.

1 change: 1 addition & 0 deletions docs/vendor.1888c7c68d355a7353fd.bundle.js
View file

Large diffs are not rendered by default.

1 change: 0 additions & 1 deletion docs/vendor.c44f4e84d8761a397bba.bundle.js
View file

This file was deleted.

7 changes: 3 additions & 4 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,13 +6,12 @@
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"docs": "ng build --prod --output-path docs --base-href ngx-editor",
"build:prod": "ng build --prod && sh scripts/build.sh",
"precommit": "ng test --watch false && yarn run build:prod"
"build": "ng build --prod && sh scripts/build.sh",
"precommit": "ng test --watch false && yarn run build"
},
"keywords": [
"angular-editor",
Expand Down Expand Up @@ -45,7 +44,7 @@
"zone.js": "^0.8.18"
},
"devDependencies": {
"@angular/cli": "1.4.3",
"@angular/cli": "1.4.4",
"@angular/compiler-cli": "^4.4.3",
"@angular/language-service": "^4.4.3",
"@types/jasmine": "~2.6.0",
Expand Down
44 changes: 10 additions & 34 deletions src/app/app.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,44 +2,20 @@
<div class="logo">
<img src="assets/icons/ngx-editor.svg" alt="ngx-Editor">
<h6>WYSIWYG Editor for Angular Applications.</h6>
<h6>(v1.0.0-beta.1)</h6>
<p>(v1.0.0-beta.1)</p>
<a class="github-button" href="https://github.com/Sibiraj-S" aria-label="Follow @Sibiraj-S on GitHub">Follow @Sibiraj-S</a>
<a class="github-button" href="https://github.com/Sibiraj-S/ngx-editor/fork" aria-label="Fork Sibiraj-S/ngx-editor on GitHub">Fork</a>
<a class="github-button" href="https://github.com/Sibiraj-S/ngx-editor" aria-label="Star Sibiraj-S/ngx-editor on GitHub">Star</a>
<a class="github-button" href="https://github.com/Sibiraj-S/ngx-editor/issues" data-show-count="true" aria-label="Issue Sibiraj-S/ngx-editor on GitHub">Issue</a>
<a class="github-button" href="https://github.com/Sibiraj-S/ngx-editor/archive/master.zip" aria-label="Download Sibiraj-S/ngx-editor on GitHub">Download</a>
</div>

<div class="editor">
<app-ngx-editor [config]="editorConfig" [placeholder]="'Enter text here...'" [(html)]="htmlContent"></app-ngx-editor>
<app-ngx-editor [config]="editorConfig" [placeholder]="'Enter text here...'" [spellcheck]="true" [(html)]="htmlContent"></app-ngx-editor>
</div>

<h6>HTML Output</h6>
<div class="html" *ngIf="htmlContent">
{{htmlContent}}
</div>
<div class="information">
<h3> Getting Started </h3>

<h4> Installation </h4>

<p>Install via Package managers such as <a href="https://www.npmjs.com/" target="_blank">npm</a> or <a href="https://yarnpkg.com/lang/en/"
target="_blank">yarn</a></p>

<pre>

npm install [email protected] --save
# or
yarn add [email protected]
</pre>

<h4>Usage</h4>

<p>Import
<mark>ngx-editor</mark> module</p>

<pre><code [innerHTML]="importCode"></code>
</pre>

<p>Import <a href="https://github.com/FortAwesome/Font-Awesome">font-awesome</a> into your application</p>
<p>Then in HTML</p>

<pre>

&lt;app-ngx-editor [placeholder]="'Enter text here...'" [(html)]="htmlContent"&gt; &lt;/app-ngx-editor&gt;
</pre>

</div>
</div>
3 changes: 0 additions & 3 deletions src/app/app.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,9 +18,6 @@
max-height: 10rem;
overflow: auto;
}
.information {
margin-top: 1rem;
}
}

pre {
Expand Down
11 changes: 3 additions & 8 deletions src/app/app.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,16 +10,11 @@ export class AppComponent {
title = 'ngx-editor';

editorConfig = {
spellCheck: false
spellcheck: false,
placeholder: 'Enter text here...',
translate: 'no'
};

htmlContent = '<span>WYSIWYG Editor for Angular Applications.</span>';

importCode = `
import { NgxEditorModule } from 'ngx-editor';
@NgModule({
imports: [ NgxEditorModule ]
})`;

}
5 changes: 3 additions & 2 deletions src/app/ngx-editor/ngx-editor.component.html
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<div class="ngx-editor" id="ngxEditor" [ngClass]="{'fullscreen': fullScreen}" [attr.spellcheck]="config['spellCheck']">
<div class="ngx-editor" id="ngxEditor">
<div class="toolbar responsive">
<div class="set">
<button (click)="executeCommand('bold')" title="Bold"><i class="fa fa-bold" aria-hidden="true"></i></button>
Expand Down Expand Up @@ -33,5 +33,6 @@
<button (click)="executeCommand('insertOrderedList')" title="Ordered List"><i class="fa fa-list-ol" aria-hidden="true"></i></button>
</div>
</div>
<div class="textarea" contenteditable="true" [attr.placeholder]="placeholder || config['placeholder']" (input)="html = $event.target.innerHTML;htmlContentChange($event.target.innerHTML)"></div>
<div class="textarea" contenteditable="true" [attr.placeholder]="placeholder || config['placeholder']" (input)="html = $event.target.innerHTML; htmlContentChange($event.target.innerHTML)"
[attr.translate]="translate || config['translate']" [attr.spellcheck]="config['spellcheck']"></div>
</div>
9 changes: 0 additions & 9 deletions src/app/ngx-editor/ngx-editor.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -109,15 +109,6 @@ $break-xtra-small: "screen and (max-width : 320px)";
background-position: center;
}
}
&.fullscreen {
z-index: 99999999;
width: 98.7%;
height: 97%;
position: absolute;
top: 0;
left: 0;
margin: 8px;
}
}

.hide {
Expand Down
12 changes: 5 additions & 7 deletions src/app/ngx-editor/ngx-editor.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,11 +46,9 @@ export class NgxEditorComponent implements OnInit {
}


@Input() spellCheck;
@Input() placeholder;

fullScreen = false;

@Input() spellcheck: boolean;
@Input() placeholder: string;
@Input() translate: string;

/*
* update html on changes in content editable
Expand Down Expand Up @@ -84,8 +82,8 @@ export class NgxEditorComponent implements OnInit {
* ngOnInit
*/
ngOnInit() {
if (this.spellCheck === false) {
this.config['spellCheck'] = this.spellCheck;
if (this.spellcheck === false) {
this.config['spellcheck'] = false;
}

this.element.nativeElement.getElementsByClassName('textarea')[0].innerHTML = this.html;
Expand Down
3 changes: 2 additions & 1 deletion src/app/ngx-editor/ngx-editor.defaults.ts
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
export const ngxEditorConfig = {
spellCheck: true,
spellcheck: true,
translate: 'yes',
placeholder: 'Enter text here...',
toolbar: {
text: ['fontFamily', 'fontSize', 'bold', 'italic', 'underline', 'strikeThrough', 'superscript', 'subscript'],
Expand Down
1 change: 1 addition & 0 deletions src/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@

<body>
<app-root></app-root>
<script async defer src="https://buttons.github.io/buttons.js"></script>
</body>

</html>
70 changes: 26 additions & 44 deletions yarn.lock
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,24 +2,26 @@
# yarn lockfile v1


"@angular-devkit/build-optimizer@~0.0.18":
version "0.0.21"
resolved "https://registry.yarnpkg.com/@angular-devkit/build-optimizer/-/build-optimizer-0.0.21.tgz#d3100a179c570d3c45ba02f87486c931e8845e13"
"@angular-devkit/build-optimizer@~0.0.23":
version "0.0.23"
resolved "https://registry.yarnpkg.com/@angular-devkit/build-optimizer/-/build-optimizer-0.0.23.tgz#2fe39f11460b27e3ebd007af7432e44646ea8816"
dependencies:
loader-utils "^1.1.0"
source-map "^0.5.6"
typescript "^2.3.3"
webpack-sources "^1.0.1"

"@angular-devkit/[email protected]":
version "0.0.14"
resolved "https://registry.yarnpkg.com/@angular-devkit/core/-/core-0.0.14.tgz#01b1bf89a3b354843ed4b8fec4e780ec6a31ca6c"
"@angular-devkit/[email protected]":
version "0.0.15"
resolved "https://registry.yarnpkg.com/@angular-devkit/core/-/core-0.0.15.tgz#f237b4b27743d3a5e6dac60503596daa14442516"
dependencies:
source-map "^0.5.6"

"@angular-devkit/schematics@~0.0.21":
version "0.0.24"
resolved "https://registry.yarnpkg.com/@angular-devkit/schematics/-/schematics-0.0.24.tgz#5e4c2f01c95aea72fdb0e832504bc3d2475934f6"
"@angular-devkit/schematics@~0.0.25":
version "0.0.25"
resolved "https://registry.yarnpkg.com/@angular-devkit/schematics/-/schematics-0.0.25.tgz#993e63c2398ce0bcd61172627bc6e44ed4c98a99"
dependencies:
"@angular-devkit/core" "0.0.14"
"@angular-devkit/core" "0.0.15"
"@ngtools/json-schema" "^1.1.0"
minimist "^1.2.0"
rxjs "^5.4.2"
Expand All @@ -30,15 +32,15 @@
dependencies:
tslib "^1.7.1"

"@angular/[email protected].3":
version "1.4.3"
resolved "https://registry.yarnpkg.com/@angular/cli/-/cli-1.4.3.tgz#8389d4eeadfe34abb1d16e53836416a8f8430fb3"
"@angular/[email protected].4":
version "1.4.4"
resolved "https://registry.yarnpkg.com/@angular/cli/-/cli-1.4.4.tgz#d267580412813942a0d84772b56d2bf0239338d4"
dependencies:
"@angular-devkit/build-optimizer" "~0.0.18"
"@angular-devkit/schematics" "~0.0.21"
"@angular-devkit/build-optimizer" "~0.0.23"
"@angular-devkit/schematics" "~0.0.25"
"@ngtools/json-schema" "1.1.0"
"@ngtools/webpack" "1.7.1"
"@schematics/angular" "~0.0.30"
"@ngtools/webpack" "1.7.2"
"@schematics/angular" "~0.0.38"
autoprefixer "^6.5.3"
chalk "^2.0.1"
circular-dependency-plugin "^3.0.0"
Expand All @@ -53,10 +55,7 @@
extract-text-webpack-plugin "3.0.0"
file-loader "^0.10.0"
fs-extra "^4.0.0"
get-caller-file "^1.0.0"
glob "^7.0.3"
heimdalljs "^0.2.4"
heimdalljs-logger "^0.1.9"
html-webpack-plugin "^2.29.0"
istanbul-instrumenter-loader "^2.0.0"
karma-source-map-support "^1.2.0"
Expand Down Expand Up @@ -163,18 +162,18 @@
version "1.1.0"
resolved "https://registry.yarnpkg.com/@ngtools/json-schema/-/json-schema-1.1.0.tgz#c3a0c544d62392acc2813a42c8a0dc6f58f86922"

"@ngtools/[email protected].1":
version "1.7.1"
resolved "https://registry.yarnpkg.com/@ngtools/webpack/-/webpack-1.7.1.tgz#383ddd689845cf42fc755975f6440f75535f5016"
"@ngtools/[email protected].2":
version "1.7.2"
resolved "https://registry.yarnpkg.com/@ngtools/webpack/-/webpack-1.7.2.tgz#3fc4de01786dcc2f50d8cbaaa117311e56799977"
dependencies:
enhanced-resolve "^3.1.0"
loader-utils "^1.0.2"
magic-string "^0.22.3"
source-map "^0.5.6"

"@schematics/angular@~0.0.30":
version "0.0.36"
resolved "https://registry.yarnpkg.com/@schematics/angular/-/angular-0.0.36.tgz#60c4f0a6b07c9695ae56eab7d84ab9f7c78d661a"
"@schematics/angular@~0.0.38":
version "0.0.38"
resolved "https://registry.yarnpkg.com/@schematics/angular/-/angular-0.0.38.tgz#6131569a9fe21fe7bad8abf4a3174ea5a8647bbd"

"@types/jasmine@*", "@types/jasmine@~2.6.0":
version "2.6.0"
Expand Down Expand Up @@ -2400,7 +2399,7 @@ gaze@^1.0.0:
dependencies:
globule "^1.0.0"

get-caller-file@^1.0.0, get-caller-file@^1.0.1:
get-caller-file@^1.0.1:
version "1.0.2"
resolved "https://registry.yarnpkg.com/get-caller-file/-/get-caller-file-1.0.2.tgz#f702e63127e7e231c160a80c1554acb70d5047e5"

Expand Down Expand Up @@ -2726,19 +2725,6 @@ [email protected]:
version "1.1.1"
resolved "https://registry.yarnpkg.com/he/-/he-1.1.1.tgz#93410fd21b009735151f8868c2f271f3427e23fd"

heimdalljs-logger@^0.1.9:
version "0.1.9"
resolved "https://registry.yarnpkg.com/heimdalljs-logger/-/heimdalljs-logger-0.1.9.tgz#d76ada4e45b7bb6f786fc9c010a68eb2e2faf176"
dependencies:
debug "^2.2.0"
heimdalljs "^0.2.0"

heimdalljs@^0.2.0, heimdalljs@^0.2.4:
version "0.2.5"
resolved "https://registry.yarnpkg.com/heimdalljs/-/heimdalljs-0.2.5.tgz#6aa54308eee793b642cff9cf94781445f37730ac"
dependencies:
rsvp "~3.2.1"

hmac-drbg@^1.0.0:
version "1.0.1"
resolved "https://registry.yarnpkg.com/hmac-drbg/-/hmac-drbg-1.0.1.tgz#d2745701025a6c775a6c545793ed502fc0c649a1"
Expand Down Expand Up @@ -5269,10 +5255,6 @@ rollup@^0.50.0:
version "0.50.0"
resolved "https://registry.yarnpkg.com/rollup/-/rollup-0.50.0.tgz#4c158f4e780e6cb33ff0dbfc184a52cc58cd5f3b"

rsvp@~3.2.1:
version "3.2.1"
resolved "https://registry.yarnpkg.com/rsvp/-/rsvp-3.2.1.tgz#07cb4a5df25add9e826ebc67dcc9fd89db27d84a"

run-async@^2.2.0:
version "2.3.0"
resolved "https://registry.yarnpkg.com/run-async/-/run-async-2.3.0.tgz#0371ab4ae0bdd720d4166d7dfda64ff7a445a6c0"
Expand Down

0 comments on commit af66d69

Please sign in to comment.