refactor: getConfig

package.json

@@ -66,6 +66,7 @@
   "dependencies": {
     "@cloudinary/url-gen": "^1.10.2",
     "dashjs": "^4.7.1",
+    "lodash": "^4.17.21",
     "uuid": "^9.0.0",
     "video.js": "8.3.0",
     "videojs-contrib-ads": "^6.9.0",

src/index.js

@@ -1,7 +1,7 @@
 import 'assets/styles/main.scss';
 import VideoPlayer from './video-player';
 import { assign } from 'utils/assign';
-import { omit, pick, convertKeysToSnakeCase } from './utils/object';
+import { pick, convertKeysToSnakeCase } from './utils/object';
 import { CLOUDINARY_CONFIG_PARAM } from './video-player.const';
 
 if (window.cloudinary && window.cloudinary.Cloudinary) {
@@ -10,12 +10,14 @@ if (window.cloudinary && window.cloudinary.Cloudinary) {
   );
 }
 
-const getConfig = (playerOptions = {}, cloudinaryConfig) =>
+const getConfig = (playerOptions = {}, cloudinaryConfig) => {
+  const snakeCaseCloudinaryConfig = pick(convertKeysToSnakeCase(playerOptions), CLOUDINARY_CONFIG_PARAM);
+
   // pick cld-configurations and assign them to cloudinaryConfig
-  assign(omit(playerOptions, CLOUDINARY_CONFIG_PARAM), {
-    cloudinaryConfig:
-      cloudinaryConfig || convertKeysToSnakeCase(pick(playerOptions, CLOUDINARY_CONFIG_PARAM))
+  return assign(playerOptions, {
+    cloudinaryConfig: cloudinaryConfig || snakeCaseCloudinaryConfig
   });
+};
 
 const getVideoPlayer = config => (id, playerOptions, ready) =>
   new VideoPlayer(id, getConfig(playerOptions, config), ready);

src/utils/object.js

@@ -1,4 +1,4 @@
-import { camelToSnake } from './string';
+import snakeCase from 'lodash/snakeCase';
 
 /**
  * a nested value from an object
@@ -54,7 +54,7 @@ export const convertKeysToSnakeCase = (obj) => {
   let snakeCaseObj = {};
 
   Object.keys(obj).forEach((key) => {
-    const snakeCaseKey = camelToSnake(key);
+    const snakeCaseKey = snakeCase(key);
     snakeCaseObj[snakeCaseKey] = obj[key];
   });
 

src/utils/string.js

@@ -11,10 +11,4 @@ function startsWith(str, searchStr, position) {
   }
 }
 
-function camelToSnake(camelCaseString) {
-  return camelCaseString.replace(/[A-Z]/g, function (match) {
-    return '_' + match.toLowerCase();
-  });
-}
-
-export { camelize, startsWith, camelToSnake };
+export { camelize, startsWith };

src/video-player.const.js

@@ -1,5 +1,4 @@
 import videojs from 'video.js';
-import { camelize } from './utils/string';
 
 export const CLOUDINARY_PARAMS = [
   'cloudinaryConfig',
@@ -51,8 +50,7 @@ export const CLOUDINARY_CONFIG_PARAM = [
   'url_suffix',
   'use_root_path',
   'auth_token'
-  // Support camelCase as well
-].map((param) => ([param, camelize(param)])).flat();
+];
 
 export const DEFAULT_HLS_OPTIONS = {
   html5: {

src/video-player.js

@@ -61,6 +61,10 @@ class VideoPlayer extends Utils.mixin(Eventable) {
     };
   }
 
+  get playerOptions() {
+    return this.options.playerOptions;
+  }
+
   constructor(elem, initOptions, ready) {
     super();
 
@@ -516,10 +520,6 @@ class VideoPlayer extends Utils.mixin(Eventable) {
     return this.videojs.cloudinary.cloudinaryConfig(config);
   }
 
-  get playerOptions() {
-    return this.options.playerOptions;
-  }
-
   currentPublicId() {
     return this.videojs.cloudinary.currentPublicId();
   }