mirror of
https://github.com/gyurix1968/guacamole-client.git
synced 2025-09-07 13:41:21 +00:00
195 lines
9.3 KiB
HTML
195 lines
9.3 KiB
HTML
<!--
|
|
Copyright (C) 2014 Glyptodon LLC
|
|
|
|
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
of this software and associated documentation files (the "Software"), to deal
|
|
in the Software without restriction, including without limitation the rights
|
|
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
copies of the Software, and to permit persons to whom the Software is
|
|
furnished to do so, subject to the following conditions:
|
|
|
|
The above copyright notice and this permission notice shall be included in
|
|
all copies or substantial portions of the Software.
|
|
|
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
THE SOFTWARE.
|
|
-->
|
|
|
|
<guac-viewport>
|
|
|
|
<!-- Client view -->
|
|
<div class="client-view">
|
|
<div class="client-view-content">
|
|
|
|
<!-- Central portion of view -->
|
|
<div class="client-body" guac-touch-drag="clientDrag" guac-touch-pinch="clientPinch">
|
|
|
|
<!-- Client -->
|
|
<guac-client client="client"></guac-client>
|
|
|
|
</div>
|
|
|
|
<!-- Bottom portion of view -->
|
|
<div class="client-bottom">
|
|
|
|
<!-- Text input -->
|
|
<div class="text-input-container" ng-show="showTextInput">
|
|
<guac-text-input needs-focus="showTextInput"></guac-text-input>
|
|
</div>
|
|
|
|
<!-- On-screen keyboard -->
|
|
<div class="keyboard-container" ng-show="showOSK">
|
|
<guac-osk layout="'CLIENT.URL_OSK_LAYOUT' | translate"></guac-osk>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Menu -->
|
|
<div class="menu" ng-class="{open: menu.shown}" id="guac-menu">
|
|
<div class="menu-content">
|
|
|
|
<!-- Stationary header -->
|
|
<div class="header">
|
|
<h2>{{client.name}}</h2>
|
|
<guac-user-menu local-actions="clientMenuActions"></guac-user-menu>
|
|
</div>
|
|
|
|
<!-- Scrollable body -->
|
|
<div class="menu-body" guac-touch-drag="menuDrag" guac-scroll="menu.scrollState">
|
|
|
|
<!-- Clipboard -->
|
|
<div class="menu-section" id="clipboard-settings">
|
|
<h3>{{'CLIENT.SECTION_HEADER_CLIPBOARD' | translate}}</h3>
|
|
<div class="content">
|
|
<p class="description">{{'CLIENT.HELP_CLIPBOARD' | translate}}</p>
|
|
<textarea ng-model="client.clipboardData" rows="10" cols="40" id="clipboard"></textarea>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Devices -->
|
|
<div class="menu-section" id="devices" ng-show="client.filesystems.length">
|
|
<h3>{{'CLIENT.SECTION_HEADER_DEVICES' | translate}}</h3>
|
|
<div class="content">
|
|
<div class="device filesystem" ng-repeat="filesystem in client.filesystems" ng-click="showFilesystemMenu(filesystem)">
|
|
{{filesystem.name}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- File transfers -->
|
|
<div class="menu-section" id="file-transfers">
|
|
<h3 guac-marker="menu.fileTransferMarker">{{'CLIENT.SECTION_HEADER_FILE_TRANSFERS' | translate}}</h3>
|
|
<div class="content">
|
|
<guac-file-transfer-manager client="client"></guac-file-transfer-manager>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Input method -->
|
|
<div class="menu-section" id="keyboard-settings">
|
|
<h3>{{'CLIENT.SECTION_HEADER_INPUT_METHOD' | translate}}</h3>
|
|
<div class="content">
|
|
|
|
<!-- No IME -->
|
|
<div class="choice">
|
|
<label><input id="ime-none" name="input-method" ng-change="closeMenu()" ng-model="menu.inputMethod" type="radio" value="none"/> {{'CLIENT.NAME_INPUT_METHOD_NONE' | translate}}</label>
|
|
<p class="caption"><label for="ime-none">{{'CLIENT.HELP_INPUT_METHOD_NONE' | translate}}</label></p>
|
|
</div>
|
|
|
|
<!-- Text input -->
|
|
<div class="choice">
|
|
<div class="figure"><label for="ime-text"><img src="images/settings/tablet-keys.png" alt=""/></label></div>
|
|
<label><input id="ime-text" name="input-method" ng-change="closeMenu()" ng-model="menu.inputMethod" type="radio" value="text"/> {{'CLIENT.NAME_INPUT_METHOD_TEXT' | translate}}</label>
|
|
<p class="caption"><label for="ime-text">{{'CLIENT.HELP_INPUT_METHOD_TEXT' | translate}} </label></p>
|
|
</div>
|
|
|
|
<!-- Guac OSK -->
|
|
<div class="choice">
|
|
<label><input id="ime-osk" name="input-method" ng-change="closeMenu()" ng-model="menu.inputMethod" type="radio" value="osk"/> {{'CLIENT.NAME_INPUT_METHOD_OSK' | translate}}</label>
|
|
<p class="caption"><label for="ime-osk">{{'CLIENT.HELP_INPUT_METHOD_OSK' | translate}}</label></p>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Mouse mode -->
|
|
<div class="menu-section" id="mouse-settings">
|
|
<h3>{{'CLIENT.SECTION_HEADER_MOUSE_MODE' | translate}}</h3>
|
|
<div class="content">
|
|
<p class="description">{{'CLIENT.HELP_MOUSE_MODE' | translate}}</p>
|
|
|
|
<!-- Touchscreen -->
|
|
<div class="choice">
|
|
<input name="mouse-mode" ng-change="closeMenu()" ng-model="client.clientProperties.emulateAbsoluteMouse" type="radio" ng-value="true" checked="checked" id="absolute"/>
|
|
<div class="figure">
|
|
<label for="absolute"><img src="images/settings/touchscreen.png" alt="{{'CLIENT.NAME_MOUSE_MODE_ABSOLUTE' | translate}}"/></label>
|
|
<p class="caption"><label for="absolute">{{'CLIENT.HELP_MOUSE_MODE_ABSOLUTE' | translate}}</label></p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Touchpad -->
|
|
<div class="choice">
|
|
<input name="mouse-mode" ng-change="closeMenu()" ng-model="client.clientProperties.emulateAbsoluteMouse" type="radio" ng-value="false" id="relative"/>
|
|
<div class="figure">
|
|
<label for="relative"><img src="images/settings/touchpad.png" alt="{{'CLIENT.NAME_MOUSE_MODE_RELATIVE' | translate}}"/></label>
|
|
<p class="caption"><label for="relative">{{'CLIENT.HELP_MOUSE_MODE_RELATIVE' | translate}}</label></p>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Display options -->
|
|
<div class="menu-section" id="display-settings">
|
|
<h3>{{'CLIENT.SECTION_HEADER_DISPLAY' | translate}}</h3>
|
|
<div class="content">
|
|
<div id="zoom-settings">
|
|
<div ng-click="zoomOut()" id="zoom-out"><img src="images/settings/zoom-out.png" alt="-"/></div>
|
|
<div id="zoom-state">{{formattedScale()}}%</div>
|
|
<div ng-click="zoomIn()" id="zoom-in"><img src="images/settings/zoom-in.png" alt="+"/></div>
|
|
</div>
|
|
<div><label><input ng-model="menu.autoFit" ng-change="changeAutoFit()" ng-disabled="autoFitDisabled()" type="checkbox" id="auto-fit"/> {{'CLIENT.TEXT_ZOOM_AUTO_FIT' | translate}}</label></div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Filesystem menu -->
|
|
<div id="filesystem-menu" class="menu" ng-class="{open: isFilesystemMenuShown()}">
|
|
<div class="menu-content">
|
|
|
|
<!-- Stationary header -->
|
|
<div class="header">
|
|
<h2>{{filesystemMenuContents.name}}</h2>
|
|
<button class="back" ng-click="hideFilesystemMenu()">Back</button>
|
|
</div>
|
|
|
|
<!-- Breadcrumbs -->
|
|
<div class="header breadcrumbs"><div
|
|
class="breadcrumb root"
|
|
ng-click="changeDirectory(filesystemMenuContents, filesystemMenuContents.root)"></div><div
|
|
class="breadcrumb"
|
|
ng-repeat="file in getPath(filesystemMenuContents.currentDirectory)"
|
|
ng-click="changeDirectory(filesystemMenuContents, file)">{{file.name}}</div>
|
|
</div>
|
|
|
|
<!-- Scrollable body -->
|
|
<div class="menu-body">
|
|
<guac-file-browser client="client" filesystem="filesystemMenuContents"></guac-file-browser>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
</guac-viewport>
|