index.html 18.9 KB
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 375 376 377 378 379 380 381 382 383 384 385 386 387 388 389 390 391 392 393 394 395 396 397 398 399 400 401 402 403 404 405 406 407 408 409 410 411 412 413 414 415 416 417 418 419 420 421 422 423 424 425 426 427
<!DOCTYPE html>
<html lang="pt-br">
  <head>
    <meta charset="utf-8" />
    <title>Dialoga Brasil</title>

    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta property="og:title" content="Dialoga Brasil" />

    <script type="text/javascript">
      /**
      * The Url created with module pattern
      *
      * @todo Moves the module to another single js file
      */
      var Url = (function(){

        return {
          initBase: function(){
            return "//" + window.location.host + window.location.pathname.replace('/index.html','');
          },
          addBaseUrl: function(filename){
            var base = window.location.href;
            if(base.match(/file:/) || filename.match(/http:/)){
              base = '';
            }else{
              base = this.initBase();
              if(base.indexOf('/', base.length - 1) === -1) {
                base = base + '/';
              }
            }
            return base + filename;
          }
        }

      })();

      function makeCSSLink(filename){
        var fileref=document.createElement('link');
        fileref.setAttribute('rel', 'stylesheet');
        fileref.setAttribute('type', 'text/css');
        fileref.setAttribute('href',  Url.addBaseUrl(filename));
        return fileref;
      }
      function loadCSSFiles(){
        var css_files = [
          'css/bootstrap.min.css',
          'css/bootstrap-alert.min.css',
          'css/hover.custom.css',
          'http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css',
          'http://fonts.googleapis.com/css?family=Open+Sans:400,300,700',
          'http://fonts.googleapis.com/css?family=Asap:400,700',
          // 'style.css'
          'novo.css'
        ];
        head = document.getElementsByTagName('head')[0]
        for(i = 0; i < css_files.length; i++){
          head.appendChild(makeCSSLink(css_files[i]));
        }
      }
      function makeJSURL(filename){
        var url = Url.addBaseUrl(filename);

        return url;
      }

      function loadJavaScriptAsync(file_path){
      }

      function loadRequireJS(){
        var head = document.getElementsByTagName('head')[0];
        var script_element = document.createElement('script');
        script_element.type = 'text/javascript';
        script_element.src = makeJSURL('js/require.js');
        script_element.setAttribute('data-main', makeJSURL('js/requirejs-config.js'));
        head.appendChild(script_element);
      }
      loadCSSFiles();
    </script>

  </head>
  <body>
    <div id="fb-root"></div>
    <script>(function(d, s, id) {
      var js, fjs = d.getElementsByTagName(s)[0];
      if (d.getElementById(id)) return;
      js = d.createElement(s); js.id = id;
      js.src = "//connect.facebook.net/pt_BR/sdk.js#xfbml=1&version=v2.3&appId=1449495475361394";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));</script>


    <div class="container">
      <div id="proposal-result"></div>
    </div>

    <script id="proposal-template" type="text/x-handlebars-template">
      <header>
        <a id="display-contrast" href="#">Alto Contraste</a>
        <div class="social top">
          {{#social_share "Dialoga Brasil" "Aqui suas ideias viram propostas e você ajuda a melhorar as ações do governo" "#"}}{{/social_share}}
        </div>
        <h1><a href="#">{{article.title}}</a></h1>
      </header>

      <div id="content">
        {{{article.abstract}}}
      </div>

      <nav class="tab" role="tabpanel">
        <ul role="tablist">
          <li id="nav-proposal-categories" role="presentation">
            <a href="#/temas" class="active" role="tab" aria-controls="proposal-categories">Por Temas</a>
          </li>
          <li id="nav-proposal-group" role="presentation">
            <a href="#/programas" role="tab" aria-controls="proposal-group">Por Programas</a>
          </li>
        </ul>
      </nav>

      <article id="proposal-categories">
        <div id="proposal-categories-container">
          <nav>
            <ul class="themes">
            {{#each article.categories}}
              <li id="proposal-category-{{slug}}" class="proposal-category" data-category="{{slug}}">
                <a href="#/temas/{{slug}}/{{id}}" class="proposal-link hvr-float-shadow " data-target="proposal-item-{{id}}">{{name}}</a>
                <div class="arrow-box" style="display: none"></div>
              </li>
            {{/each}}
            </ul>
          </nav>
          {{#each article.categories}}
            <section id="proposal-item-{{id}}" class="proposal-category-items proposal-category-items-{{slug}} hide proposal-container clearfix {{slug}}" data-category="{{slug}}">
              <div class="header">
                <div class="name">{{name}}</div>
                <div class="description"></div>
              </div>
              <ul class="proposal-list row">
                {{#list_proposal ../article.children category=slug}}
                  {{#link title id}}{{/link}}
                {{/list_proposal}}
              </ul>
            </section>
          {{/each}}
        </div>
      </article>

      <article id="proposal-group" class="hide">
        <label for="search-input">Selecione um programa para fazer propostas e contar sua experiência.</label>
        <div id="search-input-container">
          <input placeholder="palavra chave" id="search-input" type="text" name="search" />
        </div>
        <ul class="proposal-list row">
          {{#list_proposal article.children}}
            {{#link title id}}{{/link}}
          {{/list_proposal}}
        </ul>
      </article>

      {{#each article.children}}
        {{!-- <div class="container"> --}}
          <article class="proposal-detail hide" id="proposal-item-{{id}}">
            <div class="categories {{#each categories}}{{slug}} {{/each}}">
              <header class="select">
                {{#each categories}}
                  <div class="category proposal-category" data-category="{{slug}}">
                    <button class="go-back btn btn-default">
                      <span class="fa fa-reply"></span>
                      Voltar
                    </button>
                    <a href="#/temas/{{slug}}/{{id}}" class="proposal-link" data-target="proposal-item-{{id}}">{{name}}</a>
                    {{#select_proposal ../../article.children slug ../id}}{{/select_proposal}}
                  </div>
                {{/each}}
              </header>

              <div class="proposal-header">
                <div class="abstract">
                  <img src="{{../host}}{{image.url}}" alt="Imagem de apresentação do programa."/>
                </div>
                <a href="#/programas/{{id}}/sobre-o-programa">
                  <div class="title">{{title}}</div>
                  <div class="abstract">{{{abstract}}}</div>
                </a>
                <div class="show_body row">
                  <a class="col-sm-6 col-sm-offset-3" href="#/programas/{{id}}/sobre-o-programa"><span>Conheça o programa</span></a>
                </div>
              </div>

              <div class="body proposal-detail-base hide">
                <div class='body-content'>
                  {{{body}}}
                </div>

                <div class="container">
                  <div class="row">
                    <div class="col-sm-4">
                      <div class="go-to-proposal-button">
                        <a href="#/programas/{{id}}" data-target="proposal-item-{{id}}" class="button button-participe">
                          <span class="fa fa-reply"></span>
                          Participe
                        </a>
                      </div>
                    </div>
                    <div class="col-sm-4 col-sm-offset-4">
                      <div class="social right">
                        <span>COMPARTILHE<br>ESTE PROGRAMA</span>
                        {{{social_share title abstract (program_detail_url id)}}}
                      </div>
                    </div>
                  </div>
                </div>
              </div>

              <div class="row">
                <div class="make-proposal-container col-sm-6">
                  <section class="make-proposal box box-propostas">
                    <div class="container-title box-title">Faça Uma Proposta</div>
                    <div class="subtitle box-subtitle">Qual a sua sugestão para melhorar este programa?</div>
                    <div class="info box-info">Esta consulta termina em julho de 2015. Até lá, todas as propostas serão lidas e as cinco mais pontuadas em cada programa receberão resposta oficial do governo.</div>
                    <div class="send-proposal-button send-button box-footer"><a href="#" class="button button-send"><span>Envie sua proposta</span></a></div>
                    <div class="login-container hide">Login</div>
                    <form class="make-proposal-form save-article-form require-login hide" id="make-proposal-form-{{id}}" action="{{proposal_action ../article . }}" method="post">
                      <div class="message hide"></div>
                      <div>
                        <div><label for="article_abstract">Descrição</label></div>
                        <textarea id="article_abstract" class="countdown" name="article[abstract]" placeholder="Descrição" maxlength="200"></textarea>
                      </div>
                      <input type="hidden" id="type" name="article[type]" value="ProposalsDiscussionPlugin::Proposal">
                      <input type="hidden" id="content_type" name="content_type" value="ProposalsDiscussionPlugin::Proposal">
                      <input type="submit" id="make-proposal-button" name="make-proposal-button" class="make-proposal-button" value="Enviar">
                    </form>
                    <div class="success-proposal-sent success-sent hide send-button">
                      <p>Sua proposta foi encaminhada com sucesso! Ela se tornará pública em até 24 horas e poderá ser apoiada por outros participantes.</p>
                      <a href="#">Faça nova proposta</a>
                    </div>
                    <div class="clearfix"></div>
                  </section>
                </div>
                <div class="support-proposal-container col-sm-6">
                  <section class="support-proposal box box-propostas box-center box-apoie">
                    <div class="container-title box-title">Apoie outras propostas</div>
                    <div class="alert alert-warning hide" role="alert">
                      <i class="fa fa-warning"></i><strong>Proposta não encontrada</strong>
                    </div>
                    <div class="support-proposal-content require-login">
                      <div class="random-proposal"></div>
                      <div class="loading">Carregando...</div>
                      <div class="no-proposals">Ainda não existe nenhuma proposta para este programa.</div>
                    </div>
                    <div class="login-container hide">Login</div>
                    <div class="send-button"><a href="#"><span>Login</span></a></div>
                  </section>
                </div>
              </div>

              <div class="results-container hide box box-propostas "></div>

              <div class="row">
                <div class="talk-proposal-container col-sm-12">
                  <section class="talk-proposal box box-propostas">
                    <div class="container-title box-title">Bate-papo com os ministros</div>
                    <p>Confira as datas e horários:</p>
                    <ul class="calendar" data-slick='{"infinite": false, "rows": 2}'>
                      <li>
                        <span>Arthur Chioro</span>
                        <span>Saúde</span>
                        <div class="date"><i class="fa fa-calendar"></i> 17/06/2015</div><div class="time"><i class="fa fa-clock-o"></i> 19:00</div>
                      </li>
                      <li>
                        <span>Tereza Campello</span>
                        <span>Desenvolvimento Social</span>
                        <div class="date"><i class="fa fa-calendar"></i> 18/06/2015</div><div class="time"><i class="fa fa-clock-o"></i> 19:00</div>
                      </li>
                      <li>
                        <span>Renato Janine Ribeiro</span>
                        <span>Educação</span>
                        <div class="date"><i class="fa fa-calendar"></i> 24/06/2015</div><div class="time"><i class="fa fa-clock-o"></i> 19:00</div>
                      </li>
                      <li>
                        <span>José Eduardo Cardozo</span>
                        <span>Justiça</span>
                        <div class="date"><i class="fa fa-calendar"></i> 25/04/2015</div><div class="time"><i class="fa fa-clock-o"></i> 19:00</div>
                      </li>
                    </ul>
                  </section>
                </div>
              </div>

            </div>
          </article>
        {{!-- </div> --}}
      {{/each}}
    </script>

    <script id="support-proposal-template" type="text/x-handlebars-template">
      <div class="abstract">
        <p class="box-subtitle">{{stripTags (trimString abstract 200)}}</p>
      </div>
      <div class="vote-actions">
        <a href="#" class="like dislike" data-vote-value="-1"></a>
        <a href="#" class="like" data-vote-value="1"></a>
        <a href="#" class="skip button box-footer">Pular</a>
        <a href="#" class="vote-result box-bottom">Resultados</a>
      </div>
      <div class="social">
        <span>Compartilhe esta proposta</span>
        {{{social_share parent.title abstract (proposal_url parent.id id)}}}
      </div>
    </script>

    <script id="results" type="text/x-handlebars-template">
      <div class="loading">Carregando...</div>
      <div class="results-content hide">
        <div class="clearfix">
          <span class="total">Total de propostas: <span class="value">{{pagination.total}}</span></span>
          <a href="#" class="vote-result">Fechar</a>
        </div>
        <div class="updated-at">
          <span>Última atualização </span>
          <span class="timeago" title="{{updated_at}}"></span>
        </div>
        <table>
          <tr class="header">
            <td class="abstract-text">Propostas</td>
            <td class="votes-for"></td>
            <td class="votes-against"></td>
            <td class="views">Exibições</td>
            <td class="support">Apoio</td>
          </tr>
          {{#each proposals}}
            <tr>
              <td class="abstract-text"><div class="truncate"><p class="truncated">{{stripTags abstract}}</p></div></td>
              <td class="votes-for value">{{votes_for}}</td>
              <td class="votes-against value">{{votes_against}}</td>
              <td class="views value">{{hits}}</td>
              <td class="support value">{{#round effective_support}}{{/round}}</td>
            </tr>
          {{/each}}
        </table>
        <div class="paging"></div>
      </div>
    </script>

    <script id="login" type="text/x-handlebars-template">
      <div class="loading">Carregando...</div>
      <form id="login-form" class="login">
        <div class="message hide"></div>
        <div class="row">
          <div class="col-sm-4">
            <a href="#" class="new-user button">Cadastre-se</a>
          </div>
        </div>
        <p class="box-subtitle">Ou acesse:</p>
        <div class="username">
          <label for="user_name" class="label">Nome de Usuário / E-mail:</label>
          <input id="user_name" name="login" type="text" placeholder="Nome do usuário / E-mail">
        </div>
        <div class="password">
          <label for="user_password" class="label">Senha:</label>
          <input id="user_password" name="password" type="password" placeholder="Senha">
        </div>
        <div class="row">
          <div class="actions col-sm-4">
            <input type="submit" class="login-action button col-sm-12" value="Acessar"/>
            <a href="http://www.participa.br/account/forgot_password" target="_blank" class="forgot-password">Esqueci minha senha</a>
          </div>
          <div class="oauth col-sm-8">
            <span class="label">Ou acesse usando <i>&raquo;</i></span>
            <a href="http://www.participa.br/plugin/oauth_client/facebook?oauth_client_popup=true&id=1" target="_blank" class="facebook oauth-login icon icon-facebook">Facebook</a>
            <a href="http://www.participa.br/plugin/oauth_client/google_oauth2?oauth_client_popup=true&id=2" target="_blank" class="google oauth-login icon icon-gplus">Google +</a>
          </div>
        </div>
      </form>
      <form id="signup-form" class="signup hide" autocomplete="off">
        <div class="message hide"></div>
        <p class="box-subtitle">Cadastre-se</p>
        <div class="email">
          <label for="user_email" class="label">E-mail:</label>
          <input id="user_email" name="email" type="text" placeholder="E-mail">
        </div>
        <div class="username">
          <label for="user_name" class="label">Nome de Usuário</label>
          <input id="user_name" name="login" type="text" placeholder="Nome do usuário">
        </div>
        <div class="row">
          <div class="password col-sm-6">
            <label for="user_password" class="label">Senha:</label>
            <input id="user_password" name="password" type="password" placeholder="Senha">
          </div>
          <div class="password-confirmation col-sm-6">
            <label for="user_password_confirmation" class="label">Confirme a senha:</label>
            <input id="user_password_confirmation" name="password_confirmation" type="password" placeholder="Confirme a senha">
          </div>
        </div>
        <div class="actions">
          <div class="row">
            <div class="col-sm-4">
              <a href="#" class="confirm-signup button">Confirmar</a>
            </div>
            <div class="col-sm-4">
              <a href="#" class="cancel-signup button button-cancela">Cancelar</a>
            </div>
          </div>
        </div>
      </form>
    </script>

    <script id="social-share" type="text/x-handlebars-template">
      <ul>
        <li><a href="{{url}}" class="fb-share icon icon-facebook" data-caption="{{title}}" data-description="{{stripTags description}}">Compartilhar no Facebook</a></li>
        <li><a href="https://twitter.com/intent/tweet?url={{encodeURI url}}&text={{stripTags description}}" class="tw-share icon icon-twitter popup">Compartilhar no Twitter</a></li>
        <li><a href="https://plus.google.com/share?url={{encodeURI url}}" class="gp-share icon icon-gplus popup">Compartilhar no Google Plus</a></li>
        <li><a href="whatsapp://send?text={{stripTags description}} {{encodeURI url}}" class="ws-share icon icon-whatsapp">Compartilhar no WhatsApp</a></li>
      </ul>
    </script>

    <script type='text/javascript'	>
      loadRequireJS();
    </script>


  </body>

</html>