weather/app/views/admin/ruling_weathers/_setting_form.html.erb

<style>
  .modal-body{
    font-size: 1.5em;
  }
  .help_btn{
    cursor: pointer;
    padding: 0em 0.475em;
    font-size: 1.25em;
    border-radius: 1em;
    margin-left: 0.5em;
    background-color: rgb(210, 106, 2);
    border-color: rgb(210, 106, 2);
    color: white;
  }
</style>
<div id="show_help_modal1" class="modal fade hide">
  <div class='modal-dialog'>
    <div class='modal-content'>
      <div class='modal-header'>
        <button type='button' aria-hidden='true' class='close'>×</button>
        <h4 class='modal-title'><%= t("ruling_weather.dataid") %></h4>
      </div>
      <div class='modal-body'>
        <img src="/assets/ruling_weather/dataid_example.png">
        <span><%= t("ruling_weather.format") %>: F-xxxxx-xxx (Ex: F-D0047-001)</span>
        <div style="clear: both;"></div>
        <a href="https://opendata.cwb.gov.tw/dist/opendata-swagger.html" target="_blank"><%=t("ruling_weather.weather_information_center_api_instruction")%></a>
      </div>
      <div class='modal-footer'><button type='button' class='btn btn-default close-btn'>Close</button></div>
    </div>
  </div>
</div>
<div id="show_help_modal2" class="modal fade hide">
  <div class='modal-dialog'>
    <div class='modal-content'>
      <div class='modal-header'>
        <button type='button' aria-hidden='true' class='close'>×</button>
        <h4 class='modal-title'><%= t("ruling_weather.location") %></h4>
      </div>
      <div class='modal-body' style="text-align: center;">
        <p><%= t("ruling_weather.location_need_match_dataid") %></p>
        <span style="color: red; font-size: 1.5em;">Ex: 頭城鎮</span>
        <div style="clear: both;"></div>
        <%= render :partial => 'location_help' %>
        <div style="clear: both;"></div>
        <a href="https://opendata.cwb.gov.tw/opendatadoc/CWB_Opendata_API_V1.2.pdf" target="_blank"><%=t("ruling_weather.weather_information_center_api_instruction")%>.pdf Page: 47~48(附錄A)</a>
      </div>
      <div class='modal-footer'><button type='button' class='btn btn-default close-btn'>Close</button></div>
    </div>
  </div>
</div>
<div id="show_help_modal3" class="modal fade hide">
  <div class='modal-dialog'>
    <div class='modal-content'>
      <div class='modal-header'>
        <button type='button' aria-hidden='true' class='close'>×</button>
        <h4 class='modal-title'><%= t("ruling_weather.observatory_name") %></h4>
      </div>
      <div class='modal-body'>
        <img src="/assets/ruling_weather/observatory_name_example.png">
        <span>Ex: 五分山雷達站</span>
        <div style="clear: both;"></div>
        <a href="https://e-service.cwb.gov.tw/wdps/obs/state.htm#existing_station" target="_blank"><%= t("ruling_weather.observatory_name") %></a>
      </div>
      <div class='modal-footer'><button type='button' class='btn btn-default close-btn'>Close</button></div>
    </div>
  </div>
</div>
<div class="control-group">
  <label class="control-label muted"><%= t("ruling_weather.dataid") %><button type="button" tabindex="0" class="help_btn" data-target="#show_help_modal1"><i aria-hidden="true" class="fa fa-question"></i></button></label>
  <div class="controls">
    <%= f.text_field :dataid %>
  </div>
</div>
<div class="control-group">
  <label class="control-label muted"><%= t("ruling_weather.location") %><button type="button" tabindex="0" class="help_btn" data-target="#show_help_modal2"><i aria-hidden="true" class="fa fa-question"></i></button></label>
  <div class="controls">
    <%= f.text_field :location %>
  </div>
</div>
<div class="control-group">
  <label class="control-label muted"><%= t("ruling_weather.observatory_name") %><button type="button" tabindex="0" class="help_btn" data-target="#show_help_modal3"><i aria-hidden="true" class="fa fa-question"></i></button></label>
  <div class="controls">
    <%= f.text_field :observatory_name %>
  </div>
</div>
<!-- Form Actions -->
<div class="form-actions">
  <%#= f.hidden_field :time_offset, :id=>"weather_timeoffset" %>
  <% referer = request.referer rescue nil %>
  <% referer = get_referer_url if referer.blank? || request.host != URI.parse(URI.encode(referer)).host %>
  <%= f.submit t('ruling_weather.save'), class: 'btn btn-primary' %>
  <input type="hidden" name="referer_url" value="<%= referer %>">
  <%= link_to t('cancel'), referer, :class=>"btn" %> 
</div>
<script>
  /*window.timer_offset = (new Date().getTimezoneOffset() / -60).toString();
  if(window.timer_offset[0] != "-"){
    window.timer_offset = "+" + window.timer_offset;
  }
  $(document).ready(function(){
    $("#weather_timeoffset").val(window.timer_offset);
  })*/
  $('button[data-target]').click(function(){
    $($(this).data("target")).modal('show'); 
    return false;
  });
  $(".modal .close-btn, .modal .close").click(function(){
    $(this).parents(".modal").modal('hide');
    return false;
  })
</script>