WebCompDev / COMPONENTS

Commit 6dd3df9df35009348d5ad8c1aba270f2db4a481a

Authored by Renato De Donato
2 parents cd9f822e 8ab37b62

Merge branch 'master' of http://service.routetopa.eu:7480/WebCompDev/COMPONENTS

Inline Side-by-side
Showing 1 changed file with 215 additions and 0 deletions
controllets/document-card-controllet/document-card-controllet.html 0 → 100644
  View file @6dd3df9
  1 +<link rel="import" href="../../bower_components/polymer/polymer.html"/>
  2 +<link rel="import" href="../../bower_components/paper-material/paper-material.html"/>
  3 +<link rel="import" href="../../bower_components/paper-fab/paper-fab.html"/>
  4 +<link rel="import" href="../../bower_components/iron-icons/iron-icons.html"/>
  5 +<link rel="import" href="../../bower_components/paper-dialog/paper-dialog.html"/>
  6 +<link rel="import" href="../../bower_components/neon-animation/neon-animation.html"/>
  7 +
  8 +<script src="../../locales/paper_card_controllet_ln.js"></script>
  9 +
  10 +<dom-module id="document-card-controllet">
  11 +
  12 + <template>
  13 + <link rel="stylesheet" href="../shared_js/perfect-scrollbar/css/perfect-scrollbar.min.css">
  14 + <link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>
  15 + <style>
  16 +
  17 + #paper_card_container {
  18 + font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  19 + font-size: 16px;
  20 + background-color: white;
  21 + }
  22 +
  23 + #content {
  24 + padding: 4px 4px 0px 4px;
  25 + position:relative;
  26 + width: 98%;
  27 + height: 90%;
  28 + }
  29 +
  30 + .footer {
  31 + height: 16px;
  32 + }
  33 +
  34 + .comment {
  35 + position: relative;
  36 + top: -50px;
  37 + height: 50px;
  38 + background-color: white;
  39 + padding: 8px;
  40 + font-size: small;
  41 + color: #727272;
  42 + word-wrap: break-word;
  43 + overflow: hidden;
  44 + }
  45 +
  46 + paper-fab#fullscreen-button {
  47 + position: absolute;
  48 + /*z-index: 10;*/
  49 + top: 11px;
  50 + right: 15px;
  51 + --paper-fab-background:#FFFFFF;
  52 + padding : 0px;
  53 + margin: 0px;
  54 + height: 24px;
  55 + width: 24px;
  56 + color: #666666;
  57 + }
  58 +
  59 + paper-dialog {
  60 + margin: 0px;
  61 + padding: 0px;
  62 + z-index: 1100;
  63 + }
  64 +
  65 + #fullscreen_container {
  66 + display: inline;
  67 + position: fixed;
  68 + width: 90%;
  69 + height: 80vh;
  70 + right: 0;
  71 + left: 0;
  72 + top: 64px;
  73 + margin-right: auto;
  74 + margin-left: auto;
  75 + padding: 8px;
  76 + background-color: white;
  77 + }
  78 +
  79 + #fullscreen_content {
  80 + margin: 0px;
  81 + }
  82 +
  83 + #resource{
  84 + height: 100%;
  85 + width: 100%;
  86 + }
  87 +
  88 + :host #docs-header{
  89 + display : none;
  90 + }
  91 +
  92 + #info_close_button{
  93 + z-index: 1;
  94 + color: #666666;
  95 + box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
  96 + -webkit-transition: 0.2s ease-out;
  97 + -moz-transition: 0.2s ease-out;
  98 + -o-transition: 0.2s ease-out;
  99 + transition: 0.2s ease-out;
  100 + cursor: pointer;
  101 + background: linear-gradient(#f4f4f4,#e4e4e4);
  102 + float: right;
  103 + top: 11px;
  104 + right: 8px;
  105 + margin: 0px;
  106 + position: absolute;
  107 + height: 29px;
  108 + min-width: 30px;
  109 + padding: 5px;
  110 + }
  111 +
  112 + </style>
  113 +
  114 +
  115 + <paper-material id="paper_card_container" elevation="{{elevation}}">
  116 +
  117 + <div id="content">
  118 + <iframe id="resource" src="{{resourceUrl}}?userName={{userName}}"></iframe>
  119 + <!--<iframe id="resource" src="{{resourceUrl}}"></iframe>-->
  120 + </div>
  121 +
  122 + <paper-fab id="fullscreen-button" class="open" mini icon="fullscreen" on-click="_handleOpenClick"></paper-fab>
  123 +
  124 + <paper-dialog id="fullscreen_container" entry-animation="scale-up-animation" exit-animation="fade-out-animation">
  125 + <!--with-backdrop-->
  126 + <div id="fullscreen_content"></div>
  127 + <paper-button id="info_close_button" dialog-confirm autofocus>x</paper-button>
  128 + </paper-dialog>
  129 +
  130 + </paper-material>
  131 +
  132 + </template>
  133 +
  134 + <script src="../shared_js/perfect-scrollbar/js/min/perfect-scrollbar.jquery.min.js"></script>
  135 +
  136 + <script>
  137 + _this = null;
  138 +
  139 + Polymer({
  140 + is: "document-card-controllet",
  141 + properties: {
  142 +
  143 + width: {
  144 + type: Number,
  145 + observer: "_changeWidth"
  146 + },
  147 +
  148 + height: {
  149 + type: Number,
  150 + observer: "_changeHeight"
  151 + },
  152 +
  153 + elevation:{
  154 + type: Number,
  155 + value: 3
  156 + },
  157 +
  158 + createNewType : {
  159 + type : String,
  160 + value : undefined
  161 + },
  162 +
  163 + comment:{
  164 + cardType: String,
  165 + value: ""
  166 + },
  167 +
  168 + resourceUrl : {
  169 + type : String,
  170 + value : undefined
  171 + },
  172 +
  173 + userName: {
  174 + type: String,
  175 + value: undefined
  176 + },
  177 + lang:{
  178 + type: String,
  179 + value: navigator.language
  180 + }
  181 + },
  182 +
  183 + ready : function(){
  184 + },
  185 +
  186 + attached: function(){
  187 + $(this.$.fullscreen_container).perfectScrollbar();
  188 + },
  189 +
  190 +
  191 + _changeWidth: function(){
  192 + //this.style.width = this.width + "px";
  193 + //this.$.paper_card_container.style.width = this.width + "px";
  194 + //this.$.content.style.width = this.width - 8 + "px";
  195 + },
  196 +
  197 + _changeHeight: function(){
  198 + this.style.height = this.height + "vh";
  199 + //this.$.content.width = this.width - 4 + "vh";
  200 + this.$.paper_card_container.style.height = this.height + "vh";
  201 + this.$.content.style.height = this.height - 1 + "vh";
  202 + $(this.$.content).perfectScrollbar();
  203 + },
  204 +
  205 + _handleOpenClick: function(){
  206 + this.$.fullscreen_content.style.height = "80vh";
  207 + this.$.fullscreen_content.innerHTML = this.$.content.innerHTML;
  208 + this.$.fullscreen_container.style.display = "inline";//datalet res
  209 + this.$.fullscreen_container.open();
  210 + }
  211 +
  212 + })
  213 + </script>
  214 +
  215 +</dom-module>
0 \ No newline at end of file 216 \ No newline at end of file