⌈⌋ branch:  freshcode


Check-in [8d964d6f55]

Many hyperlinks are disabled.
Use anonymous login to enable hyperlinks.

Overview
Comment:Smoother forum post unfolding, double escaping for edits removed.
Downloads: Tarball | ZIP archive | SQL archive
Timelines: family | ancestors | descendants | both | trunk
Files: files | file ages | folders
SHA1: 8d964d6f55a3390e8841b9fd7f8fc0b2932617c7
User & Date: mario 2014-08-13 16:12:03
Context
2014-08-13
16:12
Mention /?format=rss shortcuts for feeds (inherited from freecode) check-in: 3ef92912aa user: mario tags: trunk
16:12
Smoother forum post unfolding, double escaping for edits removed. check-in: 8d964d6f55 user: mario tags: trunk
16:10
Colorize meta/forum link. check-in: 2c6837d32f user: mario tags: trunk
Changes
Hide Diffs Unified Diffs Ignore Whitespace Patch

Changes to forum.css.

46
47
48
49
50
51
52
53
54
55

56
57
58
59




60
61
62
63
64
65
66
67
68
69
70
71
72



73
74
75
76
77
78
79
...
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134


135
136
137


138
139

140
141
142
143

144
145
146
147



148
149
150








151

152

153
154
155
156
157
158
159
...
176
177
178
179
180
181
182




183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
...
205
206
207
208
209
210
211






212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
   float: left;
   height: 100%;
   min-height: 5000px;
   padding: 0;  margin: 0;
}
h1 {
   transform: rotate(270deg);
   color: #fff;
   font-size: 72pt;
   position: relative;

   top: 400pt;
   white-space: nowrap;
   letter-spacing: -0.025em;
}




h1 { font-weight: 300; }
h1 b { font-weight: 700; }
h1 .red { color: #744; }
h1 .grey { color: #444; }

/**
 * Forum tree
 *
 */
.forum, .forum ul {
   padding: 5pt 0 0 30pt;
   list-style: none;
}



ul.forum {
   padding: 5pt;
   padding-left: 180pt;
   list-style: none;
   padding-bottom: 90pt;
}

................................................................................
   color: #85879f;
   background: #fcf9f1;
   border-radius: 3pt;
   font-size: 105%;
   letter-spacing: 0.1em;
}


/**
 * Post content.
 *
 */
.forum .entry .summary {
   display: block;
   margin: 0;
   font-weight: bold;
   font-size: 108%;
   color: #449;
}
.forum .entry .excerpt {
   color: #777;


}
.forum .entry .excerpt.trimmed {
   display: none;


}
.forum .entry .content.trimmed {

   display: none;
}
.forum .entry .funcs.trimmed {
   opacity: 0.1;

}
.forum .entry .content p {
   padding-top: 0; margin-top: 0;
}




label {
   display: block;








   padding: 5pt;

}


.action {
   margin: 1pt;
   padding: 2pt 10pt;
   color: #33c;
   background: #e7e7fc;
   border: #f0f0f9;
................................................................................
}


/**
 * Submit form
 *
 */




form.forum-submit label b {
   display: inline-block;
   width: 80pt;
   text-align: right;
}
form.forum-submit label b select {
   font-weight: 900;
   font-size: 105%;
   text-align: right;
}

form.forum-submit .markup-buttons {
   width: 80pt;
   padding: 5pt;
   text-align: right;
   position: relative;
}
.markup-buttons .action {
................................................................................
   line-height: 1em;
   background: #eef0f7;
   opacity: 0.3;
}
.markup-buttons .action:hover {
   opacity: 1.0;
}







.error, .warning {
   background: #eeddaa;
   border: 2px solid #ddcc99;
   border-radius: 5pt;
   padding: 5pt;
}
.error {
   background: #eebbaa;
}


input, textarea, select {
   font-size: 105%;
   padding: 1.5pt;
   border: 1px solid #bbb;
   border-left: 5pt solid #ccc;
   border-radius: 5pt;
}







|
|

>
|



>
>
>
>










|


>
>
>







 







<













>
>

|
<
>
>

|
>


|
<
>




>
>
>
|
<
<
>
>
>
>
>
>
>
>
|
>

>







 







>
>
>
>










<







 







>
>
>
>
>
>
|











<
<
<
<
<
<
<
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
...
122
123
124
125
126
127
128

129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145

146
147
148
149
150
151
152
153

154
155
156
157
158
159
160
161
162


163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
...
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218

219
220
221
222
223
224
225
...
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254







   float: left;
   height: 100%;
   min-height: 5000px;
   padding: 0;  margin: 0;
}
h1 {
   transform: rotate(270deg);
   font-size: 92pt;
   font-size: 12.5vh;
   position: relative;
   top: 500pt;
   top: 67vh;
   white-space: nowrap;
   letter-spacing: -0.025em;
}
h1 * {
   color: #fff;
   text-decoration: none;
}
h1 { font-weight: 300; }
h1 b { font-weight: 700; }
h1 .red { color: #744; }
h1 .grey { color: #444; }

/**
 * Forum tree
 *
 */
.forum, .forum ul {
   padding: 5pt 0 10pt 30pt;
   list-style: none;
}
ul.forum > li {
   padding-bottom: 10pt;
}
ul.forum {
   padding: 5pt;
   padding-left: 180pt;
   list-style: none;
   padding-bottom: 90pt;
}

................................................................................
   color: #85879f;
   background: #fcf9f1;
   border-radius: 3pt;
   font-size: 105%;
   letter-spacing: 0.1em;
}


/**
 * Post content.
 *
 */
.forum .entry .summary {
   display: block;
   margin: 0;
   font-weight: bold;
   font-size: 108%;
   color: #449;
}
.forum .entry .excerpt {
   color: #777;
   z-index: 7;
   width: 600pt;
}
.forum .entry .excerpt:hover {

   color: #5a5a5a !important;
   cursor: nw-resize;
}
.forum .entry .trimmed {
   /* hidden divs */
   display: none;
}
.forum .entry {

   color: #444;
}
.forum .entry .content p {
   padding-top: 0; margin-top: 0;
}
.forum .entry .content ul {
   margin: 10pt !important;
   padding: 0 !important;
}


.forum .entry .content ul li:before {
   content: "→";
   margin-right: 5pt;
   color: #522;
}
.forum .entry .content code {
   background: #eee;
   font-size: 90%;
   padding: 1pt;
   border-radius: 3pt;
}


.action {
   margin: 1pt;
   padding: 2pt 10pt;
   color: #33c;
   background: #e7e7fc;
   border: #f0f0f9;
................................................................................
}


/**
 * Submit form
 *
 */
label {
   display: block;
   padding: 5pt;
}
form.forum-submit label b {
   display: inline-block;
   width: 80pt;
   text-align: right;
}
form.forum-submit label b select {
   font-weight: 900;
   font-size: 105%;
   text-align: right;
}

form.forum-submit .markup-buttons {
   width: 80pt;
   padding: 5pt;
   text-align: right;
   position: relative;
}
.markup-buttons .action {
................................................................................
   line-height: 1em;
   background: #eef0f7;
   opacity: 0.3;
}
.markup-buttons .action:hover {
   opacity: 1.0;
}
input, textarea, select {
   font-size: 105%;
   padding: 1.5pt;
   border: 1px solid #bbb;
   border-left: 5pt solid #ccc;
   border-radius: 5pt;
}
.error, .warning {
   background: #eeddaa;
   border: 2px solid #ddcc99;
   border-radius: 5pt;
   padding: 5pt;
}
.error {
   background: #eebbaa;
}









Changes to gimmicks.js.

123
124
125
126
127
128
129
130

131
132
133
134
135
136
137
138
139
140
...
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
...
174
175
176
177
178
179
180

181
182
183
184
185
186
187
188

    /**
     * Forum actions.
     *
     */

    // Expand forum previews
    $(".forum .entry").one("click", function(){

        $(this).find(".excerpt, .content, .funcs").toggleClass("trimmed");
    });
    
     
    // Post submit button
    $(".forum").delegate(".action", "click", function(){

        // entry/post id
        var id = $(this).data("id");
        var func = this.classList[1];
................................................................................
        // new
        if (func == "forum-new") {
            $target.load("/forum/post", { "pid": id }).fadeIn();
        }
        // reply
        if (func == "forum-reply") {
            $target.append("<ul><li></li></ul>");
            $target.find("ul li").load("/forum/post", { "pid": id }).fadeIn();
        }
        // editing
        if (func == "forum-edit") {
            $target.load("/forum/edit", { "id": id });
        }
        // submit
        if (func == "forum-submit"){
................................................................................
        if (y) {
            $ta.val(content.substr(0, x) + before + content.substr(x, y-x) + after + content.substr(y, content.length - y));
        }
        else {
            $ta.val(content + before + "..." + after);
        }
    });


});













|
>
|

<







 







|







 







>








123
124
125
126
127
128
129
130
131
132
133

134
135
136
137
138
139
140
...
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
...
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189

    /**
     * Forum actions.
     *
     */

    // Expand forum previews
    $(".forum").on("click", ".entry", function(){
        $(this).find(".excerpt, .content").animate({opacity: 'toggle', height: 'toggle'});
        $(this).find(".funcs").toggleClass("trimmed");
    });

     
    // Post submit button
    $(".forum").delegate(".action", "click", function(){

        // entry/post id
        var id = $(this).data("id");
        var func = this.classList[1];
................................................................................
        // new
        if (func == "forum-new") {
            $target.load("/forum/post", { "pid": id }).fadeIn();
        }
        // reply
        if (func == "forum-reply") {
            $target.append("<ul><li></li></ul>");
            $target.find("ul li").last().load("/forum/post", { "pid": id }).fadeIn();
        }
        // editing
        if (func == "forum-edit") {
            $target.load("/forum/edit", { "id": id });
        }
        // submit
        if (func == "forum-submit"){
................................................................................
        if (y) {
            $ta.val(content.substr(0, x) + before + content.substr(x, y-x) + after + content.substr(y, content.length - y));
        }
        else {
            $ta.val(content + before + "..." + after);
        }
    });


});






Changes to lib/forum.php.

315
316
317
318
319
320
321
322
323
324
325

326
327
328
329
330
331
332
     *  → Escapes previous content for edit_form() calls.
     *
     */
    function submit_form($pid=0, $id=0, $data=array()) {
        global $forum_cfg;

        extract(array_merge(
            array_fill_keys(str_getcsv("author,miniature,tag,summary,source"), ""),
            $data ? array() : $_COOKIE->list->text["author,miniature"],
            array_map("htmlspecialchars", $data)
        ));


        include("template/forum_submit_form.php");
    }


    /**
     * Show editing <form> instead with prefilled previous data.







|
|
|

>







315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
     *  → Escapes previous content for edit_form() calls.
     *
     */
    function submit_form($pid=0, $id=0, $data=array()) {
        global $forum_cfg;

        extract(array_merge(
            array_fill_keys(str_getcsv("author,image,tag,summary,source"), ""),
            $data ? array() : $_COOKIE->list->text->html["author,image"],
            $data  // all fields excerpt `$source` are already HTML-escaped
        ));
        $source = input::html($source);

        include("template/forum_submit_form.php");
    }


    /**
     * Show editing <form> instead with prefilled previous data.

Changes to page_forum.php.

49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
   
?>
<!DOCTYPE html>
<html>
<head>
    <title>freshcode.club forum</title>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src=gimmicks.js></script>
    <meta charset=UTF-8>
    <?= "<style>\n"
      . file_get_contents("forum.css")
      . "</style>";
    ?>
</head>
<body>
<div id=title>
   <h1><b>fresh</b>(code)<b class=red>.</b><span class=grey>club</span></h1>
</div>
<br>
<ul class=forum>

   <li>
      <div class=entry>
         <a class="action forum-new" data-id=0>New Thread</a>







|








|







49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
   
?>
<!DOCTYPE html>
<html>
<head>
    <title>freshcode.club forum</title>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="gimmicks.js?019"></script>
    <meta charset=UTF-8>
    <?= "<style>\n"
      . file_get_contents("forum.css")
      . "</style>";
    ?>
</head>
<body>
<div id=title>
   <h1><a href="/"><b>fresh</b>(code)<b class=red>.</b><span class=grey>club</span></a></h1>
</div>
<br>
<ul class=forum>

   <li>
      <div class=entry>
         <a class="action forum-new" data-id=0>New Thread</a>

Changes to template/forum_entry.php.

9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
..
25
26
27
28
29
30
31
32
33
34
35
36
37
38
$_ = "trim";

print <<<HTML

   <li>
      <article class=entry>

          <h6 class=summary>$entry[summary]
             <span class="funcs trimmed">
                <a class="action forum-edit" data-id=$entry[id] title="Edit">Ed</a>
                <a class="action forum-reply" data-id=$entry[id] title="Reply">Re</a>
             </span>
          </h6>

          <aside class=meta><div>
................................................................................
             <i class=author>
                 <img align=top src="$entry[miniature]" width=16 height=16>
                 $entry[author]
             </i>
             <var class=datetime>{$_(strftime("%Y-%m-%d - %H:%M",$entry["t_published"]))}</var>
          </div></aside>

          <div class="excerpt">$entry[excerpt]</div>
          <div class="content trimmed">$entry[html]</div>

      </article>

HTML;








|







 







|






9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
..
25
26
27
28
29
30
31
32
33
34
35
36
37
38
$_ = "trim";

print <<<HTML

   <li>
      <article class=entry>

          <h6 class=summary><b>$entry[summary]</b>
             <span class="funcs trimmed">
                <a class="action forum-edit" data-id=$entry[id] title="Edit">Ed</a>
                <a class="action forum-reply" data-id=$entry[id] title="Reply">Re</a>
             </span>
          </h6>

          <aside class=meta><div>
................................................................................
             <i class=author>
                 <img align=top src="$entry[miniature]" width=16 height=16>
                 $entry[author]
             </i>
             <var class=datetime>{$_(strftime("%Y-%m-%d - %H:%M",$entry["t_published"]))}</var>
          </div></aside>

          <div class="excerpt">$entry[excerpt]</div>
          <div class="content trimmed">$entry[html]</div>

      </article>

HTML;