立即注册 登录
彼岸网 返回首页

天香公主的个人空间 http://www.bian-wang.com/discuz/?10005 [收藏] [复制] [分享] [RSS] txgz999@yahoo.com

日志

在日志文章和论坛里支持音乐盒

热度 3已有 364 次阅读2017-5-24 08:49 PM

按网友carry0987的要求,本文讨论下如何将个人空间首页的音乐盒功能添加到日志文章和论坛里来。

首先检查下现有功能是如何实现的。个人空间音乐盒的内容以php序列化格式储存在数表common_member_field_home里的表列blockposition中:


Discuz里的下列文件负责该音乐盒的设置和显示:
  1. space_index.php和space_index.htm负责个人空间首页的显示, 而其中各个模块的显示定义在function_space.php的函数getblockhtml里,为space_index.php所调用
  2. spacecp_index.php和spacecp_index.htm负责个人空间首页各模块的设置。前者负责储存用户模块的设置和获取,后者提供编辑设置界面

要在日志文章和论坛里支持音乐盒,就需要在那些地方也利用已有的或加入类似的东西。下面分步骤讨论下需要添加的内容:
1)添加一个在编辑框上的工具栏里的代表音乐盒的图标 ,保存为 static/image/editor/musicbox.gif
2)添加一个字符串'音乐盒'作为上述图标上的文字:在文件source/language/home/lang_editor.php里加入: 'editor_musicbox' => '音乐盒', 3) 在编辑框上的工具栏里加上"音乐盒"图标。
3a) 日志和文章:修改文件source/module/home/home_editor.php,在下面这句代码 < a href="javascript:;" class="icoImg" id="icoImg" onClick="parent.createImageBox(<?php echo ($isportal ? 'parent.check_catid' : '')?>);return false;" title="<?php echo lang('home/editor', 'editor_link_image'); ?>"></a> 后添加 < a href="javascript:;" id="icoMusicBox" onClick="parent.createMusicBox(); return false;" title="<?php echo lang('home/editor', 'editor_musicbox'); ?>" style="background-image: url(static/image/editor/musicbox.gif)"></a> 3b) 论坛:修改文件template/default/forum/post_editor_body.htm,在下面这句代码 < a id="{$editorid}_image" title="{lang e_image_title}" menupos="00" menuwidth="600">{lang e_image}</a> 后添加 < a id="{$editorid}_musicbox" init="true" onClick="createMusicBox(); return false;" title="<?php echo lang('home/editor', 'editor_musicbox'); ?>" style="background-image: url(static/image/editor/musicbox.gif)" menupos="00" menuwidth="600"><?php echo lang('home/editor', 'editor_musicbox'); ?></a> 经上述修改后,工具栏里就出现了一个音乐盒的图标。
4)音乐盒内容的存放形式
音乐盒的内容将作为日志文章帖子内容的一部份存在数据库里。如何将这些内容和其它内容区分开呢?我们可以利用bb代码,正如视频是用bb代码flash的方式记录的。引入一个新的bb代码叫做musicbox,将音乐盒内容放在它的里面。和个人空间里的音乐盒设置完直接提交给服务器端储存不同,这里的设置需要先记在编辑器里,再作为日志文章帖子的内容的一部分提交到服务器端。所以将内容记成php序列化格式不方便,我们需要一种在php和javascript两种语言里都能方便操作的序列化形式,json格式就能满足要求。

5)音乐盒的显示
和个人空间的音乐盒一样,这里的音乐盒也需要有播放器来替代Discuz的基于Flash的播放器。这里我们假定网站已按前文(链接)所述的方式加入了mejs播放器。
5a) 日志和文章:修改文件function_blog.php,将下面这段 function blog_bbcode($message) { $message = preg_replace("/\[flash\=?(media|real|mp3)*\](.+?)\[\/flash\]/ie", "blog_flash('\\2', '\\1')", $message); return $message; } 改为 function blog_bbcode($message) { $message = preg_replace("/\[flash\=?(media|real|mp3)*\](.+?)\[\/flash\]/ie", "blog_flash('\\2', '\\1')", $message); $message = preg_replace_callback("/\[musicbox\](.+?)\[\/musicbox\]/i", function ($matches) { return blog_musicbox($matches[1]); }, $message); return $message; } require_once libfile('function/space'); function blog_musicbox($content) { $content = json_decode($content, true); return "<div style='border: none; margin-left: auto; margin-right: auto; max-width:300px; width:300px; overflow: auto;'><style scoped>.dxb_bc { padding: 5px 10px 10px; }</style>".getblockhtml('music', $content)."</div>"; } 5b) 论坛:修改文件function_discuzcode.php,将函数discuzcode里的最末一句 return $htmlon ? $message : nl2br(str_replace(array("\t", ' ', ' '), array('&nbsp; &nbsp; &nbsp; &nbsp; ', '&nbsp; &nbsp;', '&nbsp;&nbsp;'), $message)); 改成 $mb = ""; if(stripos($message, '[/musicbox]') !== FALSE) { $match = []; if (preg_match("/\[musicbox\](.+?)\[\/musicbox\]/i", $message, $match)) { require_once libfile('function/space'); $mb = $match[1]; if(!$htmlon) $mb = htmlspecialchars_decode($mb); $mb = json_decode($mb, true); $mb = getblockhtml('music', $mb); $mb = "<div style='border: none; margin-left: auto; margin-right: auto; max-width:300px; width:300px; overflow: auto;'><style scoped>.dxb_bc { padding: 5px 10px 10px; }</style>".$mb."</div>"; } } $message = $htmlon ? $message : nl2br(str_replace(array("\t", ' ', ' '), array('&nbsp; &nbsp; &nbsp; &nbsp; ', '&nbsp; &nbsp;', '&nbsp;&nbsp;'), $message)); $message = preg_replace("/\[musicbox\].+?\[\/musicbox\]/i", $mb, $message); return $message; 6)音乐盒编辑界面和功能:加入新文件template/default/home/editor_musicbox_menu.htm (下载链接)
这个文件里的html代码是基于spacecp_index.htm里的音乐盒编辑部分的代码,修改了其中原有的javascript代码将对space_diy.js的依赖改为对editor_function.js(日志文章情况下)和forum_post.js(论坛情况下)的依赖。还添加了将spacecp_index.php里有关检查和操作音乐盒内容的php代码转成了客户端的javascript后的代码。
7)将上述编辑界面加入网页
7a) 日志和文章:修改文件template/default/home/spacecp_blog.htm和template/default/portal/portalcp_article.htm,在下面这句代码 <!--{subtemplate home/editor_image_menu}--> 后添加 <!--{eval $editorid = 'icoImg';}--> <!--{template home/editor_musicbox_menu}--> 7b) 论坛:修改文件template/default/forum/post.htm,在下面这句代码 <!--{subtemplate forum/editor_menu_forum}--> 后添加 <!--{template home/editor_musicbox_menu}-->
注意:文中代码含有<a的地方都在两字符间加了不应有的空格,拷贝时应删去该空格。

发表评论 评论 (6 个评论)

回复 天香公主 2017-6-1 08:24 PM
ladyff: 亲,能不能研究一下firefox 64位下discuz不能上传图片的bug
你的问题真把我给难倒了。回看了我们过去的讨论后,发现其实我当时没明白你说的64位FF的意思。我还以为你指的是机器或操作系统是64位的,现在才知道FF还有32位和64位两个版本。正好我现在也有了个装了SSL的网站可以测试,测试下来也有你说的问题。具体讲:我的客户端是win7上的64位FF, 网站是装了SSL的DZ 3.0/3.1/3.2/3.3 ( https://ngcorner.com ), 在日志里都无法上传图片。

觉得应该不是swfupload的问题,因为编辑头像那里的上传图片也有同样问题。估计是Flash的问题,用Fiddler看,Flash在上传图片时要和服务器建立联系和握手时没成功。

你以前说的有两点和我的预期相反。一是你自己的用swfupload的代码能成功上传图片,二是你在DZ3.2里能上传图片。关于前者你能不能把代码寄给我让我试试?后者你有没有个网站我可以去那试试 ?(我试了你告诉我的那个DZ3.3网站也无法上传图片)
回复 ladyff 2017-5-30 10:21 PM
亲,能不能研究一下firefox 64位下discuz不能上传图片的bug
回复 天香公主粉丝 2017-5-30 06:31 AM
天香公主: 可以,群组和论坛在相关处都是用同一份代码的。
嗯,了解了,感谢
回复 天香公主 2017-5-28 10:33 AM
天香公主粉丝: 这个好啊,请问这个在群组里也通用吗?
可以,群组和论坛在相关处都是用同一份代码的。
回复 天香公主粉丝 2017-5-28 06:57 AM
这个好啊,请问这个在群组里也通用吗?
回复 天香公主 2017-5-25 12:30 PM
carry0987: 喔喔喔喔喔喔!!!!!不愧是天香!!我去試試~
(話說回來,會不會打擾到你的工作?有點擔心....)
    偶一为之吧

facelist doodle 涂鸦板

您需要登录后才可以评论 登录 | 立即注册

小黑屋|Archiver|彼岸网  

Powered by Discuz! X3.1 © 2001-2014 Comsenz Inc.
GMT-4, 2017-9-25 07:37 AM , Processed in 0.055117 second(s), 20 queries.

返回顶部