feat(embed): add method & event edit

CHANGELOG.md

@@ -2,7 +2,8 @@
 
 ## v0.3.0 (unreleased)
 
-* Add methods: `getEmbedConfig`, `setEditorConfig`
+* Add methods: `getEmbedConfig`, `setEditorConfig`, `edit`
+* Add events: `edit`
 
 ## v0.2.0
 

README.md

@@ -98,6 +98,7 @@ When instantiating `Flat.Embed`, you can pass options in the second parameter. I
   * [`setAutoZoom`](#setautozoomboolean-promiseboolean-error): Enable or disable the auto-zoom mode
 * [Editor Methods](#editor-methods)
   * [`setEditorConfig`](#seteditorconfigconfig-object-promiseobject-error): Set the config of the editor
+  * [`edit`](#editoperations-object-promisevoid-error): Make a modification to the document
 * [Events API](#events-api)
   * [`scoreLoaded`](#event-scoreLoaded): A new score has been loaded
   * [`cursorPosition`](#event-cursorposition): The cursor position changed
@@ -108,6 +109,7 @@ When instantiating `Flat.Embed`, you can pass options in the second parameter. I
   * [`pause`](#event-pause): The score playback paused
   * [`stop`](#event-stop): The score playback stopped
   * [`playbackPosition`](#event-playbackposition): The playback slider position changed
+  * [`edit`](#event-edit): An edition has been made to the document
 
 ## Viewer Methods
 
@@ -382,9 +384,20 @@ embed.setAutoZoom(false).then(function (state) {
 
 ## Editor Methods
 
+You can enable the editor mode by setting the `mode` to `edit` when creating the embed:
+
+```js
+var embed = new Flat.Embed(container, {
+  embedParams: {
+    appId: '<your-app-id>',
+    modeL 'edit'
+  }
+});
+```
+
 ### `setEditorConfig(config: object): Promise<object, Error>`
 
-Set a new config for the editor (e.g. the different tools available in the embed).
+Set a new config for the editor (e.g. the different tools available in the embed). This one will be used at the next loading score.
 
 ```js
 // For example: hide the Articulation mode, and only display the durations tools in the Note mode
@@ -399,6 +412,20 @@ embed.setEditorConfig({
 });
 ```
 
+### `edit(operations: object): Promise<void, Error>`
+
+Process some edit operations using one of our internal editing method. Feel free to [contact our developers support](mailto:[email protected]) to get more information about the operations available.
+
+```js
+embed.edit([
+  { name: 'action.SetTitle', opts: { title: 'I <3 Flat'} }
+]).then(function () {
+  // The actions have been executed
+}).catch(function (error) {
+  // Error while executing the actions
+});
+```
+
 ## Events API
 
 Events are broadcasted following actions made by the end user or you with the JavaScript API. You can subscribe to an event using the method [`on`](#onevent-string-callback-function-void), and unsubscribe using [`off`](#onevent-string-callback-function-void). When an event includes some data, this data will be available in the first parameter of the listener callback.
@@ -477,3 +504,25 @@ This event is triggered when the playback slider moves. It is usually triggered
     "timePerMeasure": 2
 }
 ```
+
+### Event: `edit`
+
+This event is triggered when one or multiple modifications ave been made to the document. This one will contain a list of operations made:
+
+```json
+[
+    {
+        "name": "action.SetTempo",
+        "opts": {
+            "startMeasureIdx": 0,
+            "stopMeasureIdx": 1,
+            "tempo": {
+                "bpm": 142,
+                "qpm": 142,
+                "durationType": 3,
+                "nbDots": 0
+            }
+        }
+    }
+]
+```

karma.conf.js

@@ -5,7 +5,8 @@ module.exports = function(config) {
     frameworks: ['mocha'],
     client: {
       mocha: {
-        timeout: '30000ms'
+        timeout: '30000ms',
+        // grep: 'Editor modifications'
       }
     },
     files: [

package.json

@@ -1,6 +1,6 @@
 {
   "name": "flat-embed",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "Interact and get events from Flat's Sheet Music Embed",
   "license": "Apache-2.0",
   "author": "Flat Team <[email protected]>",

src/embed.js

@@ -302,6 +302,15 @@ class Embed {
   setAutoZoom(state) {
     return this.call('setAutoZoom', state);
   }
+
+  /**
+   * Call Flat's internal edit methods
+   *
+   * @param {operations} The operations to process
+   */
+   edit(operations) {
+     return this.call('edit', operations);
+   }
 }
 
 export default Embed;

test/integration/embed-integration.js

@@ -165,7 +165,7 @@ describe('Integration - Embed', () => {
       });
     });
 
-    it('should fail to import a non json', function (done) {
+    it('should fail to import a non json', (done) => {
       var container = document.createElement('div');
       document.body.appendChild(container);
 
@@ -338,7 +338,7 @@ describe('Integration - Embed', () => {
       });
     });
 
-    it('should fail to import an invalid MusicXML', function (done) {
+    it('should fail to import an invalid MusicXML', (done) => {
       var container = document.createElement('div');
       document.body.appendChild(container);
 
@@ -566,7 +566,130 @@ describe('Integration - Embed', () => {
         assert.equal(config.noteMode.tuplet, false);
         container.parentNode.removeChild(container);
         done();
+      }).catch(done);
+    });
+  });
+
+  describe('Editor modifications', () => {
+    it('should make a modification, get the event and get the document updated', (done) => {
+      var container = document.createElement('div');
+      document.body.appendChild(container);
+
+      var embed = new Flat.Embed(container, {
+        score: PUBLIC_SCORE,
+        baseUrl: BASE_URL,
+        embedParams: {
+          appId: APP_ID,
+          mode: 'edit'
+        }
+      });
+
+      embed.on('edit', (operations) => {
+        assert.equal(operations.length, 1);
+        assert.equal(operations[0].name, 'action.SetTempo');
+        assert.equal(operations[0].opts.startMeasureIdx, 0);
+        assert.equal(operations[0].opts.stopMeasureIdx, 1);
+        assert.deepEqual(operations[0].opts.tempo, {
+          bpm: 142,
+          qpm: 142,
+          durationType: 3,
+          nbDots: 0
+        });
+      });
+
+      embed.edit([
+        {
+          name: 'action.SetTempo',
+          opts: {
+            startMeasureIdx: 0,
+            stopMeasureIdx: 1,
+            tempo: {
+              bpm: 142,
+              qpm: 142,
+              durationType: 3,
+              nbDots: 0
+            }
+          }
+        }
+      ]).then(() => {
+        return embed.getJSON();
+      }).then((json) => {
+        assert.equal(json['score-partwise'].part[0].measure[0].sound.$tempo, 142);
+        container.parentNode.removeChild(container);
+        done();
+      }).catch(done);
+    });
+
+    it('should fail to edit with bad ops arguments (edit error)', (done) => {
+      var container = document.createElement('div');
+      document.body.appendChild(container);
+
+      var embed = new Flat.Embed(container, {
+        score: PUBLIC_SCORE,
+        baseUrl: BASE_URL,
+        embedParams: {
+          appId: APP_ID,
+          mode: 'edit'
+        }
       });
+
+      embed.edit([
+        {
+          name: 'action.SetTempo',
+          opts: {
+            startMeasureIdx: 0,
+            stopMeasureIdx: 1000000,
+            tempo: {
+              bpm: 142,
+              qpm: 142,
+              durationType: 3,
+              nbDots: 0
+            }
+          }
+        }
+      ]).then(() => {
+        return done('Should have fail');
+      }).catch((error) => {
+        assert.equal(error.code, 'BadMeasureIdxError');
+        assert.equal(error.message, 'There is no measure at the index [1000000<number>].');
+        container.parentNode.removeChild(container);
+        done();
+      })
+    });
+
+    it('should fail to edit with bad ops arguments (bad ops format)', (done) => {
+      var container = document.createElement('div');
+      document.body.appendChild(container);
+
+      var embed = new Flat.Embed(container, {
+        score: PUBLIC_SCORE,
+        baseUrl: BASE_URL,
+        embedParams: {
+          appId: APP_ID,
+          mode: 'edit'
+        }
+      });
+
+      embed.edit({
+        name: 'action.SetTempo',
+        opts: {
+          startMeasureIdx: 0,
+          stopMeasureIdx: 1000000,
+          tempo: {
+            bpm: 142,
+            qpm: 142,
+            durationType: 3,
+            nbDots: 0
+          }
+        }
+      }).then(() => {
+        return done('Should have fail');
+      }).catch((error) => {
+        assert.equal(error.code, 'TypeError');
+        assert.equal(error.message, 'Operations must be an array of operations');
+        container.parentNode.removeChild(container);
+        done();
+      })
     });
   });
 });