PageSourceSearch

https://photogenicweekend.net/wp_posts_list.html

html photogenicweekend.net collected 2026-10-05 18:23:10 UTC 31,803 bytes, 725 lines download raw bytes

1<!DOCTYPE html>
2<html lang="jp">
3
4<head>
5    <meta charset="UTF-8">
6    <meta name="viewport" content="width=device-width, initial-scale=1.0">
7    <title>Wordpress v2 REST APIを使った記事一覧/検索/三段組Viewer - Photogenic Weekend RETURNS</title>
8    <meta name="author" content="Kazuhisa Nishikawa" />
9    <meta name="description" content="Wordpress v2 REST APIとJQuery DataTablesを使った記事の一覧/検索/三段組(css columns)表示(Bootstrap版)">
10    <!-- OGP -->
11    <meta property="og:type" content="blog">
12    <meta property="og:description" content="Wordpress v2 REST APIとJQuery DataTablesを使った記事の一覧/検索/三段組(css columns)表示(Bootstrap版)">
13    <meta property="og:title" content="Photogenic Weekend RETURNS">
14    <meta property="og:url" content="https://photogenicweekend.net/wp_posts_list.html">
15    <meta property="og:image" content="https://photogenicweekend.net/images/siteimage.jpg">
16    <meta property="og:site_name" content="Photogenic Weekend RETURNS">
17    <meta property="fb:app_id" content="179963179148116">
18    <!--Twitter Card -->
19    <meta name="twitter:card" content="summary" />
20    <meta name="twitter:site" content="@PhotogenicWeekE" />
21    <meta name="twitter:title" content="Wordpress v2 REST APIを使った記事一覧/検索/三段組Viewer - Photogenic Weekend RETURNS" />
22    <meta name="twitter:description" content="Wordpress v2 REST APIとJQuery DataTablesを使った記事の一覧/検索/三段組(css columns)表示(Bootstrap版)" />
23    <meta name="twitter:url" content="https://photogenicweekend.net/wp_posts_list.html" />
24    <meta name="twitter:image" content="https://photogenicweekend.net/images/siteimage.jpg" />
25    <!-- css -->
26    <link rel="stylesheet" type="text/css" href="//cdn.datatables.net/v/bs-3.3.7/jszip-2.5.0/pdfmake-0.1.18/dt-1.10.13/af-2.1.3/b-1.2.4/b-colvis-1.2.4/cr-1.3.2/fc-3.2.2/fh-3.1.2/kt-2.2.0/r-2.1.0/rr-1.2.0/sc-1.4.2/se-1.2.0/datatables.min.css" />
27    <link href="css/min/crayon.min.css" rel="stylesheet" type="text/css" />
28    <link href="css/min/classic.css" rel="stylesheet" type="text/css" />
29    <style type="text/css">
30        /* base */
31        
32        body,
33        blockquote {
34            font-size: 12px;
35            font-family: 'Hiragino Kaku Gothic Pro', 'Meiryo', sans-serif!important;
36            color: #000000;
37            line-height: 1.6em;
38        }
39        
40        a {
41            color: #337ab7;
42            text-decoration: none;
43        }
44        
45        a:hover {
46            text-decoration: underline;
47        }
48        
49        img {
50            width: 100%;
51        }
52        
53        embed,
54        iframe,
55        object {
56            margin-bottom: 1.5em;
57            max-width: 100%;
58        }
59        
60        .ext_icon {
61            padding-right: 14px;
62            margin-right: 2px;
63            background: url(images/link12px.png) no-repeat center right;
64        }
65        
66        .site-footer {
67            font-size: 14px;
68            font-size: 0.875rem;
69            line-height: 1.6;
70            margin-top: 1em;
71            border-top: 1px solid #eee;
72        }
73        
74        #copyright {
75            padding-right: 20px;
76            padding-left: 20px;
77            padding-bottom: 20px;
78            text-align: right;
79            color: #aaaaaa;
80            margin-top: -60px;
81        }
82        
83        #spinner {
84            position: fixed;
85            left: 0px;
86            top: 0px;
87            width: 100%;
88            height: 100%;
89            z-index: 9999;
90            background: url(images/ajax-loader.gif) 50% 50% no-repeat #f3f3f3;
91        }
92        /* DataTables */
93        
94        .form-control {
95            width: 100%;
96            height: 30px;
97            padding-left: 2px;
98            font-size: 12px;
99            line-height: 1.4;
100        }
101        
102        select.form-control {
103            display: inline-block;
104        }
105        
106        #list_length {
107            display: none;
108        }
109        
110        #list_info {
111            text-align: right;
112        }
113        
114        .dataTables_filter input {
115            width: 11em!important;
116        }
117        
118        div.dataTables_wrapper div.dataTables_filter {
119            text-align: center;
120        }
121        /* media section */
122        
123        @media screen and (max-width:767px) {
124            /* col-xs */
125            .multicolumnbox {
126                columns: 1;
127            }
128            #content,
129            blockquote {
130                font-size: 16px;
131            }
132            .dataTables_filter input {
133                width: 20em!important;
134            }
135            #archives_select,
136            #categories_select,
137            #tags_select,
138            #postid_id,
139            .postid_class {
140                display: none;
141            }
142        }
143        
144        @media screen and (max-width:991px) and (min-width:768px) {
145            /* col-sm */
146            .multicolumnbox {
147                columns: 2;
148            }
149            #content,
150            blockquote {
151                font-size: 14px;
152            }
153            #postid_id,
154            .id_class,
155            .postid_class {
156                display: none;
157            }
158            #list {
159                font-size: 10px;
160            }
161        }
162        
163        @media screen and (min-width:992px) {
164            /* col-md */
165            .multicolumnbox {
166                columns: 3;
167            }
168        }
169        /* WordPress */
170        
171        .shortcode_share,
172        .shortcode_share img,
173        figure {
174            width: 100%;
175        }
176        
177        blockquote {
178            color: #666;
179            margin: 0 0 1.5em;
180            font-style: italic;
181        }
182        /* social-navigation */
183        
184        .social-navigation {
185            clear: left;
186            float: left;
187            margin-bottom: 0;
188            width: 50%;
189            font-size: 1rem;
190            display: block;
191        }
192        
193        .social-navigation ul {
194            list-style: none;
195            margin-bottom: 0;
196            margin-left: 0;
197            margin: 0 0 1.5em;
198            padding: 0;
199        }
200        
201        .social-navigation li {
202            display: inline;
203        }
204        
205        .social-navigation a {
206            background-color: #767676;
207            -webkit-border-radius: 40px;
208            border-radius: 40px;
209            color: #fff;
210            display: inline-block;
211            height: 40px;
212            margin: 0 1em 0.5em 0;
213            text-align: center;
214            width: 40px;
215        }
216        
217        .screen-reader-text {
218            clip: rect(1px, 1px, 1px, 1px);
219            height: 1px;
220            overflow: hidden;
221            position: absolute !important;
222            width: 1px;
223            word-wrap: normal !important;
224        }
225        
226        .social-navigation .icon {
227            height: 16px;
228            top: 12px;
229            width: 16px;
230            vertical-align: top;
231        }
232        
233        .icon {
234            display: inline-block;
235            fill: currentColor;
236            height: 1em;
237            position: relative;
238            top: -0.0625em;
239            vertical-align: middle;
240            width: 1em;
241        }
242        
243        .wrap {
244            margin-left: auto;
245            margin-right: auto;
246            padding-left: 3em;
247            padding-right: 3em;
248            padding-bottom: 1.5em;
249            padding-top: 2em;
250        }
251    </style>
252</head>
253
254<body>
255    <div id="spinner"></div>
256    <div class="container-fluid" style="margin-top: 10px;">
257
258        <!-- DataTables -->
259        <div class="table-responsive">
260            <table id="list" class="table table-striped table-hover">
261                <thead>
262                    <tr>
263                        <th width="3%">Id</th>
264                        <th width="3%" id="postid_id">PostId</th>
265                        <th width="10%">Date</th>
266                        <th width="50%">Title</th>
267                        <th width="10%">Category</th>
268                        <th width="20%">Tags</th>
269                    </tr>
270                </thead>
271            </table>
272        </div>
273
274        <!-- content area -->
275        <div id="content" class="multicolumnbox" style="margin-top: 10px; width: 100%;line-height: 1.6em;"></div>
276        <div id="link" style="margin-top: 10px; width: 100%; text-align: right;"></div>
277        <div id="amp" style="width: 100%; text-align: right;"></div>
278
279        <!-- google ads -->
280        <!--
281        <div class="row">
282            <div class="col-md-offset-2 col-md-8" id="google_ads">
283
284                
284<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
284
285                <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-3885104238305751" data-ad-slot="5113471295" data-ad-format="auto"></ins>
286                
286<script>
287                    (adsbygoogle = window.adsbygoogle || []).push({});
288                </script>
288
289
290            </div>
291        </div>
292        -->
293        <!-- footer -->
294        <footer class="site-footer" role="contentinfo">
295            <div class="wrap">
296                <nav class="social-navigation" role="navigation">
297                    <ul class="social-links-menu">
298
299                        <li id="menu-item-40" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-40"><a href="https://facebook.com/PhotogenicWeekendReturns"><span class="screen-reader-text">Facebook</span><svg class="icon icon-facebook" aria-hidden="true" role="img"> <use href="#icon-facebook" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-facebook"></use> </svg></a></li>
300                        <li id="menu-item-41" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-41"><a href="https://twitter.com/PhotogenicWeekE"><span class="screen-reader-text">Twitter</span><svg class="icon icon-twitter" aria-hidden="true" role="img"> <use href="#icon-twitter" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-twitter"></use> </svg></a></li>
301                        <!--<li id="menu-item-42" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-42"><a href="https://www.instagram.com/knishika/"><span class="screen-reader-text">Instagram</span><svg class="icon icon-instagram" aria-hidden="true" role="img"> <use href="#icon-instagram" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-instagram"></use> </svg></a></li>-->
302
303                    </ul>
304                </nav>
305            </div>
306            <br clear="all" />
307            <div id="copyright">
308                © 2004-2022 Photogenic Weekend RETURNS and Kazuhisa Nishikawa All Rights Reserved.<br /> 記事、写真、動画などの著作権は著作者に帰属します。無断転用・転載は著作権法違反となります。必要な場合はこのページにリンクをお張りください。
309                <br /> WARNING Comment, Photo, Video belongs to the site owner and those are protected under Japanese and International law.<br /> Strongly prohibited by the law for the piracy act. Please set the link to this page if needed.
310            </div>
311        </footer>
312
313        <div class="modal" id="photoModal" tabindex="-1">
314            <div class="modal-dialog">
315                <div class="modal-content">
316                    <div class="modal-header">
317                        <button type="button" class="close" data-dismiss="modal"><span>×</span></button>
318                        <h4 class="modal-title">
319                            <span class="modal-title-in"></span>
320                        </h4>
321                    </div>
322                    <div class="modal-body" id="modal-photo">
323                    </div>
324                    <div class="modal-footer">
325                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
326                    </div>
327                </div>
328            </div>
329        </div>
330
331        <div class="modal" id="photoModalW" tabindex="-1">
332            <div class="modal-dialog modal-lg">
333                <div class="modal-content">
334                    <div class="modal-header">
335                        <button type="button" class="close" data-dismiss="modal"><span>×</span></button>
336                        <h4 class="modal-title">
337                            <span class="modal-title-in"></span>
338                        </h4>
339                    </div>
340                    <div class="modal-body" id="modal-photoW">
341                    </div>
342                    <div class="modal-footer">
343                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
344                    </div>
345                </div>
346            </div>
347        </div>
348
349        <!-- script file -->
350        
350<script src="//ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js" type="text/javascript"></script>
350
351        
351<script src="//cdn.datatables.net/v/bs-3.3.7/jszip-2.5.0/pdfmake-0.1.18/dt-1.10.13/af-2.1.3/b-1.2.4/b-colvis-1.2.4/cr-1.3.2/fc-3.2.2/fh-3.1.2/kt-2.2.0/r-2.1.0/rr-1.2.0/sc-1.4.2/se-1.2.0/datatables.min.js">
352            type = "text/javascript"
353        </script>
353
354        
354<script src="js/jquery.easing.1.3.js" type="text/javascript"></script>
354
355        
355<script src="js/underscore-min.js" type="text/javascript"></script>
355
356
357        <!-- main render -->
358        
358<script type="text/javascript">
359            // url and strings setting
360            var url_tags = 'tags.json'; // https://photogenicweekend.net/wp-json/wp/v2/tags?per_page=40
361            var url_categories = 'categories.json'; // https://photogenicweekend.net/wp-json/wp/v2/categories
362            var url_posts = 'post.json'; // https://photogenicweekend.net/wp-json/wp/v2/posts?per_page=86
363            var str_undefined = '[Undefined]';
364            var str_tag_l = '[';
365            var str_tag_r = ']';
366            var imgL = new Array();
367
368            // Crayon settting
369            var CrayonSyntaxSettings = {
370                "version": "_2.7.2_beta",
371                "is_admin": "0",
372                "ajaxurl": "http:\/\/photogenicweekend.net\/wp\/wp-admin\/admin-ajax.php",
373                "prefix": "crayon-",
374                "setting": "crayon-setting",
375                "selected": "crayon-setting-selected",
376                "changed": "crayon-setting-changed",
377                "special": "crayon-setting-special",
378                "orig_value": "data-orig-value",
379                "debug": ""
380            };
381            var CrayonSyntaxStrings = {
382                "copy": "Press %s to Copy, %s to Paste",
383                "minimize": "Click To Expand Code"
384            };
385
386            // ajaxの終了を待って画面復帰
387            var ajax_level = 0; // ajax level counter
388            $(function() {
389                $(document).ajaxComplete(function() {
390                    ajax_level++;
391                    if (ajax_level == 4)
392                        $('#spinner').animate({
393                            'opacity': 0
394                        }, 899, 'easeOutCubic', function() {
395                            $(this).css('display', 'none')
396                        });
397                })
398            });
399
400            // Add to RegExp prototype(= PHP)
401            // ex. console.log(/<a[^>]+?href[^>]+?>/g. execAll(html));
402            RegExp.prototype.execAll = function(string) {
403                var matches = [];
404                var match = null;
405                while ((match = this.exec(string)) != null) {
406                    var matchArray = [];
407                    for (var i in match) {
408                        if (parseInt(i) == i) {
409                            matchArray.push(match[i]);
410                        }
411                    }
412                    matches.push(matchArray);
413                }
414                return matches;
415            }
416
417            // main
418            $(document).ready(function() {
419
420                var Tags = {};
421                var Categories = {};
422                var SelectArchives = {};
423                var SelectCategories = {};
424                var SelectTags = {};
425
426                setSvg();
427                getTags();
428                getCategories();
429                getPosts();
430
431                // get svg and set body
432                function setSvg() {
433                    $.ajax({
434                            type: 'get',
435                            url: 'fonts/icon.svg'
436                        })
437                        .done(function(data) {
438                            var svg = $(data).find('svg');
439                            $('body').prepend(svg);
440                        });
441                }
442
443                // get Tags
444                function getTags() {
445                    $.getJSON(url_tags, null, function(json) {
446                        $.each(json,
447                            function(index, elem) {
448                                var row = {};
449                                row['tags'] = elem.name;
450                                Tags[elem.id] = row;
451                                SelectTags[elem.id] = 0;
452                            }
453                        );
454                    });
455                }
456
457                // get Categories
458                function getCategories() {
459                    $.getJSON(url_categories, null, function(json) {
460                        $.each(json,
461                            function(index, elem) {
462                                var row = {};
463                                row['categories'] = elem.name;
464                                Categories[elem.id] = row;
465                                SelectCategories[elem.id] = 0;
466                            }
467                        );
468                    });
469                }
470
471                // get Posts
472                function getPosts() {
473                    $.getJSON(url_posts, null, function(json) {
474                        setDataTables(json);
475                    });
476                }
477
478                // set DataTables(callback ajax: posts)
479                function setDataTables(json) {
480                    var Posts = new Array();
481                    var MyTable = null;
482
483                    json.reverse(json); // JSONが新しい順に入っているので古い順へ並び替え
484                    $.each(json,
485                        function(index, elem) {
486                            var row = {};
487                            row['id'] = index + 1;
488                            row['post_id'] = elem.id;
489                            row['date'] = elem.date;
490                            row['title'] = elem.title.rendered;
491                            row['categories'] = elem.categories[0];
492                            row['link'] = elem.link;
493                            row['content'] = _.escape(elem.content.rendered); // html escape
494
495                            var tags = '';
496                            if (elem.tags[0] == null) {
497                                tags = str_undefined;
498                            } else {
499                                $.each(elem.tags, function() {
500                                    if (Tags[this] == null)
501                                        tags += str_undefined;
502                                    else {
503                                        tags += str_tag_l + Tags[this].tags + str_tag_r;
504                                        SelectTags[this] += 1;
505                                    }
506                                });
507                            }
508                            row['tags'] = tags;
509
510                            // make select option for Archives, Categories, Tags
511                            (SelectArchives[elem.date.slice(0, 7)] == null) ? SelectArchives[elem.date.slice(0, 7)] = 1: SelectArchives[elem.date.slice(0, 7)] += 1;
512                            (SelectCategories[elem.categories[0]] == null) ? SelectCategories[elem.categories[0]] = 1: SelectCategories[elem.categories[0]] += 1;
513
514                            Posts[index] = row;
515                        }
516                    );
517
518                    // set DataTable
519                    MyTable = $('#list').DataTable({
520                        // add select archives, categories,tags
521                        dom: "<'row'<'col-sm-3'<'#archives_select.dataTables_filter'>><'col-sm-3'<'#categories_select.dataTables_filter'>><'col-sm-3'<'#tags_select.dataTables_filter'>><'col-sm-3 col-xs-12'f>>" + "<'row'<'col-sm-12'tr>>" + "<'row'<'col-sm-offset-9 col-sm-3'i>>",
522                        data: Posts,
523                        order: [0, 'desc'], // or asc
524                        scrollCollapse: false,
525                        paging: false,
526                        scrollY: "170px",
527                        stateSave: true,
528                        //pageLength: 5,
529                        columns: [{
530                            data: "id",
531                            className: "id_class",
532                            "render": function(data, type, row, meta) {
533                                return ("00" + data).slice(-3);
534                            }
535                        }, {
536                            data: "post_id",
537                            className: "postid_class",
538                            "render": function(data, type, row, meta) {
539                                return ("00" + data).slice(-4);
540                            }
541                        }, {
542                            data: "date",
543                            "render": function(data, type, row, meta) {
544                                return data.slice(0, 10);
545                            }
546                        }, {
547                            data: "title"
548                        }, {
549                            data: "categories",
550                            "render": function(data, type, row, meta) {
551                                return (Categories[data] != null) ? Categories[data].categories : str_undefined;
552                            }
553                        }, {
554                            data: "tags"
555                        }, {
556                            data: "content",
557                            visible: false
558                        }],
559                        // for Japanese
560                        language: {
561                            info: "_TOTAL_件中_START_~_END_を表示",
562                            paginate: {
563                                "first": "First",
564                                "last": "Last",
565                                "next": "&gt;",
566                                "previous": "&lt;"
567                            },
568                            lengthMenu: "_MENU_",
569                            search: "",
570                            searchPlaceholder: "Search",
571                            infoFiltered: "(_MAX_件中の検索結果)",
572                            zeroRecords: "一致する記事がありません",
573                            infoEmpty: "0 件中 0~0 を表示"
574                        }
575                    });
576
577                    // draw select
578                    var html_archives = '<label><select class="form-control" id="event_archives"><option value="0">Archives</option>'
579                    $.each(SelectArchives, function(index, elem) {
580                        html_archives += '<option value="' + index + '">' + index + '(' + elem + ')</option>';
581                    });
582                    html_archives += '</select></label>'
583                    $('#archives_select').html(html_archives);
584
585                    var html_categories = '<label><select class="form-control" id="event_categories"><option value="0">Categories</option>'
586                    $.each(SelectCategories, function(index, elem) {
587                        html_categories += '<option value="' + Categories[index].categories + '">' + Categories[index].categories + '(' + elem + ')</option>';
588                    });
589                    html_categories += '</select></label>'
590                    $('#categories_select').html(html_categories);
591
592                    var html_tags = '<label><select class="form-control" id="event_tags"><option value="0">Tags</option>'
593                    $.each(SelectTags, function(index, elem) {
594                        if (elem != 0)
595                            html_tags += '<option value="' + Tags[index].tags + '">' + Tags[index].tags + '(' + elem + ')</option>';
596                    });
597                    html_tags += '</select></label>'
598                    $('#tags_select').html(html_tags);
599
600                    // event tr click and draw content
601                    $('#list tbody').on('click', 'tr', function() {
602                        if ($(this).hasClass('selected')) {
603                            $(this).removeClass('selected');
604                        } else {
605                            MyTable.$('tr.selected').removeClass('selected');
606                            $(this).addClass('selected');
607                            var rowcollection = MyTable.$(".selected", {
608                                "page": "all"
609                            }); // OK
610                            var select_row = MyTable.row(rowcollection[0]._DT_RowIndex).data();
611                            // // html unescape and class="amazonjs_indicator_title" remove
612                            var html = '<p style="font-weight: 800; font-size: 150%;">' + select_row.title + '</p>' + _.unescape(select_row.content).replace(/class="amazonjs_indicator_title"/g, '');
613                            html = html.replace(/http:/g, "https:");
614                            $('title').html(select_row.title + ' - Wordpress v2 REST API - My Favorites');
615                            $('#content').html(html);
616
617                            // todo 2012-03号の処理(tableを使っていない)
618                            $("#content td").each(function(i, elem) {
619                                var img = $(elem).html().match(/<img(?: .+?)?>/);
620                                imgL[i] = img[0].replace('s.', '.');
621                                $(elem).html($(elem).html().replace(/<a(?: .+?)?>/, '<a href="javascript:photoClick(' + select_row['id'] + ',' + i + ',\'' + select_row['title'] + '\');" class="photoclick">'));
622                            });
623
624                            // 2012年4月0号特別処理
625                            if (select_row['id'] == 1) {
626                                $("div#kiji div").each(function(i, elem) {
627                                    var img = $(elem).html().match(/<img(?: .+?)?>/);
628                                    if (img != null && typeof img[0] != 'undefined') {
629                                        if (img[0] != '<img border="0" src="/images/1203/vol0_cover2.jpg">') {
630                                            imgL[i] = img[0].replace('s.', '.');
631                                            $(elem).html($(elem).html().replace(/<a(?: .+?)?>/, '<a href="javascript:photoClick(' + select_row['id'] + ',' + i + ',\'' + select_row['title'] + '\');" class="photoclick">'));
632                                        }
633                                    }
634                                });
635                            }
636
637                            $('#link').html('<a target="_blank" class="ext_icon" href="' + select_row.link + '">Permalink</a>');
638                            //$('#amp').html('<a target="_blank"  class="ext_icon" href="' + select_row.link + 'amp">AMP</a>');
639                            // reload Crayon Syntax Highlighter
640                            if (html.match(/Crayon/) != null) $.getScript("js/crayon.min.js", function() {});
641                            // reload google ads
642                            $.getScript("js/google_ads.js", function() {});
643                            // reload google analytics
644                            $.getScript("js/google_analytics.js", function() {});
645                        }
646                    });
647
648                    // event archives
649                    $('#event_archives').change(function() {
650                        if (MyTable == null)
651                            return;
652                        if (this.value == 0) {
653                            MyTable.column(2).search('.', true).draw(); // reset
654                            return;
655                        }
656                        MyTable.column(2).search(this.value, true).draw(); // type column #2:date
657                    });
658
659                    // event categories
660                    $('#event_categories').change(function() {
661                        if (MyTable == null)
662                            return;
663                        if (this.value == 0) {
664                            MyTable.column(4).search('.', true).draw(); // reset
665                            return;
666                        }
667                        MyTable.column(4).search(this.value, true).draw(); // type column #4:categories
668                    });
669
670                    // event tags
671                    $('#event_tags').change(function() {
672                        if (MyTable == null)
673                            return;
674                        if (this.value == 0) {
675                            MyTable.column(5).search('.', true).draw(); // reset
676                            return;
677                        }
678                        MyTable.column(5).search(this.value, true).draw(); // type column #5:tags
679                    });
680                } // END of setDataTables()
681            });
682
683            // for modal
684            function photoClick(id, i, title) {
685                $('.modal-title-in').html(title);
686
687                if (id == 1) { // 2012年4月0号特別処理
688                    $('#modal-photoW').html(imgL[i]);
689                    $('#photoModalW').modal({});
690                } else {
691                    if (i == '2' || i == '7') {
692                        $('#modal-photoW').html(imgL[i]);
693                        $('#photoModalW').modal({});
694                    } else {
695                        $('#modal-photo').html(imgL[i]);
696                        $('#photoModal').modal({});
697                    }
698                }
699            }
700        </script>
700
701
702        <div id="google_analytics">
703            
703<script>
vendor: 627 bytes, lines 703-716
703
704                (function(i, s, o, g, r, a, m) {
705                    i['GoogleAnalyticsObject'] = r;
706                    i[r] = i[r] || function() {
707                        (i[r].q = i[r].q || []).push(arguments)
708                    }, i[r].l = 1 * new Date();
709                    a = s.createElement(o),
710                        m = s.getElementsByTagName(o)[0];
711                    a.async = 1;
712                    a.src = g;
713                    m.parentNode.insertBefore(a, m)
714                })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');
715
716                ga('create', '
716UA-30003645-1
vendor: 83 bytes, lines 716-718
716', 'photogenicweekend.net');
717                ga('send', 'pageview');
718            
718</script>
718
719        </div>
720
721    </div>
722    <!-- container -->
723</body>
724
725</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.