BookStack Code Mirror - bookstack/blob - resources/views/pages/sort.blade.php

   1 @extends('base')
   2
   3 @section('content')
   4
   5     <div class="page-content">
   6         <h1>{{ $book->name }} <span class="subheader">Sort Pages</span></h1>
   7
   8         <ul class="sortable-page-list" id="sort-list">
   9             @foreach($book->children() as $bookChild)
  10                 <li data-id="{{$bookChild->id}}" data-type="{{ is_a($bookChild, 'Oxbow\Chapter') ? 'chapter' : 'page' }}">
  11                     {{ $bookChild->name }}
  12                     @if(is_a($bookChild, 'Oxbow\Chapter'))
  13                         <ul>
  14                             @foreach($bookChild->pages as $page)
  15                                 <li data-id="{{$page->id}}" data-type="page">
  16                                     {{ $page->name }}
  17                                 </li>
  18                             @endforeach
  19                         </ul>
  20                     @endif
  21                 </li>
  22             @endforeach
  23         </ul>
  24
  25         <form action="{{$book->getUrl()}}/sort" method="POST">
  26             {!! csrf_field() !!}
  27             <input type="hidden" name="_method" value="PUT">
  28             <input type="hidden" id="sort-tree-input" name="sort-tree">
  29             <div class="list">
  30                 <a href="{{$book->getUrl()}}" class="button muted">Cancel</a>
  31                 <button class="button pos" type="submit">Save Ordering</button>
  32             </div>
  33         </form>
  34
  35     </div>
  36
  37     <script>
  38         $(document).ready(function() {
  39
  40             var group = $('#sort-list').sortable({
  41                 group: 'serialization',
  42                 onDrop: function($item, container, _super) {
  43                     var data = group.sortable('serialize').get();
  44                     var pageMap = buildPageMap(data[0]);
  45                     $('#sort-tree-input').val(JSON.stringify(pageMap));
  46                     _super($item, container);
  47                 }
  48             });
  49
  50             function buildPageMap(data) {
  51                 var pageMap = [];
  52                 for(var i = 0; i < data.length; i++) {
  53                     var bookChild = data[i];
  54                     pageMap.push({
  55                         id: bookChild.id,
  56                         parentChapter: false,
  57                         type: bookChild.type
  58                     });
  59                     if(bookChild.type == 'chapter' && bookChild.children) {
  60                         var chapterId = bookChild.id;
  61                         var chapterChildren = bookChild.children[0];
  62                         for(var j = 0; j < chapterChildren.length; j++) {
  63                             var page = chapterChildren[j];
  64                             pageMap.push({
  65                                 id: page.id,
  66                                 parentChapter: chapterId,
  67                                 type: 'page'
  68                             });
  69                         }
  70                     }
  71                 }
  72                 return pageMap;
  73             }
  74
  75         });
  76     </script>
  77 @stop