2016-07-06 00:19:09 +00:00
< rd-header >
< rd-header-title title = "Create container" > < / rd-header-title >
< rd-header-content >
2016-11-02 05:14:52 +00:00
< a ui-sref = "containers" > Containers< / a > > Add container
2016-07-06 00:19:09 +00:00
< / rd-header-content >
< / rd-header >
< div class = "row" >
< div class = "col-lg-12 col-md-12 col-xs-12" >
< rd-widget >
< rd-widget-body >
< form class = "form-horizontal" >
<!-- name - input -->
< div class = "form-group" >
< label for = "container_name" class = "col-sm-1 control-label text-left" > Name< / label >
< div class = "col-sm-11" >
< input type = "text" class = "form-control" ng-model = "config.name" id = "container_name" placeholder = "e.g. myContainer" >
< / div >
< / div >
<!-- !name - input -->
2016-07-08 03:31:09 +00:00
<!-- image - and - registry - inputs -->
2016-07-06 00:19:09 +00:00
< div class = "form-group" >
< label for = "container_image" class = "col-sm-1 control-label text-left" > Image< / label >
2016-07-08 03:31:09 +00:00
< div class = "col-sm-7" >
< input type = "text" class = "form-control" ng-model = "config.Image" id = "container_image" placeholder = "e.g. ubuntu:trusty" >
< / div >
< label for = "image_registry" class = "col-sm-1 control-label text-left" > Registry< / label >
< div class = "col-sm-3" >
2016-08-17 06:42:56 +00:00
< input type = "text" class = "form-control" ng-model = "formValues.Registry" id = "image_registry" placeholder = "leave empty to use DockerHub" >
2016-07-06 00:19:09 +00:00
< / div >
< div class = "col-sm-offset-1 col-sm-11" >
< div class = "checkbox" >
< label >
2016-10-20 03:43:09 +00:00
< input type = "checkbox" ng-model = "formValues.alwaysPull" > Always pull image before creating
2016-07-06 00:19:09 +00:00
< / label >
< / div >
< / div >
< / div >
2016-07-08 03:31:09 +00:00
<!-- !image - and - registry - inputs -->
2016-07-06 00:19:09 +00:00
<!-- restart - policy -->
< div class = "form-group" >
< label class = "col-sm-1 control-label text-left" > Restart policy< / label >
< div class = "col-sm-11" >
< label class = "radio-inline" >
< input type = "radio" name = "container_restart_policy" ng-model = "config.HostConfig.RestartPolicy.Name" value = "no" >
Never
< / label >
< label class = "radio-inline" >
< input type = "radio" name = "container_restart_policy" ng-model = "config.HostConfig.RestartPolicy.Name" value = "always" >
Always
< / label >
< label class = "radio-inline" >
< input type = "radio" name = "container_restart_policy" ng-model = "config.HostConfig.RestartPolicy.Name" value = "on-failure" >
< span class = "radio-value" > On failure< / span >
< / label >
2016-10-27 07:05:37 +00:00
< label class = "radio-inline" >
< input type = "radio" name = "container_restart_policy" ng-model = "config.HostConfig.RestartPolicy.Name" value = "unless-stopped" >
< span class = "radio-value" > Unless stopped< / span >
< / label >
2016-07-06 00:19:09 +00:00
< / div >
< / div >
<!-- !restart - policy -->
<!-- port - mapping -->
< div class = "form-group" >
< label for = "container_ports" class = "col-sm-1 control-label text-left" > Port mapping< / label >
< div class = "col-sm-11" >
2016-10-27 08:33:39 +00:00
< span class = "label label-default interactive" ng-click = "addPortBinding()" >
2016-07-06 00:19:09 +00:00
< i class = "fa fa-plus-circle" aria-hidden = "true" > < / i > map port
< / span >
< / div >
<!-- port - mapping - input - list -->
< div class = "col-sm-offset-1 col-sm-11 form-inline" style = "margin-top: 10px;" >
< div ng-repeat = "portBinding in config.HostConfig.PortBindings" style = "margin-top: 2px;" >
< div class = "input-group col-sm-5 input-group-sm" >
< span class = "input-group-addon" > host< / span >
2016-10-07 05:08:07 +00:00
< input type = "text" class = "form-control" ng-model = "portBinding.hostPort" placeholder = "e.g. 80 or 1.2.3.4:80 (optional)" >
2016-07-06 00:19:09 +00:00
< / div >
< div class = "input-group col-sm-5 input-group-sm" >
< span class = "input-group-addon" > container< / span >
< input type = "text" class = "form-control" ng-model = "portBinding.containerPort" placeholder = "e.g. 80" >
< / div >
< div class = "input-group col-sm-1 input-group-sm" >
2016-12-25 20:34:02 +00:00
< select class = "form-control" ng-model = "portBinding.protocol" >
2016-07-06 00:19:09 +00:00
< option value = "tcp" > tcp< / option >
< option value = "udp" > udp< / option >
< / select >
< span class = "input-group-btn" >
< button class = "btn btn-default" type = "button" ng-click = "removePortBinding($index)" >
< i class = "fa fa-minus" aria-hidden = "true" > < / i >
< / button >
< / span >
< / div >
< / div >
< / div >
<!-- !port - mapping - input - list -->
< / div >
<!-- !port - mapping -->
< / form >
< / rd-widget-body >
< / rd-widget >
< / div >
< / div >
< div class = "row" >
< div class = "col-lg-12 col-md-12 col-xs-12" >
< rd-widget >
< rd-widget-body >
< ul class = "nav nav-tabs" >
2016-10-27 08:33:39 +00:00
< li class = "active interactive" > < a data-target = "#command" data-toggle = "tab" > Command< / a > < / li >
< li class = "interactive" > < a data-target = "#volumes" data-toggle = "tab" > Volumes< / a > < / li >
< li class = "interactive" > < a data-target = "#network" data-toggle = "tab" > Network< / a > < / li >
2016-12-25 20:33:14 +00:00
< li class = "interactive" > < a data-target = "#labels" data-toggle = "tab" > Labels< / a > < / li >
2016-10-27 08:33:39 +00:00
< li class = "interactive" > < a data-target = "#security" data-toggle = "tab" > Security/Host< / a > < / li >
2016-07-06 00:19:09 +00:00
< / ul >
<!-- tab - content -->
< div class = "tab-content" >
<!-- tab - command -->
< div class = "tab-pane active" id = "command" >
< form class = "form-horizontal" style = "margin-top: 15px;" >
<!-- command - input -->
< div class = "form-group" >
< label for = "container_command" class = "col-sm-1 control-label text-left" > Command< / label >
< div class = "col-sm-9" >
< input type = "text" class = "form-control" ng-model = "config.Cmd" id = "container_command" placeholder = "e.g. /usr/bin/nginx -t -c /mynginx.conf" >
< / div >
< / div >
<!-- !command - input -->
<!-- entrypoint - input -->
< div class = "form-group" >
< label for = "container_entrypoint" class = "col-sm-1 control-label text-left" > Entry Point< / label >
< div class = "col-sm-9" >
< input type = "text" class = "form-control" ng-model = "config.Entrypoint" id = "container_entrypoint" placeholder = "e.g. /bin/sh -c" >
< / div >
< / div >
<!-- !entrypoint - input -->
<!-- workdir - user - input -->
< div class = "form-group" >
< label for = "container_workingdir" class = "col-sm-1 control-label text-left" > Working Dir< / label >
< div class = "col-sm-4" >
< input type = "text" class = "form-control" ng-model = "config.WorkingDir" id = "container_workingdir" placeholder = "e.g. /myapp" >
< / div >
< label for = "container_user" class = "col-sm-1 control-label text-left" > User< / label >
< div class = "col-sm-4" >
< input type = "text" class = "form-control" ng-model = "config.User" id = "container_user" placeholder = "e.g. nginx" >
< / div >
< / div >
<!-- !workdir - user - input -->
<!-- console -->
< div class = "form-group" >
< label for = "container_console" class = "col-sm-1 control-label text-left" > Console< / label >
< div class = "col-sm-11" >
< div class = "col-sm-4" >
< label class = "radio-inline" >
< input type = "radio" name = "container_console" ng-model = "formValues.Console" value = "both" >
Interactive & TTY < span class = "small text-muted" > (-i -t)< / span >
< / label >
< / div >
< div class = "col-sm-4" >
< label class = "radio-inline" >
< input type = "radio" name = "container_console" ng-model = "formValues.Console" value = "interactive" >
Interactive < span class = "small text-muted" > (-i)< / span >
< / label >
< / div >
< / div >
< div class = "col-sm-offset-1 col-sm-11" >
< div class = "col-sm-4" >
< label class = "radio-inline" >
< input type = "radio" name = "container_console" ng-model = "formValues.Console" value = "tty" >
TTY < span class = "small text-muted" > (-t)< / span >
< / label >
< / div >
< div class = "col-sm-4" >
< label class = "radio-inline" >
< input type = "radio" name = "container_console" ng-model = "formValues.Console" value = "none" >
None
< / label >
< / div >
< / div >
< / div >
<!-- !console -->
<!-- environment - variables -->
< div class = "form-group" >
< label for = "container_env" class = "col-sm-1 control-label text-left" > Environment variables< / label >
< div class = "col-sm-11" >
2016-10-27 08:33:39 +00:00
< span class = "label label-default interactive" ng-click = "addEnvironmentVariable()" >
2016-07-06 00:19:09 +00:00
< i class = "fa fa-plus-circle" aria-hidden = "true" > < / i > environment variable
< / span >
< / div >
<!-- environment - variable - input - list -->
< div class = "col-sm-offset-1 col-sm-11 form-inline" style = "margin-top: 10px;" >
< div ng-repeat = "variable in config.Env" style = "margin-top: 2px;" >
< div class = "input-group col-sm-5 input-group-sm" >
< span class = "input-group-addon" > name< / span >
< input type = "text" class = "form-control" ng-model = "variable.name" placeholder = "e.g. FOO" >
< / div >
< div class = "input-group col-sm-5 input-group-sm" >
< span class = "input-group-addon" > value< / span >
< input type = "text" class = "form-control" ng-model = "variable.value" placeholder = "e.g. bar" >
< span class = "input-group-btn" >
< button class = "btn btn-default" type = "button" ng-click = "removeEnvironmentVariable($index)" >
< i class = "fa fa-minus" aria-hidden = "true" > < / i >
< / button >
< / span >
< / div >
< / div >
< / div >
<!-- !environment - variable - input - list -->
< / div >
<!-- !environment - variables -->
< / form >
< / div >
<!-- !tab - command -->
<!-- tab - volume -->
< div class = "tab-pane" id = "volumes" >
< form class = "form-horizontal" style = "margin-top: 15px;" >
<!-- volumes -->
< div class = "form-group" >
< label for = "container_volumes" class = "col-sm-1 control-label text-left" > Volumes< / label >
2016-08-17 06:42:56 +00:00
< div class = "col-sm-11" >
2016-10-27 08:33:39 +00:00
< span class = "label label-default interactive" ng-click = "addVolume()" >
2016-07-06 00:19:09 +00:00
< i class = "fa fa-plus-circle" aria-hidden = "true" > < / i > volume
< / span >
< / div >
<!-- volumes - input - list -->
< div class = "col-sm-offset-1 col-sm-11 form-inline" style = "margin-top: 10px;" >
< div ng-repeat = "volume in formValues.Volumes" style = "margin-top: 2px;" >
2016-08-17 06:42:56 +00:00
< div class = "input-group col-sm-1 input-group-sm" >
< div class = "checkbox" >
< label >
< input type = "checkbox" ng-model = "volume.readOnly" > Read-only
< / label >
< / div >
< / div >
2016-07-06 00:19:09 +00:00
< div class = "input-group col-sm-5 input-group-sm" >
2016-08-17 06:42:56 +00:00
< span class = "input-group-addon" > < input type = "checkbox" ng-model = "volume.isPath" ng-click = "resetVolumePath($index)" > Path< / span >
2016-12-25 20:34:02 +00:00
< select class = "form-control" ng-model = "volume.name" ng-if = "!volume.isPath" >
2016-07-06 00:19:09 +00:00
< option selected disabled hidden value = "" > Select a volume< / option >
2016-08-17 06:42:56 +00:00
< option ng-repeat = "vol in availableVolumes" ng-value = "vol.Name" > {{ vol.Name|truncate:30}}< / option >
2016-07-06 00:19:09 +00:00
< / select >
2016-08-17 06:42:56 +00:00
< input ng-if = "volume.isPath" type = "text" class = "form-control" ng-model = "volume.name" placeholder = "e.g. /path/on/host" >
2016-07-06 00:19:09 +00:00
< / div >
< div class = "input-group col-sm-5 input-group-sm" >
< span class = "input-group-addon" > container< / span >
< input type = "text" class = "form-control" ng-model = "volume.containerPath" placeholder = "e.g. /path/in/container" >
< span class = "input-group-btn" >
< button class = "btn btn-default" type = "button" ng-click = "removeVolume($index)" >
< i class = "fa fa-minus" aria-hidden = "true" > < / i >
< / button >
< / span >
< / div >
< / div >
< / div >
<!-- !volumes - input - list -->
< / div >
< / form >
<!-- !volumes -->
< / div >
<!-- !tab - volume -->
<!-- tab - network -->
< div class = "tab-pane" id = "network" >
< form class = "form-horizontal" style = "margin-top: 15px;" >
2017-01-22 23:14:34 +00:00
< div class = "form-group" ng-if = "globalNetworkCount === 0 && applicationState.endpoint.mode.provider !== 'DOCKER_SWARM_MODE'" >
2016-07-06 07:04:45 +00:00
< div class = "col-sm-12" >
< span class = "small text-muted" > You don't have any shared network. Head over the < a ui-sref = "networks" > networks view< / a > to create one.< / span >
< / div >
< / div >
2016-07-06 00:19:09 +00:00
<!-- network - input -->
< div class = "form-group" >
< label for = "container_network" class = "col-sm-1 control-label text-left" > Network< / label >
< div class = "col-sm-9" >
2016-12-25 20:34:02 +00:00
< select class = "form-control" ng-model = "config.HostConfig.NetworkMode" id = "container_network" >
2016-07-06 00:19:09 +00:00
< option selected disabled hidden value = "" > Select a network< / option >
< option ng-repeat = "net in availableNetworks" ng-value = "net.Name" > {{ net.Name }}< / option >
< / select >
< / div >
< / div >
<!-- !network - input -->
2016-11-16 01:52:05 +00:00
<!-- container - name - input -->
< div class = "form-group" ng-if = "config.HostConfig.NetworkMode == 'container'" >
< label for = "container_network_container" class = "col-sm-1 control-label text-left" > Container< / label >
< div class = "col-sm-9" >
2017-01-22 23:14:34 +00:00
< select ng-if = "applicationState.endpoint.mode.provider !== 'DOCKER_SWARM'" ng-options = "container|containername for container in runningContainers" class = "form-control" ng-model = "formValues.NetworkContainer" >
2016-11-16 01:52:05 +00:00
< option selected disabled hidden value = "" > Select a container< / option >
< / select >
2017-01-22 23:14:34 +00:00
< select ng-if = "applicationState.endpoint.mode.provider === 'DOCKER_SWARM'" ng-options = "container|swarmcontainername for container in runningContainers" class = "form-control" ng-model = "formValues.NetworkContainer" >
2016-11-16 01:52:05 +00:00
< option selected disabled hidden value = "" > Select a container< / option >
< / select >
< / div >
< / div >
<!-- !container - name - input -->
2016-07-06 00:19:09 +00:00
<!-- hostname - input -->
< div class = "form-group" >
< label for = "container_hostname" class = "col-sm-1 control-label text-left" > Hostname< / label >
< div class = "col-sm-9" >
< input type = "text" class = "form-control" ng-model = "config.Hostname" id = "container_hostname" placeholder = "e.g. web01" >
< / div >
< / div >
<!-- !hostname - input -->
<!-- domainname - input -->
< div class = "form-group" >
< label for = "container_domainname" class = "col-sm-1 control-label text-left" > Domain Name< / label >
< div class = "col-sm-9" >
< input type = "text" class = "form-control" ng-model = "config.Domainname" id = "container_domainname" placeholder = "e.g. example.com" >
< / div >
< / div >
<!-- !domainname -->
< / form >
< / div >
<!-- !tab - network -->
2016-12-25 20:33:14 +00:00
<!-- tab - labels -->
< div class = "tab-pane" id = "labels" >
< form class = "form-horizontal" style = "margin-top: 15px;" >
<!-- labels -->
< div class = "form-group" >
< label for = "container_labels" class = "col-sm-1 control-label text-left" > Labels< / label >
< div class = "col-sm-11" >
< span class = "label label-default interactive" ng-click = "addLabel()" >
< i class = "fa fa-plus-circle" aria-hidden = "true" > < / i > label
< / span >
< / div >
<!-- labels - input - list -->
< div class = "col-sm-offset-1 col-sm-11 form-inline" style = "margin-top: 10px;" >
< div ng-repeat = "label in formValues.Labels" style = "margin-top: 2px;" >
< div class = "input-group col-sm-5 input-group-sm" >
< span class = "input-group-addon" > name< / span >
< input type = "text" class = "form-control" ng-model = "label.name" placeholder = "e.g. com.example.foo" >
< / div >
< div class = "input-group col-sm-5 input-group-sm" >
< span class = "input-group-addon" > value< / span >
< input type = "text" class = "form-control" ng-model = "label.value" placeholder = "e.g. bar" >
< span class = "input-group-btn" >
< button class = "btn btn-default" type = "button" ng-click = "removeLabel($index)" >
< i class = "fa fa-minus" aria-hidden = "true" > < / i >
< / button >
< / span >
< / div >
< / div >
< / div >
<!-- !labels - input - list -->
< / div >
<!-- !labels -->
< / form >
< / div >
<!-- !tab - labels -->
2016-07-06 00:19:09 +00:00
<!-- tab - security -->
< div class = "tab-pane" id = "security" >
< form class = "form-horizontal" style = "margin-top: 15px;" >
<!-- privileged - mode -->
< div class = "form-group" >
< div class = "col-sm-12" >
< div class = "checkbox" >
< label >
< input type = "checkbox" ng-model = "config.HostConfig.Privileged" > Privileged mode
< / label >
< / div >
< / div >
< / div >
<!-- !privileged - mode -->
< / form >
< / div >
<!-- !tab - security -->
< / div >
< / rd-widget-body >
< / rd-widget >
< / div >
< / div >
< div class = "row" >
< div class = "col-lg-12 col-md-12 col-xs-12" style = "text-align: center;" >
2016-07-07 00:44:58 +00:00
< div >
< i id = "createContainerSpinner" class = "fa fa-cog fa-3x fa-spin" style = "margin-bottom: 5px; display: none;" > < / i >
< / div >
2016-07-06 00:19:09 +00:00
< button type = "button" class = "btn btn-default btn-lg" ng-click = "create()" > Create< / button >
< a type = "button" class = "btn btn-default btn-lg" ui-sref = "containers" > Cancel< / a >
< / div >
< / div >