Commit Graph

32 Commits

Author SHA1 Message Date
Kevin Ansfield
352c4af1d7 Refactored usage of .get('property') with es5 getters
no issue
- ran [es5-getter-ember-codemod](https://github.com/rondale-sc/es5-getter-ember-codemod)
- [es5 getters RFC](https://github.com/emberjs/rfcs/blob/master/text/0281-es5-getters.md)
- updates the majority of `object.get('property')` with `object.property` with exceptions:
  - `.get('nested.property')` - it's not possible to determine if this is relying on "safe" path chaining for when `nested` doesn't exist
  - `.get('config.x')` and `.get('settings.x')` - both our `config` and `settings` services are proxy objects which do not support es5 getters
- this PR is not exhaustive, there are still a number of places where `.get('service.foo')` and similar could be replaced but it gets us a long way there in a quick and automated fashion
2019-03-06 13:54:14 +00:00
Kevin Ansfield
68e684453d 🐛 Fixed Code Injection inputs not being clickable
no issue
- attempt to fix the "Cannot set property 'modeOption' of undefined" error by telling CM to replace the textarea element rather than appending to the wrapper and having Ember replace the textarea
2019-02-22 10:52:32 +07:00
Kevin Ansfield
e7c3b1b0e3 🐛 Fixed Code Injection input fields not being clickable
no issue
- lazy loaded scripts such as the CodeMirror asset used on the Code Injection screen could throw errors such as `TypeError: Cannot set property 'modeOption' of undefined`
- this was caused by "loading" promise returned from the `lazyLoader` service returning as soon as the network request finished which can be before the loaded script has been parsed and run meaning any processing occurring after the promise returns could be depending on unloaded code
- switched the lazyLoader service's loading mechanism from an ajax fetch to insertion of a `<script>` tag which can have `load` event attached which _will_ return after parsing/loading has completed
2019-02-11 21:08:15 +00:00
Kevin Ansfield
893a010a4f Lazy-load SimpleMDE dependency in MD card (reduces main bundle by 260KB)
no issue
- use broccoli-funnel to avoid polluting the `dist/` dir with unused build artefacts
- load codemirror and simplemde CSS up-front to avoid duplicate styles and specificity problems
- pull simplemde dependency out into a separate JS file and lazy-load in `{{gh-simplemde}}` component to reduce main bundle size. Before/after:
  - `vendor.min.js 3.58 MB (795.88 KB gzipped)`
  - `vendor.min.js 3.32 MB (710.66 KB gzipped)`
2019-01-21 16:06:25 +00:00
Kevin Ansfield
73daa80b7f Migrate to latest ember, ember-mocha and modern ember testing (#1044)
no issue
- upgrade to latest `ember-source` and related dependencies including `ember-cli`
- upgrade to latest `ember-mocha` and modern ember testing setup
    - https://github.com/emberjs/rfcs/blob/master/text/0268-acceptance-testing-refactor.md
    - switch from using global acceptance test helpers and `native-dom-helpers` to using the new `ember-test-helpers` methods
    - use [`chai-dom`](https://github.com/nathanboktae/chai-dom) assertions where in some places (still a lot of places in the tests that could use these)
- pin `ember-in-viewport` to 3.0.x to work around incompatibilities between different versions used in `ember-light-table`, `ember-infinity`, and `ember-sticky-element`
    - incompatibilities manifested as "Invalid value used as weak map key" errors thrown when using `ember-light-table` (subscribers screen)
- pin `ember-power-datepicker` to unreleased version that contains a move from global acceptance test helpers to modern test helpers
2019-01-02 09:58:55 +00:00
Kevin Ansfield
761e841875 Koenig - Enable line-wrapping for HTML card's CodeMirror instance
refs https://github.com/TryGhost/Ghost/issues/9505
- pass `lineWrapping` option through to CodeMirror in `{{gh-cm-editor}}`
- add cascade overrides for the `pre` line-wrapping styles needed by CodeMirror
2018-04-25 12:06:01 +01:00
Austin Burdine
ad5528b078 Remove ember-invoke-action (#978)
closes TryGhost/Ghost#9477
- remove ember-invoke-action in favor of straight function calls
2018-03-20 14:57:59 +00:00
Kevin Ansfield
3f1e5b9fa9 Koenig - Update {{koenig-card-html}} to use new {{koenig-card}} container
refs https://github.com/TryGhost/Ghost/issues/9311
- wraps embed card in same container as the markdown card to handle mouse selection/edit toggles etc
- add render mode to embed card
- autofocus CodeMirror editor when switching to edit mode
- fix incorrect pointer on cards
2018-02-15 15:57:44 +00:00
Kevin Ansfield
48e3bf003d ESLint: Consistent ember property/method ordering
no issue
- https://github.com/ember-cli/eslint-plugin-ember/blob/master/docs/rules/order-in-components.md
- https://github.com/ember-cli/eslint-plugin-ember/blob/master/docs/rules/order-in-controllers.md
- https://github.com/ember-cli/eslint-plugin-ember/blob/master/docs/rules/order-in-routes.md
2018-01-12 12:17:56 +00:00
Kevin Ansfield
a85f5fae35 Switch to eslint-plugin-ghost extending plugin:ghost/ember
no issue
- fix lint errors in lib/gh-koenig
- fix ghost:base eslint errors
- update ember plugin refs, remove ember-suave plugin refs
- remove old jshint refs
- add `lint:js` script
- switch to `eslint-plugin-ghost` extending `plugin:ghost/ember`
2018-01-12 12:17:56 +00:00
Kevin Ansfield
2d8b3039d1 🎨 Improved code injection loading behaviour on slow connections (#935)
closes https://github.com/TryGhost/Ghost/issues/9249
- in `{{gh-cm-editor}}` display a standard textarea in place of the CodeMirror editor whilst CodeMirror assets are loading in the background, textarea will be upgraded to a CodeMirror editor when loading finishes
- update styles so that the switch from plain textarea to CodeMirror is not too jarring
2018-01-02 18:29:03 +00:00
Kevin Ansfield
9adbcd1fd0 Match service/controller import to ember-modules-codemod style for consistency
no issue

Automated tools, code generators, and editor integrations are increasingly standardising on the import style used in `ember-modules-codemod`. Our import style differed a little with regards to service/controller injection imports which meant we were starting to see inconsistent naming.
2017-10-30 09:38:01 +00:00
Kevin Ansfield
983110d931 Switched from ember-cli-shims to new module imports (#779)
no issue

- add eslint-plugin-ember, configure no-old-shims rule
- run `eslint --fix` on `app`, `lib`, `mirage`, and `tests` to move imports to the new module imports
- further cleanup of Ember globals usage
- remove event-dispatcher initializer now that `canDispatchToEventManager` is deprecated
2017-08-22 14:53:26 +07:00
Kevin Ansfield
b89a0d0a5e ️ Added per-post code injection fields to PSM (#811)
- Remove gh-tab* components
    - The PSM was the only place where the `gh-tabs-manager`, `gh-tab`, and `gh-tab-pane` components were being used. These were very old components and did not work well with newer Ember versions and best practices.
    - 🔥 remove `gh-tab*` components
    - 💄 fix indents in `gh-post-settings-menu` template
    - 🎨 add support for named subviews ready for additional PSM panes

- Added per-post code injection fields to PSM
    - add "Code Injection" pane to the PSM
    - implement `codeinjectionHead` and `codeinjectionFoot`  attributes on `Post` model and save values from PSM
    - use CodeMirror for the PSM code injection fields
2017-08-02 13:32:51 +04:00
Kevin Ansfield
b425cb1352 🎨 fully fix Code Injection styles (#723)
closes https://github.com/TryGhost/Ghost/issues/8504

- allow `.settings-code-editor` to inherit from `.gh-input` - fixes border colours
- change `gh-cm-editor`'s "focused" class from `.focused` to `.focus` so it can inherit `.gh-input` styles
- add lazy loading of CM styles back in `gh-cm-editor` but prevent `lib/codemirror.css` from being compiled into the codemirror styles so that we get the theme colours without causing conflicts with the main editor
2017-06-01 23:01:43 +02:00
Kevin Ansfield
c74662538a 🐛 fix lazy-loading of CodeMirror interfering with editor (#717)
closes https://github.com/TryGhost/Ghost/issues/8488

- don't lazy-load the CodeMirror styles in `gh-cm-editor` as they are already loaded and overridden
2017-05-30 15:31:18 +02:00
Kevin Ansfield
cb59388c5b 💄🐷 sort-imports eslint rule (#712)
no issue

- adds `eslint-plugin-sort-imports-es6-autofix` dependency
  - implements ESLint's base `sort-imports` rule but has a distinction in that `import {foo} from 'bar';` is considered `multiple` rather than `single`
  - fixes ESLint's autofix behaviour so `eslint --fix` will actually fix the sort order
- updates all unordered import rules by using `eslint --fix`

With the increased number of `import` statements since Ember+ecosystem started moving towards es6 modules I've found it frustrating at times trying to search through randomly ordered import statements. Recently I've been sorting imports manually when I've added new code or touched old code so I thought I'd add an ESLint rule to codify it.
2017-05-29 20:50:03 +02:00
Kevin Ansfield
aaed8d9cf4 🐛 Fix HTML card not launching in edit mode (#647)
* replace `isEditing` observers with `didReceiveAttrs` hook

* 🐛 Fix HTML card not launching in edit mode

closes https://github.com/TryGhost/Ghost/issues/8310
- adds `autofocus=true` attribute to `gh-cm-editor` that will use CodeMirror's built-in autofocus behaviour
- set HTML card's launch mode to `edit` and ensure that the `autofocus` attribute is passed
- refactor `gh-cm-editor` for more robust event handling
- re-work `ch-cm-editor` tests to take into account CMs events not being triggered within a single run-loop and to still work when the browser window isn't focused (should fix the random test failures on Travis and the issues where the CM tests will fail locally)
2017-04-18 19:20:38 +12:00
Ryan McCarvill
5724a94fbc improved card selection behaviour (#608)
Refs: https://github.com/TryGhost/Ghost/issues/8191
Refs: https://github.com/TryGhost/Ghost/issues/8194

Changes the selection behaviour of mobiledoc-cards:
If you navigate to a card with a keyboard or click on the new editor toolbar it "hard selects".
If you click into the body of a card to edit it it "soft selects".

When a card is "hard selected" you can navigate out of the card and to the previous or following blocks within the mobiledoc with the keyboard, you can delete the current card with the backspace or delete button, and you can create a new block following the card with the enter key.

When a card is soft selected it is simply displayed as selected and allows the user to edit content within the card.

New card toolbar:
Allows a user to delete the card, save the card, and "hard select" a card.

New title behaviour:
Pressing the enter key within the title "splits" the title at the cursor point, if multiple characters are selected they are first deleted, and creates a new paragraph at the top of the document with the trailing characters after the split.

gh-cm-editor updates:
Adds an on-focus event to gh-cm-editor
2017-03-30 15:29:08 +01:00
Austin Burdine
3536d91c9c 🎨 make lazyLoader return a promise for loadStyle method
no issue
- cleans up the interface to maintain consistency between loadScript and
loadStyle
- update gh-cm-editor component to await result of loadStyle
2017-03-03 16:54:50 +00:00
Austin Burdine
2d6bb65322 🐛 don't destroy codemirror editor if it doesn't exist (#530)
closes TryGhost/Ghost#7855
- check if codemirror has been initialized before trying to destroy it
2017-02-17 10:15:28 +00:00
Hannah Wolfe
05940b7b83 🎨 Change asset path to /ghost/assets (#309)
refs #7503

- Having assets served from the same directory as the admin makes this tricky to refactor server side
- It's also much harder to optimise for 404s
2016-10-07 16:16:26 -05:00
Austin Burdine
c0f21b37d3 lazy-load codemirror on code injection screen (#99)
refs TryGhost/Ghost#6149
- concats codemirror.js and css on build, keeping them out of vendor.js
- add lazy-loader service to enable loading of external scripts
2016-07-05 17:30:14 +01:00
Austin Burdine
fb239054a0 convert remainder of components to use ember-cli-shims (#101)
follow up from #95
- converts components to use ember-cli-shims
2016-06-30 19:14:25 +01:00
Austin Burdine
6ee77a712a convert inputs to one-way inputs
no issue
- moves all inputs to use the data-down-actions-up component paradigm
2016-06-18 07:44:23 -04:00
Austin Burdine
cf36851265 deps: grunt-jscs,ember-suave@3.0.0
replaces #41, #60
- update ember-suave and grunt-jscs to 3.0
- standardize Ember global de-structuring rules across app & tests
2016-06-11 13:39:31 -06:00
Kevin Ansfield
e01ffa3620 Always call _super when using Ember hooks
no issue
- review use of Ember core hooks and add a call to `this._super` if missing
- fix a few occurrences of using the wrong component lifecycle hooks that could result in multiple/duplicate event handlers being attached

`_super` should always be called when overriding Ember's base hooks so that core functionality or app functionality added through extensions, mixins or addons is not lost. This is important as it guards against issues arising from later refactorings or core changes.

As example of lost functionality, there were a number of routes that extended from `AuthenticatedRoute` but then overrode the `beforeModel` hook without calling `_super` which meant that the route was no longer treated as authenticated.
2015-11-30 12:45:37 +00:00
Kevin Ansfield
2f4f6db133 Use es6 across client and add ember-suave to enforce rules
no issue
- add ember-suave dependency
- upgrade grunt-jscs dependency
- add a new .jscsrc for the client's tests directory that extends from client's base .jscsrc
- separate client tests in Gruntfile jscs task so they pick up the test's .jscsrc
- standardize es6 usage across client
2015-11-30 10:41:01 +00:00
Matthew Beale
3e881027cc Use private properties for unobserved render state
* Drop set for local private editor property
* Only run preview setup on didInsertElement
* Drop set for local scrollWrapper prop
* Selectize setup on afterRender instead of next
* Use local props for editor save timers
2015-11-21 09:25:21 -05:00
Kevin Ansfield
89b7ff3320 Routable tags
refs #5845
- Updates tag settings screen to match content screen behaviour. Each now tag has it's own route that is link-able from other areas of the app
- Updates a number of places where jQuery event handler code was not wrapped in Ember's run loop
2015-10-27 12:48:41 +00:00
Kevin Ansfield
5c9a824d53 Standardize on var-less export default across ember app
no issue
- drops the `var Foo = Ember.Thing.extend({}); export default Foo;` syntax in favour of exporting directly, eg: `export default Ember.Thing.extend({})`
- discussion on this change [here](https://github.com/TryGhost/Ghost/pull/5340#issuecomment-105828423) and [here](https://github.com/TryGhost/Ghost/pull/5694#discussion-diff-37511606)
2015-10-06 10:59:50 +01:00
Austin Burdine
ee685e448a add code editor component
closes #4995
- adds code mirror editor component
- converted code-injection editor fields to gh-cm-editor component
2015-04-05 11:57:18 -05:00