Fixed OHIF Viewer layout / CINE / Hanging Protocol buttons (OHIF-49)

Packages/viewerbase/client/components/viewer/toolbarSectionButton/toolbarSectionButton.html

@@ -1,7 +1,12 @@
 <template name="toolbarSectionButton">
-    <div id="{{this.id}}" class="toolbarSectionButton rp-x-1 {{this.classes}} {{activeClass}}" title="{{this.title}}">
+    {{ #if this.buttonTemplateName }}
+    {{> UI.dynamic template=this.buttonTemplateName data=this }}
+    {{ else }}
+    <div id="{{this.id}}"
+         class="toolbarSectionButton rp-x-1 {{this.classes}} {{activeClass}}"
+         title="{{this.title}}">
         <div class="svgContainer">
-            {{ #if this.svgLink }} 
+            {{ #if this.svgLink }}
             <svg>
                 <use xlink:href={{this.svgLink}}></use>
             </svg>
@@ -13,4 +18,5 @@
             {{this.title}}
         </div>
     </div>
+    {{ /if }}
 </template>

Packages/viewerbase/client/components/viewer/toolbarSectionButton/toolbarSectionButton.js

@@ -30,7 +30,7 @@ Template.toolbarSectionButton.events({
     },
     'click .imageViewerCommand'(event, instance) {
         const command = event.currentTarget.id;
-        if (!OHIF.viewer.functionList.hasOwnProperty(command)) {
+        if (!OHIF.viewer.functionList || !OHIF.viewer.functionList.hasOwnProperty(command)) {
             return;
         }