本发明涉及编辑器技术，尤其涉及基于网页的编辑器技术。
背景技术：
技术实现要素：
本申请的实施例公开了一种基于网页的内容编辑方法：包括构建框架层，所述框架层包括模块框架对象嵌入区域以及用于在所述模块框架对象嵌入区域中嵌入至少一个模块框架对象的至少一个模块框架对象添加控件；监听用户对所述至少一个模块框架对象添加控件中的特定的模块框架对象添加控件的触发；响应用户对所述触发弹出层，其中所述弹出层至少包括本地图片选择功能；监听用户对本地图片选择功能的选定，关闭所述弹出层，并在所述框架层的所述模块框架对象嵌入区域创建包含所述选定的图片的模块框架对象；其中，将所述创建的包含所述图片的模块框架对象按照所述至少一个模块框架对象的创建顺序显示于所述模块框架对象嵌入区域。
本申请的实施例提供了一种为基于网页的编辑器提供图片的方法，包括加载上传图片功能，所述上传图片功能存储于基于网页的编辑器的弹出层提供的关联部指向上传图片功能的地址；生成上传按钮；监听上传按钮的触发状态；按钮被触发后，调用运行该上传图片功能的终端的浏览器内置函数；再调用所述终端的底层函数启动终端内部的拍照功能或打开相册功能；拍照获得图片或者选中一张或多张手机相册中的已有图片；将所述图片上传至由图片传输控制设备控制的图片服务器。
本申请的一些实施例提供了一种为基于网页的编辑器提供图片的系统，包括上传图片功能，所述图片上传功能存储于基于网页的编辑器的弹出层提供的关联部指向上传图片功能的地址；所述上传图片功能包括：生成上传按钮的子功能；监听上传按钮的触发状态子功能；按钮被触发后，调用运行该上传图片功能的终端的浏览器内置函数；再调用所述终端的底层函数启动终端内部的拍照功能或打开相册功能的子功能；拍照获得图片或者选中一张或多张手机相册中的已有图片；将所述图片上传至由图片传输控制设备控制的图片服务器。
利用本申请的实施例提供的方法和系统可以实现对文本、图片以及视频等进行高效的排版。
附图说明
图1是根据本申请的实施例的基于网页的内容编辑器的界面示意图。
图2是根据本申请的实施例的基于网页的内容编辑器的另一界面示意图。
图3是根据本申请的实施例的基于网页的内容编辑器的一种实施例的系统结构图；
图4是根据本申请的实施例的基于网页的内容编辑器的网页端创建模块框架对象的流程图；
图5是根据本申请的实施例的基于网页的内容编辑器的图片提供端提供图片的流程图；以及
图6是根据本申请的实施例的基于网页的内容编辑器的控制调度端调度图片的流程图。
具体实施方式
在更加详细地讨论示例性实施例之前应当提到的是，一些示例性实施例被描述成作为流程图描绘的处理或方法。虽然流程图将各项操作描述成顺序的处理，但是其中的许多操作可以被并行地、并发地或者同时实施。此外，各项操作的顺序可以被重新安排。当其操作完成时所述处理可以被终止，但是还可以具有未包括在附图中的附加步骤。所述处理可以对应于方法、函数、规程、子例程、子程序等等。
在上下文中所称“服务器”是指可以通过运行预定程序或指令来执行数值计算和/或逻辑计算等预定处理过程的智能电子设备，其可以包括处理器与存储器，由处理器执行在存储器中预存的程序指令来执行预定处理过程，或是由asic、fpga、dsp等硬件执行预定处理过程，或是由上述二者组合来实现。
其中，所述用户设备包括但不限于智能手机、pda、pc、笔记本电脑等；所述网络设备包括但不限于单个网络服务器、多个网络服务器组成的服务器组或基于云计算(cloudcomputing)的由大量计算机或网络服务器构成的云，其中，云计算是分布式计算的一种，由一群松散耦合的计算机集组成的一个超级虚拟计算机。其中，所述计算机设备可单独运行来实现本申请，也可接入网络并通过与网络中的其他计算机设备的交互操作来实现本申请。其中，所述计算机设备所处的网络包括但不限于互联网、广域网、城域网、局域网、vpn网络等。
需要说明的是，所述用户设备、网络设备和网络等仅为举例，其他现有的或今后可能出现的计算机设备或网络如可适用于本申请，也应包含在本申请保护范围以内，并以引用方式包含于此。
本文后面所讨论的方法(其中一些通过流程图示出)可以通过硬件、软件、固件、中间件、微代码、硬件描述语言或者其任意组合来实施。当用软件、固件、中间件或微代码来实施时，用以实施必要任务的程序代码或代码段可以被存储在机器或计算机可读介质(比如存储介质)中。(一个或多个)处理器可以实施必要的任务。
这里所公开的具体结构和功能细节仅仅是代表性的，并且是用于描述本申请的示例性实施例的目的。但是本申请可以通过许多替换形式来具体实现，并且不应当被解释成仅仅受限于这里所阐述的实施例。
这里所使用的术语仅仅是为了描述具体实施例而不意图限制示例性实施例。除非上下文明确地另有所指，否则这里所使用的单数形式“一个”、“一项”还意图包括复数。还应当理解的是，这里所使用的术语“包括”和/或“包含”规定所陈述的特征、整数、步骤、操作、单元和/或组件的存在，而不排除存在或添加一个或更多其他特征、整数、步骤、操作、单元、组件和/或其组合。
还应当提到的是，在一些替换实现方式中，所提到的功能/动作可以按照不同于附图中标示的顺序发生。举例来说，取决于所涉及的功能/动作，相继示出的两幅图实际上可以基本上同时执行或者有时可以按照相反的顺序来执行。
本申请涉及一种基于网页的模块化内容编辑器，该内容编辑器可以用于编辑诸如文字、图片，视频等内容元素，并将这些内容元素进行合并而形成混编的内容，并通过诸如网页等形式保存或发布。
图1示出了依据本申请的一种实施例的基于网页的模块化编辑器的界面示意图。参照图1，各界面元素可以被设置于同一框架层，例如第一框架层200，该层例如可以包括模块框架对象添加按钮控件，模块框架对象添加按钮控件可以位于按钮添加栏201内，模块框架对象添加按钮控件包括文字模块框架对象添加按钮控件201a，图片模块框架对象添加按钮控件201b，以及视频模块框架对象添加按钮控件201c。其中，网页模块化编辑器可监听用户对每个按钮控件的触发，并在某得按钮被触发后调用相应的处理。例如，触发每个按钮控件能在按钮控件的下方的模块框架对象嵌入区域202嵌入对应的模块框架对象；例如触发文字模块框架对象添加按钮控件201a会嵌入文本内容框架对象202a，而此后触发的图片模块框架对象添加按钮控件201b则会在文本内容框架对象202a下方一定距离处嵌入图片内容框架对象202b。继续触发不同的添加按钮控件还可以继续添加其他的框架对象。
可以根据框架对象的属性输入不同的内容。例如，文本内容框架对象可以在框架对象中输入纯文本，可通过各种监听事件处理对输入的文本进行分段，修改文字属性等操作。在同一框架对象中输入的文本被限定在同一框架区域内。可以为文本内容框架对象设定字符数量的限制，而在限定的字符数量内，自动扩展框架对象的下边沿，而使得最新输入的文本内容可以显示出来。
针对图片内容框架对象可以提供选取本地保存的图片的功能，例如，当编辑器监听到框架对象所在区域被单击，则可触发弹出层300供用户点击选择本地图片按钮控件，也可以不弹出弹出层而直接触发本地图片调用函数从而弹出图片选择窗体再对本地图片进行选择。
图3是根据本申请的实施例的一种基于图片提供设备向编辑器端提供图片的系统的结构示意图。其中，终端设备10可以是例如台式电脑、手提电脑、平板电脑、手机等具支持网页协议并提供网页服务的设备。本申请中的基于网页的模块化编辑器的至少一部分可以实施于所述终端设备10上。图片提供设备20可以是保存有图片或者具有拍照功能的设备，其可以具有例如二维码识别功能及/或文本识别功能，图片提供设备可以具有有线或无线通讯模块，以与所述图片传输控制设备通信，通常这样的图片提供设备可以是例如平板电脑、手机等智能设备，也可以是安装有二维码扫描、识别功能并具有有线或无线通信模块的相机等设备。
所述图片提供设备20可以从所述超文本传输协议地址下载图片上传功能。该功能可以是例如利用html语言和javascript语言编写的上传图片程序，图5示出了一种可能的上传图片程序的流程图。参照图5，该程序可以包括提供s201，页面可以包括上传按钮控件，该上传按钮控件可以例如通过javascript语言编写的自定义函数自动生成。按钮控件的形态例如可以是“加号框”。该上传按钮控件被设置为：当监听到该按钮控件被触发后，可调用图片提供设备的浏览器内置函数，再调用图片提供设备的底层函数启动终端内部的拍照功能或者打开相册功能，通过拍照或者选择一张图片s202；在监听到完成按钮控件被触发后，将该图片异步上传至图片数据库，例如图片服务器，s203，例如可以利用jqueryajax函数，使图片提供设备向图片传输控制设备发出请求以启动图片的上传。
传输可以是基于认证信息的传输，例如所述界面加载时可以生成token值，其中，该token具有唯一性，其是根据服务器提供的公钥以及私钥和权限签名所计算出来的一种具有唯一性永远不会重复的数字和字母的组成标识。所述token值用于图片传输控制设备对图片提供设备进行验证，例如可将公钥部分发送至图片提供设备，从而实现在图片传输前的对图片提供设备的验证s204。该token可以用来确保图片提供设备上传至图片服务器中的图片与终端设备端10具有同样的标识。
图片传输控制设备30的控制调度功能的流程图的示例如图6所示。参照图6，所述控制调度功能可以包括基于通过图片上传接口从所述图片提供设备上传图片，并将其保存于所述图片服务器40的数据库表中s301。图片在数据库表中保存成功后，图片传输控制设备控制所述图片数据库表向网页客户端发送具有所述网页客户端标识的图片数据s302。
在一些实施例中，为了实现图片传输控制设备与图片提供设备之间的验证，所述控制调度功能可以包括接收针对请求与其连接的图片提供设备的token，s303。
在一些实施例中，可以由所述图片传输控制设备30提供上传图片程序，并由图片传输控制设备将上传图片程序传送给所述图片提供设备20。
返回图1，框架对象202a和202b之间在竖直方向的间隔，可与框架对象202b和其下方的框架对象的间隔相同，从而形成沿竖直方向的自动排版。框架对象202a、202b以及其他框架对象可以具有相同的框架宽度，这样在框架对象添加完成后，编辑器的用户可以直接将编辑完成的网页直接保存至服务器，而省去了后续的排版工作。
可利用iframe子页面函数向html网页中嵌入框架，可以利用原生的javascript编写宽高比自适应计算逻辑，使得网页模块化编辑器在网页页面中能更简单更便利的调用并嵌套。
编辑器的通信可以采用原生的javascript编写的接收函数，通往网页浏览器windows对象的原型调用自定义的接收函数，实现数据的相互传输。
网页模块化编辑器利用原生的javascript编写绑定提交函数，提交方式为from表单提交，提交数据时自动调用原生的javascript函数中转处理，通过原生的javascript编写的验证函数后，间所有模块转换成对象结构再次转换成json字符串提交给服务器。
可以为创建好的模块提供模块删除功能，例如利用html+javascript在模块的右上角添加“x”按钮。
可为编辑器提供模块框架对象顺序调整功能。例如，可以在每个模块框架对象的整体或一个区域提供选定按钮控件，以及鼠标位置监听功能。所述选定按钮控件例如可以提供在模块框架对象的顶部，被触发后，可实现模块框架对象整体的选定，并启动鼠标位置监听功能。当鼠标位置自一个方向移动越过另一目标模块框架对象的中线时，则将被选定的模块框架对象与目标模块框架位置的位置的互换，并保存互换后的模块框架对象顺序。
通过扫描关联部而实现编辑器中的图片的上传的具体实施例可以为：
a、网页端实现功能：
“点击’添加图片’按钮，弹出利用html语言+javascript语言编写的上传图片通用弹出层，弹出层左侧利用javascript语言自定义编写的qrcodeupload()函数动态创建的二维码图标并为二维码赋予终端上传图片页面的链接地址，用手机中任意一款可以扫描二维码的app对此模块左侧利用qrcodeupload()函数创建的二维码图标进行扫描，网页浏览器将在通过jquery框架语言中ajax()函数(ajax()：异步请求函数，可以使客户端页面系统向服务器端请求数据。)每3000毫秒请求一次服务器端(一直请求直至编辑结束)，请求成功后服务器返回data数据(服务器端的全部图片数据)，网页浏览器端通过jquery框架语言中的json.parse(data)函数把服务器返回data数据解析成object对象存储在自定义的existqrimg数组变量(保存已经存在于网页客户端中的图片数据)中，利用javascript语言编写的函数在图片上传成功后在existqrimg数组中进行数据排重和过滤(对服务器返回的数据进行排除和过滤)，排除和过滤结束后，则可以通过javascript语言编写的getimghtml()函数创建过滤之后的所有图片数据在html页面元素中。此时网页模块化的编辑器内容区域自动添加了一个图片模块(addimgmodel()函数)。
b.在扫码设备端实现以下功能：
“扫描成功后终端会弹出一个利用html语言和javascript语言编写的upload上传图片页面(此页面专为移动终端设计可自适应窗口大小)，页面加载时生成token值(token值具有唯一性，是根据云端服务器提供的公钥以及私钥和权限签名所计算出来的一种具有唯一性永远不会重复的数字和字母的组成标识)，为上传做准备，"upload上传图片页面"通过javascript语言编写的自定义函数自动生成上传按钮，按钮形态为“加号框”，手动触摸该按钮后，javascript会调用终端浏览器内置函数然后再调用终端底层函数启动手机内部的拍照功能或打开相册功能，可以直接拍照或者选中一张或多张手机相册中的已有照片或图片，选择完成后将利用jqueryajax函数(ajax：异步请求函数，可以使客户端页面系统向服务器端请求数据。)上传至服务器端”。
c.服务器端现以下功能：“移动终端页面选择照片或拍照完成后，请求服务器用php语言编写的gettoken接口通过uploadtoken()函数生成上传的token(.ps:token值具有唯一性，是根据云端服务器提供的公钥以及私钥和权限签名所计算出来的一种具有唯一性永远不会重复的数字和字母的组成标识)然后在通过使用php语言编写的getimage接口上传成功后通过php语言的insert()函数将上传成功的图片存入数据库表中数据表中数据插入成功后再将上传成功的图片名字、宽度、高度、唯一标识、调用路径、类型、图片大小、状态等数据组成字符集返回给移动终端页面。
另外，本申请的一部分可被应用为计算机程序产品，例如计算机程序指令，当其被计算机执行时，通过该计算机的操作，可以调用或提供根据本申请的方法和/或技术方案。而调用本申请的方法的程序指令，可能被存储在固定的或可移动的记录介质中，和/或通过广播或其他信号承载媒体中的数据流而被传输，和/或被存储在根据所述程序指令运行的计算机设备的工作存储器中。在此，根据本申请的一个实施例包括一个装置，该装置包括用于存储计算机程序指令的存储器和用于执行程序指令的处理器，其中，当该计算机程序指令被该处理器执行时，触发该装置运行基于前述根据本申请的多个实施例的方法和/或技术方案。
本申请的代表性示例包括但不限于：
1、一种基于网页的内容编辑方法：包括
构建框架层，所述框架层包括模块框架对象嵌入区域以及用于在所述模块框架对象嵌入区域中嵌入至少一个模块框架对象的至少一个模块框架对象添加控件；
监听用户对所述至少一个模块框架对象添加控件中的特定的模块框架对象添加控件的触发；
响应用户对所述触发弹出层，其中所述弹出层至少包括本地图片选择功能；
监听用户对本地图片选择功能的选定，关闭所述弹出层，并在所述框架层的所述模块框架对象嵌入区域创建包含所述选定的图片的模块框架对象；其中，将所述创建的包含所述图片的模块框架对象按照所述至少一个模块框架对象的创建顺序显示于所述模块框架对象嵌入区域。
2、根据示例1所述的基于网页的内容编辑方法，其特征在于：
在所述弹出层提供关联部，其中所述关联部指向上传图片功能；
向图片传输控制设备请求通过上传图片功能上传至由所述图片传输控制设备控制的图片服务器的图片；
对所述图片数据进行重排和过滤得到需要的图片数据；
对所述需要的图片数据进行解析得到需要的图片；
并在所述第一层的所述模块框架对象嵌入区域创建包含所述特定的模块框架对象。
3、根据示例1所述的基于网页的内容编辑方法，其特征在于：所述模块框架对象添加控件包括文本模块框架对象添加控件，图片模块框架对象添加控件以及模块框架内容对象添加控件，
4、根据示例3所述的基于网页的内容编辑方法，其特征在于：所述特定的模块框架对象添加控件是图片模块框架对象添加控件，所述特定的模块框架对象是图片模块框架对象。
5、一种基于网页的内容编辑方法：包括
响应用户对所述内容对象添加控件的触发弹出层，在所述弹出层提供关联部，在所述弹出层提供关联部，其中所述关联部指向上传图片功能；
6、根据示例5所述的基于网页的内容编辑方法，其特征在于：所述模块框架对象添加控件包括文本模块框架对象添加控件，图片模块框架对象添加控件以及模块框架内容对象添加控件，
7、根据示例6所述的基于网页的内容编辑方法，其特征在于：所述特定的模块框架对象添加控件是图片模块框架对象添加控件，所述特定的模块框架对象是图片模块框架对象。
8、一种基于网页的内容编辑器，其特征在于：包括
第一层构建功能，用于构建包括框架层，所述框架层包括模块框架对象嵌入区域以及用于在所述模块框架对象嵌入区域中嵌入至少一个模块框架对象的至少一个模块框架对象添加控件；
弹出层构建功能，响应用户对所述至少一个模块框架对象添加控件中的特定的模块框架对象添加控件的触发，构建弹出层，所述弹出层具有关联部，其中所述关联部指向上传图片功能；
请求功能，用于向图片传输控制设备请求通过上传图片功能上传至由所述图片传输控制设备控制的图片服务器的图片；
重排和过滤功能，用于对所述图片数据进行重排和过滤得到需要的图片数据；
解析功能，用于将所述需要的图片数据解析成需要的图片；
模块框架对象创建功能，用于根据所述需要的图片创建包含所述需要的图片的模块框架对象；以及
排序功能，用于将所述创建的包含需要的图片的模块框架对象按照所述至少一个模块框架对象的创建顺序显示于所述模块框架对象嵌入区域。
9、一种为基于网页的编辑器提供图片的方法，包括
加载上传图片功能，所述上传图片功能存储于基于网页的编辑器的弹出层提供的关联部指向上传图片功能的地址；
生成上传按钮；
监听上传按钮的触发状态；
按钮被触发后，调用运行该上传图片功能的终端的浏览器内置函数；再调用所述终端的底层函数启动终端内部的拍照功能或打开相册功能；
拍照获得图片或者选中一张或多张手机相册中的已有图片；
将所述图片上传至由图片传输控制设备控制的图片服务器。
10、一种为基于网页的编辑器提供图片的系统，包括
上传图片功能，所述图片上传功能存储于基于网页的编辑器的弹出层提供的关联部指向上传图片功能的地址；
所述上传图片功能包括：
生成上传按钮的子功能；
监听上传按钮的触发状态子功能；
按钮被触发后，调用运行该上传图片功能的终端的浏览器内置函数；再调用所述终端的底层函数启动终端内部的拍照功能或打开相册功能的子功能；
11、一种基于网页的内容编辑器系统，其特征在于：包括
至少一个终端设备端，所述至少一个终端设备端的每一个包括：
排序功能，用于将所述创建的包含需要的图片的模块框架对象按照所述至少一个模块框架对象的创建顺序显示于所述模块框架对象嵌入区域；
图片提供设备，包括所述上传图片功能；
图片服务器，用于存储所述图片；以及
图片传输控制设备，相应所述请求功能激活所述上传图片功能，在图片上传至所述图片服务器后，指引所述终端设备端获取所述图片。