-<%= form_for(@panel) do |f| %>
- <%= render 'system/error_explanation', :obj => @panel %>
+<div id="tabs">
+ <ul>
+ <li><a href="#tabs-1">panel</a></li>
+ <li><a href="#tabs-2">t order</a></li>
+ <li><a href="#tabs-3">z order</a></li>
+ </ul>
+ <div id="tabs-1">
+ <%= form_for(@panel) do |f| %>
+ <%= render 'system/error_explanation', :obj => @panel %>
- <div class="field">
- <%= f.label :caption %><br />
- <%= f.text_field :caption %>
- </div>
- <div class="field">
- <%= f.label :width %><br />
- <%= f.number_field :width %>
- </div>
- <div class="field">
- <%= f.label :height %><br />
- <%= f.number_field :height %>
- </div>
- <div class="field">
- <%= f.label :border %><br />
- <%= f.number_field :border %>
- </div>
- <div class="field">
- <%= f.label :publish %><br />
- <%= f.collection_select :publish, t_select_items(MagicNumber['panel_visible_items']), :last, :first, :html => {:selected => @panel.publish} %>
- </div>
- <div class="actions">
- <%= f.submit %>
- </div>
-<% end %>
+ <div class="field">
+ <%= f.label :caption %><br />
+ <%= f.text_field :caption %>
+ </div>
+ <div class="field">
+ <%= f.label :width %><br />
+ <%= f.number_field :width, :id => 'panel-width' %>
+ </div>
+ <div class="field">
+ <%= f.label :height %><br />
+ <%= f.number_field :height, :id => 'panel-height' %>
+ </div>
+ <div class="field">
+ <%= f.label :border %><br />
+ <%= f.number_field :border %>
+ </div>
+ <div class="field">
+ <%= f.label :publish %><br />
+ <%= f.collection_select :publish, t_select_items(MagicNumber['panel_visible_items']), :last, :first, :html => {:selected => @panel.publish} %>
+ </div>
+ <div class="actions">
+ <%= f.submit %>
+ </div>
+ <% end %>
+ <h2><%= t 'panels.create_from_json' -%></h2>
+ <%= form_for(@panel) do |f| %>
+ <%= render 'system/error_explanation', :obj => @panel %>
-<h2><%= t 'panels.create_from_json' -%></h2>
-<%= form_for(@panel) do |f| %>
- <%= render 'system/error_explanation', :obj => @panel %>
-
- <div>
- <label for="json">json data</label>
+ <div>
+ <label for="json">json data</label>
+ </div>
+ <%= text_field_tag "json" %>
+ <div>
+ <%= submit_tag t('panels.create_from_json') -%>
+ </div>
+ <% end %>
+ </div>
+ <div id="tabs-2">
+ <h2><%= 't reorder' -%></h2>
+ <table id="t-sortable">
+ <tbody >
+ <% @panel.panel_elements.each do |elm| %>
+ <tr classname="<%= elm.class.to_s -%>" oid="<%= elm.id -%>">
+ <% case elm.class.to_s %>
+ <% when 'PanelPicture' %>
+ <td>
+ <%= tag(:img, elm.tmb_opt_img_tag) %>
+ </td>
+ <% when 'SpeechBalloon' %>
+ <td>
+ <%= elm.id -%>
+ <%= elm.caption -%>
+ </td>
+ <% when 'GroundPicture' %>
+ <td>
+ <%= tag(:img, elm.tmb_opt_img_tag) -%>
+ </td>
+ <% when 'GroundColor' %>
+ <td style="color: #<%= format("%06x", elm.code ^ 0xffffff) -%>; background-color: #<%= format("%06x", elm.code) -%>;">
+ <%= format("%06x", elm.code ^ 0xffffff) %>
+ </td>
+ <% end %>
+ <td>
+ <%= h(truncate(elm.caption, :length => 12)) %>
+ </td>
+ </tr>
+ <% end %>
+ </tbody>
+ </table>
+ <%= form_for(@panel) do |f| %>
+ <%= hidden_field_tag "json", nil, :id => 't-reorder' %>
+ <% unless @panel.new_record? -%>
+ <%= content_tag :div, '', :id => "panel-id-elm", :oid => @panel.id -%>
+ <% end %>
+ <div>
+ <%= submit_tag t('panels.create.title') -%>
+ </div>
+ <% end %>
</div>
- <%= text_field_tag "json" %>
- <div>
- <%= submit_tag t('panels.create_from_json') -%>
+ <div id="tabs-3">
+ <h2><%= 'z reorder' -%></h2>
+ <table id="z-sortable">
+ <tbody >
+ <% @panel.zorderd_elements.each do |elm| %>
+ <tr classname="<%= elm.class.to_s -%>" oid="<%= elm.id -%>">
+ <% case elm.class.to_s %>
+ <% when 'PanelPicture' %>
+ <td>
+ <%= tag(:img, elm.tmb_opt_img_tag) %>
+ </td>
+ <% when 'SpeechBalloon' %>
+ <td>
+ <%= elm.id -%>
+ <%= elm.caption -%>
+ </td>
+ <% when 'GroundPicture' %>
+ <td>
+ <%= tag(:img, elm.tmb_opt_img_tag) -%>
+ </td>
+ <% when 'GroundColor' %>
+ <td style="color: #<%= format("%06x", elm.code ^ 0xffffff) -%>; background-color: #<%= format("%06x", elm.code) -%>;">
+ <%= format("%06x", elm.code ^ 0xffffff) %>
+ </td>
+ <% end %>
+ <td>
+ <%= h(truncate(elm.caption, :length => 12)) %>
+ </td>
+ </tr>
+ <% end %>
+ </tbody>
+ </table>
+ <%= form_for(@panel) do |f| %>
+ <%= hidden_field_tag "json", nil, :id => 'z-reorder' %>
+ <% unless @panel.new_record? -%>
+ <%= content_tag :div, '', :id => "panel-id-zorderd", :oid => @panel.id -%>
+ <% end %>
+ <div>
+ <%= submit_tag t('panels.create.title') -%>
+ </div>
+ <% end %>
</div>
-<% end %>
+</div>
-<h2><%= 't reorder' -%></h2>
-<table id="t-sortable">
- <tbody >
- <% @panel.panel_elements.each do |elm| %>
- <tr classname="<%= elm.class.to_s -%>" oid="<%= elm.id -%>">
+<style>
+<!--
+#t-sortable tr {
+ margin: 0 3px 3px 3px;
+ padding: 0.3em;
+ padding-left: 1em;
+ font-size: 15px;
+ font-weight: bold;
+ cursor: move;
+}
+#z-sortable tr {
+ margin: 0 3px 3px 3px;
+ padding: 0.3em;
+ padding-left: 1em;
+ font-size: 15px;
+ font-weight: bold;
+ cursor: move;
+}
+-->
+</style><script>
+<!--
+$( function() {
+ $( '#tabs' ) . tabs();
+});
+var panel_attributes = {};
+jQuery( function() {
+ jQuery( '#panel<%= @panel.id -%>' ) . resizable({
+ stop: function( event, ui ) {
+ var p = $('#panel<%= @panel.id -%>');
+ $("#panel-width").val(p.width());
+
+ confirm( p.width() );
+ panel_attributes['width'] = this.getAttribute('width');
+ }
+ });
+ <% @panel.panel_elements.each do |elm| %>
<% case elm.class.to_s %>
<% when 'PanelPicture' %>
- <td>
- <%= link_to(tag(:img, elm.tmb_opt_img_tag), elm) %>
- </td>
+ jQuery( '#vpicture<%= elm.id -%>' ) . draggable();
+ jQuery( '#panel-picture<%= elm.id -%>' ) . resizable({handles: 'all'});
<% when 'SpeechBalloon' %>
- <td>
- <%= elm.id -%>
- <%= elm.caption -%>
- </td>
+ jQuery( '#vballoon<%= elm.id -%>' ) . draggable();
+ jQuery( '#balloon<%= elm.id -%>' ) . resizable({handles: 'all'});
<% when 'GroundPicture' %>
- <td>
- <%= link_to(tag(:img, elm.tmb_opt_img_tag), elm.picture) -%>
- </td>
<% when 'GroundColor' %>
- <td style="color: #<%= format("%06x", elm.code ^ 0xffffff) -%>; background-color: #<%= format("%06x", elm.code) -%>;">
- <%= format("%06x", elm.code ^ 0xffffff) %>
- </td>
<% end %>
- <td>
- <%= h(truncate(elm.caption, :length => 12)) %>
- </td>
- </tr>
- <% end %>
- </tbody>
-</table>
-<%= form_for(@panel) do |f| %>
- <%= hidden_field_tag "json", nil, :id => 't-reorder' %>
- <% unless @panel.new_record? -%>
- <%= content_tag :div, '', :id => "panel-id-elm", :oid => @panel.id -%>
- <% end %>
- <div>
- <%= submit_tag t('panels.create.title') -%>
- </div>
-<% end %>
-
-<script>
-<!--
-jQuery( function() {
+ <% end %>
jQuery( '#t-sortable tbody' ) . sortable( {
update: function( event, ui ) {
var panel_pictures_attributes = {};
}
} );
jQuery( '#t-sortable tbody' ) . disableSelection();
+
+ jQuery( '#z-sortable tbody' ) . sortable( {
+ update: function( event, ui ) {
+ var panel_pictures_attributes = {};
+ var speech_balloons_attributes = {};
+ var ground_colors_attributes = {};
+ var ground_pictures_attributes = {};
+ var i = 1;
+ jQuery( '#z-sortable tr' ) . map( function() {
+ switch ( this.getAttribute("classname") ){
+ case 'PanelPicture':
+ panel_pictures_attributes[this.getAttribute("oid")] = {id: this.getAttribute("oid"), z: i};
+ break;
+ case 'SpeechBalloon':
+ speech_balloons_attributes[this.getAttribute("oid")] = {id: this.getAttribute("oid"), z: i};
+ break;
+ case 'GroundPicture':
+ ground_pictures_attributes[this.getAttribute("oid")] = {id: this.getAttribute("oid"), z: i};
+ break;
+ case 'GroundColor':
+ ground_colors_attributes[this.getAttribute("oid")] = {id: this.getAttribute("oid"), z: i};
+ break;
+ }
+ i++;
+ } );
+ var panel = {
+ panel_pictures_attributes: panel_pictures_attributes,
+ speech_balloons_attributes: speech_balloons_attributes,
+ ground_pictures_attributes: ground_pictures_attributes,
+ ground_colors_attributes: ground_colors_attributes
+ };
+ if ( $("#panel-id-zorderd") )
+ panel['id'] = $( "#panel-id-zorderd").attr("oid") ;
+ $("#z-reorder").val(JSON.stringify(panel));
+
+ }
+ } );
+ jQuery( '#t-sortable tbody' ) . disableSelection();
} );
// -->
</script>
end\r
end\r
end\r
+ \r
+ describe 'z順コマ部品に於いて' do\r
+ before do\r
+ #コマを作成しておく。\r
+ @panel = FactoryGirl.create :panel, :author_id => @author.id\r
+ @pp = FactoryGirl.create :panel_picture, :panel_id => @panel.id, :t => 0, :z => 2, :width => @p.width, :height => @p.height\r
+ @sb = @panel.speech_balloons.create(\r
+ FactoryGirl.attributes_for(:speech_balloon, :panel_id => @panel.id, :speech_balloon_template_id => @sbt.id, :t => 1, :z => 1)\r
+ )\r
+ @gc = @panel.ground_colors.create(\r
+ FactoryGirl.attributes_for(:ground_color, :panel_id => @panel.id, :t => 2, :z => 3)\r
+ )\r
+ @gp = @panel.ground_pictures.create(\r
+ FactoryGirl.attributes_for(:ground_picture, :panel_id => @panel.id, :picture_id => @p.id, :t => 3, :z => 4)\r
+ )\r
+ @panel.reload\r
+ end\r
+ context 'つつがなく終わるとき' do\r
+ it 'コマ部品集合を利用している' do\r
+ Panel.any_instance.stub(:parts_element).with(any_args).and_return([])\r
+ Panel.any_instance.should_receive(:parts_element).with(any_args).exactly(1)\r
+ r = @panel.zorderd_elements\r
+ end\r
+ end\r
+ it 'リストを返している' do\r
+ r = @panel.zorderd_elements\r
+ r.is_a?(Array).should be_true\r
+ r.size.should eq 4\r
+ end\r
+ it 'zでオフセットを0でソートしている' do\r
+ r = @panel.zorderd_elements\r
+ r[0].should eq @sb\r
+ r[1].should eq @pp\r
+ r[2].should eq @gc\r
+ r[3].should eq @gp\r
+ end\r
+ context 'さらに末尾にフキダシを追加したとき' do\r
+ before do\r
+ @sb2 = @panel.speech_balloons.create(\r
+ FactoryGirl.attributes_for(:speech_balloon, :panel_id => @panel.id, :speech_balloon_template_id => @sbt.id, :t => 4, :z => 5)\r
+ )\r
+ @panel.reload\r
+ end\r
+ it 'zでソートしている' do\r
+ r = @panel.zorderd_elements\r
+ r[0].should eq @sb\r
+ r[1].should eq @pp\r
+ r[2].should eq @gc\r
+ r[3].should eq @gp\r
+ r[4].should eq @sb2\r
+ end\r
+ end\r
+ end\r
describe 'コマ要素に於いて' do\r
before do\r
#コマを作成しておく。\r