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