Guess access UI styling

public/css/style.css

@@ -994,3 +994,11 @@ canvas.pdf-viewer-page {
     display: block;
     box-shadow: 0 0 2px #aaa;
 }
+.hidden-link-input {
+    /*opacity: 0;
+    width: 0 !important;
+    border: 0 !important;
+    padding: 0 !important;*/
+    position: absolute;
+    left: -9999px;
+}

resources/views/app/patient/note/guest-access.blade.php

@@ -1,73 +1,91 @@
-<div class="d-flex">
+<div class="d-flex align-items-center">
 
-    @if($section->guest_access_level != 'READ')
-    <div moe wide class="mr-2">
-        <a start show>
-            Enable Guest Read Access
-        </a>
-        <form url="/api/section/enableGuestReadAccess">
-            <input type="hidden" name="uid" value="{{$section->uid}}">
+    <i class="fa fa-user"></i>
+    <span class="ml-2 font-weight-bold text-secondary">Guest Access</span>
 
-            <div class="form-group">
-                Enable guest read access?
-            </div>
+    @if($section->guest_access_level == 'NONE')
+        <i class="fa fa-ban text-danger ml-2"></i>
+    @else
+        <i class="fa fa-check text-success ml-2"></i>
+    @endif
+    <span class="ml-1">Read</span>
 
-            <div class="form-group m-0">
-                <button submit class="btn btn-primary btn-sm mr-2">Submit</button>
-                <button cancel class="btn btn-default border btn-sm mr-2">Cancel</button>
-            </div>
-        </form>
-    </div>
+    @if($section->guest_access_level == 'NONE')
+        <div moe relative wide class="ml-1">
+            <a start show class="font-weight-bold">
+                Allow
+            </a>
+            <form url="/api/section/enableGuestReadAccess" right>
+                <input type="hidden" name="uid" value="{{$section->uid}}">
+
+                <div class="form-group">
+                    Enable guest read access?
+                </div>
+
+                <div class="form-group m-0">
+                    <button submit class="btn btn-primary btn-sm mr-2">Submit</button>
+                    <button cancel class="btn btn-default border btn-sm mr-2">Cancel</button>
+                </div>
+            </form>
+        </div>
+    @endif
+
+    @if($section->guest_access_level != 'WRITE')
+        <i class="fa fa-ban text-danger ml-2"></i>
+    @else
+        <i class="fa fa-check text-success ml-2"></i>
     @endif
+    <span class="ml-1">Write</span>
 
     @if($section->guest_access_level != 'WRITE')
-    <div moe wide class="mr-2">
-        <a start show>
-            Enable Guest Write Access
-        </a>
-        <form url="/api/section/enableGuestWriteAccess">
-            <input type="hidden" name="uid" value="{{$section->uid}}">
+        <div moe relative wide class="ml-1 d-none if-edit">
+            <a start show class="font-weight-bold">
+                Allow
+            </a>
+            <form url="/api/section/enableGuestWriteAccess" right>
+                <input type="hidden" name="uid" value="{{$section->uid}}">
 
-            <div class="form-group">
-                Enable guest write access?
-            </div>
+                <div class="form-group">
+                    Enable guest write access?
+                </div>
 
-            <div class="form-group m-0">
-                <button submit class="btn btn-primary btn-sm mr-2">Submit</button>
-                <button cancel class="btn btn-default border btn-sm mr-2">Cancel</button>
-            </div>
-        </form>
-    </div>
+                <div class="form-group m-0">
+                    <button submit class="btn btn-primary btn-sm mr-2">Submit</button>
+                    <button cancel class="btn btn-default border btn-sm mr-2">Cancel</button>
+                </div>
+            </form>
+        </div>
     @endif
 
     @if($section->guest_access_level != 'NONE')
-    <div class="mr-2">
-        @if($section->guest_access_level == 'READ')
-        READ ACCESS: 
-        @endif
-        
-        @if($section->guest_access_level == 'WRITE')
-        WRITE ACCESS: 
-        @endif
-        <a href="{{route('guest_section_access', $section->guest_access_code)}}"> {{route('guest_section_access', $section->guest_access_code)}} </a>
-    </div>
-    <div moe wide class="mr-2">
-        <a start show>
-            Disable Guest Access
-        </a>
-        <form url="/api/section/disableGuestAccess">
-            <input type="hidden" name="uid" value="{{$section->uid}}">
+        <div class="d-none if-edit">
+            <div class="d-flex align-items-center">
+                <span class="mx-2 text-secondary">|</span>
+                <?php $id = "guest_link_" . Illuminate\Support\Str::random(10); ?>
+                <input tabindex="-1" type="text" class="hidden-link-input" aria-hidden="true"
+                       id="{{ $id }}"
+                       value="{{ route('guest_section_access', $section->guest_access_code) }}">
+                <a href="#" class="copy-link" data-id="{{ $id }}">Copy Access Link</a>
+                <span class="mx-2 text-secondary">|</span>
+                <div moe wide relative>
+                    <a start show>
+                        Disable Access
+                    </a>
+                    <form url="/api/section/disableGuestAccess" right>
+                        <input type="hidden" name="uid" value="{{$section->uid}}">
 
-            <div class="form-group">
-                Disable guest access?
-            </div>
+                        <div class="form-group">
+                            Disable guest access?
+                        </div>
 
-            <div class="form-group m-0">
-                <button submit class="btn btn-primary btn-sm mr-2">Submit</button>
-                <button cancel class="btn btn-default border btn-sm mr-2">Cancel</button>
+                        <div class="form-group m-0">
+                            <button submit class="btn btn-primary btn-sm mr-2">Submit</button>
+                            <button cancel class="btn btn-default border btn-sm mr-2">Cancel</button>
+                        </div>
+                    </form>
+                </div>
+                <span class="ml-2 text-secondary">|</span>
             </div>
-        </form>
-    </div>
+        </div>
     @endif
-
-</div>
+</div>

resources/views/app/patient/note/section.blade.php

@@ -4,7 +4,7 @@ if ($latestSectionTS === 0 || $latestSectionTS < $sectionTS) {
     $latestSectionTS = $sectionTS;
 }
 ?>
-<div data-ts="{{$sectionTS}}" class="p-3 border-bottom note-section " 
+<div data-ts="{{$sectionTS}}" class="p-3 border-bottom note-section "
     data-section-uid="{{ $section->uid }}"
     data-section-template-uid="{{ $section->sectionTemplate->uid }}"
     data-section-template-name="{{ $section->sectionTemplate->internal_name }}">
@@ -37,25 +37,26 @@ if ($latestSectionTS === 0 || $latestSectionTS < $sectionTS) {
         }
         ?>
         <?php if (file_exists(storage_path('sections/' . $sectionInternalName . '/actions.blade.php'))): ?>
-        @include('sections/' . $sectionInternalName . '/actions') 
+        @include('sections/' . $sectionInternalName . '/actions')
         <?php endif; ?>
 
         @if(isset($pro))
-            <div class="ml-4">
-                @include('app.patient.note.guest-access')
-            </div>   
-
-            <a href="#" class="d-none text-danger if-edit ml-auto remove-section-trigger mr-1" data-uid="{{$section->uid}}" title="Remove {{$section->sectionTemplate->title}}">
-                Remove {{$section->sectionTemplate->title}}
-            </a>
-
-            <a href="#" class="d-none if-edit ml-2 move-up-trigger" data-uid="{{$section->uid}}" title="Move Up">
-                <i class="fa fa-arrow-up"></i>
-            </a>
-
-            <a href="#" class="d-none if-edit ml-2 move-down-trigger" data-uid="{{$section->uid}}" title="Move Down">
-                <i class="fa fa-arrow-down"></i>
-            </a>
+            <div class="ml-auto d-inline-flex align-items-center">
+                <div class="ml-auto">
+                    @if(!isset($note) || (isset($note) && !$note->is_signed_by_hcp))
+                        @include('app.patient.note.guest-access')
+                    @endif
+                </div>
+                <a href="#" class="d-none text-danger if-edit ml-2 remove-section-trigger mr-1" data-uid="{{$section->uid}}" title="Remove {{$section->sectionTemplate->title}}">
+                    Remove {{$section->sectionTemplate->title}}
+                </a>
+                <a href="#" class="d-none if-edit ml-2 move-up-trigger" data-uid="{{$section->uid}}" title="Move Up">
+                    <i class="fa fa-arrow-up"></i>
+                </a>
+                <a href="#" class="d-none if-edit ml-2 move-down-trigger" data-uid="{{$section->uid}}" title="Move Down">
+                    <i class="fa fa-arrow-down"></i>
+                </a>
+            </div>
         @endif
     </div>
     @if(!isset($guestAccessCode) || $section->guest_access_level == 'READ')

resources/views/app/patient/note/section_script.blade.php

@@ -67,6 +67,17 @@
             @if(isset($guestAccessCode))
                 $('.note-section form').append("<input type='hidden' name='guest_access_code' value='{{$guestAccessCode}}'/>");
             @endif
+
+            // copy link
+            $(document)
+                .off('click.copy', '.copy-link')
+                .on('click.copy', '.copy-link', function() {
+                    var copyText = $('#' + $(this).attr('data-id'));
+                    copyText.focus().select();
+                    document.execCommand("copy");
+                    toastr.success("The link " + copyText.val() + " has been copied to the clipboard");
+                    return false;
+                });
         }
 
         const debounce = (func, wait) => {
@@ -138,4 +149,4 @@
         addMCInitializer('note-sections-list', init);
 
     })();
-</script>
+</script>