Fix HTML and Image cards

TryGhost · Apr 6, 2017 · 3d84e01 · 3d84e01
1 parent e9c9a57
commit 3d84e01
Show file tree

Hide file tree

Showing 8 changed files with 29 additions and 36 deletions.
diff --git a/app/styles/addons/gh-koenig/gh-koenig.css b/app/styles/addons/gh-koenig/gh-koenig.css
@@ -69,7 +69,6 @@
     bottom:-9px;
     width: 100%;
     height: 8px;
-    background-color:pink;
 }
 
 .button-group:after {
@@ -174,7 +173,6 @@ textarea.ed_code {
 
 .dragOver {
     background-color: var(--lightgrey);
-    position: relative;
 }
 
 

diff --git a/lib/gh-koenig/addon/components/cards/card-html.js b/lib/gh-koenig/addon/components/cards/card-html.js
@@ -6,7 +6,6 @@ import {invokeAction} from 'ember-invoke-action';
 
 export default Component.extend({
     layout,
-    isEditing: true,
     hasRendered: false,
     save: observer('doSave', function () {
         this.get('env').save(this.get('payload'), false);

diff --git a/lib/gh-koenig/addon/components/cards/card-markdown.js b/lib/gh-koenig/addon/components/cards/card-markdown.js
@@ -1,14 +1,12 @@
 import Component from 'ember-component';
-import Object from 'ember-object';
 import layout from '../../templates/components/card-markdown';
 import {formatMarkdown} from '../../lib/format-markdown';
 import injectService from 'ember-service/inject';
 import {invokeAction} from 'ember-invoke-action';
 import {isEmberArray} from 'ember-array/utils';
 import {isBlank} from 'ember-utils';
-import computed, {alias} from 'ember-computed';
+import computed from 'ember-computed';
 import observer from 'ember-metal/observer';
-import boundOneWay from 'ghost-admin/utils/bound-one-way';
 import run from 'ember-runloop';
 import {
     isRequestEntityTooLargeError,
@@ -71,6 +69,7 @@ export default Component.extend({
         invokeAction(this, 'uploadSuccess', response);
         let placeholderText = `![uploading:${response.file.name}]()`;
         let imageText = `![](${response.url})`;
+        // eslint-disable-next-line ember-suave/prefer-destructuring
         let el = this.$('textarea')[0]; // array destructuring on jquery causes ember to throw an error about calling an Object as a Function
 
         el.value = el.value.replace(placeholderText, imageText);
@@ -203,19 +202,18 @@ export default Component.extend({
             invokeAction(this, 'selectCard');
         },
         didDrop(event) {
-
             event.preventDefault();
             event.stopPropagation();
             // eslint-disable-next-line ember-suave/prefer-destructuring
             let el = this.$('textarea')[0]; // array destructuring here causes ember to throw an error about calling an Object as a Function
-            
+
             let start = el.selectionStart;
-            
+
             let end = el.selectionEnd;
 
             let {files} = event.dataTransfer;
             let combinedLength = 0;
-            
+
             // eslint-disable-next-line ember-suave/prefer-destructuring
             let file = files[0]; // array destructuring here causes ember to throw an error about calling an Object as a Function
             let placeholderText = `\r\n![uploading:${file.name}]()\r\n`;
@@ -227,10 +225,10 @@ export default Component.extend({
 
             this.send('fileSelected', event.dataTransfer.files);
         },
-        didDragOver(event) {
+        didDragOver() {
             this.$('textarea').addClass('dragOver');
         },
-        didDragLeave(event) {
+        didDragLeave() {
             this.$('textarea').removeClass('dragOver');
         }
     }

diff --git a/lib/gh-koenig/addon/components/gh-koenig.js b/lib/gh-koenig/addon/components/gh-koenig.js
@@ -195,10 +195,10 @@ export default Component.extend({
                 window.getSelection().removeAllRanges();
                 this.send('selectCardHard', id);
             } else {
-                 this.send('deselectCard');
+                this.send('deselectCard');
             }
         } else {
-             this.send('deselectCard');
+            this.send('deselectCard');
         }
     },
 
@@ -215,9 +215,9 @@ export default Component.extend({
         selectCard(cardId) {
             let card = this.get('emberCards').find((card) => card.id === cardId);
             let cardHolder = $(`#${cardId}`).parent('.kg-card');
-            if(this.get('selectedCard') !== card) {
+            if (this.get('selectedCard') !== card) {
                 this.send('deselectCard');
-             }
+            }
             cardHolder.addClass('selected');
             cardHolder.removeClass('selected-hard');
             this.set('selectedCard', card);
@@ -235,15 +235,15 @@ export default Component.extend({
         // creating blocks under the card and deleting the card.
         // used when selecting the card with the keyboard or clicking on the toolbar.
         selectCardHard(cardId) {
-             let card = this.get('emberCards').find((card) => card.id === cardId);
-             let cardHolder = $(`#${cardId}`).parents('.kg-card');
-             if(this.get('selectedCard') !== card) {
+            let card = this.get('emberCards').find((card) => card.id === cardId);
+            let cardHolder = $(`#${cardId}`).parents('.kg-card');
+            if (this.get('selectedCard') !== card) {
                 this.send('deselectCard');
-             }
-             cardHolder.addClass('selected');
-             cardHolder.addClass('selected-hard');
-             this.set('selectedCard', card);
-            
+            }
+            cardHolder.addClass('selected');
+            cardHolder.addClass('selected-hard');
+            this.set('selectedCard', card);
+
             document.onclick = (event) => {
                 let target = $(event.target);
                 let parent = target.parents('.kg-card');
@@ -330,7 +330,7 @@ export default Component.extend({
             }
             this.get('keyDownHandler').length = 0;
             document.onclick = null;
-            
+
             this.set('editedCard', null);
         },
         editCard(cardId) {

diff --git a/lib/gh-koenig/addon/components/koenig-card.js b/lib/gh-koenig/addon/components/koenig-card.js
@@ -7,7 +7,7 @@ export default Component.extend({
     layout,
     editing: observer('editedCard', function () {
         let editing = this.get('editedCard') === this.get('card');
-        if(this.get('isEditing') && !editing) {
+        if (this.get('isEditing') && !editing) {
             this.send('stopEdit');
         }
         this.set('isEditing', editing);
@@ -22,7 +22,6 @@ export default Component.extend({
             () => {
                 let card = this.get('card');
 
-
                 let {env: {name}} = card;
 
                 // the mobiledoc generated container.
@@ -33,7 +32,7 @@ export default Component.extend({
                 mobiledocCard.addClass(name ? `kg-${name}` : '');
                 mobiledocCard.attr('tabindex', 3);
                 mobiledocCard.click(() => {
-                    if(!this.get('isEditing')) {
+                    if (!this.get('isEditing')) {
                         this.send('selectCardHard');
                     }
                 });
@@ -46,7 +45,7 @@ export default Component.extend({
         },
 
         toggleState() {
-            if(this.get('isEditing')) {
+            if (this.get('isEditing')) {
                 this.send('stopEdit');
             } else {
                 this.send('startEdit');
@@ -66,7 +65,7 @@ export default Component.extend({
             this.get('card').env.remove();
         },
         startEdit() {
-            this.sendAction('edit', this.card.id)
+            this.sendAction('edit', this.card.id);
         },
         stopEdit() {
             this.send('save');

diff --git a/lib/gh-koenig/addon/options/default-tools.js b/lib/gh-koenig/addon/options/default-tools.js
@@ -207,7 +207,7 @@ export default function (editor, toolbar) {
                         postEditor.replaceSection(thisSection, card);
                     }
                     // insert empty paragraph after card if it's the last element.
-                    if(!thisSection.next) {
+                    if (!thisSection.next) {
                         let newSection = editor.builder.createMarkupSection('p');
                         postEditor.insertSectionAtEnd(newSection);
                     }
@@ -237,7 +237,7 @@ export default function (editor, toolbar) {
                         postEditor.replaceSection(thisSection, card);
                     }
 
-                    if(!thisSection.next) {
+                    if (!thisSection.next) {
                         let newSection = editor.builder.createMarkupSection('p');
                         postEditor.insertSectionAtEnd(newSection);
                     }
@@ -262,7 +262,7 @@ export default function (editor, toolbar) {
                     let card = postEditor.builder.createCardSection('card-hr', {pos: 'top'});
                     postEditor.insertSection(card);
 
-                    if(!thisSection.next) {
+                    if (!thisSection.next) {
                         let newSection = editor.builder.createMarkupSection('p');
                         postEditor.insertSectionAtEnd(newSection);
                     }
@@ -291,7 +291,7 @@ export default function (editor, toolbar) {
                         postEditor.replaceSection(thisSection, card);
                     }
                     // if this is the last element then insert a paragraph after the card
-                    if(!thisSection.next) {
+                    if (!thisSection.next) {
                         let newSection = editor.builder.createMarkupSection('p');
                         postEditor.insertSectionAtEnd(newSection);
                     }

diff --git a/lib/gh-koenig/addon/templates/components/card-html.hbs b/lib/gh-koenig/addon/templates/components/card-html.hbs
@@ -1,5 +1,5 @@
 {{#if isEditing}}
-    {{gh-cm-editor value update=(action (mut value)) focus-in=(action "selectCard")}} {{!-- codemirror editor component from Ghost-Admin --}}
+    {{gh-cm-editor value update=(action (mut value)) focus-in=(action "selectCard")}}
 {{else}}
     {{{value}}}    
 {{/if}}
diff --git a/lib/gh-koenig/addon/templates/components/card-markdown.hbs b/lib/gh-koenig/addon/templates/components/card-markdown.hbs
@@ -1,5 +1,4 @@
 {{#if isEditing}}
-    {{!--{{textarea value=value key-up="updateValue" focus-in=(action "selectCard")}}--}}
     <textarea onfocus={{action "selectCard"}} ondrop={{action "didDrop"}} ondragover={{action "didDragOver"}} ondragleave={{action "didDragLeave"}}>{{value}}</textarea>
 {{else}}
     {{{preview}}}